javascript - How to create a callback priority queue with the help of jQuery? -

when doing $(element).on('customevent',function(){});, every element binds customevent trigger. works pub/sub, , appears there no order or priority. want is, implement own callback queue, but, ajustable priority (like wordpress has, can set hooks priorities). higher number have bigger priority, , number 0 common , executed last.

given example $(element).on_priority(10, 'customevent', function(){}); , $(element).on_priority(0, 'customevent', function(){});, 10 priority execute same customevent first, , might or not cancel execution of 0 priority event.

how can implement that? i'm having trouble trying visualize flow of callbacks

so far, thought this:

• keep "global" (inside closure) object callback names set.
• inside each member of callback, object containing priorities.

var callbacks = {   'customevent': {},   'customevent2': {     0: [{element: $element, fn: function(), data:{}}, {element: $element, fn: function(), data:{}}],    10: [{element: $element, fn: function(), data:{}}],    20: [{element: $element, fn: function(), data:{}}]   } }; 

is right direction? performance wise shouldn't of hit, problem iterating object on , over. problem wouldn't able unregister set event or set order (or reorder) callback array inside each priority

i'd suggest array of callback objects encapsulate in own object. object has methods add, remove , execute. add, adds given callback in priority order. remove finds callback , removes it. execute calls each callback in priority order, stopping further execution of callbacks if callback returns false.

traversing callbacks in priority order simple (you go begin end of array) because callbacks kept in sorted order in array.

function sortedcallbacks() {     this.list = []; }  sortedcallbacks.prototype = {     // add callback list     add: function(fn, priority, data) {         var list = this.list;         var callbackobj = {fn: fn, priority: priority, data: data};          (var = 0; < list.length; i++) {             // if our new priority greater, insert here             if (priority > list[i].priority) {                 list.splice(i, 0, callbackobj);                 return;             }         }         // if list either empty or no priorities in list less         // new priority, add onto end of list         list.push(callbackobj);     },     // remove callback list     remove: function(fn, priority) {         var list = this.list;         (var = 0; < list.length; i++) {             if (list[i].fn === fn && list[i].priority === priority) {                 list.splice(i, 1);                 return;             }         }     },     // change priority or data or both     change: function(fn, oldpriority, newpriority, data) {         this.remove(fn, oldpriority);         this.add(fn, newpriority, data);     }     // execute callbacks in order     execute: function(/* args callback passed here */) {         // execute in priority order         var list = this.list, retval, args;         (var = 0; < list.length; i++) {             args = [].slice.call(arguments, 0);             // add data callback arguments passed execute             args.unshift(list[i].data);             retval = list[i].fn.apply(this, args);             // if callback returns false, stop further callback execution             if (retval === false) {                 return;             }         }             } }; 

sample usage:

// create callbacks object , add callbacks var callbacks = new sortedcallbacks(); callbacks.add(fn1, 4, "whatever"); callbacks.add(fn2, 9, "hello"); callbacks.add(fn8, -1, "nothing");  // execute callbacks , pass them each value callbacks.execute(elem.value)