| Alarm: | Alarm State: | Time: | Time OK: | Count: |
| Alarm: | Alarm Time: | Time OK: | Ack By: |
| Event #: | Date: | Event: | State: |
| Date: | Tag: | Error: |
| Date: | Status Code: | Status: |
This program demonstrates a number of web based HMI features. This help screen explains what these feature are and how they may be used. For detailed information including how to make your own HMI screens, see the complete help system which is available on-line by following the directions provided in the installation instructions.
The first screen visible when starting the system demonstrates several different features. These are:
The main menu is used to select different HMI "screens". A "screen" is a collection of HMI elements that are visible together. They are referred to as "screens" here rather than "web pages" because the entire HMI web application is technically a single page. The menu is simply used to hide and reveal different parts of it as required.
This menu was created using HTML, and so is a text based menu. HTML menus are very simple to created and can be oriented and styled in different ways.
It is possible to have sub-menus as well as a main menu (as will be shown later). The main menu however provides access to the major divisions of the HMI. To go do a new screen, click on a menu item.
The following items would normally be found in most HMI applications:
The "graphical" menu is normally customised for each different application. It is referred to as a "graphical", because unlike the HTML based main menu, this one uses SVG (Scalable Vector Graphics) to provide a high quality graphical image for each menu item.
The examples here use a simple array of plain buttons. However each menu item can be of any size, colour, or shape, and can be in any orientation or location. The menu items in this example are for the following screens:
The general status area demonstrates several different items. On the left are three pilot lights labelled "Status", "Watchdog", and "Alarms". These are labelled pilot lights. "Status" and "Watchdog" are green when OK, and red when an error is present. The "Alarms" pilot light mirrors the state of the alarms table (it turns white when no alarms are present).
To the right is a numeric display in decorative bezel, displaying a continuously updating integer. This number is the message id, which is used to track browser to server communications.
Below that is a text display with a decorative bezel displaying the "server id", which is a string sent by the HMI server to identify it.
The tank demo is the largest demonstration on this screen. It consists of two tanks where liquid is pumped alternately from one to the other. The demo is controlled by the 3 position selector switch to the right.
When the selector switch is set to "FWD", liquid is pumped from the left hand tank to the right hand tank. While pumping is occurring, the rotor of the pump (below the tanks) can be seen to rotate. In addition, the pipes will show a colour change.
Both tanks are instrumented with gauges, numeric displays, and cut-away columns showing the relative "liquid" levels. The left hand tank uses a dial gauge with a rotating pointer. The right hand tank uses a vertical column guage.
To the right of the tanks are the controls. The 3 position selector switch can be activated by clicking directly on the labels. Clicking on the switch itself will always reset it to the "off" position. When a tank cycle has completed, the switch will automatically turn itself off.
Above the selector switch is a numeric display. This is similar to the one used for server message id (see above), but has been resized to be taller but with fewer digits. This display indicates pump speed.
Below the selector switch is another numeric display, but which has the added feature of two push buttons which can alter the pump speed.
Finally, there is a set of push buttons and pilot lights labelled "PB1" to "PB5". Each push button controls the adjoining pilot light ("PB5" is an illuminated push button). "PB1", "PB2", and "PB3" also trigger alarms which may be viewed on the alarm screen.
"PB1" is a momentary push button. "PB2" and "PB3" are two styles of maintained (toggle action) push buttons. "PB4" will cause its pilot light to cycle through a series of colours. An adjoining text display will show arbitrary text messages linked to the same push button. The text messages shown here are constants which can be associated with a numeric value, and do not have to be transmitted from the server (or in the control program). "PB5" is a simple toggle action illuminated push button.
This screen demonstrates a numeric entry keypad. Clicking on individual digits will cause them to accumulate in a calculator-like manner (including decimal point and sign). Clicking on "STR" will write the current value to the data table (and be shown in the numeric displays to the left). Clicking on "CLR" will clear the numeric display to permit a new number to be entered.
It also demonstrates how string constants (or any constant) can be attached to a push button and also written to the data table.
The pick and place demo shows how simple custom graphics can be animated. The pick and place itself is not a part of the standard HMI graphics library. However it was constructed out of just 10 rectangles and 2 polygons (the gripper jaws).
Clicking on the 2 position selector switches below will cause the pick and place to move. Clicking on the selector switch labels will cause the switch to move to that position. Clicking directly on a switch will cause it to toggle to the opposite position (this is different from the behaviour of a 3 position switch).
The switch position directly reflects the actual data table value, so the switches can be directly controlled by the PLC (or other control device) program.
Also present is a set of controls which demonstrate how an input device (e.g. push button) can be disabled under software control. A "buttom mask" is placed over the push button and made to appear or disappear under the control of the value of a tag (controlled here by the selector switch).
In the example shown above, the mask is hidden and the button is enabled. Pressing the button will cause the pilot light to change colour.
In the next example, the selector switch has been toggled to make the mask visible and it now covers the push button. The push button cannot be activated in this condition.
In addition to these there are a set of controls which show how animations work. This consists of a selector switch to turn the animations on and off, an animated pilot light, and an animated pump. Animations may not work correctly on all browsers at this time.
This strip chart demo screen shows how simple strip charts can be created. Strip charts may be any size or shape, with any number of traces.
Alarms are high priority operator messages which require acknowledgement (i.e. fault messages).
The alarm screen consists of two tables. The active alarms table shows alarms which are currently active. Repeated alarms are automatically summarised. Alarms are colour coded according to whether they have been already acknowledged and as to whether the fault condition has already corrected itself. If multiple operator stations are in use and an operator acknowledges an alarm, the acknowledgement is automatically reflected to all other operator stations.
Once alarms have been acknowledged and the alarm condition they automatically move to a historical table.
For the purposes of this demonstration alarms can be created using the PB1, PB2, and PB3 push buttons on the main tank demo screen.
The alarm screen is normally used as is. The alarm acknowledge button can be restyled or relocated.
Events are low priority operator messages which do not require acknowledgement. Events are displayed in a historical table.
For the purposes of this demonstration events can be created by the tank level and pump status on the main tank demo screen.
The event screen is normally used as is.
The error status screen displays communications errors. For the purpose if this demonstration, errors can be created using the "Test" screen. The error status screen is normally used as is.
Since the HMI is based entirely on standard web technologies an HMI page can be customised to any extent desired. In addition, all graphics are modifiable, and entirely new graphics can be created and will function on an equal footing with those supplied with the system.
Since HMI screens are just web pages, multiple languages may be supported by simply translating web pages. Text constants, event messages, and alarm messages are stored in data files and so may be customised (translated) for each web page by simply importing a different data file.
The web page templates come with standard help page text explaining the standard features. The following shows the standard help descriptions. The help text would can however be customised for each application to whatever degree is required.
Alarms are high priority operator messages which require acknowledgement (i.e. fault messages).
The alarm screen consists of two tables. The active alarms table shows alarms which are currently active. Repeated alarms are automatically summarised. Alarms are colour coded according to whether they have been already acknowledged and as to whether the fault condition has already corrected itself. If multiple operator stations are in use and an operator acknowledges an alarm, the acknowledgement is automatically reflected to all other operator stations.
Once alarms have been acknowledged and the alarm condition they automatically move to a historical table.
The active alarms table contains the following columns:
The alarm history table contains the following columns:
Events are low priority operator messages which do not require acknowledgement. Events are displayed in a historical table.
The events table contains the following columns:
The error status screen displays communications errors and status. The communications errors errors table displays error codes returned from the server. These error codes are associated with individual commands for such things as data out of range, incompatible data types, etc. Status errors are usually caused by HMI programming or server configuration errors. The communications errors table contains the following columns:
A communications status code reflects the protocol status code. A status message is added to the table whenever a status code other than "ok" is returned. The communications status table contains the following columns:
Communications error and status messages are only returned to the client which generated the original request. When the web page is reloaded, the messages are cleared.
This screen.