ci-server-engineer/knowledge/manuals/IM36K10R30-01EN.md

manual	title	edition	version	status
IM 36K10R30-01EN	Graphic Display Setup	3rd Edition, Sep. 2023	R1.03	HTML display (Mobile Operator) and a project layout (CIENG_Operator) verified in the Operator Interface (desktop) and the HTML display 2026-10-01; dataset forms, form language and dual screen from docs

Graphic Display Setup (R1.03)

How the operator interface is framed (layouts), how custom dataset forms are added, and how displays run in a web browser (HTML display, "Mobile Operator"). Section numbers refer to the manual. Building displays: IM36K10C50-01EN.md; AOG library: IM36K10C60-01EN.md.

1. Files and folders (installed)

What	Where (%TLS_WAP_PATH% = C:\Users\Public\Yokogawa\tls\wap)
Displays (operator interface)	cfg\operatorInterfaces\DEPLOY\displays\<name>.xml (plus .lck while open in the Edit Module, .autosave)
Symbols	cfg\operatorInterfaces\DEPLOY\symbols\ (≈ 3100 files incl. the AOG library)
Layouts	cfg\operatorInterfaces\DEPLOY\layouts\Layouts.xml (+ Layouts.readme, Layouts-original.xml)
Components, locales, thresholds	cfg\operatorInterfaces\DEPLOY\components\, locales\, thresholds\
HTML displays	mobileoperator\operatorInterfaces\DEPLOY\displays\<name>.html
Dataset forms	cfg\dialog\dialogs\<name>Dia.xml (components <name>Com.xml, definitions JToolsGlobalDef.xml); texts in cfg\properties\

DEPLOY is the deployment name (a user's Operator Interface Deployment field selects another; empty = deploy).

2. Layouts (§1)

• Layouts.xml holds several <layout> elements under <layouts> (common options such as debugActivationKey="CONTROL SHIFT F6" for the graphics debugger, Java only). A layout = menu, toolbar, frame set (required), status line.
• Layout options: name, icon, title ($<frame> = title of the display in that frame), drawBorder, sizingAllowed, minimizingAllowed, closingAllowed, alwaysOnTop, modal, lookAndFeel, initialPosition (… fitFrames), initialPositionX/Y, initialSize, initialSizeWidth/Height, maximumOpen, print orientation and margins (Java only).
• Menu items (§1.5, e.g. menu.file.login, menu.view.reload), toolbar (§1.6), status line items (§1.7, e.g. graphics queue level), frames and tabs (§1.8), translations (§1.9).
• Which layout opens: In layout of an Open display action (Edit Module), or the user's Layout field (Engineering Module, Authorization > Users); empty = default.
• Dual screen (§1.10): copy the layout and the banner display as <name>_1 / <name>_2 and let each banner open its main display in its own layout.
• Verified (2026-10-01): sample layout CIENG_Operator (skill graphics, task layouts.md): second window from an Open display action, own menu/toolbar/frames, $default title, popup layout, F11; the Operator Interface reads Layouts.xml only at start. The installed Layouts.readme is the full reference for options and commands.
• Installed layouts: mobile, default, sxga1f/r, uxga1f/r, wxga1f/r, wsxga1f/r, wsxgap1f/r, wuxga1f/r, ResizablePopup, FixedPopup, popup, Splash, tuningpanel, faceplate, SelectMode, Setpoint, mapviewer (f fixed / r resizable per screen size). The test system's Layouts.xml also has a custom layout added by the author; keep a copy of the original before editing.

3. Dataset forms (§2, §3)

Engineering-Module-style forms for operators: write <name>Dia.xml in cfg\dialog\dialogs (never change the existing forms there), optionally a property file per language, then place a Dataset form component on a display. Objects: label, textField, checkBox, comboBox, panel, component (JhmiRecordNameCom, JhmiTreeComboBoxCom, JhmiSelectAvailableCom, JhmiTimeSelectorCom); meta links an object to a dataset field: field=, mixedValue=, choices=<dataset>[,<field>[,<filter>]], none=, available=/selected=, label=, dateVisible=, visibility=. Layout by column, top="+", right="*". Localisation via property files and language codes (§3.5).

4. HTML display / Mobile Operator (§4)

• Export: Edit Module saves the HTML version automatically when the display has HTML display ticked; or jwuiutl -e HTML -i [-o <path>] [-f <deployment>] [<display>] (without -o it writes into mobileoperator\operatorInterfaces\<deployment>). Verified: both give identical HTML (except a time stamp).
• Open: http(s)://<host>:8080|8443/mobileoperator?d=<display>&l=<layout>&u=<user> or Open of Mobile Operator on the Remote Connect page. Login with a CI Server user (manual, or SSO via https://<host>:8443/auth/mbl); user profile fields used: password, authorization group, ASA, shelving group, process areas, logoff timeout, deployment, initial display, locale (layout not). Login control: dssana.sup interface mobile operator.
• Verified: http://localhost:8080/mobileoperator/?d=CIENG_Tank showed the operator frame (menu, navigation buttons, alarm banner, status line) and the display; the number field updated live; the alarm overview listed the sample's alarms. Reloading the browser page ends the session (login again); use the display's own menu View > Reload instead (keeps the session, confirmed by the user), and the display box to open other displays.
• Differences from the Java operator interface (§4.7): layout windows live inside the browser window (no resizing of embedded layouts); displays need explicit width/height; names are case-sensitive; zoom and pan not supported; some mouse/keyboard events and actions missing; no enterprise displays. Components supported (§4.8): alarm overview, display, group, symbol, trend, visibility group/layer, parameters, web browser (with listed properties).
• Full screen F11, Chrome shortcuts or chrome.exe --app=http://<host>:<port>.
• Test system: the HTML trend of CIENG_Tank drew no line although history existed; browser console Mismatch between number of labels … and number of columns in array (51) (ISS-041). Cause (2026-10-02): the web trend code always builds 50 data columns, so a trend draws only with 50 visible pens; workaround add_trend_spares.ps1, details and web/desktop differences in skill graphics, tasks/trend.md §6.