Download - Saia-Support

Technical Information 

Saia ® S-Web-Editor – visualization and 

operation made easy 

A tool for web-based HMI devices 

Controls Division 

Key benefits 

■ Create web pages by placing and parameterizing graphic objects specially tailored to the Saia ® PCD controls. 

Intuitive use without any HTML or Java programming knowledge. 

■ Generation of web pages by the WYSIWYG method (what you see is what you get) for all standard screen 

resolutions. 

■ Precise and efficient working with formatting tools and extended drawing functions familiar from 

Windows. 

■ Save valuable engineering time by the use of foreground and background pages, on the principle 

“write once, use many”. 

■ Macro management for the creation and reuse of your own macro objects generated from basic objects. 

■ Savings in engineering from optimum integration within the Saia ® PG5 controls suite, and from the 

associated direct access to PG5 symbol variables. Eliminates duplicate entry and additional sources 

of error. 

■ Convenient trending function to display and analyze historical data. 

■ Powerful alarm management function for machine or system monitoring.

Saia ® S-Web – an integrated system approach 

Reduction in engineering and maintenance costs with web-based HMI concept 

Compared to the normal HMI concepts, the Saia ® S-Web concept offers crucial strengths and, together 

with its components, constitutes a comprehensive system solution. 

■ Web server integrated into the Saia ® PCD control 

■ Many web-based HMI devices 

We offer a broad product portfolio, from the simple, 

cost-effective Saia ® micro-browser touch-panel, 

through the eWinCE- and eWinXP-based Saia ® touchpanel, 

to the standard PC with Internet Explorer. Our 

micro-browser supports mobile access with Windowsbased 

PDAs or smart phones. 

With the Saia ® S-Web-based concept, on the other 

hand, the HMI functions and applications are stored 

in the SPS – the PCD web server. In the event of 

changes or enhancements, only the SPS application 

in the control concerned has to be modified. This 

significantly reduces engineering and maintenance 

costs. 

HMI 1 

PLC Browser 1 

HMI 2 

Browser 

■ Powerful software tools to generate and manage web 

and HMI projects. 

PLC 1 

HMI PLC1 

HMI n 

Browser 

HMI 3 

Browser 

The S-Web concept enables innovative HMI solutions 

which stand out from classical HMI solutions 

in terms of functionality and costs. 

PLC 2 

HMI PLC2 

PLC 3 

HMI PLC2 

Internet 

Intranet 

Lower engineering costs and simpler maintenance 

In classical HMI concepts, the HMI device only 

exchanges user data with the SPS. The actual display 

(the HMI application) is generated with a specific 

HMI editor and stored in the HMI device. In 

the event of changes or enhancements, both the 

SPS program and the local HMI application have to 

be modified. Where there is communication with 

multiple SPS controls, the application becomes proportionally 

more complex and costly. If there are 

several HMI devices in a system accessing the same 

control, the application has to be created, stored 

and maintained for each of these front-ends. 

HMI 1 

PLC 1 PLC 2 PLC 3 

HMI 2 

Open and flexible 

The HMI device only needs the web browser, and 

retrieves both the user data and the visualization 

pages from the web server of the Saia ® PCD control. 

This makes it easy to exchange and enhance 

the HMIs. Other HMI devices or PCs with web 

browsers can be added at any time without any 

change to the SPS or the visualization application. 

They can be integrated into the IT environment 

and connected to higher-level systems with 

worldwide access to remote support via Internet/Intranet, 

using the standard Ethernet-TCP/IP 

and HTTP protocols, easily and at no additional 

cost. As the HMI application is stored in the SPS, 

the user interface is always displayed in the same 

way, whether on local micro-browser web panels 

or notebooks running Internet Explorer over the 

Internet. 



| 

www.saia-pcd.com 

Technical Information Saia ® S-Web-Editor

fi 

Saia ® S-Web-Editor – simple and efficient creation of 

web pages 

Powerful software tools are crucial 

When implementing web-based visualization and control interfaces, the generation of the web pages 

makes up a substantial part of the engineering costs. Attractive and functional web pages are the 

hallmark of the machine or system, and support efficient and secure operation. A powerful tool for 

generating the web pages is therefore crucial. 

and above the basic functionality, such as the display 

and analysis of trend curves and a powerful 

alarm management function, are available in the 

Advanced Edition. 

Saia ® S-Web-Editor: simple, intuitive and efficient 

Designing dynamic web pages with a normal HTML 

editor is laborious and requires specific know-how 

(in-depth HTML and Java programming knowledge). 

To ensure that this innovative technology 

does not remain the preserve of a small circle of 

specialists, the S-Web ® Editor provides the user with 

a simple-to-use software tool for generating HMI 

web pages. The S-Web Editor is used to create Javabased 

web-pages simply and efficiently by placing 

and parameterizing objects specially tailored to the 

Saia ® PCD web server. The use of the Editor is intuitive, 

and requires no HTML or Java programming 

knowledge. With optimum integration into the 

Saia ® PG5 controls suite and the associated direct 

access to all symbols, powerful macro management 

to generate your own reusable macros and many 

other useful functions for efficient generation of 

web pages, the engineering costs are significantly 

reduced compared to other editors. The investment 

for the one-off license pays for itself in the very first 

project. The S-Web Editor exists as a Basic Edition 

and an Advanced Edition. Important functions over 

A tool for all web-based HMI devices 

The Web-Editor can be used to throughout to generate 

web pages for all web-based HMI devices: from 

the simple and cost-effective Saia ® micro-browser 

touch-panel through eWinCE- and eWinXP-based 

Saia ® touch-panels, to the 

standard PC with Internet 

Explorer, and even for 

mobile access with Windows-based 

PDAs or smart 

phones with micro-browsers. 

For further information, 

please see Technical 

Information 26/432. 

Saia PCD Web Panel eXP 

For machine and 

system operation 

The web-based HMI devices are used successfully 

today in conjunction with the Saia ® PCD web 

server both as operational and support devices for 

machine controls and for simple Scada systems, e.g. 

in building automation. 

Technical Information Saia ® S-Web-Editor 


|

The Workbench 

Clear and functional design of the user interface 

Menu bar with pull-down menus. All avaialble 

commands and configuration parameters are 

accessible via the menus. 

Toolbar with the most frequently 

used commands. 

Toolbar with the available standard 

graphic objects (Painter objects). 

Project Files list: 

Shows all TEQ views 

(web pages) and other 

files used in the 

project. 

„Painter Configurations“: 

shows the 

parameters for 

the selected object 

(Painter). By doubleclicking, 

they can also 

be changed in this 

separate window. 

The formatting tools familiar from Windows, 

and extended functions such as layout, 

centring, grouping, layering, grids etc. 

These important tools enable efficient and 

precise work when creating and formatting 

the web pages. 

Work area for creating the TEQ view (web 

page). This displays the page/file selected 

from the „Project Files“ list. The size matches 

the display resolution set for the web HMI. 

The pages are generated in WYSIWYG format 

(what you see Is what you get). 

| 



HMI functions and settings 

The configuration options applicable to the whole web HMI project are described below. The settings 

are entered in the “Project Configurations” menu box. 

Resolution of the web HMI displays 

(Teq Configurations) 

resolutions. The resolution can also be set for each 

individual page. This means that web pages can 

be produced for different displays within the same 

project and stored within the PCD web server. 

Refresh interval of process data points 

(PCD variables) 

The PCD variables used are automatically read and 

updated within the browser by the PCD web server 

on a cyclical basis. The refresh interval can be set in 

the Web Editor and hence optimized for the whole 

SPS application. Write commands from the browser 

to the web server are not affected by the refresh 

interval and are always processed directly. 

Background and foreground pages 

The ability to use background and foreground pages 

is valuable and helps to produce a professional and 

consistent design of the web pages. The principle 

“write once, use many” also saves valuable time in 

generating the web pages. 

Background pages (Background Teq) 

The Background Teq appears in the background of 

the current web page. It allows page templates with 

standard design elements to be developed, e.g. a 

company logo or standard controls (e.g. navigation 

menus). 

Foreground pages (Foreground Teq) 

As the name suggests, the Foreground Teq appears 

in the foreground and overlays the current web 

page. The Foreground Teq is ideally suited for cyclical 

monitoring of conditions in the background and 

for displaying the relevant events in the foreground. 

In this way, e.g. errors or other messages can very 

easily be displayed in the current view on an eventdriven 

basis. 

Background and Foreground Teq can be generated 

and used for the whole project or individually 

for each web page. 

Multilingual HMI projects for worldwide deployment 

The concept of “HTML tags” makes it easy to 

develop multilingual HMIs. Text strings to be used 

in multiple languages are defined as “HTML tags”. 

At the press of a button, these tags and the original 

text strings are saved to an Excel-compatible CSV 

file (in ASCII format). These files are used for translation 

into the desired languages. Within the web 

browser, the user can switch languages quite easily 

at run-time, at the touch of a button. Support for 

Unicode character sets is also available. Provided 

that the web HMI device itself supports Unicode, 

Asian and Cyrillic character sets can also be used 

and displayed. 



|

The basic Painter objects 

Placing, parameterizing and animating graphical Java objects 

The Painter objects can be used to create and animate graphical web pages. A Painter is a graphic 

object programmed in Java. All available Painter objects are stored in the “IMaster.jar” applet. 

The basic Painter objects have predefined properties and functions, which can be parameterized 

by the user in the Web Editor. This defines the appearance and behaviour of the objects at run-time 

in the web browser. Variables can be used to control the behaviour of the objects dynamically at 

run-time also. 

Static text 

This object can be used to create and parameterize 

static text; the content may also be a variable. Various 

properties (colour, text position, text source 

etc.) of the object can be controlled dynamically at 

run-time using variables (e.g. PCD variables such 

as registers and flags). 

Edit field 

The Edit field can be used to display and modify 

variables. The variables are read cyclically by the 

web server and written back immediately they 

are changed by the user. Various display formats 

(binary, decimal, float, string etc.) can be set for the 

variables. Minimum and maximum values allowed 

for input by the user through the browser can also 

be defined. It is also possible to display a unit. 

Drawing functions 

These objects offer a selection of predefined 

drawing objects. The polygon can be used to draw 

any kind of shape. The fill colour and the border 

can be controlled dynamically at run-time using 

variables. 

Button 

The buttons can be used by the user to trigger actions 

such as a paging, links (URL jumps) value changes 

etc. The standard button icon can be replaced by 

specific GIF graphics and changed conditionally at 

run-time. Buttons can also be made visible or invisible, 

active or inactive, and modified conditionally 

at run-time. 

Image 

This allows graphics in GIF format (e.g. logos or 

system icons) to be integrated into a web page. 

The graphics can be displayed hidden or switched 

dynamically at run-time independently of the variables. 

Bar Graph 

This allows variable to be displayed graphically in 

a bar graph. According to the configuration, the 

colours can be changed to reflect the values in up 

to three steps. 

| 



Easy and intuitive configuration of properties and display of graphic objects. 

By double-clicking on the Painter objects, you are taken to the configuration dialogues, where the 

properties and behaviour of the objects can be parameterized at run-time. The main configuration 

dialogues are shown below. 

General settings 

The general settings are the same for all objects. 

This is where background colours, font sizes and 

line types are configured. If necessary, the size and 

position of the object can be adjusted to an exact 

number of pixels. 

Repaints 

The data, variables or graphics displayed by the 

object are defined under Repaints. When assigning 

PCD variables, you can access the PG5 symbol file 

directly. This eliminates duplicate entry and additional 

sources of error. The display of Painter objects 

in the browser is also configured here. An object can 

be conditionally displayed, hidden or deactivated by 

variables. These configuration options are available 

for all Painter objects. 

Actions 

Actions are only available for Button objects. They 

define the actions to be performed when the button 

is pressed. Values can be written to a variable, 

and paging or links (URL jumps) can be triggered. 

Apart from normal page changes, these may be links 

to HTML pages, e.g. for help files, or links to other 

web servers (e.g. support servers on the Internet). 

Border Advanced 

A setting available for all objects, used to define the 

colour properties of the object. The colours can be 

changes in many stages according to variables. 

Text Positions Advanced 

With the Static Text and Button objects, the text 

position can also be controlled at run-time based 

on variables. 



|

Extended functions and objects 

Create and manage macros 

Basic Painter objects can be combined into a macro 

with the grouping function and saved to the macro 

library for reuse. Basic objects grouped into a 

macro can then be easily and efficiently manipulated 

(moved, copied, enlarged or reduced etc.). 

Password entry 

The Password entry macro can be used to implement 

simple access security with a password request. 

Up to 4 different access levels can be defined. The 

passwords are stored in the non-volatile memory 

of the PCD control. On input, the password entered 

is compared against the passwords stored in the 

PCD, and the access level within the browser is set 

accordingly. Depending on the current access level, 

the Painter objects can be individually displayed or 

hidden, activated or deactivated, and so protected 

against unauthorized access. 

Combo Box 

The “combo box” allows the user to select a single 

element from a predefined list. The selected element 

is displayed in the field and the corresponding 

index number is written to the specified PCD variable. 

The element text can also be switched according 

to the language. 

Automatic paging 

The macro “teqJumpEvent_onPPO” can be used to 

force automatic page changes by the SPS application. 

The page changes are triggered automatically 

by PCD variables based on the content. This allows 

machine- or process-controlled user navigation to 

be implemented. In the event of a machine problem, 

for example, the relevant diagnostic page with 

the necessary corrective actions can be displayed 

directly. 

Table control / spreadsheet 

This macro supports the display/input of values, 

text, conditions etc. in tabular form. The arrow keys 

can be used to page up and down. The individual 

cells can be built from any Painter objects. Edit box 

objects can also be used for direct input of values. 

The basic macro comprises a template with 4 columns 

of 10 rows each. Based on this template, the 

user creates the table structure to meet his requirements. 

| 



Trend recording and display 

The Trend macros can be used to display historical data in the browser as graphical trend 

curves. The data can be captured and filed either online through the browser, or offline through 

the PCD control. 

Data capture 

Offline data capture in the control is handled by the 

HDLog FBox library for PCD Classic controls, or the 

HDLog FB library for xx7 controls. 

The user configures in the FBoxes or FBs whether 

the display of the data should be event-driven and/ 

or cyclical. For recording, either a ring memory 

(old values overwritten) or permanent memory 

(recording terminated when the buffer is full) 

can be used. 

Within the control, the historical data is captured 

Various Trend macros are provided for online and 

offline data capture. For online data capture, the 

HDLog library is not needed for recording the data 

in the SPS. The values are read cyclically by the web 

browser and displayed online as trend curves. To 

record the data, the appropriate view must be displayed 

in the web browser. 

The user can choose from three different trending 

macros as required: 

in data blocks with date and timestamp (1 second 

precision). The available memory is configurable, 

and depends on the PCD type used (e.g. for 

the PCD2.M170: 1 Mbyte in total for programs and 

data). For each value recorded, 8 bytes are occupied 

(4 bytes for the value and 4 bytes for the date 

and timestamp). This is true for digital and analogue 

signals. 

Example calculation: 3 process signals are to 

be recorded every 15 minutes for 3 months. The 

DB space required is 3 x 90 x 24 x 4 x 8 = 207,360 

bytes. 

Displaying trend curves in the web browser 

Up to 5 curves can be displayed at once in the same 

window. The trend curves can be analyzed in detail 

with powerful scroll and zoom functions. The “linear” 

function allows detailed values from the curve 

at a particular point in time to be displayed. The 

trend data can be saved to a file on the browser PC 

in Excel-compatible CSV format if required. 

Depending on the macro used, the configuration 

parameters (number of curves, min/max values, 

colours etc.) can be changed in the web browser 

even at run-time. 

■ TrendMinimal supports reduced functionality. 

The focus here is on ease of use. 

■ TrendComplete supports the full functionality 

■ TrendScalable supports reduced functionality 

and can be easily modified by the user. 

With all macros, the design (size and arrangement 

of the various elements such as buttons, display 

fields, fonts etc.) can be individually tailored by the 

user according to his needs. The Web Editor is used 

to configure the properties and the display (colours, 

labels, scales etc.) of the trend curves. 



|

Alarm Management 

The process signals are monitored and alarms 

picked up independently of the web browser in the 

PCD control. The actual alarm function is implemented 

in the firmware on the PCD control. It is 

activated and parameterized using CSF (Call System 

Function) instructions, or SFC (System Function 

Call) instructions for xx7 controls. A Fupla 

FBox library for the PCD Classic is available. 

The alarms are stored in alarm lists in the nonvolatile 

internal memory of the PCD control. There 

is a clear distinction between the alarm status list 

and the alarm history list. 

The alarm status list in the PCD control contains the 

following information for each alarm type defined: 

■ The alarm number (the associated alarm text 

can be defined either as PCD text or in a CSV file 

using an HTML tag). 

■ Date and timestamp of the last alarm entry 

■ Status of the alarm (pending or expired) / date 

and timestamp from when the alarm expired 

■ The acknowledgement status 

■ Total counter for the alarm concerned 

Display and editing of alarm lists in the web browser 

To display and edit alarm lists in the web browser, 

the user has a choice of 3 different alarm macros. 

The „Alarm status list“ macro can be used to display 

the alarm status list and edit it online. Alarms 

can be acknowledged and deleted individually or in 

groups, using multiple selection. 

The „Alarm history online“ macro can be used to 

display the alarm history list and edit it online. 

Alarms can be acknowledged and deleted individually 

or in groups. 

The alarm history list stores all alarm events in the 

PCD control, with the following information: 

■ The alarm number (the associated alarm text 

can be defined either as PCD text or in a CSV file 

using an HTML tag). 

■ Date and timestamp of each incoming alarm 

■ Date and timestamp of each outgoing alarm 

■ The acknowledgement status 

The alarm history list can be configured as ring 

memory or permanent memory. 

For each alarm list, there is a generic alarm, signalling 

a new alarm entry. This allows the user 

to trigger specifically defined alarms (e.g. display 

alarm message in the browser). 

Up to 10 different alarm lists can be defined and 

managed within a PCD control. The reserved memory 

for the whole alarm database is dependent on 

the PCD type used, and cannot exceed 64 kB. An 

entry in an alarm list takes up 15 bytes. That means 

that up to 4,200 entries (alarm status list and alarm 

history list) can be stored in the alarm database. 

The „Alarm history offline“ macro can be used to 

load the alarm history list into the browser and analyze 

it efficiently offline (i.e. without connecting to 

the alarm list on the PCD control). For this, the list 

can be sorted according to various criteria or saved 

to an Excel-compatible CSV file on the hard disk of 

the browser PC and e.g. e-mailed to other people 

for further analysis. 

The alarm texts can be defined as PCD text strings 

or using HTML tags. HTML tags are defined in CSV 

files and so support multilingual functionality. For 

each language there is a CSV file which is activated 

within the browser at run-time. 


Technical Information Saia 

10 | ® S-Web-Editor

System limits 

Saia ® S-Web and Web Editor as the solution 

to all requirements? 

Compared to normal HMI concepts, the Saia ® S- 

Web concept has some crucial strengths. The next 

few sections contain information on possible limits, 

which are intended to help find the optimum solution 

for the customer application. As with cars, every 

model is not the best solution for every purpose and 

requirement – for example, a Rolls-Royce offers 

great comfort, but is not especially economical or 

manoeuvrable, a Ferrari is a sports car with limited 

comfort, and a Smart car provides limited space but 

is small and manoeuvrable. A comparable situation 

exists with the different HMI concepts. 

Is the Saia ® S-Web concept suitable as a high-level 

central control system in large installations with 

distributed controls? 

The web browser only ever communicates with one 

PCD web server at a time. The web application in 

a PCD control may contain URL links to other local 

distributes PCD web servers. This allows decentralized 

structures to be operated and managed with 

the same HMI or web browser. However, a system 

structured in this way does not offer the same possibilities 

as a higher-level control system that stores 

the local data from several PCD web servers in a 

central database and makes it available for further 

processing. In smaller systems, the resources of a 

PCD control with a web server are sufficient to support 

this central function. However, in large systems 

with a large number of distributed PCD controls, it 

becomes necessary to use a higher-level control 

system in addition to the PCD web servers. 

It is important to recognize that the solutions complement 

each other and are not mutually exclusive. 

A higher-level control system can always access the 

web application on the PCD control (used by the 

local HMI device). 

Moreover: simpler higher-level functions and 

displays that access multiple PCD web servers can 

be addressed with the Web Editor and the relevant 

programming knowledge (HTML, Java Script, VB), 

without using an additional control system. 

Does the Saia ® PCD web server have sufficient 

system resources for all applications? 

The Saia ® PCD web server is integrated with SPS 

systems optimized to handle control tasks. The 

resources are therefore allocated differently to a 

standard PC system. Unlike a PC system, the PCD 

control does not have almost unlimited memory and 

CPU resources. Apart from handling the web application, 

the PCD’s main task is to control the process. 

The HMI functions integrated into the PCD system, 

such as trending, alarm management, access security 

etc., are structured and implemented with an 

eye to the available resources. For this reason, user 

expectations are not the same as with a large-scale 

Scada system based on powerful PC systems. The 

available resources of the PCD control must be 

taken into account by the user when selecting and 

designing projects. 

Are there other system-related properties 

to be considered? 

The Saia ® S-Web concept is based on web technology, 

with the corresponding system behaviour. 

A web page has to be loaded by the browser via 

the communications interface from the PCD web 

server before it can be displayed. The load times may 

therefore be longer compared to a system where the 

HMI pages are stored locally. The exchange of data 

between the web browser and the PCD control is 

always via the PCD web server. Data transfer uses 

the HTTP protocol, in ASCII format. This may also 

result in longer response times in comparison to 

purely binary transmission protocols. A web server is 

basically passive, and only reacts to requests from the 

browser. Without an active connection between the 

browser and the PCD web server, no event-driven 

information and messages can be displayed in the 

browser. 

Does the PCD web server have access security with 

user administration? 

As described in this document, there is simple password 

security with 4 different access levels. There 

is no more comprehensive access security with 

unrestricted user administration and any number 

of definable access rights. 



| 11

Case studies and order details 

Operating and maintaining stock systems with 

Saia ® web panel 

A major manufacturer of 

stock systems is upgrading 

its systems with the 

latest Saia ® web technology. 

Depending on the 

application, eWinCE or 

Micro-browser-based 

web panels from Saia- 

Burgess are used for 

local control of the systems. For commissioning, 

diagnostics and maintenance, the support staff also 

use notebooks with Internet Explorer, with local or 

remote access to the telecommunications network. 

No proprietary software tools are needed. 

The 200+ HMI pages used to run and maintain the 

system are created with the Saia ® S-Web-Editor and 

tailored to the needs of the users. This increases 

both user friendliness and security. The HMI pages 

are generated in multiple languages and stored 

in the PCD3-based controls. The language can be 

switched by the user at run-time. 

Operating and monitoring building systems 

with Saia ® web technology 

In conjunction either with Saia ® web panel or with 

PCs running Internet Explorer, the Saia ® PCD web 

server is used in many projects as a simple visualization 

system – for smaller buildings such as 

houses and flats, schools 

and hospitals, banks and 

other office buildings. 

Thanks to the web server 

integrated into the PCD 

controls and the use of 

standard software like 

Internet Explorer, there 

are no run-time license costs. The web pages are 

easily and efficiently generated with the S-Web Editor. 

Whether the PCD web server is accessed locally 

or remotely, the user interface for heating control, 

ventilation, electricity supply etc. is always the 

same. To optimize the control of the system, process 

parameters can be recorded, and then displayed 

and analyzed in trend curves. The alarm module 

captures and stores faults and supports operators 

and support staff in locating and fixing errors. 

Order details 

■ S-Web-Editor Basic Edition for Saia ® PCD 

■ S-Web-Editor Advanced Edition for Saia ® PCD (incl. trending and alarms) 

Contact 

Switzerland and international 

This brochure was received from: 

Saia-Burgess Controls Ltd 

Bahnhofstrasse 18 

CH-3280 Murten / Switzerland 

T +41 (0)26 / 672 71 11 

F +41 (0)26 / 672 74 99 

pcd@saia-burgess.com 


Product Support, 

Technical reference website: 

www.sbc-support.ch 

P+P26/453 E3 05. 2008 

Subject to change without notice.

Download - Saia-Support

Create successful ePaper yourself

Delete template?

Save as template?