The field relates to user interface (UI) technology. More precisely, the field relates to user programming access to data model in UI design.
In the world of computing, Web applications such as Rich Internet Applications (RIAs) have many of the characteristics of desktop applications. The RIAs are typically delivered either by a site-specific browser, a browser plug-in, or independently via a virtual machine. The most commonly used frameworks that support such Web applications are Adobe Flash™, Java™, and Microsoft Silverlight™. Generally, the framework has to be installed using the computer's operating system prior to launching the RIA. The Web application framework typically downloads, updates, verifies, and executes the RIA. Microsoft Silverlight (WPF/E) is a programmable Web browser plug-in that enables features such as animation, vector graphics and audio-video playback that characterize RIAs. Microsoft Silverlight brings additional interactivity features and support for .NET languages and development tools. It is compatible with multiple Web browser products.
Many Web application frameworks follow the Model View Controller (MVC) architectural pattern to separate the data model with the business logic from the user interface. The MVC pattern modularizes code, promotes code reuse (use of existing software code, or software knowledge, to build new software code), and allows multiple interfaces to be applied. The MVC architecture consists of a model, a view, and a controller. The model part of the MVC pattern is a domain-specific representation of the data upon which the application operates. Domain logic adds meaning to raw data (for example, calculating the totals, taxes, and shipping charges for shopping cart items). When a model changes its state, it notifies its associated views so they can refresh. The view of the MVC pattern renders the model into a form suitable for interaction, typically a user interface element. Multiple views can exist for a single model for different purposes. The controller of the MVC pattern receives input and initiates a response by making calls on model objects. When a Web application user interface framework is built on the MVC architectural pattern approach, high speed development of uniform user interfaces (UIs) is possible.
Various embodiments of systems and methods for user programming access to data model in user interface design are described herein. In one embodiment, the method includes receiving a selection of one or more user interface (UI) components to form a UI model and binding at least one component from the one or more UI components to a data structure in a backend system. The method also includes receiving a user action for UI design at runtime, the user action accessing the data structure in the backend system for UI customization and rendering the UI model as a UI view.
In other embodiments, the system includes at least one processor for executing program code and memory, a display to render a UI, an input device to receive one or more script inputs to customize the UI, and a repository within the memory to persist a UI data model and backend data. The system also includes a scripting engine within the memory to interpret the one or more script inputs.
These and other benefits and features of embodiments of the invention will be apparent upon consideration of the following detailed description of preferred embodiments thereof, presented in connection with the following drawings.
The claims set forth the embodiments of the invention with particularity. The invention is illustrated by way of example and not by way of limitation in the figures of the accompanying drawings in which like references indicate similar elements. The embodiments of the invention, together with its advantages, may be best understood from the following detailed description taken in conjunction with the accompanying drawings.
Embodiments of techniques for user programming access to data model in user interface design are described herein. In the following description, numerous specific details are set forth to provide a thorough understanding of embodiments of the invention. One skilled in the relevant art will recognize, however, that the invention can be practiced without one or more of the specific details, or with other methods, components, materials, etc. In other instances, well known structures, materials, or operations are not shown or described in detail to avoid obscuring aspects of the invention.
Reference throughout this specification to “one embodiment”, “this embodiment” and similar phrases, means that a particular feature, structure, or characteristic described in connection with the embodiment is included in at least one embodiment of the present invention. Thus, the appearances of these phrases in various places throughout this specification are not necessarily all referring to the same embodiment. Furthermore, the particular features, structures, or characteristics may be combined in any suitable manner in one or more embodiments.
UI Framework Client Runtime 115 may be implemented in a programming language such as “C#” using a RIA based framework such as Microsoft Silverlight technology. The UI Framework Client Runtime 115 is responsible for rendering user interfaces and access business data from backend 120. Every user request is triggered on the UI Framework Client Runtime 115. The very first request is a navigation request that results in a request to the backend 120 to read a UI component. The UI component is read from the Central Metadata Repository 175 in the backend 120 and transported to the frontend 110. A component manager instantiates the UI component and a corresponding component controller 165 for the UI component on the frontend 110 and triggers the initialization of the UI component on the backend 120. The component manager builds up a control tree for the UI component out of a set of UI controls 150. These UI controls 150 ensure conformable look and feel and the ability to change UI themes consistently. The controls in the “themed UI controls” package are all enabled in a consistent way for test automation and accessibility, and are provided in a manner that all native implemented custom UI panes can take use of that controls. Usually, more than one UI component is needed to render a UI, as UI components typically embed other UI components (e.g., a Work Center component embeds a set of Work Center View Components and they again embed other components). The top-level UI component that is rendered is the root UI component which makes sure to render a common frame for all UI components, e.g., by rendering the top level navigation and the ability for personalization from personalization 155 unit.
In an embodiment, the UI Framework Client Runtime 115 also comprises the following built-in units: analytics 130, mashups 135, diagnostics 140, shell 145, and frontend scripting 160. Analytics 130 are components that represent data in a grouped, aggregated, and hierarchical way. These components serve to answer business questions about, for example, how many products were sold in a particular country and provide drill down capabilities to different level of abstraction. Diagnostics 140 allows the collection of, for example, the context of the current framework and all other running entities of the overall system at a specific point in time (e.g., in case of an exception or error). The collected information can help to track down the cause of the exception. Shell unit 145 provides the shell for running the UI Framework Client Runtime. It includes all units for the user interface ranging from defining the overall appearance of windows (including standard elements like menus, toolbars, navigation areas, windows management) as well as the mediator layer that maps logical component definitions from the configuration model to physical controls. Shell unit 145 represents a standalone native client (WPF) based on the Silverlight technology. Frontend scripting 160 enables data from the client side data model to be read, evaluated, and modified—which eventually causes configured events again in the runtime execution of the model. With these capabilities, UI-only logic can be expressed and modeled via some script; it is not required to implement or model the logic in the backend. Optionally, the script can be executed on the client or backend.
The frontend 110 communicates with the backend 120 via browser 167 on a regular HTTP/HTTPs connection 168 using JavaScript Object Notation (JSON) (also other serialization formats such as XML can be used in parallel to JSON) as a lightweight data interchange format. The requests from the frontend 110 are received at Internet Communication Framework (ICF) 170. The ICF 170 forwards the requests to the UI Framework Server Runtime 125 and Central Metadata Repository 175. The Central Metadata Repository 175 stores all UI entities with their metadata. The UI Framework Server Runtime 125 reads and interprets the UI model of the application, manages the access to the backend and ensures an optimized communication with the UI Framework Client Runtime 115. After the UI Framework Client Runtime 115 triggers the initialization of a UI component in the backend 120 for a first time in a session, the UI Framework Server Runtime 125 first creates a master controller 180 for the complete session and then creates a component controller for each component that is requested from the UI Framework Client Runtime 115. Each component controller builds a UI data container out of the information of the UI model for a component. At runtime, the composition of the dependent components is combined within the master controller 180, which holds one event queue and performs data updates for all included components as one component. In an embodiment, it can be configured that logically separated declared components to run as one virtual controller at runtime.
After the master controller 180 has processed all component controllers, it collects all the data that has changed in the UI data container and makes sure that all changed data and only the changed data is transported to the client 110. The access from the UI Framework Server Runtime 125 to business data 190 is performed via connector 185. Connector 185 is able to connect to different technologies.
At block 340, script inputs for UI customization are interpreted at runtime. The function of the script inputs is to introduce controller and navigation logic to the UI model. In one embodiment, the scripts access and manipulate data objects from the backend data. Typically, the script inputs are predefined and thus there is a set of operations allowed to be performed by the script inputs. For example, in one embodiment, an instance of the script inputs may be used for calling an event handler. In another embodiment, script inputs define a calculation rule for a component of the UI model. In yet another embodiment, script inputs may be used for invalidating a control in the UI.
At block 345, the UI view is updated. The UI view is updated based on the interpreted script inputs for UI customization. The script inputs change the UI model and hence the UI view.
At decision block 350, a check is performed on whether data objects of the backend data are updated. If there is no change in the backend data, the UI view remains intact. If some of the data in the backend changes, a new check is performed at decision block 360, whether the updated data objects are processed by script inputs. In case the updated data is not affected by script inputs, the UI remains intact, otherwise, the method continues at block 370 with rerunning the script inputs and updating the UI view at block 345. This is necessary in order for the applied controller and navigation logic to be updated according to the latest updates of the backend data.
The system 400 further includes a repository 440 within the memory 420, the repository 440 to persist a UI data model 443 for UI generation and backend data 446. The memory 420 also includes a scripting engine 460 to process the one or more script inputs received through the input device 450. In one embodiment, the UI data model 443 is persisted in an XML file. In another embodiment, components of the UI data model 443 are bound to data objects of the backend data 446. In yet another embodiment, the data objects of the backend data 446 are business object metadata.
In one embodiment, the scripting engine 460 includes a tokenizer 461, a parser 462, an abstract syntax tree 463, an interpreter 464, and runtime environment 465. The tokenizer 461 is based on lexical definition to split the script inputs in tokens. The parser 462 is based on grammar to parse the script inputs and analyze syntax. The abstract syntax tree 463 is formed by outputs from the tokenizer 461 and the parser 462. The interpreter 464 is intended to interpret the abstract syntax tree. The runtime environment 465 provides access to the UI data model 443. In one embodiment, the runtime environment 465 consists of a script context module (not shown) where UI data model objects are declared and a data wrapper interface (not shown) to define accessible data values.
Some embodiments of the invention may include the above-described methods being written as one or more software components. These components, and the functionality associated with each, may be used by client, server, distributed, or peer computer systems. These components may be written in a computer language corresponding to one or more programming languages such as, functional, declarative, procedural, object-oriented, lower level languages and the like. They may be linked to other components via various application programming interfaces and then compiled into one complete application for a server or a client. Alternatively, the components maybe implemented in server and client applications. Further, these components may be linked together via various distributed programming protocols. Some example embodiments of the invention may include remote procedure calls being used to implement one or more of these components across a distributed programming environment. For example, a logic level may reside on a first computer system that is remotely located from a second computer system containing an interface level (e.g., a graphical user interface). These first and second computer systems can be configured in a server-client, peer-to-peer, or some other configuration. The clients can vary in complexity from mobile and handheld devices, to thin clients and on to thick clients or even other servers.
The above-illustrated software components are tangibly stored on a computer readable storage medium as instructions. The term “computer readable storage medium” should be taken to include a single medium or multiple media that stores one or more sets of instructions. The term “computer readable storage medium” should be taken to include any physical article that is capable of undergoing a set of physical changes to physically store, encode, or otherwise carry a set of instructions for execution by a computer system which causes the computer system to perform any of the methods or process steps described, represented, or illustrated herein. Examples of computer readable storage media include, but are not limited to: magnetic media, such as hard disks, floppy disks, and magnetic tape; optical media such as CD-ROMs, DVDs and holographic devices; magneto-optical media; and hardware devices that are specially configured to store and execute, such as application-specific integrated circuits (“ASICs”), programmable logic devices (“PLDs”) and ROM and RAM devices. Examples of computer readable instructions include machine code, such as produced by a compiler, and files containing higher-level code that are executed by a computer using an interpreter. For example, an embodiment of the invention may be implemented using Java, C++, or other object-oriented programming language and development tools. Another embodiment of the invention may be implemented in hard-wired circuitry in place of, or in combination with machine readable software instructions.
A data source is an information resource. Data sources include sources of data that enable data storage and retrieval. Data sources may include databases, such as, relational, transactional, hierarchical, multi-dimensional (e.g., OLAP), object oriented databases, and the like. Further data sources include tabular data (e.g., spreadsheets, delimited text files), data tagged with a markup language (e.g., XML data), transactional data, unstructured data (e.g., text files, screen scrapings), hierarchical data (e.g., data in a file system, XML data), files, a plurality of reports, and any other data source accessible through an established protocol, such as, Open DataBase Connectivity (ODBC), produced by an underlying software system (e.g., ERP system), and the like. Data sources may also include a data source where the data is not tangibly stored or otherwise ephemeral such as data streams, broadcast data, and the like. These data sources can include associated data foundations, semantic layers, management systems, security systems and so on.
In the above description, numerous specific details are set forth to provide a thorough understanding of embodiments of the invention. One skilled in the relevant art will recognize, however that the invention can be practiced without one or more of the specific details or with other methods, components, techniques, etc. In other instances, well-known operations or structures are not shown or described in details to avoid obscuring aspects of the invention.
Although the processes illustrated and described herein include series of steps, it will be appreciated that the different embodiments of the present invention are not limited by the illustrated ordering of steps, as some steps may occur in different orders, some concurrently with other steps apart from that shown and described herein. In addition, not all illustrated steps may be required to implement a methodology in accordance with the present invention. Moreover, it will be appreciated that the processes may be implemented in association with the apparatus and systems illustrated and described herein as well as in association with other systems not illustrated.
The above descriptions and illustrations of embodiments of the invention, including what is described in the Abstract, is not intended to be exhaustive or to limit the invention to the precise forms disclosed. While specific embodiments of, and examples for, the invention are described herein for illustrative purposes, various equivalent modifications are possible within the scope of the invention, as those skilled in the relevant art will recognize. These modifications can be made to the invention in light of the above detailed description. Rather, the scope of the invention is to be determined by the following claims, which are to be interpreted in accordance with established doctrines of claim construction.