The Anatomy of an ITOP App

Overview of an iTop Application

Overview of an ITOP Application

On the lower part of the screen, we have the taskbar. The right corner of the taskbar is reserved for status information. The tasks are represented by icons on the left corner of the taskbar. The tasks may be rearranged through drag-and-drop. The buttons between the tasks allows to view two tasks at the same time, either horizontally or vertically. On limited-size screens, such as mobile phones for example, the taskbar may be hidden, appearing only when the user hovers over the lower part of the screen.

Each application window is divided in four frames: list, form, media and social. The framebar may be used to maximize or show/hide each frame. The four frames might appear simultaneously, or any combination, including just one. On limited-size screens, only one of the frames may be visible at a time. The framebar may be hidden, appearing only when the user hovers over the right part of the screen.

The list frame is located on the left side of the application window and its main purpose is to help users browse different services. The list may be populated from the server-side by calling an appropriate service. Services may be interlinked with the serviceLink metadata. To allow secure cross-site access, CORS is used. Since browsing services is fundamental, a navigation bar is available on the left corner. The navigation bar allows the user to go back and forth, refresh, check the history, and access shortcuts. On limited-size screens, the navigation bar may be hidden, appearing only when the user hovers over the left part of the screen.

The form frame is located in the middle of the application window. Just like the list, the form may be populated from the server-side by calling an appropriate service. To allow secure cross-site access, CORS is used. The form frame features the title bar, the tool bar and the status bar. The title bar contains the name of the form currently being displayed. The tool bar provides buttons to perform actions. The status bar helps the user to be aware of which part of the form is currently being displayed, since the form might be broken into several parts. The buttons provided in the toolbar are also available from a menu on the status bar. On limited-size screens, the tool bar may be hidden, appearing only when the user hovers over the top part of the screen.

The media frame is located on the middle of the application window. Media might be an image, an audio, a video, or a graph. Conventional Web pages or self-contained Web applications may also be displayed in the media frame. In these cases, they are displayed within an iframe for security reasons.

And finally, the social frame is located on the right side of the application window. The social frame let’s the user communicate and share the application window with his/her contacts.

Leave a Reply