JavaScript

From SpinetiX Support Wiki

Jump to: navigation, search
The SpinetiX players conform with the ECMAScript Standard (ECMA-262) and implement the SpiderMonkey JavaScript engine.

Introduction

JavaScript (often shortened to JS) is a lightweight, interpreted, object-oriented language with first-class functions. It is a prototype-based, multi-paradigm scripting language that is dynamic, and supports object-oriented, imperative, and functional programming styles. Read more about JavaScript on MDN.

The JavaScript standard is ECMAScript (a scripting language that forms the basis of several well-known client-side scripting languages like JavaScript, JScript, ActionScript etc.), standardized by the Ecma International standards organization in the ECMA-262 specification and ISO/IEC 16262.

JavaScript engine

The SpinetiX players use the open-source SpiderMonkey JavaScript engine, currently maintained by Mozilla Foundation.

History:

  • Firmware 2.2.x - SpiderMonkey 1.8.0, which implements ECMAScript 3;
  • Firmware 3.0.0 - update to SpiderMonkey 1.8.5, which implements ECMAScript 5;
  • Firmware 3.1.0 - update to SpiderMonkey 17.

Getting started with JavaScript

To get started with the JavaScript language, refer to Mozilla's JavaScript Guide and JavaScript reference.

JavaScript tutorials

You can find a lot of tutorials on the MDN site under JavaScript section - some of the must-read are:

JavaScript reference

For the complete documentation of JavaScript language features, refer to the JavaScript Reference - some shortcuts are provided below:

How to include JavaScript code

To include JavaScript code inside an SVG document, the <script> element is used. The JS code can either be placed inline in the <script> element (as character data) or as an external resource, referenced through the xlink:href attribute.

<script xlink:href="http://download.spinetix.com/spxjslibs/jSignage.js" />

<script>
   <![CDATA[
       // Your code goes here ...
   ]]>
</script>

In case of interactive projects, the JavaScript code can also be included using the <handler> element in a similar manner as above.

How to debug the code

The best tool to debug the JavaScript code is to use the Developer Console included into Elementi X. Otherwise, you can use standard alert messages - these are displayed on the screen in Elementi and written inside the player.log on the HMP.

Supported APIs

  • jSignage API
    Simplifies writing code for animations, interactivity & event handling, DOM traversal & manipulation, Ajax calls, data feed parsing etc., comparing to standard JavaScript. It includes a port of the popular jQuery library on the SVG Tiny 1.2 uDOM.
  • HTMLImageElement API(since 3.0.0 release)
    An HTML5 API that allows querying information about the dimensions of graphic resources.
  • HTML Canvas 2D Context API (since 3.1.0 release)
    Provides objects, methods, and properties to draw and manipulate graphics on a canvas drawing surface.
This page was last modified on 24 July 2023, at 14:22.