The EEvision GUI Main Features
The HTML Structure
The EEvision main GUI is built on a static HTML structure that is dynamically extended or changed by JavaScript. The GUI consists of a toolbar, some dialog windows plus one big CANVAS element that renders the schematic diagram. The HTML structure is as follows (optionally with a class and/or an id):
HTML HEAD TITLE [...] BODY FIELDSET id=toolBar SELECT id=t_otype INPUT id=t_search [...] DIV id=settwin DIV id=loading DIV id=livesearch DIV id=infowin DIV id=errwin DIV id=canvDIV CANVAS id=canv SCRIPT
The Toolbar
HTML BODY FIELDSET id=toolBar SELECT id=t_otype INPUT id=t_search BUTTON id=t_smode BUTTON id=t_load Load BUTTON id=t_extract Extract BUTTON id=t_lnet Net BUTTON id=t_info ⓘ BUTTON id=t_regen Regenerate BUTTON id=t_optim Optimize BUTTON id=t_gmode GM DIV id=toolBar_right DIV id=toolBar_pi DIV id=toolBar_dropdown BUTTON id=t_more More▼ DIV id=t_menu BUTTON id=t_lall Load All BUTTON Print BUTTON SVG BUTTON id=t_rot90 90° BUTTON id=t_log Logical BUTTON id=t_block Blocks BUTTON id=t_home BUTTON id=t_settings ⚙ BUTTON id=t_yellow disabled
Here is the complete HTML structure of the toolbar. Buttons from dynamically loaded plugins are inserted into the toolBar_pi container.