better event handling in Ox.Element
This commit is contained in:
parent
506a2f2923
commit
5f417fa152
4 changed files with 60 additions and 71 deletions
|
@ -44,6 +44,7 @@ Ox.load('UI', {
|
|||
})
|
||||
.bindEvent({
|
||||
geocode: function(event, data) {
|
||||
Ox.print(event)
|
||||
Ox.print(JSON.stringify(data))
|
||||
}
|
||||
})
|
||||
|
|
|
@ -55,6 +55,13 @@ Ox.Element = function() {
|
|||
} : {}));
|
||||
*/
|
||||
|
||||
function bind(action, event, fn) {
|
||||
self.$eventHandler[action]('ox_' + event, function(event, data) {
|
||||
// fixme: remove second parameter
|
||||
fn(Ox.extend({_event: event}, data), data);
|
||||
});
|
||||
}
|
||||
|
||||
function mousedown(e) {
|
||||
/*
|
||||
better mouse events
|
||||
|
@ -170,28 +177,19 @@ Ox.Element = function() {
|
|||
/***
|
||||
binds a function to an event triggered by this object
|
||||
Usage
|
||||
bindEvent(event, fn) or bindEvent({event0: fn0, event1: fn1, ...})
|
||||
bindEvent(event, fn)
|
||||
bindEvent({eventA: fnA, eventB: fnB, ...})
|
||||
***/
|
||||
if (arguments.length == 1) {
|
||||
Ox.forEach(arguments[0], function(fn, event) {
|
||||
// Ox.print(that.id, 'bind', event);
|
||||
self.$eventHandler.bind('ox_' + event, fn);
|
||||
});
|
||||
} else {
|
||||
// Ox.print(that.id, 'bind', arguments[0]);
|
||||
self.$eventHandler.bind('ox_' + arguments[0], arguments[1]);
|
||||
}
|
||||
Ox.forEach(Ox.makeObject(arguments), function(fn, event) {
|
||||
bind('bind', event, fn);
|
||||
});
|
||||
return that;
|
||||
}
|
||||
|
||||
that.bindEventOnce = function() {
|
||||
if (arguments.length == 1) {
|
||||
Ox.forEach(arguments[0], function(fn, event) {
|
||||
self.$eventHandler.one('ox_' + event, fn);
|
||||
});
|
||||
} else {
|
||||
self.$eventHandler.one('ox_' + arguments[0], arguments[1]);
|
||||
}
|
||||
Ox.forEach(Ox.makeObject(arguments), function(fn, event) {
|
||||
bind('one', event, fn);
|
||||
});
|
||||
return that;
|
||||
};
|
||||
|
||||
|
@ -259,39 +257,37 @@ Ox.Element = function() {
|
|||
Usage
|
||||
triggerEvent(event)
|
||||
triggerEvent(event, data)
|
||||
triggerEvent({event0: data0, event1: data1, ...})
|
||||
triggerEvent({eventA: dataA, eventB: dataB, ...})
|
||||
***/
|
||||
if (Ox.isObject(arguments[0])) {
|
||||
Ox.forEach(arguments[0], function(data, event) {
|
||||
if (['mousedown', 'mouserepeat', 'anyclick', 'singleclick', 'doubleclick', 'dragstart', 'drag', 'dragpause', 'dragend', 'playing'].indexOf(event) == -1) {
|
||||
Ox.print(that.id, self.options.id, 'trigger', event, data);
|
||||
}
|
||||
self.$eventHandler.trigger('ox_' + event, data);
|
||||
});
|
||||
} else {
|
||||
if (['mousedown', 'mouserepeat', 'anyclick', 'singleclick', 'doubleclick', 'dragstart', 'drag', 'dragpause', 'dragend', 'playing'].indexOf(arguments[0]) == -1) {
|
||||
Ox.print(that.id, self.options ? self.options.id : '', 'trigger', arguments[0], arguments[1] || {});
|
||||
Ox.forEach(Ox.makeObject(arguments), function(data, event) {
|
||||
if ([
|
||||
'mousedown', 'mouserepeat', 'anyclick', 'singleclick', 'doubleclick',
|
||||
'dragstart', 'drag', 'dragpause', 'dragend', 'playing'
|
||||
].indexOf(event) == -1) {
|
||||
Ox.print(that.id, self.options.id, 'trigger', event, data);
|
||||
}
|
||||
self.$eventHandler.trigger('ox_' + arguments[0], arguments[1] || {});
|
||||
}
|
||||
self.$eventHandler.trigger('ox_' + event, data);
|
||||
});
|
||||
return that;
|
||||
};
|
||||
|
||||
that.unbindEvent = function() {
|
||||
/***
|
||||
unbinds a function from an event triggered by this element
|
||||
unbinds an event triggered by this element
|
||||
Usage
|
||||
unbindEvent(event, fn)
|
||||
unbindEvent({event0: fn0, event1: fn1, ...})
|
||||
unbindEvent() // unbinds all events
|
||||
unbindEvent(event)
|
||||
unbindEvent(eventA, eventB, ...)
|
||||
unbindEvent([eventA, eventB, ...])
|
||||
to unbind a specific handler, use namespaced events
|
||||
bind('doubleclick.x', fn) ... unbind('doubleclick.x')
|
||||
***/
|
||||
if (arguments.length == 1) {
|
||||
Ox.forEach(arguments[0], function(fn, event) {
|
||||
// Ox.print(that.id, 'unbind', arguments[0]);
|
||||
self.$eventHandler.unbind('ox_' + event, fn);
|
||||
});
|
||||
if (arguments.length == 0) {
|
||||
self.$eventHandler.unbind();
|
||||
} else {
|
||||
// Ox.print(that.id, 'unbind', arguments[0]);
|
||||
self.$eventHandler.unbind('ox_' + arguments[0], arguments[1]);
|
||||
Ox.makeArray(arguments).forEach(function(event) {
|
||||
self.$eventHandler.unbind('ox_' + event);
|
||||
});
|
||||
}
|
||||
return that;
|
||||
};
|
||||
|
|
|
@ -1,4 +1,5 @@
|
|||
// vim: et:ts=4:sw=4:sts=4:ft=js
|
||||
|
||||
Ox.Range = function(options, self) {
|
||||
|
||||
/**
|
||||
|
|
53
source/Ox.js
53
source/Ox.js
|
@ -136,7 +136,8 @@ Ox.getset = function(obj, args, callback, context) {
|
|||
ret = obj[args[0]];
|
||||
} else {
|
||||
// getset([key, val]) or getset([{key: val, ...}])
|
||||
args = Ox.makeObject(Ox.isObject(args[0]) ? args[0] : args);
|
||||
args = Ox.makeObject(args);
|
||||
// args = Ox.makeObject(Ox.isObject(args[0]) ? args[0] : args);
|
||||
obj = Ox.extend(obj, args);
|
||||
Ox.forEach(args, function(val, key) {
|
||||
if (!obj_ || !Ox.isEqual(obj_[key], val)) {
|
||||
|
@ -629,44 +630,34 @@ Ox.loop = function() {
|
|||
}
|
||||
};
|
||||
|
||||
Ox.makeArray = function(arg) {
|
||||
Ox.makeArray = function(obj) {
|
||||
/*
|
||||
like $.makeArray()
|
||||
>>> Ox.makeArray('foo', 'bar')
|
||||
['foo', 'bar']
|
||||
>>> (function() { return Ox.makeArray(arguments); }('foo', 'bar'))
|
||||
['foo', 'bar']
|
||||
*/
|
||||
return Array.prototype.slice.call(
|
||||
Ox.isArguments(arg) ? arg : arguments
|
||||
);
|
||||
return Array.prototype.slice.call(obj);
|
||||
};
|
||||
|
||||
Ox.makeObject = function() {
|
||||
Ox.makeObject = function(obj) {
|
||||
/*
|
||||
>>> Ox.makeObject("foo", "bar").foo
|
||||
"bar"
|
||||
>>> Ox.makeObject(["foo", "bar"]).foo
|
||||
"bar"
|
||||
>>> Ox.makeObject({foo: "bar"}).foo
|
||||
"bar"
|
||||
>>> (function() { return Ox.makeObject(arguments); }("foo", "bar")).foo
|
||||
"bar"
|
||||
>>> (function() { return Ox.makeObject(arguments); }({foo: 'bar'})).foo
|
||||
'bar'
|
||||
>>> (function() { return Ox.makeObject(arguments); }('foo', 'bar')).foo
|
||||
'bar'
|
||||
>>> (function() { return Ox.makeObject(arguments); }('foo')).foo
|
||||
undefined
|
||||
>>> (function() { return Ox.makeObject(arguments); }()).foo
|
||||
undefined
|
||||
*/
|
||||
var obj = {};
|
||||
if (arguments.length == 1) {
|
||||
if (Ox.isObject(arguments[0])) {
|
||||
// ({foo: 'bar'})
|
||||
obj = arguments[0];
|
||||
} else {
|
||||
// (['foo', 'bar'])
|
||||
obj[arguments[0][0]] = arguments[0][1];
|
||||
}
|
||||
} else {
|
||||
var ret = {};
|
||||
if (obj.length == 1) {
|
||||
// ({foo: 'bar'})
|
||||
ret = obj[0];
|
||||
} else if (obj.length == 2){
|
||||
// ('foo', 'bar')
|
||||
obj[arguments[0]] = arguments[1];
|
||||
ret[obj[0]] = obj[1]
|
||||
}
|
||||
return obj;
|
||||
return ret;
|
||||
};
|
||||
|
||||
Ox.map = function(obj, fn) {
|
||||
|
@ -1320,7 +1311,7 @@ Ox.element = function(str) {
|
|||
if (arguments.length == 1 && Ox.isString(arguments[0])) {
|
||||
ret = this[0].getAttribute(arguments[0]);
|
||||
} else {
|
||||
Ox.forEach(Ox.makeObject.apply(null, arguments), function(v, k) {
|
||||
Ox.forEach(Ox.makeObject(arguments), function(v, k) {
|
||||
that[0].setAttribute(k, v);
|
||||
});
|
||||
ret = this;
|
||||
|
@ -1332,7 +1323,7 @@ Ox.element = function(str) {
|
|||
if (arguments.length == 1 && Ox.isString(arguments[0])) {
|
||||
ret = this[0].style[arguments[0]];
|
||||
} else {
|
||||
Ox.forEach(Ox.makeObject.apply(null, arguments), function(v, k) {
|
||||
Ox.forEach(Ox.makeObject(arguments), function(v, k) {
|
||||
that[0].style[k] = v;
|
||||
});
|
||||
ret = this;
|
||||
|
|
Loading…
Reference in a new issue