dojo
Version:
Dojo core is a powerful, lightweight library that makes common tasks quicker and easier. Animate elements, manipulate the DOM, and query with easy CSS syntax, all without sacrificing performance.
327 lines (304 loc) • 9.95 kB
JavaScript
define(["./_base/lang", "./_base/array", "./dom"], function(lang, array, dom){
// module:
// dojo/dom-class
var className = "className";
/* Part I of classList-based implementation is preserved here for posterity
var classList = "classList";
has.add("dom-classList", function(){
return classList in document.createElement("p");
});
*/
// =============================
// (CSS) Class Functions
// =============================
var cls, // exports object
spaces = /\s+/, a1 = [""];
function str2array(s){
if(typeof s == "string" || s instanceof String){
if(s && !spaces.test(s)){
a1[0] = s;
return a1;
}
var a = s.split(spaces);
if(a.length && !a[0]){
a.shift();
}
if(a.length && !a[a.length - 1]){
a.pop();
}
return a;
}
// assumed to be an array
if(!s){
return [];
}
return array.filter(s, function(x){ return x; });
}
/* Part II of classList-based implementation is preserved here for posterity
if(has("dom-classList")){
// new classList version
cls = {
contains: function containsClass(node, classStr){
var clslst = classStr && dom.byId(node)[classList];
return clslst && clslst.contains(classStr); // Boolean
},
add: function addClass(node, classStr){
node = dom.byId(node);
classStr = str2array(classStr);
for(var i = 0, len = classStr.length; i < len; ++i){
node[classList].add(classStr[i]);
}
},
remove: function removeClass(node, classStr){
node = dom.byId(node);
if(classStr === undefined){
node[className] = "";
}else{
classStr = str2array(classStr);
for(var i = 0, len = classStr.length; i < len; ++i){
node[classList].remove(classStr[i]);
}
}
},
replace: function replaceClass(node, addClassStr, removeClassStr){
node = dom.byId(node);
if(removeClassStr === undefined){
node[className] = "";
}else{
removeClassStr = str2array(removeClassStr);
for(var i = 0, len = removeClassStr.length; i < len; ++i){
node[classList].remove(removeClassStr[i]);
}
}
addClassStr = str2array(addClassStr);
for(i = 0, len = addClassStr.length; i < len; ++i){
node[classList].add(addClassStr[i]);
}
},
toggle: function toggleClass(node, classStr, condition){
node = dom.byId(node);
if(condition === undefined){
classStr = str2array(classStr);
for(var i = 0, len = classStr.length; i < len; ++i){
node[classList].toggle(classStr[i]);
}
}else{
cls[condition ? "add" : "remove"](node, classStr);
}
return condition; // Boolean
}
}
}
*/
// regular DOM version
var fakeNode = {}; // for effective replacement
cls = {
// summary:
// This module defines the core dojo DOM class API.
contains: function containsClass(/*DomNode|String*/ node, /*String*/ classStr){
// summary:
// Returns whether or not the specified classes are a portion of the
// class list currently applied to the node.
// node: String|DOMNode
// String ID or DomNode reference to check the class for.
// classStr: String
// A string class name to look for.
// example:
// Do something if a node with id="someNode" has class="aSillyClassName" present
// | if(domClass.contains("someNode","aSillyClassName")){ ... }
return ((" " + dom.byId(node)[className] + " ").indexOf(" " + classStr + " ") >= 0); // Boolean
},
add: function addClass(/*DomNode|String*/ node, /*String|Array*/ classStr){
// summary:
// Adds the specified classes to the end of the class list on the
// passed node. Will not re-apply duplicate classes.
//
// node: String|DOMNode
// String ID or DomNode reference to add a class string too
//
// classStr: String|Array
// A String class name to add, or several space-separated class names,
// or an array of class names.
//
// example:
// Add a class to some node:
// | require(["dojo/dom-class"], function(domClass){
// | domClass.add("someNode", "anewClass");
// | });
//
// example:
// Add two classes at once:
// | require(["dojo/dom-class"], function(domClass){
// | domClass.add("someNode", "firstClass secondClass");
// | });
//
// example:
// Add two classes at once (using array):
// | require(["dojo/dom-class"], function(domClass){
// | domClass.add("someNode", ["firstClass", "secondClass"]);
// | });
//
// example:
// Available in `dojo/NodeList` for multiple additions
// | require(["dojo/query"], function(query){
// | query("ul > li").addClass("firstLevel");
// | });
node = dom.byId(node);
classStr = str2array(classStr);
var cls = node[className], oldLen;
cls = cls ? " " + cls + " " : " ";
oldLen = cls.length;
for(var i = 0, len = classStr.length, c; i < len; ++i){
c = classStr[i];
if(c && cls.indexOf(" " + c + " ") < 0){
cls += c + " ";
}
}
if(oldLen < cls.length){
node[className] = cls.substr(1, cls.length - 2);
}
},
remove: function removeClass(/*DomNode|String*/ node, /*String|Array?*/ classStr){
// summary:
// Removes the specified classes from node. No `contains()`
// check is required.
//
// node: String|DOMNode
// String ID or DomNode reference to remove the class from.
//
// classStr: String|Array
// An optional String class name to remove, or several space-separated
// class names, or an array of class names. If omitted, all class names
// will be deleted.
//
// example:
// Remove a class from some node:
// | require(["dojo/dom-class"], function(domClass){
// | domClass.remove("someNode", "firstClass");
// | });
//
// example:
// Remove two classes from some node:
// | require(["dojo/dom-class"], function(domClass){
// | domClass.remove("someNode", "firstClass secondClass");
// | });
//
// example:
// Remove two classes from some node (using array):
// | require(["dojo/dom-class"], function(domClass){
// | domClass.remove("someNode", ["firstClass", "secondClass"]);
// | });
//
// example:
// Remove all classes from some node:
// | require(["dojo/dom-class"], function(domClass){
// | domClass.remove("someNode");
// | });
//
// example:
// Available in `dojo/NodeList` for multiple removal
// | require(["dojo/query"], function(query){
// | query("ul > li").removeClass("foo");
// | });
node = dom.byId(node);
var cls;
if(classStr !== undefined){
classStr = str2array(classStr);
cls = " " + node[className] + " ";
for(var i = 0, len = classStr.length; i < len; ++i){
cls = cls.replace(" " + classStr[i] + " ", " ");
}
cls = lang.trim(cls);
}else{
cls = "";
}
if(node[className] != cls){ node[className] = cls; }
},
replace: function replaceClass(/*DomNode|String*/ node, /*String|Array*/ addClassStr, /*String|Array?*/ removeClassStr){
// summary:
// Replaces one or more classes on a node if not present.
// Operates more quickly than calling domClass.remove and domClass.add
//
// node: String|DOMNode
// String ID or DomNode reference to remove the class from.
//
// addClassStr: String|Array
// A String class name to add, or several space-separated class names,
// or an array of class names.
//
// removeClassStr: String|Array?
// A String class name to remove, or several space-separated class names,
// or an array of class names.
//
// example:
// | require(["dojo/dom-class"], function(domClass){
// | domClass.replace("someNode", "add1 add2", "remove1 remove2");
// | });
//
// example:
// Replace all classes with addMe
// | require(["dojo/dom-class"], function(domClass){
// | domClass.replace("someNode", "addMe");
// | });
//
// example:
// Available in `dojo/NodeList` for multiple toggles
// | require(["dojo/query"], function(query){
// | query(".findMe").replaceClass("addMe", "removeMe");
// | });
node = dom.byId(node);
fakeNode[className] = node[className];
cls.remove(fakeNode, removeClassStr);
cls.add(fakeNode, addClassStr);
if(node[className] !== fakeNode[className]){
node[className] = fakeNode[className];
}
},
toggle: function toggleClass(/*DomNode|String*/ node, /*String|Array*/ classStr, /*Boolean?*/ condition){
// summary:
// Adds a class to node if not present, or removes if present.
// Pass a boolean condition if you want to explicitly add or remove.
// Returns the condition that was specified directly or indirectly.
//
// node: String|DOMNode
// String ID or DomNode reference to toggle a class string
//
// classStr: String|Array
// A String class name to toggle, or several space-separated class names,
// or an array of class names.
//
// condition:
// If passed, true means to add the class, false means to remove.
// Otherwise domClass.contains(node, classStr) is used to detect the class presence.
//
// example:
// | require(["dojo/dom-class"], function(domClass){
// | domClass.toggle("someNode", "hovered");
// | });
//
// example:
// Forcefully add a class
// | require(["dojo/dom-class"], function(domClass){
// | domClass.toggle("someNode", "hovered", true);
// | });
//
// example:
// Available in `dojo/NodeList` for multiple toggles
// | require(["dojo/query"], function(query){
// | query(".toggleMe").toggleClass("toggleMe");
// | });
node = dom.byId(node);
if(condition === undefined){
classStr = str2array(classStr);
for(var i = 0, len = classStr.length, c; i < len; ++i){
c = classStr[i];
cls[cls.contains(node, c) ? "remove" : "add"](node, c);
}
}else{
cls[condition ? "add" : "remove"](node, classStr);
}
return condition; // Boolean
}
};
return cls;
});