JavaScript/Notes/CustomEvents: Difference between revisions
Jump to navigation
Jump to search
(Created page with "== Under Construction == An event is a function call that signifies something happened. <source language="javascript"> var TableSort = (function() { function TableSort(id) ...") |
No edit summary |
||
(13 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
== | == What are they? == | ||
An event is a function call that signifies something happened. | An event is a function call that signifies something happened. | ||
== Data Received == | |||
function | Example: [http://garretts.github.io/ape-javascript-library/example/widget/HSVPicker/ HSVPicker]. | ||
<source lang="javascript"> | |||
var transport = new AjaxTransport(url); | |||
transport.onsuccess = transportSuccessHandler; | |||
function transportSuccessHandler(ev) { | |||
var data = ev.data; | |||
updateTable(data); | |||
} | } | ||
</source> | |||
Custom calls notify subscribers. The function is either defined by the "class" (default) or shadowed on the instance, by the client of the API. | |||
== Objects Talking == | |||
* Class - defines methods and default handlers | |||
* Instance - shadows class | |||
* Instance usage (from other objects) | |||
== Why? == | |||
Centralized dispatch. Method called from many places and when it is done, shared notifications fire. | |||
<source lang="javascript"> | |||
var tableSort = new Factory(function() { | |||
function _getSortFunction(sortType) { | |||
if(sortType == "number") { | |||
return function() { }; | |||
} | |||
} | |||
function _isSortedBy(tableSort, sortType) { | |||
} | |||
var configData = {}; | |||
function TableSort(id, config) { | |||
this.id = id; | |||
configData[id] = Object.create(config); | |||
} | |||
TableSort.prototype.sortBy = function(sortType) { | |||
var config = configData[this.id]; | |||
if(config.currentSort != sortType) { | |||
config.sortFunction(this); | |||
this.onsort(sortType); | |||
} | |||
}; | |||
return TableSort; | |||
}); | |||
function Factory(getConstructor){ | |||
var i = 0, ctor; | |||
this.getById = getById; | |||
function getById(id, config) { | |||
var instances = this.instances; | |||
if(!instances) { // First time. | |||
instances = this.instances = {}; | |||
// Get the constructor. | |||
ctor = getConstructor(this); | |||
} | |||
return instances[id] || (instances[id] = new ctor(id, config)); | |||
} | } | ||
} | } | ||
</source> | </source> |
Latest revision as of 23:32, 18 January 2014
What are they?[edit]
An event is a function call that signifies something happened.
Data Received[edit]
Example: HSVPicker.
<source lang="javascript"> var transport = new AjaxTransport(url); transport.onsuccess = transportSuccessHandler;
function transportSuccessHandler(ev) {
var data = ev.data; updateTable(data);
} </source>
Custom calls notify subscribers. The function is either defined by the "class" (default) or shadowed on the instance, by the client of the API.
Objects Talking[edit]
- Class - defines methods and default handlers
- Instance - shadows class
- Instance usage (from other objects)
Why?[edit]
Centralized dispatch. Method called from many places and when it is done, shared notifications fire.
<source lang="javascript"> var tableSort = new Factory(function() {
function _getSortFunction(sortType) { if(sortType == "number") { return function() { }; } } function _isSortedBy(tableSort, sortType) { } var configData = {}; function TableSort(id, config) { this.id = id; configData[id] = Object.create(config); } TableSort.prototype.sortBy = function(sortType) { var config = configData[this.id]; if(config.currentSort != sortType) { config.sortFunction(this); this.onsort(sortType); } }; return TableSort;
});
function Factory(getConstructor){
var i = 0, ctor; this.getById = getById; function getById(id, config) { var instances = this.instances; if(!instances) { // First time. instances = this.instances = {}; // Get the constructor. ctor = getConstructor(this); } return instances[id] || (instances[id] = new ctor(id, config)); }
} </source>