User Interface

The One Network SDK provides the 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 which have been extensively tested across many browser and operating system combinations to ensure wide compatibility. One Network has extended ExtJs with our own set of tools allowing logical extensions to our modelling and execution frameworks.

The primary visual component of an application developed the One Network SDK is the Command Center (CC). The Command Center 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 Command Center. The Command Center 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 Command Center's login screen. For more information on SSO, see the chapter in this Users Guide titled "Single Sign-On".

  • Menus. Command Center displays a menu structure based on the user's access levels and the modules that comprise your solution. These menus are managed by Command Center 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 Command Center.

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

  • Portals. The SDK provides the ability to develop and display a dashboard style portal which 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, Command Center 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 Command Center, 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.

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, its 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 portals 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.