0x2620/oxjs
2
0
Fork 1
Code Issues 172 Pull requests Releases Wiki Activity

Ox.$: various bugfixes and enhancements

Browse source
This commit is contained in:
rolux 2014-09-22 14:11:55 +02:00
parent ef127e1db4
commit 66a4fcb9f9
1 changed files with 68 additions and 40 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

108
source/Ox/js/DOM.js
View file

@ -29,14 +29,15 @@ Ox.$ <f> Generic HTML element, mimics jQuery
@*/
Ox.$ = Ox.element = function $(value) {
var data = {},
var elementData = {},
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'];
: ['mousewheel', 'DOMMouseScroll', 'MozMousePixelScroll'],
previousDisplay;
function getElements($other) {
return $other.forEach ? $other
@ -148,7 +149,10 @@ Ox.$ = Ox.element = function $(value) {
args = Ox.makeObject(args);
elements.forEach(function(element) {
Ox.forEach(args, function(value, key) {
if (element.setAttribute) {
if (
element.setAttribute
&& !Ox.contains([false, null, void 0], value)
) {
element.setAttribute(key, value);
}
});
@ -158,12 +162,16 @@ Ox.$ = Ox.element = function $(value) {
},
/*@
children <f> Returns the unique list of children of all elements
() -> <[h]> Children
([selector]) -> <[h]> Children
selector <s|'*'> CSS selector
@*/
children: function children() {
return Ox.unique(Ox.flatten(elements.map(function(element) {
return element.childNodes;
var children = Ox.unique(Ox.flatten(elements.map(function(element) {
return Ox.slice(element.childNodes);
})));
return Ox.$(selector ? children.filter(function(child) {
return Ox.$(child).is(selector);
}) : children);
},
/*@
css <f> Gets or sets a CSS attribute for all elements
@ -178,9 +186,8 @@ Ox.$ = Ox.element = function $(value) {
if (args.length == 1 && Ox.isString(args[0])) {
return elements[0].style[args[0]];
} else {
args = Ox.makeObject(args);
elements.forEach(function(element) {
Ox.forEach(args, function(value, key) {
Ox.forEach(Ox.makeObject(args), function(value, key) {
element.style[key] = value;
});
});
@ -198,22 +205,32 @@ Ox.$ = Ox.element = function $(value) {
@*/
data: function data() {
if (arguments.length == 0) {
return data;
return elementData;
} else if (arguments.length == 1 && Ox.isString(arguments[0])) {
return data[arguments[0]];
return elementData[arguments[0]];
} else {
Ox.forEach(Ox.makeObject(arguments), function(value, key) {
data[key] = value;
elementData[key] = value;
});
return this;
}
},
/*@
elements <f> Returns all elements
() -> <[h]> All elements
elements <a> All elements
@*/
elements: function elements() {
return elements;
elements: elements,
/*@
eq <f> Reduces the list of elements to the one at the given index
() -> <o> This DOM object
@*/
eq: function eq() {
var that = this;
Ox.loop(1, this.length, function(index) {
delete that[index];
});
this.elements = [this.elements[index]];
this.length = 1;
return this;
},
/*@
empty <f> Empties the inner HTML of all elements
@ -243,10 +260,10 @@ Ox.$ = Ox.element = function $(value) {
([selector]) -> <[h]> Elements
selector <s|'*'> CSS selector
@*/
find: function find(string) {
return Ox.unique(elements.map(function(element) {
return element.querySelectorAll(string || '*');
}));
find: function find(selector) {
return Ox.$(Ox.unique(Ox.flatten(elements.map(function(element) {
return Ox.slice(element.querySelectorAll(selector || '*'));
}))));
},
/*@
forEach <f> Loops over all elements
@ -279,6 +296,7 @@ Ox.$ = Ox.element = function $(value) {
() -> <o> This DOM object
@*/
hide: function hide() {
previousDisplay = this.css('display');
return this.css({display: 'none'});
},
/*@
@ -308,7 +326,7 @@ Ox.$ = Ox.element = function $(value) {
object <o> Another DOM object
@*/
insertAfter: function insertAfter($other) {
var nextSibling = $element[0].nextSibling;
var nextSibling = $other[0].nextSibling;
elements.forEach(function(element) {
$other[0].parentNode.insertBefore(element, nextSibling);
})
@ -330,12 +348,14 @@ Ox.$ = Ox.element = function $(value) {
(selector) -> <b> True if the element matches the selector
selector <s> CSS selector
@*/
is: function is(string) {
is: function is(selector) {
return elements.some(function(element) {
return Ox.contains(
(element.parentNode || document).querySelectorAll(string),
element
);
var parent = element.parentNode;
if (!parent) {
parent = document.createElement('div');
parent.appendChild(element);
}
return Ox.contains(parent.querySelectorAll(selector), element);
});
},
/*@
@ -355,9 +375,9 @@ Ox.$ = Ox.element = function $(value) {
() -> <[h]> Siblings
@*/
next: function next() {
return Ox.unique(Ox.filter(elements.map(function(element) {
return Ox.$(Ox.unique(Ox.filter(elements.map(function(element) {
return element.nextSibling;
})));
}))));
},
/*@
nextAll <f> Returns the unique list of siblings after all elements
@ -375,7 +395,7 @@ Ox.$ = Ox.element = function $(value) {
siblings.push(sibling);
}
});
return Ox.unique(siblings);
return Ox.$(Ox.unique(siblings));
},
/*@
off <f> Unbinds a callback from an event
@ -438,13 +458,14 @@ Ox.$ = Ox.element = function $(value) {
() -> <[h]> Parent elements
@*/
parent: function parent() {
return Ox.unique(elements.map(function(element) {
return Ox.$(Ox.unique(Ox.compact(elements.map(function(element) {
return element.parentNode;
}));
}))));
},
/*@
parents <f> Returns the unique list of all ancestors of all elements
() -> <[h]> Ancestor elements
([selector]) -> <[h]> Ancestor elements
selector <s|'*'> CSS selector
@*/
parents: function parents() {
var parents = [];
@ -458,7 +479,10 @@ Ox.$ = Ox.element = function $(value) {
parents.unshift(parent);
}
});
return Ox.unique(parents);
parents = Ox.unique(parents);
return Ox.$(selector ? parents.filter(function(parent) {
return Ox.$(parent).is(selector);
}) : parents);
},
/*@
prepend <f> Prepends one or more DOM objects to this DOM object
@ -496,9 +520,9 @@ Ox.$ = Ox.element = function $(value) {
() -> <[h]> Siblings
@*/
prev: function prev() {
return Ox.unique(Ox.filter(elements.map(function(element) {
return Ox.$(Ox.unique(Ox.filter(elements.map(function(element) {
return element.previousSibling;
})));
}))));
},
/*@
prevAll <f> Returns the unique list of siblings before all elements
@ -516,7 +540,7 @@ Ox.$ = Ox.element = function $(value) {
siblings.unshift(sibling);
}
});
return Ox.unique(siblings);
return Ox.$(Ox.unique(siblings));
},
/*@
reduce <f> Applies `reduce` to all elements
@ -611,14 +635,15 @@ Ox.$ = Ox.element = function $(value) {
() -> This DOM object
@*/
show: function show() {
return this.css({display: 'block'});
return this.css({display: previousDisplay || 'block'});
},
/*@
siblings <f> Returns all siblings of all elements
() -> <[h]> Siblings
([selector]) -> <[h]> Siblings
selector <s|'*'> CSS selector
@*/
siblings: function siblings() {
return Ox.unique(elements.map(function(element) {
var siblings = Ox.unique(elements.map(function(element) {
return Ox.filter(
element.parentNode.childNodes,
function(sibling) {
@ -626,6 +651,9 @@ Ox.$ = Ox.element = function $(value) {
}
);
}));
return Ox.$(selector ? siblings.filter(function(sibling) {
return Ox.$(sibling).is(selector);
}) : siblings);
},
/*@
some <f> Tests if some elements satisfy a given condition
@ -645,8 +673,8 @@ Ox.$ = Ox.element = function $(value) {
var text = '';
if (arguments.length == 0) {
elements.forEach(function(element) {
text += Ox.isString(this.textContent) ? this.textContent
: this.innerText;
text += Ox.isString(element.textContent)
? element.textContent : element.innerText;
});
return text;
} else {