User application Component Class Structure and Main Method

• Class : NEST

  Declares all variables and functions on NEST

  Members :

  - env

  The items listed below are variable runtime environment information.

  app	NEST Application Information
  browser	Browser Information
  device	Device Information
  language	Language Information
  os	OS Information
  v	NEST Version

  - ComponentType

  Each component posses one enumeration listed below in order to compare between components.

  Name	Type	Description
  Visual	int	VisualComponent
  NonVisual	int	NonVisualComponent
  Container	int	ContainerComponent
  ListView	int	ListViewComponent
  ListItem	int	ListItemComponent
  Data	int	DataStoreComponent
  Form	int	Form
  Logic	int	Logic

  - define(namespace, clazz)

  Methods used when declaring components must use both parameters below.

  Parameters:

  Name	Type	Description
  namespace	string	Component organization symbols
  clazz	object	Json object

  Example:

  NEST.define("com.nxstinc.nest.component", {
  Button : function() {
  	var clazz = function(id) {
  		this.id = id;
  		this.text = undefined;
  	};
  
  	clazz.prototype = NEST.inherits("com.nxstinc.nest.component.VisualComponent");
  
  	clazz.prototype.paint = function(context) {
  		...
  	};
  		
  	clazz.prototype.hide = function() {
  	};
  		
  	clazz.prototype.show = function() {
  	};
  		
  	// #ifdef designing
  	clazz.prototype.editor = function() {
  		var d = {
  			palette : {
  				category : "Basic",
  				priority : -1,
  				description : "Image",
  			},
  			property : {
  				text : {
  					type : "string",
  					category : "Setup",
  					priority : 1,
  				},
  			},
  			method : {
  				show : {
  					priority : 1,
  				},
  				hide : {
  					priority : 2,
  				},
  			},				
  			event : {
  				onTap : {
  					priority : 1,
  				},
  			},
  		};
  		return d;
  	};
  	// #endif designing
  	return clazz;
  }
  });
  

  - inherits(_super)

  Methods used when declaring components must use the parameter below.

  Parameters:

  Name	Type	Description
  _super	component	VisualComponent ContainerComponent ListViewComponent ListItemComponent NonVisualComponent DataStoreComponent Declaration in accordance with the type required from the list above

  Example:

  NEST.define("com.nxstinc.nest.component", {
  Button : function() {
  	var clazz = function(id) {
  		this.id = id;
  		this.text = undefined;
  	};
  
  	clazz.prototype = NEST.inherits("com.nxstinc.nest.component.VisualComponent");

  - loadJs(scriptId, src, onLoad)

  Used when referring and loading dynamic Javascript Files

  Parameters:

  Name	Type	Description
  scriptId	string	Script identifier; used when deleting script no longer necessary
  src	string	Script path
  onLoad	function	Callback function for when script is already loaded.

  Example:

  var gUrl = "https://maps.googleapis.com/maps/api/js?v=3.exp&signed_in=true&libraries=places";
  
  NEST.loadJs("maps", gUrl, function() {
  	if (google.maps && google.maps.places) {
  		me.gCallback();
  	}
  });
  

  - loadStylesheet(styleId, src, onLoad)

  Used when referring and loading dynamic CSS Files

  Parameters:

  Name	Type	Description
  styleId	string	Script identifier; used when deleting script no longer necessary
  src	string	Script path
  onLoad	function	Callback function for when script is already loaded.

  Example:

  NEST.loadStylesheet("selectbar.css", 
  			"assets/selectbar/selectbar.css", 
  			function() {
  			}
  );

  - loadStylesheetInline(styleId, cssString, onLoad)

  Used when referring and loading dynamic Inline CSS

  Parameters:

  Name	Type	Description
  styleId	string	Script identifier; used when deleting script no longer necessary
  cssString	string	Strings for adding inline style
  onLoad	function	Callback function for when script is already loaded.

  Example:

  NEST.loadStylesheet("selectbar.css", 
  			".myclass {background-color: #ddd}", 
  			function() {
  			}
  );
  

  - removeJs(scriptId)

  Used to delete the loaded script

  Parameters:

  Name	Type	Description
  scriptId	string	Script identifier; used when deleting script no longer necessary

  Example:

  NEST.removeJs("selectbar.js");
  

  - removeStylesheet(styleId))

  Used to delete the loaded script

  Parameters:

  Name	Type	Description
  styleId	string	script identifier for deletion

  Example:

  NEST.removeStylesheet("selectbar.css");
  

• Class : Component

  NEST Component’s root class

  Members :

  - env

  Unique ID identifying components within Forms

  - bind(name, callback)

  Connects user chosen events in the application

  Name	Type	Description
  name	string	Event name
  callback	function	Event handler

  Example:

  this.dataStore.bind("onTake", function(p) {
  });
  

  - trigger(name, param)

  Triggers user chosen events in the application

  Name	Type	Description
  name	string	Event name
  callback	function	Event parameter

  Example:

  this.trigger("onTap");
  

  - triggerCount(name)

  Returns the number of user chosen events in the application

  Name	Type	Description
  name	string	Event name

  Example:

  var count = this.triggerCount("onTap");
  

  - on(element, name, callback, stopPropagation)

  Used when connecting HTML element event

  Name	Type	Description
  element	JQuery Element	HTML element that connects events
  name	string	Event name
  callback	function	Event Function
  stopPropagation	boolean	Prevents Event Bubbling

  Example:

  this.on(element, "click", function(ev) {
  	me.trigger("onTap");
  }, true);
  

• Class : VisualComponent

  Component responsible for UI visible on screen such as Button, Label, and Textbox

  Members :

  - paint(context)

  Invoked when component is drawn on screen

  All components must override paint function and implement required code for the UI

  Name	Type	Description
  context	object	context data needed to draw on screen

  Example:

  clazz.prototype.paint = function(context) {
  	var ss = "";
  	ss += "<div id='" + this.id + "'";
  	ss += ">"</div>";
  
  	var parent = context.selector;
  	var element = $(ss);
  	$(parent).append(element);
  };
  

• Class : ContainerComponent

  Components used on the Layout inheriting the Visual Components

  Although visible on the screen it is unable to function by itself. It must be inherited by other component such as Form, Panel, and Scroll Panel.

• Class : ListComponent

  Component inheriting Visual Components.

  Unlike Container Component it contains only Listitem component which is the root component.

• Class : ListItemComponent

  Components that inheriting Visual Component

  Can only be used as child of ListViewComponent

• Class : Non-VisualComponent

  Component not visible on the screen, only functions to organize logic such as Loading, Link, Timer, DataTime, and Script.

• Class : DataStoreComponent

  Component Inheriting NonVisibleComponents, focuses on processing data and retuning data.

• Class : Form

  Component responsible for organizing components on screen.

  All components individually child of Form component

• Class : Logic

  Component that organizes the applications logic that processes common logic with NonVisibleComponent.

• Class : Application

  Includes all Form and Logic components, responsible for applications Life Cycle and Form creation/deletion.