HTTP Interface

As well as the operator interface already described, the “Movement Controller” also provides most of those same displays via HTTP so that they can be displayed using an Internet Browser. Whether they are available via the Internet is dependent upon whether there is an Internet connection to the computer and upon firewall settings.

Although there is a corresponding HTML5 page for most of the displays of the operator interface, their appearance and functionality is very different. Generally speaking, no control functions are provided via the HTTP interface, but we have attempted to provide the same information. The HTML5 page corresponding to the Stores Diagram is shown below to give some idea of what can be expected.

What is displayed is determined by the “Movement Controller” software employing the contents of the application's subdirectory, “www”. The “www” directory contains a number of HTML5 files, a CSS3 file, “favicon.ico”, and the odd image file. The HTML5 files will contain, as well as the usual HTML5 and, possibly, JavaScript, special processing instructions which are interpreted by the “Movement Controller” software to provide live plant data.

As much of the HTTP interface is defined by HTML5, CSS3, and the odd image file, the customer is encouraged to modify this interface to better suit his desires or just to make it more presentable (bearing in mind that the original designer is colour-blind). With this in mind, there is a section of the software manual dedicated to describing this interface, and there is a link to that section, on the “Manuals” page of the HTTP interface.

As the “Movement Controller” reads the HTML5 files to deliver via HTTP on port 8080, it substitutes any processing instructions that it finds with the referenced live plant data. Whenever it delivers live plant data, it appends a JavaScript program that uses AJAX techniques to request regular updates of the plant data, in order to maintain a real-time representation of the plant.

The system diagram is largely graphical and so does not lend itself to being presented in HTML5. So, instead, we provide a text summary of the most important information on this page, and a link to allow the presentation of the actual diagram using SVG2. This is shown below, and if you click on it, it will present you that SVG2 page (for another site).

The actual file delivered contains very little SVG2. Instead, there is a large data array that is passed, along with a JavaScript program. This JavaScript program interprets the data array to build up the SVG2 definitions and elements. It then uses AJAX techniques to request updates. These updates arrive as data that need to be interpreted as instructions to alter certain attributes of the previously defined SVG2 elements. Also, in response to the operator clicking on any conveyor position, it will make an AJAX request to obtain all the details associated with that conveyor position, and present these in a table near the position clicked.

Should you click on the above image to bring up the actual SVG, that display will be making those continual update requests, but, here, will be given the same old data upon each request. If you watch attentively, you'll see that three emergency stops show up to the left of the diagram, then, once the first AJAX request is honoured, they will disappear. You can click on a conveyor position to present its details and click on the “Level” button to switch conveyor levels (when the upper level is shown, you can still see those conveyors on the lower level that are not obscured by the conveyors above).

Should you look into the JavaScript program, you'll find it is not very easy to read, as it was written by software, with no intention that anyone would be reading it. Among other things, it contains little formatting. The “C++” program that produces it has the indentation for the JavaScript to the left of the opening double quote, so that it reads well in the “C++” program, but doesn't consume space in the JavaScript file.