Loading ...

OpenWGA 7.9 - OpenWGA Concepts and Features

Design and development » TMLScript » TMLScript Objects

Define and instantiate Script Objects

Script objects are defined in TMLScript modules using "prototype syntax":

// Constructor

function Product(articlenumber){ 
  this.name = "my product " + (articlenumber || "unknown");
}


// Methods:

Product.prototype.getName = function(){
  return this.name;
}

Creating script object instances

Script objects may be instantiated either manual in your design or implicitly by the OpenWGA runtime system (TML Module Controller, TMLScript Globals).

To manual create an object you use the JavaScript "new" keyword. However OpenWGA needs to know where to find the TMLScript module in the app design that contains the objects script code. The constructor of a script object can be retrieved using a "design locator" object globally available as $:

var Product = new $.Product()

Methods can then be called as expected:

Product.someMethod();

The above piece of code loads the TMLScript module "scripts/tmlscript/Product.tmlscript" and calls a method Product() inside this module to create a new script object. This means that a TMLScript module with name "X" MUST contain a constructor function X() with the same name as the TMLScript file. File names and constructor names are case sensitive. We advice to use propercase names as in this example.

To be more precise:

The OpenWGA design locator analyses the name of the TMLScript module (without extension .tmlscript) and assumes the part after a last possible "." (if found) as the name of the constructor function. So if your TMLScript is named "my.Product.tmlscript" the name of the constructor is "Product".

The design locator is able to handle subdirectories below "scripts/tmlscript" as well. If Product.tmlscript is located in a subdirectory "myObjects" the object must be instantiated as

var Product = new $.myObjects.Product()

$$ design locator

To address TMLScript modules from the current directory the special design locator $$ can be used (this behaves synonym to :: for WebTML-module references):

var Product = new $$.Product()

This will search Products.tmlscript is the same directory as the module containing the script.

Reference @base design or designs from other apps

If the script module is part of a foreign design, the app containing the design can be specified as follows:

var Product = new $["db:otherApp"].any.subfolder.Product()

Note that "DB:" has to be uppercase until OpenWGA 7.5.4. Starting with OpenWGA 7.5.5 this can be lowercased as well.

If you are inside an overlay design and need to reference the @base design, use the following syntax:

var Product = new $["@base"].any.subfolder.Product()

Inheritance

Script objects V2 support inheritance using Object.create().

Sample:

Product.tmlscript:

function Product(articlenumber){

  this.name = "my product " + (articlenumber || "unknown")

}

Product.prototype.getName = function(){

  return this.name || "no name"

}

ComputerProduct.tmlscript:

function ComputerProduct(articlenumber){

  $.Product.call(this, articlenumber);
  this.memory = 12;

}


ComputerProduct.prototype = Object.create($.Product.prototype); // inherit getName() from $.Product:


ComputerProduct.prototype.getMemory = function(){

  return this.memory + " GB"

}

TML:

ComputerProduct: <tml:script>

  var Product = new $.ComputerProduct("MacBook")
  return Product.getName() + ", " + Product.getMemory()

</tml:script>