Frontend

The eDESIGN frontend serves as the primary user interface, where the designed pages come to life. Think of it as the final product, the website or application that end users will interact with. In normal operation, only the frontend is loaded, providing a seamless user experience.

Frontend Layout:

The frontend page consists of three main areas - the top toolbar (1), the left menu bar (2) and a screen area (3)

The frontend is comprised of three key areas:

Top Toolbar (1): This customizable toolbar can house various elements like a menu icon, a home button, and more. It can be configured in the editor to show or hide specific components based on your needs.

Left Menu Bar (2): This navigation menu provides users with quick access to different pages and functionalities within the application. Similar to the toolbar, menu items can be edited and organized hierarchically in the editor. Additionally, you can control which pages are visible to specific user roles, ensuring a tailored experience.

Screen Area (3): This is the central workspace where all the pages created in the editor are displayed. This is where users will see and interact with the content you've designed.

Understanding the Toolbar:

The toolbar offers quick access to various functions and information, and its components can be customized in the editor:

Frontend with toolbar

  1. Menu Bar: Provides navigation options within the application.
  2. Logo and Home Button: Offer a quick way to return to the main page.
  3. Time and Date: Displays the current date and time.
  4. Language: Allows users to switch between different language options.
  5. Login: Provides access for authorized users.
  6. Help: Offers assistance and documentation within the application.

The menu component contains navigation links to pages and other system components, e.g. alarms. Menu items can be edited in the Editor module and allow recursive submenu items. In the Editor, you can also specify which pages are visible to which roles. That is, if the menu item is linked to a page that is not visible to the currently logged-in user, the item will not be displayed.