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.