Make Ox.$ work with more than one element
This commit is contained in:
rolux
parent
d05b5ce811
commit
6a7b2fa7d7
1 changed files with 447 additions and 264 deletions
|
|
@ -30,11 +30,10 @@ Ox.$ <f> Generic HTML element, mimics jQuery
|
|||
Ox.$ = Ox.element = function(value) {
|
||||
|
||||
var data = {},
|
||||
element = !Ox.isString(value) ? value // window, document or element
|
||||
: value[0] == '<' ? document.createElement(value.slice(1, -1))
|
||||
: value[0] == '#' ? document.getElementById(value.slice(1))
|
||||
: value[0] == '.' ? document.getElementsByClassName(value.slice(1))[0]
|
||||
: document.getElementsByTagName(value)[0],
|
||||
elements = Ox.isArray(value) ? value // array of elements
|
||||
: !Ox.isString(value) ? [value] // window, document or element
|
||||
: value[0] == '<' ? [document.createElement(value.slice(1, -1))]
|
||||
: Ox.slice(document.querySelectorAll(value)),
|
||||
mousewheelEvents = ['wheel', 'mousewheel'],
|
||||
originalMousewheelEvents = 'onwheel' in document ? ['wheel']
|
||||
: ['mousewheel', 'DOMMouseScroll', 'MozMousePixelScroll'];
|
||||
|
|
@ -53,207 +52,312 @@ Ox.$ = Ox.element = function(value) {
|
|||
return ret;
|
||||
}
|
||||
|
||||
return element ? {
|
||||
//@ 0 <h> The DOM element itself
|
||||
0: element,
|
||||
function removeOxElements(parent, includeParent) {
|
||||
if (includeParent) {
|
||||
removeOxElement(parent);
|
||||
} else {
|
||||
parent.find('.OxElement').forEach(removeOxElement);
|
||||
}
|
||||
function removeOxElement(element) {
|
||||
Ox.getOxElement(element).removeElement();
|
||||
}
|
||||
}
|
||||
|
||||
return elements.length ? Ox.extend(
|
||||
Ox.zipObject(Ox.range(elements.length), elements
|
||||
), {
|
||||
/*@
|
||||
addClass <f> Adds a class name
|
||||
(className) -> <o> This element
|
||||
add <f> Adds another DOM object to this DOM object
|
||||
(other) -> This DOM object
|
||||
other <o> Other DOM object
|
||||
@*/
|
||||
add: function add($other) {
|
||||
elements = Ox.unique(elements.concat(other.elements()));
|
||||
this.length = elements.length;
|
||||
return this;
|
||||
},
|
||||
/*@
|
||||
addClass <f> Adds a class name to all elements
|
||||
(className) -> <o> This DOM object
|
||||
className <s> Class name
|
||||
@*/
|
||||
addClass: function(string) {
|
||||
this[0].className = Ox.unique(((
|
||||
this[0].className ? this[0].className + ' ' : ''
|
||||
) + Ox.clean(string)).split(' ')).join(' ');
|
||||
return this;
|
||||
},
|
||||
/*@
|
||||
append <f> Appends one or more elements to this element
|
||||
(element[, element[, ...]]) -> <o> This element
|
||||
element <o> Another element
|
||||
@*/
|
||||
append: function() {
|
||||
var that = this;
|
||||
Ox.slice(arguments).forEach(function($element) {
|
||||
that[0].appendChild($element[0]);
|
||||
addClass: function addClass(string) {
|
||||
string = Ox.clean(string);
|
||||
elements.forEach(function(element) {
|
||||
element.className = Ox.unique(((
|
||||
element.className ? element.className + ' ' : ''
|
||||
) + string).split(' ')).join(' ');
|
||||
});
|
||||
return this;
|
||||
},
|
||||
/*@
|
||||
appendTo <f> Appends this element object to another element object
|
||||
(element) -> <o> This element
|
||||
element <o> Another element
|
||||
append <f> Appends one or more DOM objects to this DOM object
|
||||
(object[, object[, ...]]) -> <o> This DOM object
|
||||
element <o> Another DOM object
|
||||
@*/
|
||||
appendTo: function($element) {
|
||||
$element[0].appendChild(this[0]);
|
||||
append: function append() {
|
||||
var $others = Ox.slice(arguments);
|
||||
elements.forEach(function(element) {
|
||||
$others.forEach(function($other) {
|
||||
$other.forEach(function(otherElement) {
|
||||
element.appendChild(otherElement);
|
||||
});
|
||||
});
|
||||
});
|
||||
return this;
|
||||
},
|
||||
/*@
|
||||
attr <f> Gets or sets an attribute
|
||||
appendTo <f> Appends this DOM object to another DOM object
|
||||
(object) -> <o> This DOM object
|
||||
object <o> Another DOM object
|
||||
@*/
|
||||
appendTo: function appendTo($other) {
|
||||
$other.forEach(function(otherElement) {
|
||||
elements.forEach(function(element) {
|
||||
otherElement.appendChild(element);
|
||||
});
|
||||
});
|
||||
return this;
|
||||
},
|
||||
/*@
|
||||
attr <f> Gets or sets an attribute for all elements
|
||||
(key) -> <s> Value
|
||||
(key, value) -> <o> This element
|
||||
({key0: value0, key1: value1, ...}) -> <o> This element
|
||||
(key, value) -> <o> This DOM object
|
||||
({key0: value0, key1: value1, ...}) -> <o> This DOM object
|
||||
key <s> Attribute name
|
||||
value <s> Attribute value
|
||||
@*/
|
||||
attr: function() {
|
||||
var ret, that = this;
|
||||
if (arguments.length == 1 && Ox.isString(arguments[0])) {
|
||||
attr: function attr() {
|
||||
var args = arguments, ret, that = this;
|
||||
if (args.length == 1 && Ox.isString(args[0])) {
|
||||
ret = this[0].getAttribute
|
||||
? this[0].getAttribute(arguments[0])
|
||||
: null;
|
||||
? this[0].getAttribute(args[0])
|
||||
: void 0;
|
||||
// fixme: why exactly is this needed?
|
||||
if (ret === null) {
|
||||
ret = void 0;
|
||||
}
|
||||
return ret === null ? void 0 : ret;
|
||||
} else {
|
||||
Ox.forEach(Ox.makeObject(arguments), function(value, key) {
|
||||
that[0].setAttribute && that[0].setAttribute(key, value);
|
||||
});
|
||||
ret = this;
|
||||
args = Ox.makeObject(args);
|
||||
elements.forEach(function(element) {
|
||||
Ox.forEach(args, function(value, key) {
|
||||
if (element.setAttribute) {
|
||||
element.setAttribute(key, value);
|
||||
}
|
||||
});
|
||||
});
|
||||
return this;
|
||||
}
|
||||
return ret;
|
||||
},
|
||||
/*@
|
||||
children <f> Returns the children of this element
|
||||
children <f> Returns the unique list of children of all elements
|
||||
() -> <[h]> Children
|
||||
@*/
|
||||
children: function() {
|
||||
return Ox.slice(this[0].childNodes);
|
||||
children: function children() {
|
||||
return Ox.unique(Ox.flatten(elements.map(function(element) {
|
||||
return Ox.slice(element.childNodes);
|
||||
})));
|
||||
},
|
||||
/*@
|
||||
css <f> Gets or sets a CSS attribute
|
||||
css <f> Gets or sets a CSS attribute for all elements
|
||||
(key) -> <s> Value
|
||||
(key, value) -> <o> This element
|
||||
({key0: value0, key1: value1, ...}) -> <o> This element
|
||||
(key, value) -> <o> This DOM object
|
||||
({key0: value0, key1: value1, ...}) -> <o> This DOM object
|
||||
key <s> Attribute name
|
||||
value <s> Attribute value
|
||||
@*/
|
||||
css: function() {
|
||||
var ret, that = this;
|
||||
if (arguments.length == 1 && Ox.isString(arguments[0])) {
|
||||
ret = this[0].style[arguments[0]];
|
||||
css: function css() {
|
||||
var args = arguments;
|
||||
if (args.length == 1 && Ox.isString(args[0])) {
|
||||
return elements[0].style[args[0]];
|
||||
} else {
|
||||
Ox.forEach(Ox.makeObject(arguments), function(value, key) {
|
||||
that[0].style[key] = value;
|
||||
args = Ox.makeObject(args);
|
||||
elements.forEach(function(element) {
|
||||
Ox.forEach(args, function(value, key) {
|
||||
element.style[key] = value;
|
||||
});
|
||||
ret = this;
|
||||
});
|
||||
return this;
|
||||
}
|
||||
return ret;
|
||||
},
|
||||
/*@
|
||||
data <f> Gets or sets data
|
||||
() -> <o> All data
|
||||
(key) -> <s> Value
|
||||
(key, value) -> <o> This element
|
||||
({key0: value0, key1: value1, ...}) -> <o> This element
|
||||
(key, value) -> <o> This DOM object
|
||||
({key0: value0, key1: value1, ...}) -> <o> This DOM object
|
||||
key <s> Property
|
||||
value <*> Value
|
||||
@*/
|
||||
data: function() {
|
||||
var ret;
|
||||
data: function data() {
|
||||
if (arguments.length == 0) {
|
||||
ret = data;
|
||||
return data;
|
||||
} else if (arguments.length == 1 && Ox.isString(arguments[0])) {
|
||||
ret = data[arguments[0]];
|
||||
return data[arguments[0]];
|
||||
} else {
|
||||
Ox.forEach(Ox.makeObject(arguments), function(value, key) {
|
||||
data[key] = value;
|
||||
});
|
||||
ret = this;
|
||||
return this;
|
||||
}
|
||||
return ret;
|
||||
},
|
||||
/*@
|
||||
empty <f> Empties the inner HTML
|
||||
() -> <o> This element
|
||||
elements <f> Returns all elements
|
||||
() -> <[h]> All elements
|
||||
@*/
|
||||
empty: function() {
|
||||
elements: function elements() {
|
||||
return elements;
|
||||
},
|
||||
/*@
|
||||
empty <f> Empties the inner HTML of all elements
|
||||
() -> <o> This DOM object
|
||||
@*/
|
||||
empty: function empty() {
|
||||
return this.html('');
|
||||
},
|
||||
/*@
|
||||
find <f> Find descendant elements
|
||||
every <f> Tests if every element satisfies a given condition
|
||||
(test) -> True if every element passes the test
|
||||
test <f> Test function
|
||||
@*/
|
||||
every: function every() {
|
||||
return Array.prototype.every.apply(elements, arguments);
|
||||
},
|
||||
/*@
|
||||
filter <f> Filters all elements by a given condition
|
||||
(test) -> Array of matching elements
|
||||
test <f> Test function
|
||||
@*/
|
||||
filter: function filter() {
|
||||
return Array.prototype.filter.apply(elements, arguments);
|
||||
},
|
||||
/*@
|
||||
find <f> Find all descendant elements matching a CSS selector
|
||||
([selector]) -> <[h]> Elements
|
||||
selector <s|'*'> CSS selector
|
||||
@*/
|
||||
find: function(string) {
|
||||
return Ox.slice(this[0].querySelectorAll(string || '*'));
|
||||
find: function find(string) {
|
||||
return Ox.unique(elements.map(function(element) {
|
||||
return this[0].querySelectorAll(string || '*');
|
||||
}));
|
||||
},
|
||||
/*@
|
||||
forEach <f> Loops over all elements
|
||||
(iterator) -> This DOM object
|
||||
iterator <f> Iterator function
|
||||
@*/
|
||||
forEach: function forEach() {
|
||||
Array.prototype.forEach.apply(elements, arguments);
|
||||
return this;
|
||||
},
|
||||
/*@
|
||||
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(string) {
|
||||
return this[0].className.split(' ').indexOf(string) > -1;
|
||||
hasClass: function hasClass(string) {
|
||||
return elements.any(function(element) {
|
||||
return Ox.contains(element.className.split(' '), string);
|
||||
});
|
||||
},
|
||||
/*@
|
||||
height <f> Returns the height of this element
|
||||
height <f> Returns the height of the first element
|
||||
() -> <n> Height in px
|
||||
@*/
|
||||
height: function() {
|
||||
return this[0].offsetHeight;
|
||||
height: function height() {
|
||||
return elements[0].offsetHeight;
|
||||
},
|
||||
/*@
|
||||
hide <f> Hides this element
|
||||
() -> <o> This element
|
||||
hide <f> Hides all elements
|
||||
() -> <o> This DOM object
|
||||
@*/
|
||||
hide: function() {
|
||||
hide: function hide() {
|
||||
return this.css({display: 'none'});
|
||||
},
|
||||
/*@
|
||||
html <f> Gets or sets the inner HTML
|
||||
html <f> Gets or sets the innerHTML of all elements
|
||||
() -> <s> The inner HTML
|
||||
(html) -> <o> This element
|
||||
(html) -> <o> This DOM object
|
||||
html <s> The inner HTML
|
||||
@*/
|
||||
html: function(string) {
|
||||
var ret;
|
||||
html: function html(string) {
|
||||
var html = '';
|
||||
if (arguments.length == 0) {
|
||||
ret = this[0].innerHTML;
|
||||
elements.forEach(function(element) {
|
||||
html += element.innerHTML;
|
||||
})
|
||||
return html;
|
||||
} else {
|
||||
this[0].innerHTML = string;
|
||||
ret = this;
|
||||
elements.forEach(function(element) {
|
||||
removeOxElements(element);
|
||||
element.innerHTML = string;
|
||||
});
|
||||
return this;
|
||||
}
|
||||
return ret;
|
||||
},
|
||||
/*@
|
||||
insertAfter <f> Inserts this element after another element
|
||||
(element) -> <o> This element
|
||||
element <o> Another element
|
||||
insertAfter <f> Inserts this DOM object after another DOM object
|
||||
(object) -> <o> This DOM object
|
||||
object <o> Another DOM object
|
||||
@*/
|
||||
insertAfter: function($element) {
|
||||
$element[0].parentNode.insertBefore(this[0], $element[0].nextSibling);
|
||||
insertAfter: function insertAfter($other) {
|
||||
var nextSibling = $element[0].nextSibling;
|
||||
elements.forEach(function(element) {
|
||||
$other[0].parentNode.insertBefore(element, nextSibling);
|
||||
})
|
||||
return this;
|
||||
},
|
||||
/*@
|
||||
insertBefore <f> Inserts this element before another element
|
||||
(element) -> <o> This element
|
||||
element <o> Another element
|
||||
insertBefore <f> Inserts this DOM object before another DOM object
|
||||
(object) -> <o> This DOM object
|
||||
object <o> Another DOM object
|
||||
@*/
|
||||
insertBefore: function($element) {
|
||||
$element[0].parentNode.insertBefore(this[0], $element[0]);
|
||||
insertBefore: function insertBefore($other) {
|
||||
elements.forEach(function(element) {
|
||||
$other[0].parentNode.insertBefore(element, $other[0]);
|
||||
});
|
||||
return this;
|
||||
},
|
||||
/*@
|
||||
is <f> Returns true if the element matches the query
|
||||
is <f> Tests if any element matches a CSS selector
|
||||
(selector) -> <b> True if the element matches the selector
|
||||
selector <s> CSS selector
|
||||
@*/
|
||||
is: function(query) {
|
||||
return Ox.contains(this.parent().querySelectorAll(query), this[0]);
|
||||
is: function is(string) {
|
||||
return elements.some(function(element) {
|
||||
return Ox.contains(
|
||||
(element.parentNode || document).querySelectorAll(string),
|
||||
element
|
||||
);
|
||||
});
|
||||
},
|
||||
/*@
|
||||
next <f> Returns the sibling after this element
|
||||
() -> <h> Next element
|
||||
length <n> Number of elements
|
||||
@*/
|
||||
next: function() {
|
||||
return this[0].nextSibling;
|
||||
length: elements.length,
|
||||
/*@
|
||||
map <f> Transforms all elements
|
||||
(iterator) -> [] Transformed elements
|
||||
iterator <f> Iterator function
|
||||
@*/
|
||||
map: function map() {
|
||||
return Array.prototype.filter.map(elements, arguments);
|
||||
},
|
||||
/*@
|
||||
nextAll <f> Returns all siblings after this element
|
||||
() -> <[h]> Next elements
|
||||
next <f> Returns the unique list of siblings directly after all elements
|
||||
() -> <[h]> Siblings
|
||||
@*/
|
||||
nextAll: function() {
|
||||
var sibling = this[0], siblings = [];
|
||||
next: function next() {
|
||||
return Ox.unique(Ox.filter(elements.map(function(element) {
|
||||
return element.nextSibling;
|
||||
})));
|
||||
},
|
||||
/*@
|
||||
nextAll <f> Returns the unique list of siblings after all elements
|
||||
() -> <[h]> Siblings
|
||||
@*/
|
||||
nextAll: function nextAll() {
|
||||
var siblings = [];
|
||||
elements.forEach(function(element) {
|
||||
var sibling = element;
|
||||
while (true) {
|
||||
sibling = sibling.nextSibling;
|
||||
if (!sibling) {
|
||||
|
|
@ -261,51 +365,56 @@ Ox.$ = Ox.element = function(value) {
|
|||
}
|
||||
siblings.push(sibling);
|
||||
}
|
||||
return siblings;
|
||||
});
|
||||
return Ox.unique(siblings);
|
||||
},
|
||||
/*@
|
||||
off <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) -> <o> This DOM object (unbinds all callbacks)
|
||||
(event, callback) -> <o> This DOM object
|
||||
({event0: callback0, event1: callback1, ...}) -> <o> This DOM object
|
||||
event <s> Event name
|
||||
callback <f> Callback function
|
||||
@*/
|
||||
off: function(event, callback) {
|
||||
var that = this;
|
||||
Ox.forEach(normalizeEvents(arguments), function(callback, event) {
|
||||
off: function off(event, callback) {
|
||||
var args = normalizeEvents(arguments);
|
||||
elements.forEach(function(element) {
|
||||
Ox.forEach(args, function(callback, event) {
|
||||
if (callback) {
|
||||
that[0].removeEventListener(event, callback, false);
|
||||
element.removeEventListener(event, callback, false);
|
||||
} else {
|
||||
that[0]['on' + event] = null;
|
||||
element['on' + event] = null;
|
||||
}
|
||||
});
|
||||
});
|
||||
return this;
|
||||
},
|
||||
/*@
|
||||
on <f> Binds a callback to an event
|
||||
(event, callback) -> <o> This element
|
||||
({event0: callback0, event1: callback1, ...}) -> <o> This element
|
||||
(event, callback) -> <o> This DOM object
|
||||
({event0: callback0, event1: callback1, ...}) -> <o> This DOM object
|
||||
event <s> Event name
|
||||
callback <f> Callback function
|
||||
e <o> Event properties
|
||||
@*/
|
||||
on: function() {
|
||||
var that = this;
|
||||
Ox.forEach(normalizeEvents(arguments), function(callback, event) {
|
||||
that[0].addEventListener(event, callback, false);
|
||||
on: function on() {
|
||||
var args = normalizeEvents(arguments);
|
||||
elements.forEach(function(element) {
|
||||
Ox.forEach(args, function(callback, event) {
|
||||
element.addEventListener(event, callback, false);
|
||||
});
|
||||
});
|
||||
return this;
|
||||
},
|
||||
/*@
|
||||
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, callback) -> <o> This DOM object
|
||||
({event0: callback0, event1: callback1, ...}) -> <o> This DOM object
|
||||
event <s> Event name
|
||||
callback <f> Callback function
|
||||
e <o> Event properties
|
||||
@*/
|
||||
one: function(events) {
|
||||
one: function one(events) {
|
||||
var args = Ox.slice(arguments), that = this;
|
||||
Ox.forEach(normalizeEvents(arguments), function(callback, event) {
|
||||
that.on(event, function fn() {
|
||||
|
|
@ -316,18 +425,22 @@ Ox.$ = Ox.element = function(value) {
|
|||
return this;
|
||||
},
|
||||
/*@
|
||||
parent <f> Returns the parent of this element
|
||||
() -> <h> Parent element
|
||||
parent <f> Returns the unique list of parents of all elements
|
||||
() -> <[h]> Parent elements
|
||||
@*/
|
||||
parent: function() {
|
||||
return this[0].parentNode;
|
||||
parent: function parent() {
|
||||
return Ox.unique(elements.map(function(element) {
|
||||
return element.parentNode;
|
||||
}));
|
||||
},
|
||||
/*@
|
||||
parents <f> Returns all ancestors of this element
|
||||
parents <f> Returns the unique list of all ancestors of all elements
|
||||
() -> <[h]> Ancestor elements
|
||||
@*/
|
||||
parents: function() {
|
||||
var parent = this[0], parents = [];
|
||||
parents: function parents() {
|
||||
var parents = [];
|
||||
Ox.reverse(elements).forEach(function(element) {
|
||||
var parent = element;
|
||||
while (true) {
|
||||
parent = parent.parentNode;
|
||||
if (!parent) {
|
||||
|
|
@ -335,43 +448,57 @@ Ox.$ = Ox.element = function(value) {
|
|||
}
|
||||
parents.unshift(parent);
|
||||
}
|
||||
return parents;
|
||||
});
|
||||
return Ox.unique(parents);
|
||||
},
|
||||
/*@
|
||||
prepend <f> Prepends one or more elements to this element
|
||||
(element[, element[, ...]]) -> <o> This element
|
||||
element <o> Another element
|
||||
prepend <f> Prepends one or more DOM objects to this DOM object
|
||||
(object[, object[, ...]]) -> <o> DOM object
|
||||
object <o> Another DOM objectt
|
||||
@*/
|
||||
prepend: function() {
|
||||
var parent = this[0].parentNode;
|
||||
Ox.slice(arguments).reverse().forEach(function($element) {
|
||||
parent.insertBefore($element[0], parent.firstChild);
|
||||
prepend: function prepend() {
|
||||
var $others = Ox.slice(arguments).reverse();
|
||||
elements.forEach(function(element) {
|
||||
var parent = element.parentNode;
|
||||
$others.forEach(function($other) {
|
||||
$other.forEach(function(otherElement) {
|
||||
parent.insertBefore(otherElement, parent.firstChild);
|
||||
});
|
||||
});
|
||||
});
|
||||
return this;
|
||||
},
|
||||
/*@
|
||||
prependTo <f> Prepends this element object to another element object
|
||||
(element) -> <o> This element
|
||||
element <o> Another element
|
||||
prependTo <f> Prepends this DOM object to another DOM object
|
||||
(object) -> <o> This DOM object
|
||||
object <o> Another DOM object
|
||||
@*/
|
||||
prependTo: function($element) {
|
||||
var element = $element[0];
|
||||
element.insertBefore(this[0], element.firstChild);
|
||||
prependTo: function prependTo($other) {
|
||||
$other.forEach(function(otherElement) {
|
||||
var firstChild = otherElement.firstChild
|
||||
elements.forEach(function(element) {
|
||||
otherElement.insertBefore(element, firstChild);
|
||||
});
|
||||
});
|
||||
return this;
|
||||
},
|
||||
/*@
|
||||
prev <f> Returns the sibling before this element
|
||||
() -> <h> Next element
|
||||
prev <f> Returns the unique list of siblings directly before all elements
|
||||
() -> <[h]> Siblings
|
||||
@*/
|
||||
prev: function() {
|
||||
return this[0].previousSibling;
|
||||
prev: function prev() {
|
||||
return Ox.unique(Ox.filter(elements.map(function(element) {
|
||||
return element.previousSibling;
|
||||
})));
|
||||
},
|
||||
/*@
|
||||
prevAll <f> Returns all siblings before this element
|
||||
() -> <[h]> Next elements
|
||||
prevAll <f> Returns the unique list of siblings before all elements
|
||||
() -> <[h]> Siblings
|
||||
@*/
|
||||
prevAll: function() {
|
||||
var sibling = this[0], siblings = [];
|
||||
prevAll: function prevAll() {
|
||||
var siblings = [];
|
||||
Ox.reverse(elements).forEach(function(element) {
|
||||
var sibling = element;
|
||||
while (true) {
|
||||
sibling = sibling.previousSibling;
|
||||
if (!sibling) {
|
||||
|
|
@ -379,143 +506,199 @@ Ox.$ = Ox.element = function(value) {
|
|||
}
|
||||
siblings.unshift(sibling);
|
||||
}
|
||||
return siblings;
|
||||
});
|
||||
return Ox.unique(siblings);
|
||||
},
|
||||
/*@
|
||||
remove <f> Removes this element from the DOM
|
||||
() -> <o> This element
|
||||
reduce <f> Applies `reduce` to all elements
|
||||
@*/
|
||||
remove: function() {
|
||||
this[0].parentNode.removeChild(this[0]);
|
||||
return this;
|
||||
reduce: function reduce() {
|
||||
return Array.prototype.reduce.apply(elements, arguments);
|
||||
},
|
||||
/*@
|
||||
removeAttr <f> Removes an attribute
|
||||
(key) -> <o> This element
|
||||
([key0, key1, ...]) -> <o> This element
|
||||
key <s> The attribute
|
||||
remove <f> Removes all element from the DOM
|
||||
() -> <o> This DOM object
|
||||
@*/
|
||||
removeAttr: function() {
|
||||
var that = this;
|
||||
Ox.makeArray(arguments[0]).forEach(function(key) {
|
||||
that[0].removeAttribute(key);
|
||||
remove: function remove() {
|
||||
elements.forEach(function(element) {
|
||||
if (element.parentNode) {
|
||||
removeOxElements(element, true);
|
||||
element.parentNode.removeChild(element);
|
||||
}
|
||||
});
|
||||
return this;
|
||||
},
|
||||
/*@
|
||||
removeClass <f> Removes a class name
|
||||
(className) -> <o> This element
|
||||
removeAttr <f> Removes an attribute from all elements
|
||||
(key) -> <o> This DOM object
|
||||
([key0, key1, ...]) -> <o> This DOM object
|
||||
key <s> The attribute
|
||||
@*/
|
||||
removeAttr: function removeAttr() {
|
||||
var keys = Ox.makeArray(arguments);
|
||||
elements.forEach(function(element) {
|
||||
keys.forEach(function(key) {
|
||||
element.removeAttribute(key);
|
||||
});
|
||||
});
|
||||
return this;
|
||||
},
|
||||
/*@
|
||||
removeClass <f> Removes a class name from all elements
|
||||
(className) -> <o> This DOM object
|
||||
className <s> Class name
|
||||
@*/
|
||||
removeClass: function(string) {
|
||||
var array = Ox.clean(string).split(' ');
|
||||
this[0].className = this[0].className.split(' ').filter(
|
||||
function(className) {
|
||||
return array.indexOf(className) == -1;
|
||||
removeClass: function removeClass(string) {
|
||||
var classNames = Ox.clean(string).split(' ');
|
||||
elements.forEach(function(element) {
|
||||
element.className = element.className.split(' ')
|
||||
.filter(function(className) {
|
||||
return !Ox.contains(classNames, className)
|
||||
})
|
||||
.join(' ');
|
||||
});
|
||||
return this;
|
||||
},
|
||||
/*@
|
||||
replace <f> Replaces another DOM object with this DOM object
|
||||
(object) -> <o> This DOM object
|
||||
object <o> Another DOM object
|
||||
@*/
|
||||
replace: function replace($other) {
|
||||
$other.forEach(function(otherElement) {
|
||||
var parent = otherElement.parentNode,
|
||||
sibling = otherElement.nextSibling;
|
||||
if (parent) {
|
||||
removeOxElements(otherElement, true);
|
||||
parent.removeChild(otherElement);
|
||||
elements.forEach(function(element) {
|
||||
parent.insertBefore(element, sibling)
|
||||
});
|
||||
}
|
||||
).join(' ');
|
||||
});
|
||||
return this;
|
||||
},
|
||||
/*@
|
||||
replace <f> Replaces another element with this element
|
||||
(element) -> <o> This element
|
||||
element <o> Another element
|
||||
replaceWith <f> Replaces this DOM object with another DOM object
|
||||
(object) -> <o> This DOM object
|
||||
object <o> Another DOM object
|
||||
@*/
|
||||
replace: function($element) {
|
||||
var next = $element[0].nextSibling, parent = $element[0].parentNode;
|
||||
$element.remove();
|
||||
parent.insertBefore(this[0], next);
|
||||
replaceWith: function replaceWith($element) {
|
||||
elements.forEach(function(element) {
|
||||
var parent = element.parentNode,
|
||||
sibling = element.nextSibling;
|
||||
if (parent) {
|
||||
removeOxElements(element, true);
|
||||
parent.removeChild(element);
|
||||
$other.forEach(function(otherElement) {
|
||||
parent.insertBefore(otherElement, sibling);
|
||||
});
|
||||
}
|
||||
});
|
||||
return this;
|
||||
},
|
||||
/*@
|
||||
replaceWith <f> Replaces this element with another element
|
||||
(element) -> <o> This element
|
||||
element <o> Another element
|
||||
show <f> Shows all elements
|
||||
() -> This DOM object
|
||||
@*/
|
||||
replaceWith: function($element) {
|
||||
var next = this[0].nextSibling, parent = this[0].parentNode;
|
||||
this.remove();
|
||||
parent.insertBefore($element[0], next);
|
||||
return this;
|
||||
},
|
||||
/*@
|
||||
show <f> Shows this element
|
||||
() -> This element
|
||||
@*/
|
||||
show: function() {
|
||||
show: function show() {
|
||||
return this.css({display: 'block'});
|
||||
},
|
||||
/*@
|
||||
siblings <f> Returns all siblings of this element
|
||||
() -> <[oh]> Sibling elements
|
||||
siblings <f> Returns all siblings of all elements
|
||||
() -> <[h]> Siblings
|
||||
@*/
|
||||
siblings: function() {
|
||||
var that = this;
|
||||
return Ox.filter(this[0].parentNode.childNodes, function(element) {
|
||||
return element !== that[0];
|
||||
});
|
||||
siblings: function siblings() {
|
||||
return Ox.unique(elements.map(function(element) {
|
||||
return Ox.filter(
|
||||
element.parentNode.childNodes,
|
||||
function(sibling) {
|
||||
return sibling !== element;
|
||||
}
|
||||
);
|
||||
}));
|
||||
},
|
||||
/*@
|
||||
text <f> Gets or sets the text contents
|
||||
some <f> Tests if some elements satisfy a given condition
|
||||
(test) -> True if some elements pass the test
|
||||
test <f> Test function
|
||||
@*/
|
||||
some: function some() {
|
||||
return Array.prototype.some.apply(elements, arguments);
|
||||
},
|
||||
/*@
|
||||
text <f> Gets or sets the text contents of all elements
|
||||
() -> <s> The text contents
|
||||
(text) -> <o> This element
|
||||
(text) -> <o> This DOM object
|
||||
text <s> The text contents
|
||||
@*/
|
||||
text: function(string) {
|
||||
var ret;
|
||||
text: function text(string) {
|
||||
var text = '';
|
||||
if (arguments.length == 0) {
|
||||
ret = Ox.isString(this.textContent)
|
||||
? this.textContent : this.innerText;
|
||||
elements.forEach(function(element) {
|
||||
text += Ox.isString(this.textContent) ? this.textContent
|
||||
: this.innerText;
|
||||
});
|
||||
return text;
|
||||
} else {
|
||||
this.empty()[0].appendChild(document.createTextNode(string));
|
||||
ret = this;
|
||||
elements.forEach(function(element) {
|
||||
element.empty();
|
||||
element.appendChild(document.createTextNode(string));
|
||||
});
|
||||
return this;
|
||||
}
|
||||
return ret;
|
||||
},
|
||||
/*@
|
||||
toggleClass <f> Toggles a class name
|
||||
(className) -> <o> This element
|
||||
toggleClass <f> Toggles a class name for all elements
|
||||
(className) -> <o> This DOM object
|
||||
className <s> Class name
|
||||
@*/
|
||||
toggleClass: function(string) {
|
||||
return this[
|
||||
this.hasClass(string) ? 'removeClass' : 'addClass'
|
||||
toggleClass: function toggleClass(string) {
|
||||
elements.forEach(function(element) {
|
||||
var $element = Ox.$(element);
|
||||
$element[
|
||||
$element.hasClass(string) ? 'removeClass' : 'addClass'
|
||||
](string);
|
||||
},
|
||||
/*@
|
||||
trigger <f> Triggers an event
|
||||
(event) -> <o> This element
|
||||
@*/
|
||||
trigger: function(event) {
|
||||
var e = document.createEvent('MouseEvents');
|
||||
e.initEvent(event, true, true);
|
||||
this[0].dispatchEvent(e);
|
||||
})
|
||||
return this;
|
||||
},
|
||||
/*@
|
||||
val <f> Gets or sets the value property of this element
|
||||
() -> <s> Value
|
||||
(value) -> <o> This element
|
||||
value <s> Value
|
||||
trigger <f> Triggers an event
|
||||
(event) -> <o> This DOM object
|
||||
@*/
|
||||
val: function(value) {
|
||||
var ret;
|
||||
if (arguments.length == 0) {
|
||||
ret = this[0].value;
|
||||
} else {
|
||||
this[0].value = value;
|
||||
ret = this;
|
||||
}
|
||||
return ret;
|
||||
trigger: function trigger(event) {
|
||||
elements.forEach(function(element) {
|
||||
var e = document.createEvent('MouseEvents');
|
||||
e.initEvent(event, true, true);
|
||||
element.dispatchEvent(e);
|
||||
});
|
||||
return this;
|
||||
},
|
||||
/*@
|
||||
width <f> Returns the width of this element
|
||||
val <f> Gets the value of the first or sets the value of all elements
|
||||
() -> <s> Value
|
||||
(value) -> <o> This DOM object
|
||||
value <s> Value
|
||||
@*/
|
||||
val: function val(value) {
|
||||
var ret;
|
||||
if (arguments.length == 0) {
|
||||
return elements[0].value;
|
||||
} else {
|
||||
elements.forEach(function(element) {
|
||||
element.value = value;
|
||||
});
|
||||
return this;
|
||||
}
|
||||
},
|
||||
/*@
|
||||
width <f> Returns the width of the first element
|
||||
() -> <n> Width in px
|
||||
@*/
|
||||
width: function() {
|
||||
return this[0].offsetWidth;
|
||||
width: function width() {
|
||||
return elements[0].offsetWidth;
|
||||
}
|
||||
} : null;
|
||||
}) : null;
|
||||
|
||||
};
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue