# WebPages HMI Scripting

The WebPages HMI scripting is based on JavaScript and supports HTML5.

WebPage HMI scripting is composed using the Script Editor, and has the following characteristics:

- Executes in a Web browser, and only execute when the job is online.
- Tags are stored at the beginning of the script; if the tag value is updated by another component of the system while the WebPage HMI script is being executed, that change will not affect the tag’s value within the WebPage HMI script. After the WebPage HMI script completes, the updated tag value will be written back to the tag, and will overwrite any other changes to the tag while the WebPage HMI script was executing.

- For actions that only affect the HMI, use the WebPage Elements Event handler scripts. If the action requires an immediate update, use a Promise within the code. Promises should be used to get the return values of a WebPage script, and then execute any dependent script code.

  Note: For more information about using promises, see the WebPages JavaScript Promises topic.

- WebPage Elements Event Handler Scripts

  These scripts are used with WebPage Elements Events, such as On Mouse Enter, On Mouse Up, On Changed, etc.

The WebPages HMI scripting can interact with the following:

- The properties of WebPage Elements, which are published as Tags (WebPages Element Property Tags).

  This allows you to access elements' properties, such as a Slider element's Value property or a TextBox element's Text property, using tags.

  For example:

      $MyTag = 45;

      console.log($MyErrorMessageTag);

      $WebPages.WebPage.TextBox.Text = "new text";

      $WebPages.WebPage.DataTable.Content = { Header: ["Header1"], Data: [ ["test"], ["test2] ] }

      $WebPages.WebPage.DataTable.Content = new TableData(["Header1"], [ ["test"], ["test2"] ] )

  Note: The two DataTable examples produce the same result.

Note:

- For more in-depth information about the JavaScript programming language, please consult the following (Internet access is required):

  - Mozilla JavaScript Guide
  - Mozilla JavaScript Language Reference
  - "JavaScript: The Definitive Guide" by David Flanagan