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({
|
.bindEvent({
|
||||||
geocode: function(event, data) {
|
geocode: function(event, data) {
|
||||||
|
Ox.print(event)
|
||||||
Ox.print(JSON.stringify(data))
|
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) {
|
function mousedown(e) {
|
||||||
/*
|
/*
|
||||||
better mouse events
|
better mouse events
|
||||||
|
@ -170,28 +177,19 @@ Ox.Element = function() {
|
||||||
/***
|
/***
|
||||||
binds a function to an event triggered by this object
|
binds a function to an event triggered by this object
|
||||||
Usage
|
Usage
|
||||||
bindEvent(event, fn) or bindEvent({event0: fn0, event1: fn1, ...})
|
bindEvent(event, fn)
|
||||||
|
bindEvent({eventA: fnA, eventB: fnB, ...})
|
||||||
***/
|
***/
|
||||||
if (arguments.length == 1) {
|
Ox.forEach(Ox.makeObject(arguments), function(fn, event) {
|
||||||
Ox.forEach(arguments[0], function(fn, event) {
|
bind('bind', event, fn);
|
||||||
// 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]);
|
|
||||||
}
|
|
||||||
return that;
|
return that;
|
||||||
}
|
}
|
||||||
|
|
||||||
that.bindEventOnce = function() {
|
that.bindEventOnce = function() {
|
||||||
if (arguments.length == 1) {
|
Ox.forEach(Ox.makeObject(arguments), function(fn, event) {
|
||||||
Ox.forEach(arguments[0], function(fn, event) {
|
bind('one', event, fn);
|
||||||
self.$eventHandler.one('ox_' + event, fn);
|
|
||||||
});
|
});
|
||||||
} else {
|
|
||||||
self.$eventHandler.one('ox_' + arguments[0], arguments[1]);
|
|
||||||
}
|
|
||||||
return that;
|
return that;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -259,39 +257,37 @@ Ox.Element = function() {
|
||||||
Usage
|
Usage
|
||||||
triggerEvent(event)
|
triggerEvent(event)
|
||||||
triggerEvent(event, data)
|
triggerEvent(event, data)
|
||||||
triggerEvent({event0: data0, event1: data1, ...})
|
triggerEvent({eventA: dataA, eventB: dataB, ...})
|
||||||
***/
|
***/
|
||||||
if (Ox.isObject(arguments[0])) {
|
Ox.forEach(Ox.makeObject(arguments), function(data, event) {
|
||||||
Ox.forEach(arguments[0], function(data, event) {
|
if ([
|
||||||
if (['mousedown', 'mouserepeat', 'anyclick', 'singleclick', 'doubleclick', 'dragstart', 'drag', 'dragpause', 'dragend', 'playing'].indexOf(event) == -1) {
|
'mousedown', 'mouserepeat', 'anyclick', 'singleclick', 'doubleclick',
|
||||||
|
'dragstart', 'drag', 'dragpause', 'dragend', 'playing'
|
||||||
|
].indexOf(event) == -1) {
|
||||||
Ox.print(that.id, self.options.id, 'trigger', event, data);
|
Ox.print(that.id, self.options.id, 'trigger', event, data);
|
||||||
}
|
}
|
||||||
self.$eventHandler.trigger('ox_' + 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] || {});
|
|
||||||
}
|
|
||||||
self.$eventHandler.trigger('ox_' + arguments[0], arguments[1] || {});
|
|
||||||
}
|
|
||||||
return that;
|
return that;
|
||||||
};
|
};
|
||||||
|
|
||||||
that.unbindEvent = function() {
|
that.unbindEvent = function() {
|
||||||
/***
|
/***
|
||||||
unbinds a function from an event triggered by this element
|
unbinds an event triggered by this element
|
||||||
Usage
|
Usage
|
||||||
unbindEvent(event, fn)
|
unbindEvent() // unbinds all events
|
||||||
unbindEvent({event0: fn0, event1: fn1, ...})
|
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) {
|
if (arguments.length == 0) {
|
||||||
Ox.forEach(arguments[0], function(fn, event) {
|
self.$eventHandler.unbind();
|
||||||
// Ox.print(that.id, 'unbind', arguments[0]);
|
|
||||||
self.$eventHandler.unbind('ox_' + event, fn);
|
|
||||||
});
|
|
||||||
} else {
|
} else {
|
||||||
// Ox.print(that.id, 'unbind', arguments[0]);
|
Ox.makeArray(arguments).forEach(function(event) {
|
||||||
self.$eventHandler.unbind('ox_' + arguments[0], arguments[1]);
|
self.$eventHandler.unbind('ox_' + event);
|
||||||
|
});
|
||||||
}
|
}
|
||||||
return that;
|
return that;
|
||||||
};
|
};
|
||||||
|
|
|
@ -1,4 +1,5 @@
|
||||||
// vim: et:ts=4:sw=4:sts=4:ft=js
|
// vim: et:ts=4:sw=4:sts=4:ft=js
|
||||||
|
|
||||||
Ox.Range = function(options, self) {
|
Ox.Range = function(options, self) {
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|
51
source/Ox.js
51
source/Ox.js
|
@ -136,7 +136,8 @@ Ox.getset = function(obj, args, callback, context) {
|
||||||
ret = obj[args[0]];
|
ret = obj[args[0]];
|
||||||
} else {
|
} else {
|
||||||
// getset([key, val]) or getset([{key: val, ...}])
|
// 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);
|
obj = Ox.extend(obj, args);
|
||||||
Ox.forEach(args, function(val, key) {
|
Ox.forEach(args, function(val, key) {
|
||||||
if (!obj_ || !Ox.isEqual(obj_[key], val)) {
|
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'))
|
>>> (function() { return Ox.makeArray(arguments); }('foo', 'bar'))
|
||||||
['foo', 'bar']
|
['foo', 'bar']
|
||||||
*/
|
*/
|
||||||
return Array.prototype.slice.call(
|
return Array.prototype.slice.call(obj);
|
||||||
Ox.isArguments(arg) ? arg : arguments
|
|
||||||
);
|
|
||||||
};
|
};
|
||||||
|
|
||||||
Ox.makeObject = function() {
|
Ox.makeObject = function(obj) {
|
||||||
/*
|
/*
|
||||||
>>> Ox.makeObject("foo", "bar").foo
|
>>> (function() { return Ox.makeObject(arguments); }({foo: 'bar'})).foo
|
||||||
"bar"
|
'bar'
|
||||||
>>> Ox.makeObject(["foo", "bar"]).foo
|
>>> (function() { return Ox.makeObject(arguments); }('foo', 'bar')).foo
|
||||||
"bar"
|
'bar'
|
||||||
>>> Ox.makeObject({foo: "bar"}).foo
|
>>> (function() { return Ox.makeObject(arguments); }('foo')).foo
|
||||||
"bar"
|
undefined
|
||||||
>>> (function() { return Ox.makeObject(arguments); }("foo", "bar")).foo
|
>>> (function() { return Ox.makeObject(arguments); }()).foo
|
||||||
"bar"
|
undefined
|
||||||
*/
|
*/
|
||||||
var obj = {};
|
var ret = {};
|
||||||
if (arguments.length == 1) {
|
if (obj.length == 1) {
|
||||||
if (Ox.isObject(arguments[0])) {
|
|
||||||
// ({foo: 'bar'})
|
// ({foo: 'bar'})
|
||||||
obj = arguments[0];
|
ret = obj[0];
|
||||||
} else {
|
} else if (obj.length == 2){
|
||||||
// (['foo', 'bar'])
|
|
||||||
obj[arguments[0][0]] = arguments[0][1];
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
// ('foo', 'bar')
|
// ('foo', 'bar')
|
||||||
obj[arguments[0]] = arguments[1];
|
ret[obj[0]] = obj[1]
|
||||||
}
|
}
|
||||||
return obj;
|
return ret;
|
||||||
};
|
};
|
||||||
|
|
||||||
Ox.map = function(obj, fn) {
|
Ox.map = function(obj, fn) {
|
||||||
|
@ -1320,7 +1311,7 @@ Ox.element = function(str) {
|
||||||
if (arguments.length == 1 && Ox.isString(arguments[0])) {
|
if (arguments.length == 1 && Ox.isString(arguments[0])) {
|
||||||
ret = this[0].getAttribute(arguments[0]);
|
ret = this[0].getAttribute(arguments[0]);
|
||||||
} else {
|
} else {
|
||||||
Ox.forEach(Ox.makeObject.apply(null, arguments), function(v, k) {
|
Ox.forEach(Ox.makeObject(arguments), function(v, k) {
|
||||||
that[0].setAttribute(k, v);
|
that[0].setAttribute(k, v);
|
||||||
});
|
});
|
||||||
ret = this;
|
ret = this;
|
||||||
|
@ -1332,7 +1323,7 @@ Ox.element = function(str) {
|
||||||
if (arguments.length == 1 && Ox.isString(arguments[0])) {
|
if (arguments.length == 1 && Ox.isString(arguments[0])) {
|
||||||
ret = this[0].style[arguments[0]];
|
ret = this[0].style[arguments[0]];
|
||||||
} else {
|
} else {
|
||||||
Ox.forEach(Ox.makeObject.apply(null, arguments), function(v, k) {
|
Ox.forEach(Ox.makeObject(arguments), function(v, k) {
|
||||||
that[0].style[k] = v;
|
that[0].style[k] = v;
|
||||||
});
|
});
|
||||||
ret = this;
|
ret = this;
|
||||||
|
|
Loading…
Reference in a new issue