clean up Ox.$
This commit is contained in:
rolux
parent
c7e89cf73a
commit
ad56695694
1 changed files with 104 additions and 62 deletions
|
|
@ -19,7 +19,7 @@ Ox.canvas = function() {
|
|||
image = isImage ? arguments[0] : {
|
||||
width: arguments[0], height: arguments[1]
|
||||
};
|
||||
c.context = (c.canvas = Ox.element('<canvas>').attr({
|
||||
c.context = (c.canvas = Ox.$('<canvas>').attr({
|
||||
width: image.width, height: image.height
|
||||
})[0]).getContext('2d');
|
||||
isImage && c.context.drawImage(image, 0, 0);
|
||||
|
|
@ -31,8 +31,8 @@ Ox.canvas = function() {
|
|||
|
||||
/*@
|
||||
Ox.documentReady <function> Calls a callback function once the DOM is ready
|
||||
(callback) -> <boolean> If true, the document was ready
|
||||
callback <function> Callback function
|
||||
(callback) -> <b> If true, the document was ready
|
||||
callback <f> Callback function
|
||||
@*/
|
||||
Ox.documentReady = (function() {
|
||||
var callbacks = [];
|
||||
|
|
@ -55,7 +55,7 @@ Ox.documentReady = (function() {
|
|||
}());
|
||||
|
||||
/*@
|
||||
Ox.element <f> Generic HTML element, mimics jQuery
|
||||
Ox.$ <f> Generic HTML element, mimics jQuery
|
||||
(str) -> <o> Element object
|
||||
str <s> Tagname ('<tagname>') or selector ('tagname', '.classname', '#id')
|
||||
> Ox.element("<div>").addClass("red").hasClass("red")
|
||||
|
|
@ -70,6 +70,8 @@ Ox.element <f> Generic HTML element, mimics jQuery
|
|||
"red"
|
||||
> Ox.element("<div>").html("red").html()
|
||||
"red"
|
||||
> Ox.element("<div>").html("red").empty().html()
|
||||
""
|
||||
@*/
|
||||
Ox.$ = Ox.element = function(val) {
|
||||
// fixme: remove click and mousedown,
|
||||
|
|
@ -89,25 +91,21 @@ Ox.$ = Ox.element = function(val) {
|
|||
className <s> Class name
|
||||
@*/
|
||||
addClass: function(str) {
|
||||
/* fixme:
|
||||
this[0].className = Ox.unique(
|
||||
this[0].className.split(' ').push(className)
|
||||
).join(' ');
|
||||
*/
|
||||
this[0].className = this[0].className
|
||||
? Ox.unique(
|
||||
(this[0].className + ' ' + str).split(' ')
|
||||
).join(' ')
|
||||
: str;
|
||||
this[0].className = Ox.unique(((
|
||||
this[0].className ? this[0].className + ' ' : ''
|
||||
) + Ox.clean(str)).split(' ')).join(' ');
|
||||
return this;
|
||||
},
|
||||
/*@
|
||||
append <f> Appends another element to this element
|
||||
(element) -> <o> This element
|
||||
element <o> Another element
|
||||
element <o|[o]> One or more elements
|
||||
@*/
|
||||
append: function(element) {
|
||||
this[0].appendChild(element[0]);
|
||||
append: function() {
|
||||
var that = this;
|
||||
Ox.toArray(arguments[0]).forEach(function(element) {
|
||||
that[0].appendChild(element[0]);
|
||||
});
|
||||
return this;
|
||||
},
|
||||
/*@
|
||||
|
|
@ -121,9 +119,9 @@ Ox.$ = Ox.element = function(val) {
|
|||
},
|
||||
/*@
|
||||
attr <f> Gets or sets an attribute
|
||||
(key) -> <s> Value
|
||||
(key, value) -> <o> This element
|
||||
({key, value}) -> <o> This element
|
||||
(key) -> <s> Value
|
||||
(key, value) -> <o> This element
|
||||
({key: value, key1: value1, ...}) -> <o> This element
|
||||
key <str> Attribute name
|
||||
value <str> Attribute value
|
||||
@*/
|
||||
|
|
@ -139,40 +137,27 @@ Ox.$ = Ox.element = function(val) {
|
|||
}
|
||||
return ret;
|
||||
},
|
||||
bind: function(events) {
|
||||
var that = this;
|
||||
Ox.forEach(Ox.makeObject(arguments), function(callback, event) {
|
||||
that[0]['on' + event] = callback;
|
||||
});
|
||||
return this;
|
||||
},
|
||||
// FIXME: should be "one"
|
||||
bindOnce: function(events) {
|
||||
var that = this;
|
||||
Ox.forEach(Ox.makeObject(arguments), function(callback, event) {
|
||||
that[0]['on' + event] = function() {
|
||||
that.unbind(event);
|
||||
callback();
|
||||
};
|
||||
});
|
||||
return this;
|
||||
},
|
||||
/*@
|
||||
click <f> Binds a function to the click event
|
||||
(callback) -> <o> This element
|
||||
bind <f> Binds a callback to an event
|
||||
(event, callback) -> <o> This element
|
||||
({event0: callback0, event1: callback1, ...}) -> <o> This element
|
||||
event <s> Event name
|
||||
callback <f> Callback function
|
||||
event <o> The DOM event
|
||||
e <o> Event properties
|
||||
@*/
|
||||
click: function(callback) {
|
||||
this[0].onclick = callback;
|
||||
bind: function() {
|
||||
var that = this;
|
||||
Ox.forEach(Ox.makeObject(arguments), function(callback, event) {
|
||||
that[0].addEventListener(event, callback);
|
||||
});
|
||||
return this;
|
||||
},
|
||||
/*@
|
||||
css <f> Gets or sets a CSS attribute
|
||||
(key) -> <s> Value
|
||||
(key, value) -> <o> This element
|
||||
({key, value}) -> <o> This element
|
||||
key <str> Attribute name
|
||||
(key) -> <s> Value
|
||||
(key, value) -> <o> This element
|
||||
({key0: value0, key1: value1, ...}) -> <o> This element
|
||||
key <str> Attribute name
|
||||
value <str> Attribute value
|
||||
@*/
|
||||
css: function() {
|
||||
|
|
@ -187,26 +172,38 @@ Ox.$ = Ox.element = function(val) {
|
|||
}
|
||||
return ret;
|
||||
},
|
||||
/*@
|
||||
empty <f> Empties the inner HTML
|
||||
() -> <o> This element
|
||||
@*/
|
||||
empty: function() {
|
||||
return this.html('');
|
||||
},
|
||||
/*@
|
||||
hasClass <f> Returns true if the element has a given class
|
||||
(className) -> <b> True if the element has the class
|
||||
hasClass <f> Returns true if this element has a given class
|
||||
(className) -> <b> True if this element has the class
|
||||
className <s> Class name
|
||||
@*/
|
||||
hasClass: function(str) {
|
||||
return this[0].className.split(' ').indexOf(str) > -1;
|
||||
},
|
||||
/*@
|
||||
height <f> Returns the height of this element
|
||||
() -> <n> Height in px
|
||||
@*/
|
||||
height: function() {
|
||||
return this[0].offsetHeight;
|
||||
},
|
||||
/*@
|
||||
hide <f> Hides this element
|
||||
() -> <o> This element
|
||||
@*/
|
||||
hide: function() {
|
||||
return this.css({display: 'none'});
|
||||
},
|
||||
/*@
|
||||
html <f> Gets or sets the inner HTML
|
||||
() -> <s> The inner HTML
|
||||
() -> <s> The inner HTML
|
||||
(html) -> <o> This element
|
||||
html <s> The inner HTML
|
||||
@*/
|
||||
|
|
@ -221,15 +218,27 @@ Ox.$ = Ox.element = function(val) {
|
|||
return ret;
|
||||
},
|
||||
/*@
|
||||
mousedown <f> Binds a function to the mousedown event
|
||||
(callback) -> <o> This element
|
||||
one <f> Binds a callback to an event and unbinds it on first invocation
|
||||
(event, callback) -> <o> This element
|
||||
({event0: callback0, event1: callback1, ...}) -> <o> This element
|
||||
event <s> Event name
|
||||
callback <f> Callback function
|
||||
event <o> The DOM event
|
||||
e <o> Event properties
|
||||
@*/
|
||||
mousedown: function(callback) {
|
||||
this[0].onmousedown = callback;
|
||||
one: function(events) {
|
||||
var that = this;
|
||||
Ox.forEach(Ox.makeObject(arguments), function(callback, event) {
|
||||
that.bind(event, function f() {
|
||||
that.unbind(event, f);
|
||||
callback();
|
||||
});
|
||||
});
|
||||
return this;
|
||||
},
|
||||
/*@
|
||||
remove <f> Removes this element from the DOM
|
||||
() -> <o> This element
|
||||
@*/
|
||||
remove: function() {
|
||||
this[0].parentNode.removeChild(this[0]);
|
||||
return this;
|
||||
|
|
@ -237,10 +246,13 @@ Ox.$ = Ox.element = function(val) {
|
|||
/*@
|
||||
removeAttr <f> Removes an attribute
|
||||
(key) -> <o> This element
|
||||
([key0, key1, ...]) -> <o> This element
|
||||
key <s> The attribute
|
||||
@*/
|
||||
removeAttr: function(key) {
|
||||
this[0].removeAttribute(key);
|
||||
removeAttr: function() {
|
||||
Ox.toArray(arguments[0]).forEach(function(key) {
|
||||
this[0].removeAttribute(key);
|
||||
});
|
||||
return this;
|
||||
},
|
||||
/*@
|
||||
|
|
@ -249,20 +261,46 @@ Ox.$ = Ox.element = function(val) {
|
|||
className <s> Class name
|
||||
@*/
|
||||
removeClass: function(str) {
|
||||
this[0].className = Ox.filter(
|
||||
this[0].className.split(' '), function(className) {
|
||||
return className != str;
|
||||
var arr = Ox.clean(str).split(' ');
|
||||
this[0].className = this[0].className.split(' ').filter(
|
||||
function(className) {
|
||||
return arr.indexOf(className) == -1;
|
||||
}
|
||||
).join(' ');
|
||||
return this;
|
||||
},
|
||||
/*@
|
||||
show <f> Show this element
|
||||
() -> This element
|
||||
@*/
|
||||
show: function() {
|
||||
return this.css({display: 'block'});
|
||||
},
|
||||
unbind: function(event) {
|
||||
this[0]['on' + event] = null;
|
||||
/*@
|
||||
unbind <f> Unbinds a callback from an event
|
||||
(event) -> <o> This element (unbinds all callbacks)
|
||||
(event, callback) -> <o> This element
|
||||
({event0: callback0, event1: callback1, ...}) -> <o> This element
|
||||
event <s> Event name
|
||||
callback <f> Callback function
|
||||
@*/
|
||||
unbind: function(event, callback) {
|
||||
var that = this;
|
||||
Ox.forEach(Ox.makeObject(arguments), function(callback, event) {
|
||||
if (callback) {
|
||||
that[0].removeEventListener(event, callback);
|
||||
} else {
|
||||
that[0]['on' + event] = null;
|
||||
}
|
||||
});
|
||||
return this;
|
||||
},
|
||||
/*@
|
||||
val <f> Gets or sets the value property of this element
|
||||
() -> <s> Value
|
||||
(value) -> <o> This element
|
||||
value <s> Value
|
||||
@*/
|
||||
val: function() {
|
||||
var ret;
|
||||
if (arguments.length == 0) {
|
||||
|
|
@ -273,6 +311,10 @@ Ox.$ = Ox.element = function(val) {
|
|||
}
|
||||
return ret;
|
||||
},
|
||||
/*@
|
||||
width <f> Returns the width of this element
|
||||
() -> <n> Width in px
|
||||
@*/
|
||||
width: function() {
|
||||
return this[0].offsetWidth;
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue