JavaScript/Notes/CustomEvents: Difference between revisions

From Noisebridge
Jump to navigation Jump to search
Line 5: Line 5:


<source lang="javascript">
<source lang="javascript">
var TableSort = new Factory(function() {
Factory(function() {
 
 
   function _getSortFunction(sortType) {
   function _getSortFunction(sortType) {
     if(sortType == "number") {
     if(sortType == "number") {
     return function() { }
     return function() { };
     }
     }
   }
   }
 
   function _isSortedBy(tableSort, sortType) {
   function _isSortedBy(tableSort, sortType) {
   
   }
   }
 
   var configData = {};
   var configData = {};
 
   function TableSort(id, config) {
   function TableSort(id, config) {
     this.id = id;
     this.id = id;
     configData[id] = Object.create(config);
     configData[id] = Object.create(config);
   }
   }
 
   TableSort.prototype.sortBy = function(sortType) {
   TableSort.prototype.sortBy = function(sortType) {
     var config = configData[this.id];
     var config = configData[this.id];
 
     if(!config.currentSort != "sortType") {
     if(config.currentSort != sortType) {
       config.sortFunction(this);
       config.sortFunction(this);
       this.onsort(sortType);
       this.onsort(sortType);
     }
     }
   };
   };
 
   return TableSort;
   return TableSort;
});
});
</source>
The <code>Factory</code> is explained in [https://noisebridge.net/index.php?title=JavaScript/Notes/Factory Factory] lesson.
Use a shared a noop function for the <code>onsort</code> event. Function.prototype is itself a function that
does nothing and returns undefined.
<source lang="javascript">
TableSort.prototype = {
  sortBy : function(sortType) {
    var config = configData[this.id];
    if(!config.currentSort != sortType) {
      config.sortFunction(this);
      this.onsort(sortType);
    }
  },
  onsort : Function.prototype
};
</source>
=== Instantiate and Listen for onsort ===
Instantiate the object and add an event handler to the instance.
<source lang="javascript">
var propertiesTable = TableSort.getById("properties", { "price" : function(row} { } });
propertiesTable.onsort = function(sortType) {
  updateHeader(sortType);
};
</source>
</source>

Revision as of 08:41, 11 January 2014

Under Construction

An event is a function call that signifies something happened.

Custom events are functions that you call to notify subscribers. The function is either defined by the "class" (default) or shadowed on the instance, by the client of the API.

<source lang="javascript">

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;

}); </source>