User Interface

The One Network SDK provides all the tools you need to create a rich interactive experience for your users as an extension of its powerful data modeling tools. The User Interface (UI) components are based on the popular third-party cross-platform JavaScript library from Sencha called ExtJs™. This library provides a host of Rich User Interface (RUI) components that have been extensively tested across many browsers and operating system combinations to ensure wide compatibility. One Network has extended ExtJs with our own set of tools allowing logical extensions to our modeling and execution frameworks.

The primary visual component of an application developed by the One Network SDK is the NEO Dashboard. The NEO Dashboard is a centralized user interface that provides services across all modules within your application. In other words, an application may be comprised of multiple modules. Those module's user interfaces are rendered within the NEO Dashboard. The NEO Dashboard provides a number of elements to make a set of modules behave as a single unified application:

  • Access to Single Sign-On (SSO). The SSO service is designed to allow you to manage user information across modules. SSO is accessed using NEO Dashboard's login screen. For more information on SSO, see the chapter in this Users Guide titled "Single-Sign-On".

  • Menus. NEO Dashboard displays a menu structure based on the user's access levels and the modules that comprise your solution. These menus are managed by NEO Dashboard using a single XML-based configuration file.

  • Tabbed View Manager. Module screens are rendered in a tabbed environment allowing users to easily switch between multiple module screens. The tabs are managed automatically by NEO Dashboard.

  • Access to Common Features. Items that are common across all modules are rendered at the top of the NEO Dashboard screen. Some examples include help, managing multiple user roles, favorites, etc.

  • Widgets. The SDK provides the ability to develop and display a dashboard-style widget that the user may configure limited by their permissions.

  • Role / Permissions Based Menus and Screens. The SDK provides JavaScript access to information related to the current user, site, organization, and enterprise and provides easy methods to limit access to screens and menu options based on permissions.

  • Model-Based CRUD Screens. It is possible to configure screens to handle basic create, read, update, and delete operations based on models with only a few lines of JavaScript code.

In short, NEO Dashboard provides most of the features a web application needs without the developer having to spend any time on such features. It is possible to use services created using the SDK with user interfaces rendered outside of NEO Dashboard, such as with a custom user interface you develop. For example, it is possible to develop or leverage your own user interface developed in tools like JavaScript, Flash, iOS, Android, or any thick client.

The development of a UI for a module can be broken down into two main topics. First is the UI Meta Model. As you'll see, it's a very powerful XML-based configuration system that lets you customize every aspect of your application's appearance beyond cosmetics. This is to say, the UI Metamodel determines which menu elements appear on the menu, the permissions required to see them, how widgets and dashboards may be rendered, and all other functional aspects of the UI. The UI Metamodel does not specify visual elements such as colors, layout, etc, which are handled using Cascading Style Sheets (CSS).

The second topic of discussion revolves generally around ExtJs, and specifically around the classes in One.Ext - One Network's extensions to ExtJs that allow specific interoperability with One Network services created in Studio.