1 | define(["./_base/kernel", "./has", "./dom", "./on", "./_base/array", "./_base/lang", "./selector/_loader", "./selector/_loader!default"], |
---|
2 | function(dojo, has, dom, on, array, lang, loader, defaultEngine){ |
---|
3 | |
---|
4 | "use strict"; |
---|
5 | |
---|
6 | has.add("array-extensible", function(){ |
---|
7 | // test to see if we can extend an array (not supported in old IE) |
---|
8 | return lang.delegate([], {length: 1}).length == 1 && !has("bug-for-in-skips-shadowed"); |
---|
9 | }); |
---|
10 | |
---|
11 | var ap = Array.prototype, aps = ap.slice, apc = ap.concat, forEach = array.forEach; |
---|
12 | |
---|
13 | var tnl = function(/*Array*/ a, /*dojo/NodeList?*/ parent, /*Function?*/ NodeListCtor){ |
---|
14 | // summary: |
---|
15 | // decorate an array to make it look like a `dojo/NodeList`. |
---|
16 | // a: |
---|
17 | // Array of nodes to decorate. |
---|
18 | // parent: |
---|
19 | // An optional parent NodeList that generated the current |
---|
20 | // list of nodes. Used to call _stash() so the parent NodeList |
---|
21 | // can be accessed via end() later. |
---|
22 | // NodeListCtor: |
---|
23 | // An optional constructor function to use for any |
---|
24 | // new NodeList calls. This allows a certain chain of |
---|
25 | // NodeList calls to use a different object than dojo/NodeList. |
---|
26 | var nodeList = new (NodeListCtor || this._NodeListCtor || nl)(a); |
---|
27 | return parent ? nodeList._stash(parent) : nodeList; |
---|
28 | }; |
---|
29 | |
---|
30 | var loopBody = function(f, a, o){ |
---|
31 | a = [0].concat(aps.call(a, 0)); |
---|
32 | o = o || dojo.global; |
---|
33 | return function(node){ |
---|
34 | a[0] = node; |
---|
35 | return f.apply(o, a); |
---|
36 | }; |
---|
37 | }; |
---|
38 | |
---|
39 | // adapters |
---|
40 | |
---|
41 | var adaptAsForEach = function(f, o){ |
---|
42 | // summary: |
---|
43 | // adapts a single node function to be used in the forEach-type |
---|
44 | // actions. The initial object is returned from the specialized |
---|
45 | // function. |
---|
46 | // f: Function |
---|
47 | // a function to adapt |
---|
48 | // o: Object? |
---|
49 | // an optional context for f |
---|
50 | return function(){ |
---|
51 | this.forEach(loopBody(f, arguments, o)); |
---|
52 | return this; // Object |
---|
53 | }; |
---|
54 | }; |
---|
55 | |
---|
56 | var adaptAsMap = function(f, o){ |
---|
57 | // summary: |
---|
58 | // adapts a single node function to be used in the map-type |
---|
59 | // actions. The return is a new array of values, as via `dojo/_base/array.map` |
---|
60 | // f: Function |
---|
61 | // a function to adapt |
---|
62 | // o: Object? |
---|
63 | // an optional context for f |
---|
64 | return function(){ |
---|
65 | return this.map(loopBody(f, arguments, o)); |
---|
66 | }; |
---|
67 | }; |
---|
68 | |
---|
69 | var adaptAsFilter = function(f, o){ |
---|
70 | // summary: |
---|
71 | // adapts a single node function to be used in the filter-type actions |
---|
72 | // f: Function |
---|
73 | // a function to adapt |
---|
74 | // o: Object? |
---|
75 | // an optional context for f |
---|
76 | return function(){ |
---|
77 | return this.filter(loopBody(f, arguments, o)); |
---|
78 | }; |
---|
79 | }; |
---|
80 | |
---|
81 | var adaptWithCondition = function(f, g, o){ |
---|
82 | // summary: |
---|
83 | // adapts a single node function to be used in the map-type |
---|
84 | // actions, behaves like forEach() or map() depending on arguments |
---|
85 | // f: Function |
---|
86 | // a function to adapt |
---|
87 | // g: Function |
---|
88 | // a condition function, if true runs as map(), otherwise runs as forEach() |
---|
89 | // o: Object? |
---|
90 | // an optional context for f and g |
---|
91 | return function(){ |
---|
92 | var a = arguments, body = loopBody(f, a, o); |
---|
93 | if(g.call(o || dojo.global, a)){ |
---|
94 | return this.map(body); // self |
---|
95 | } |
---|
96 | this.forEach(body); |
---|
97 | return this; // self |
---|
98 | }; |
---|
99 | }; |
---|
100 | |
---|
101 | var NodeList = function(array){ |
---|
102 | // summary: |
---|
103 | // Array-like object which adds syntactic |
---|
104 | // sugar for chaining, common iteration operations, animation, and |
---|
105 | // node manipulation. NodeLists are most often returned as the |
---|
106 | // result of dojo/query() calls. |
---|
107 | // description: |
---|
108 | // NodeList instances provide many utilities that reflect |
---|
109 | // core Dojo APIs for Array iteration and manipulation, DOM |
---|
110 | // manipulation, and event handling. Instead of needing to dig up |
---|
111 | // functions in the dojo package, NodeLists generally make the |
---|
112 | // full power of Dojo available for DOM manipulation tasks in a |
---|
113 | // simple, chainable way. |
---|
114 | // example: |
---|
115 | // create a node list from a node |
---|
116 | // | require(["dojo/query", "dojo/dom" |
---|
117 | // | ], function(query, dom){ |
---|
118 | // | query.NodeList(dom.byId("foo")); |
---|
119 | // | }); |
---|
120 | // example: |
---|
121 | // get a NodeList from a CSS query and iterate on it |
---|
122 | // | require(["dojo/on", "dojo/dom" |
---|
123 | // | ], function(on, dom){ |
---|
124 | // | var l = query(".thinger"); |
---|
125 | // | l.forEach(function(node, index, nodeList){ |
---|
126 | // | console.log(index, node.innerHTML); |
---|
127 | // | }); |
---|
128 | // | }); |
---|
129 | // example: |
---|
130 | // use native and Dojo-provided array methods to manipulate a |
---|
131 | // NodeList without needing to use dojo.* functions explicitly: |
---|
132 | // | require(["dojo/query", "dojo/dom-construct", "dojo/dom" |
---|
133 | // | ], function(query, domConstruct, dom){ |
---|
134 | // | var l = query(".thinger"); |
---|
135 | // | // since NodeLists are real arrays, they have a length |
---|
136 | // | // property that is both readable and writable and |
---|
137 | // | // push/pop/shift/unshift methods |
---|
138 | // | console.log(l.length); |
---|
139 | // | l.push(domConstruct.create("span")); |
---|
140 | // | |
---|
141 | // | // dojo's normalized array methods work too: |
---|
142 | // | console.log( l.indexOf(dom.byId("foo")) ); |
---|
143 | // | // ...including the special "function as string" shorthand |
---|
144 | // | console.log( l.every("item.nodeType == 1") ); |
---|
145 | // | |
---|
146 | // | // NodeLists can be [..] indexed, or you can use the at() |
---|
147 | // | // function to get specific items wrapped in a new NodeList: |
---|
148 | // | var node = l[3]; // the 4th element |
---|
149 | // | var newList = l.at(1, 3); // the 2nd and 4th elements |
---|
150 | // | }); |
---|
151 | // example: |
---|
152 | // chainability is a key advantage of NodeLists: |
---|
153 | // | require(["dojo/query", "dojo/NodeList-dom" |
---|
154 | // | ], function(query){ |
---|
155 | // | query(".thinger") |
---|
156 | // | .onclick(function(e){ /* ... */ }) |
---|
157 | // | .at(1, 3, 8) // get a subset |
---|
158 | // | .style("padding", "5px") |
---|
159 | // | .forEach(console.log); |
---|
160 | // | }); |
---|
161 | |
---|
162 | var isNew = this instanceof nl && has("array-extensible"); |
---|
163 | if(typeof array == "number"){ |
---|
164 | array = Array(array); |
---|
165 | } |
---|
166 | var nodeArray = (array && "length" in array) ? array : arguments; |
---|
167 | if(isNew || !nodeArray.sort){ |
---|
168 | // make sure it's a real array before we pass it on to be wrapped |
---|
169 | var target = isNew ? this : [], |
---|
170 | l = target.length = nodeArray.length; |
---|
171 | for(var i = 0; i < l; i++){ |
---|
172 | target[i] = nodeArray[i]; |
---|
173 | } |
---|
174 | if(isNew){ |
---|
175 | // called with new operator, this means we are going to use this instance and push |
---|
176 | // the nodes on to it. This is usually much faster since the NodeList properties |
---|
177 | // don't need to be copied (unless the list of nodes is extremely large). |
---|
178 | return target; |
---|
179 | } |
---|
180 | nodeArray = target; |
---|
181 | } |
---|
182 | // called without new operator, use a real array and copy prototype properties, |
---|
183 | // this is slower and exists for back-compat. Should be removed in 2.0. |
---|
184 | lang._mixin(nodeArray, nlp); |
---|
185 | nodeArray._NodeListCtor = function(array){ |
---|
186 | // call without new operator to preserve back-compat behavior |
---|
187 | return nl(array); |
---|
188 | }; |
---|
189 | return nodeArray; |
---|
190 | }; |
---|
191 | |
---|
192 | var nl = NodeList, nlp = nl.prototype = |
---|
193 | has("array-extensible") ? [] : {};// extend an array if it is extensible |
---|
194 | |
---|
195 | // expose adapters and the wrapper as private functions |
---|
196 | |
---|
197 | nl._wrap = nlp._wrap = tnl; |
---|
198 | nl._adaptAsMap = adaptAsMap; |
---|
199 | nl._adaptAsForEach = adaptAsForEach; |
---|
200 | nl._adaptAsFilter = adaptAsFilter; |
---|
201 | nl._adaptWithCondition = adaptWithCondition; |
---|
202 | |
---|
203 | // mass assignment |
---|
204 | |
---|
205 | // add array redirectors |
---|
206 | forEach(["slice", "splice"], function(name){ |
---|
207 | var f = ap[name]; |
---|
208 | //Use a copy of the this array via this.slice() to allow .end() to work right in the splice case. |
---|
209 | // CANNOT apply ._stash()/end() to splice since it currently modifies |
---|
210 | // the existing this array -- it would break backward compatibility if we copy the array before |
---|
211 | // the splice so that we can use .end(). So only doing the stash option to this._wrap for slice. |
---|
212 | nlp[name] = function(){ return this._wrap(f.apply(this, arguments), name == "slice" ? this : null); }; |
---|
213 | }); |
---|
214 | // concat should be here but some browsers with native NodeList have problems with it |
---|
215 | |
---|
216 | // add array.js redirectors |
---|
217 | forEach(["indexOf", "lastIndexOf", "every", "some"], function(name){ |
---|
218 | var f = array[name]; |
---|
219 | nlp[name] = function(){ return f.apply(dojo, [this].concat(aps.call(arguments, 0))); }; |
---|
220 | }); |
---|
221 | |
---|
222 | lang.extend(NodeList, { |
---|
223 | // copy the constructors |
---|
224 | constructor: nl, |
---|
225 | _NodeListCtor: nl, |
---|
226 | toString: function(){ |
---|
227 | // Array.prototype.toString can't be applied to objects, so we use join |
---|
228 | return this.join(","); |
---|
229 | }, |
---|
230 | _stash: function(parent){ |
---|
231 | // summary: |
---|
232 | // private function to hold to a parent NodeList. end() to return the parent NodeList. |
---|
233 | // |
---|
234 | // example: |
---|
235 | // How to make a `dojo/NodeList` method that only returns the third node in |
---|
236 | // the dojo/NodeList but allows access to the original NodeList by using this._stash: |
---|
237 | // | require(["dojo/query", "dojo/_base/lang", "dojo/NodeList", "dojo/NodeList-dom" |
---|
238 | // | ], function(query, lang){ |
---|
239 | // | lang.extend(NodeList, { |
---|
240 | // | third: function(){ |
---|
241 | // | var newNodeList = NodeList(this[2]); |
---|
242 | // | return newNodeList._stash(this); |
---|
243 | // | } |
---|
244 | // | }); |
---|
245 | // | // then see how _stash applies a sub-list, to be .end()'ed out of |
---|
246 | // | query(".foo") |
---|
247 | // | .third() |
---|
248 | // | .addClass("thirdFoo") |
---|
249 | // | .end() |
---|
250 | // | // access to the orig .foo list |
---|
251 | // | .removeClass("foo") |
---|
252 | // | }); |
---|
253 | // |
---|
254 | this._parent = parent; |
---|
255 | return this; // dojo/NodeList |
---|
256 | }, |
---|
257 | |
---|
258 | on: function(eventName, listener){ |
---|
259 | // summary: |
---|
260 | // Listen for events on the nodes in the NodeList. Basic usage is: |
---|
261 | // |
---|
262 | // example: |
---|
263 | // | require(["dojo/query" |
---|
264 | // | ], function(query){ |
---|
265 | // | query(".my-class").on("click", listener); |
---|
266 | // This supports event delegation by using selectors as the first argument with the event names as |
---|
267 | // pseudo selectors. For example: |
---|
268 | // | query("#my-list").on("li:click", listener); |
---|
269 | // This will listen for click events within `<li>` elements that are inside the `#my-list` element. |
---|
270 | // Because on supports CSS selector syntax, we can use comma-delimited events as well: |
---|
271 | // | query("#my-list").on("li button:mouseover, li:click", listener); |
---|
272 | // | }); |
---|
273 | var handles = this.map(function(node){ |
---|
274 | return on(node, eventName, listener); // TODO: apply to the NodeList so the same selector engine is used for matches |
---|
275 | }); |
---|
276 | handles.remove = function(){ |
---|
277 | for(var i = 0; i < handles.length; i++){ |
---|
278 | handles[i].remove(); |
---|
279 | } |
---|
280 | }; |
---|
281 | return handles; |
---|
282 | }, |
---|
283 | |
---|
284 | end: function(){ |
---|
285 | // summary: |
---|
286 | // Ends use of the current `NodeList` by returning the previous NodeList |
---|
287 | // that generated the current NodeList. |
---|
288 | // description: |
---|
289 | // Returns the `NodeList` that generated the current `NodeList`. If there |
---|
290 | // is no parent NodeList, an empty NodeList is returned. |
---|
291 | // example: |
---|
292 | // | require(["dojo/query", "dojo/NodeList-dom" |
---|
293 | // | ], function(query){ |
---|
294 | // | query("a") |
---|
295 | // | .filter(".disabled") |
---|
296 | // | // operate on the anchors that only have a disabled class |
---|
297 | // | .style("color", "grey") |
---|
298 | // | .end() |
---|
299 | // | // jump back to the list of anchors |
---|
300 | // | .style(...) |
---|
301 | // | }); |
---|
302 | // |
---|
303 | if(this._parent){ |
---|
304 | return this._parent; |
---|
305 | }else{ |
---|
306 | //Just return empty list. |
---|
307 | return new this._NodeListCtor(0); |
---|
308 | } |
---|
309 | }, |
---|
310 | |
---|
311 | // http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Reference:Global_Objects:Array#Methods |
---|
312 | |
---|
313 | // FIXME: handle return values for #3244 |
---|
314 | // http://trac.dojotoolkit.org/ticket/3244 |
---|
315 | |
---|
316 | // FIXME: |
---|
317 | // need to wrap or implement: |
---|
318 | // join (perhaps w/ innerHTML/outerHTML overload for toString() of items?) |
---|
319 | // reduce |
---|
320 | // reduceRight |
---|
321 | |
---|
322 | /*===== |
---|
323 | slice: function(begin, end){ |
---|
324 | // summary: |
---|
325 | // Returns a new NodeList, maintaining this one in place |
---|
326 | // description: |
---|
327 | // This method behaves exactly like the Array.slice method |
---|
328 | // with the caveat that it returns a `dojo/NodeList` and not a |
---|
329 | // raw Array. For more details, see Mozilla's [slice |
---|
330 | // documentation](https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array/slice) |
---|
331 | // begin: Integer |
---|
332 | // Can be a positive or negative integer, with positive |
---|
333 | // integers noting the offset to begin at, and negative |
---|
334 | // integers denoting an offset from the end (i.e., to the left |
---|
335 | // of the end) |
---|
336 | // end: Integer? |
---|
337 | // Optional parameter to describe what position relative to |
---|
338 | // the NodeList's zero index to end the slice at. Like begin, |
---|
339 | // can be positive or negative. |
---|
340 | return this._wrap(a.slice.apply(this, arguments)); |
---|
341 | }, |
---|
342 | |
---|
343 | splice: function(index, howmany, item){ |
---|
344 | // summary: |
---|
345 | // Returns a new NodeList, manipulating this NodeList based on |
---|
346 | // the arguments passed, potentially splicing in new elements |
---|
347 | // at an offset, optionally deleting elements |
---|
348 | // description: |
---|
349 | // This method behaves exactly like the Array.splice method |
---|
350 | // with the caveat that it returns a `dojo/NodeList` and not a |
---|
351 | // raw Array. For more details, see Mozilla's [splice |
---|
352 | // documentation](https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array/splice) |
---|
353 | // For backwards compatibility, calling .end() on the spliced NodeList |
---|
354 | // does not return the original NodeList -- splice alters the NodeList in place. |
---|
355 | // index: Integer |
---|
356 | // begin can be a positive or negative integer, with positive |
---|
357 | // integers noting the offset to begin at, and negative |
---|
358 | // integers denoting an offset from the end (i.e., to the left |
---|
359 | // of the end) |
---|
360 | // howmany: Integer? |
---|
361 | // Optional parameter to describe what position relative to |
---|
362 | // the NodeList's zero index to end the slice at. Like begin, |
---|
363 | // can be positive or negative. |
---|
364 | // item: Object...? |
---|
365 | // Any number of optional parameters may be passed in to be |
---|
366 | // spliced into the NodeList |
---|
367 | return this._wrap(a.splice.apply(this, arguments)); // dojo/NodeList |
---|
368 | }, |
---|
369 | |
---|
370 | indexOf: function(value, fromIndex){ |
---|
371 | // summary: |
---|
372 | // see `dojo/_base/array.indexOf()`. The primary difference is that the acted-on |
---|
373 | // array is implicitly this NodeList |
---|
374 | // value: Object |
---|
375 | // The value to search for. |
---|
376 | // fromIndex: Integer? |
---|
377 | // The location to start searching from. Optional. Defaults to 0. |
---|
378 | // description: |
---|
379 | // For more details on the behavior of indexOf, see Mozilla's |
---|
380 | // [indexOf |
---|
381 | // docs](https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array/indexOf) |
---|
382 | // returns: |
---|
383 | // Positive Integer or 0 for a match, -1 of not found. |
---|
384 | return d.indexOf(this, value, fromIndex); // Integer |
---|
385 | }, |
---|
386 | |
---|
387 | lastIndexOf: function(value, fromIndex){ |
---|
388 | // summary: |
---|
389 | // see `dojo/_base/array.lastIndexOf()`. The primary difference is that the |
---|
390 | // acted-on array is implicitly this NodeList |
---|
391 | // description: |
---|
392 | // For more details on the behavior of lastIndexOf, see |
---|
393 | // Mozilla's [lastIndexOf |
---|
394 | // docs](https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array/lastIndexOf) |
---|
395 | // value: Object |
---|
396 | // The value to search for. |
---|
397 | // fromIndex: Integer? |
---|
398 | // The location to start searching from. Optional. Defaults to 0. |
---|
399 | // returns: |
---|
400 | // Positive Integer or 0 for a match, -1 of not found. |
---|
401 | return d.lastIndexOf(this, value, fromIndex); // Integer |
---|
402 | }, |
---|
403 | |
---|
404 | every: function(callback, thisObject){ |
---|
405 | // summary: |
---|
406 | // see `dojo/_base/array.every()` and the [Array.every |
---|
407 | // docs](https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array/every). |
---|
408 | // Takes the same structure of arguments and returns as |
---|
409 | // dojo/_base/array.every() with the caveat that the passed array is |
---|
410 | // implicitly this NodeList |
---|
411 | // callback: Function |
---|
412 | // the callback |
---|
413 | // thisObject: Object? |
---|
414 | // the context |
---|
415 | return d.every(this, callback, thisObject); // Boolean |
---|
416 | }, |
---|
417 | |
---|
418 | some: function(callback, thisObject){ |
---|
419 | // summary: |
---|
420 | // Takes the same structure of arguments and returns as |
---|
421 | // `dojo/_base/array.some()` with the caveat that the passed array is |
---|
422 | // implicitly this NodeList. See `dojo/_base/array.some()` and Mozilla's |
---|
423 | // [Array.some |
---|
424 | // documentation](https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array/some). |
---|
425 | // callback: Function |
---|
426 | // the callback |
---|
427 | // thisObject: Object? |
---|
428 | // the context |
---|
429 | return d.some(this, callback, thisObject); // Boolean |
---|
430 | }, |
---|
431 | =====*/ |
---|
432 | |
---|
433 | concat: function(item){ |
---|
434 | // summary: |
---|
435 | // Returns a new NodeList comprised of items in this NodeList |
---|
436 | // as well as items passed in as parameters |
---|
437 | // description: |
---|
438 | // This method behaves exactly like the Array.concat method |
---|
439 | // with the caveat that it returns a `NodeList` and not a |
---|
440 | // raw Array. For more details, see the [Array.concat |
---|
441 | // docs](https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array/concat) |
---|
442 | // item: Object? |
---|
443 | // Any number of optional parameters may be passed in to be |
---|
444 | // spliced into the NodeList |
---|
445 | |
---|
446 | //return this._wrap(apc.apply(this, arguments)); |
---|
447 | // the line above won't work for the native NodeList, or for Dojo NodeLists either :-( |
---|
448 | |
---|
449 | // implementation notes: |
---|
450 | // Array.concat() doesn't recognize native NodeLists or Dojo NodeLists |
---|
451 | // as arrays, and so does not inline them into a unioned array, but |
---|
452 | // appends them as single entities. Both the original NodeList and the |
---|
453 | // items passed in as parameters must be converted to raw Arrays |
---|
454 | // and then the concatenation result may be re-_wrap()ed as a Dojo NodeList. |
---|
455 | |
---|
456 | var t = aps.call(this, 0), |
---|
457 | m = array.map(arguments, function(a){ |
---|
458 | return aps.call(a, 0); |
---|
459 | }); |
---|
460 | return this._wrap(apc.apply(t, m), this); // dojo/NodeList |
---|
461 | }, |
---|
462 | |
---|
463 | map: function(/*Function*/ func, /*Function?*/ obj){ |
---|
464 | // summary: |
---|
465 | // see `dojo/_base/array.map()`. The primary difference is that the acted-on |
---|
466 | // array is implicitly this NodeList and the return is a |
---|
467 | // NodeList (a subclass of Array) |
---|
468 | return this._wrap(array.map(this, func, obj), this); // dojo/NodeList |
---|
469 | }, |
---|
470 | |
---|
471 | forEach: function(callback, thisObj){ |
---|
472 | // summary: |
---|
473 | // see `dojo/_base/array.forEach()`. The primary difference is that the acted-on |
---|
474 | // array is implicitly this NodeList. If you want the option to break out |
---|
475 | // of the forEach loop, use every() or some() instead. |
---|
476 | forEach(this, callback, thisObj); |
---|
477 | // non-standard return to allow easier chaining |
---|
478 | return this; // dojo/NodeList |
---|
479 | }, |
---|
480 | filter: function(/*String|Function*/ filter){ |
---|
481 | // summary: |
---|
482 | // "masks" the built-in javascript filter() method (supported |
---|
483 | // in Dojo via `dojo/_base/array.filter`) to support passing a simple |
---|
484 | // string filter in addition to supporting filtering function |
---|
485 | // objects. |
---|
486 | // filter: |
---|
487 | // If a string, a CSS rule like ".thinger" or "div > span". |
---|
488 | // example: |
---|
489 | // "regular" JS filter syntax as exposed in `dojo/_base/array.filter`: |
---|
490 | // | require(["dojo/query", "dojo/NodeList-dom" |
---|
491 | // | ], function(query){ |
---|
492 | // | query("*").filter(function(item){ |
---|
493 | // | // highlight every paragraph |
---|
494 | // | return (item.nodeName == "p"); |
---|
495 | // | }).style("backgroundColor", "yellow"); |
---|
496 | // | }); |
---|
497 | // example: |
---|
498 | // the same filtering using a CSS selector |
---|
499 | // | require(["dojo/query", "dojo/NodeList-dom" |
---|
500 | // | ], function(query){ |
---|
501 | // | query("*").filter("p").styles("backgroundColor", "yellow"); |
---|
502 | // | }); |
---|
503 | |
---|
504 | var a = arguments, items = this, start = 0; |
---|
505 | if(typeof filter == "string"){ // inline'd type check |
---|
506 | items = query._filterResult(this, a[0]); |
---|
507 | if(a.length == 1){ |
---|
508 | // if we only got a string query, pass back the filtered results |
---|
509 | return items._stash(this); // dojo/NodeList |
---|
510 | } |
---|
511 | // if we got a callback, run it over the filtered items |
---|
512 | start = 1; |
---|
513 | } |
---|
514 | return this._wrap(array.filter(items, a[start], a[start + 1]), this); // dojo/NodeList |
---|
515 | }, |
---|
516 | instantiate: function(/*String|Object*/ declaredClass, /*Object?*/ properties){ |
---|
517 | // summary: |
---|
518 | // Create a new instance of a specified class, using the |
---|
519 | // specified properties and each node in the NodeList as a |
---|
520 | // srcNodeRef. |
---|
521 | // example: |
---|
522 | // Grabs all buttons in the page and converts them to dijit/form/Button's. |
---|
523 | // | var buttons = query("button").instantiate(Button, {showLabel: true}); |
---|
524 | var c = lang.isFunction(declaredClass) ? declaredClass : lang.getObject(declaredClass); |
---|
525 | properties = properties || {}; |
---|
526 | return this.forEach(function(node){ |
---|
527 | new c(properties, node); |
---|
528 | }); // dojo/NodeList |
---|
529 | }, |
---|
530 | at: function(/*===== index =====*/){ |
---|
531 | // summary: |
---|
532 | // Returns a new NodeList comprised of items in this NodeList |
---|
533 | // at the given index or indices. |
---|
534 | // |
---|
535 | // index: Integer... |
---|
536 | // One or more 0-based indices of items in the current |
---|
537 | // NodeList. A negative index will start at the end of the |
---|
538 | // list and go backwards. |
---|
539 | // |
---|
540 | // example: |
---|
541 | // Shorten the list to the first, second, and third elements |
---|
542 | // | require(["dojo/query" |
---|
543 | // | ], function(query){ |
---|
544 | // | query("a").at(0, 1, 2).forEach(fn); |
---|
545 | // | }); |
---|
546 | // |
---|
547 | // example: |
---|
548 | // Retrieve the first and last elements of a unordered list: |
---|
549 | // | require(["dojo/query" |
---|
550 | // | ], function(query){ |
---|
551 | // | query("ul > li").at(0, -1).forEach(cb); |
---|
552 | // | }); |
---|
553 | // |
---|
554 | // example: |
---|
555 | // Do something for the first element only, but end() out back to |
---|
556 | // the original list and continue chaining: |
---|
557 | // | require(["dojo/query" |
---|
558 | // | ], function(query){ |
---|
559 | // | query("a").at(0).onclick(fn).end().forEach(function(n){ |
---|
560 | // | console.log(n); // all anchors on the page. |
---|
561 | // | }) |
---|
562 | // | }); |
---|
563 | |
---|
564 | var t = new this._NodeListCtor(0); |
---|
565 | forEach(arguments, function(i){ |
---|
566 | if(i < 0){ i = this.length + i; } |
---|
567 | if(this[i]){ t.push(this[i]); } |
---|
568 | }, this); |
---|
569 | return t._stash(this); // dojo/NodeList |
---|
570 | } |
---|
571 | }); |
---|
572 | |
---|
573 | function queryForEngine(engine, NodeList){ |
---|
574 | var query = function(/*String*/ query, /*String|DOMNode?*/ root){ |
---|
575 | // summary: |
---|
576 | // Returns nodes which match the given CSS selector, searching the |
---|
577 | // entire document by default but optionally taking a node to scope |
---|
578 | // the search by. Returns an instance of NodeList. |
---|
579 | if(typeof root == "string"){ |
---|
580 | root = dom.byId(root); |
---|
581 | if(!root){ |
---|
582 | return new NodeList([]); |
---|
583 | } |
---|
584 | } |
---|
585 | var results = typeof query == "string" ? engine(query, root) : query ? (query.end && query.on) ? query : [query] : []; |
---|
586 | if(results.end && results.on){ |
---|
587 | // already wrapped |
---|
588 | return results; |
---|
589 | } |
---|
590 | return new NodeList(results); |
---|
591 | }; |
---|
592 | query.matches = engine.match || function(node, selector, root){ |
---|
593 | // summary: |
---|
594 | // Test to see if a node matches a selector |
---|
595 | return query.filter([node], selector, root).length > 0; |
---|
596 | }; |
---|
597 | // the engine provides a filtering function, use it to for matching |
---|
598 | query.filter = engine.filter || function(nodes, selector, root){ |
---|
599 | // summary: |
---|
600 | // Filters an array of nodes. Note that this does not guarantee to return a NodeList, just an array. |
---|
601 | return query(selector, root).filter(function(node){ |
---|
602 | return array.indexOf(nodes, node) > -1; |
---|
603 | }); |
---|
604 | }; |
---|
605 | if(typeof engine != "function"){ |
---|
606 | var search = engine.search; |
---|
607 | engine = function(selector, root){ |
---|
608 | // Slick does it backwards (or everyone else does it backwards, probably the latter) |
---|
609 | return search(root || document, selector); |
---|
610 | }; |
---|
611 | } |
---|
612 | return query; |
---|
613 | } |
---|
614 | var query = queryForEngine(defaultEngine, NodeList); |
---|
615 | /*===== |
---|
616 | query = function(selector, context){ |
---|
617 | // summary: |
---|
618 | // This modules provides DOM querying functionality. The module export is a function |
---|
619 | // that can be used to query for DOM nodes by CSS selector and returns a NodeList |
---|
620 | // representing the matching nodes. |
---|
621 | // selector: String |
---|
622 | // A CSS selector to search for. |
---|
623 | // context: String|DomNode? |
---|
624 | // An optional context to limit the searching scope. Only nodes under `context` will be |
---|
625 | // scanned. |
---|
626 | // example: |
---|
627 | // add an onclick handler to every submit button in the document |
---|
628 | // which causes the form to be sent via Ajax instead: |
---|
629 | // | require(["dojo/query", "dojo/request", "dojo/dom-form", "dojo/dom-construct", "dojo/dom-style" |
---|
630 | // | ], function(query, request, domForm, domConstruct, domStyle){ |
---|
631 | // | query("input[type='submit']").on("click", function(e){ |
---|
632 | // | e.preventDefault(); // prevent sending the form |
---|
633 | // | var btn = e.target; |
---|
634 | // | request.post("http://example.com/", { |
---|
635 | // | data: domForm.toObject(btn.form) |
---|
636 | // | }).then(function(response){ |
---|
637 | // | // replace the form with the response |
---|
638 | // | domConstruct.create(div, {innerHTML: response}, btn.form, "after"); |
---|
639 | // | domStyle.set(btn.form, "display", "none"); |
---|
640 | // | }); |
---|
641 | // | }); |
---|
642 | // | }); |
---|
643 | // |
---|
644 | // description: |
---|
645 | // dojo/query is responsible for loading the appropriate query engine and wrapping |
---|
646 | // its results with a `NodeList`. You can use dojo/query with a specific selector engine |
---|
647 | // by using it as a plugin. For example, if you installed the sizzle package, you could |
---|
648 | // use it as the selector engine with: |
---|
649 | // | require(["dojo/query!sizzle"], function(query){ |
---|
650 | // | query("div")... |
---|
651 | // |
---|
652 | // The id after the ! can be a module id of the selector engine or one of the following values: |
---|
653 | // |
---|
654 | // - acme: This is the default engine used by Dojo base, and will ensure that the full |
---|
655 | // Acme engine is always loaded. |
---|
656 | // |
---|
657 | // - css2: If the browser has a native selector engine, this will be used, otherwise a |
---|
658 | // very minimal lightweight selector engine will be loaded that can do simple CSS2 selectors |
---|
659 | // (by #id, .class, tag, and [name=value] attributes, with standard child or descendant (>) |
---|
660 | // operators) and nothing more. |
---|
661 | // |
---|
662 | // - css2.1: If the browser has a native selector engine, this will be used, otherwise the |
---|
663 | // full Acme engine will be loaded. |
---|
664 | // |
---|
665 | // - css3: If the browser has a native selector engine with support for CSS3 pseudo |
---|
666 | // selectors (most modern browsers except IE8), this will be used, otherwise the |
---|
667 | // full Acme engine will be loaded. |
---|
668 | // |
---|
669 | // - Or the module id of a selector engine can be used to explicitly choose the selector engine |
---|
670 | // |
---|
671 | // For example, if you are using CSS3 pseudo selectors in module, you can specify that |
---|
672 | // you will need support them with: |
---|
673 | // | require(["dojo/query!css3"], function(query){ |
---|
674 | // | query('#t > h3:nth-child(odd)')... |
---|
675 | // |
---|
676 | // You can also choose the selector engine/load configuration by setting the query-selector: |
---|
677 | // For example: |
---|
678 | // | <script data-dojo-config="query-selector:'css3'" src="dojo.js"></script> |
---|
679 | // |
---|
680 | return new NodeList(); // dojo/NodeList |
---|
681 | }; |
---|
682 | =====*/ |
---|
683 | |
---|
684 | // the query that is returned from this module is slightly different than dojo.query, |
---|
685 | // because dojo.query has to maintain backwards compatibility with returning a |
---|
686 | // true array which has performance problems. The query returned from the module |
---|
687 | // does not use true arrays, but rather inherits from Array, making it much faster to |
---|
688 | // instantiate. |
---|
689 | dojo.query = queryForEngine(defaultEngine, function(array){ |
---|
690 | // call it without the new operator to invoke the back-compat behavior that returns a true array |
---|
691 | return NodeList(array); // dojo/NodeList |
---|
692 | }); |
---|
693 | |
---|
694 | query.load = function(id, parentRequire, loaded){ |
---|
695 | // summary: |
---|
696 | // can be used as AMD plugin to conditionally load new query engine |
---|
697 | // example: |
---|
698 | // | require(["dojo/query!custom"], function(qsa){ |
---|
699 | // | // loaded selector/custom.js as engine |
---|
700 | // | qsa("#foobar").forEach(...); |
---|
701 | // | }); |
---|
702 | loader.load(id, parentRequire, function(engine){ |
---|
703 | loaded(queryForEngine(engine, NodeList)); |
---|
704 | }); |
---|
705 | }; |
---|
706 | |
---|
707 | dojo._filterQueryResult = query._filterResult = function(nodes, selector, root){ |
---|
708 | return new NodeList(query.filter(nodes, selector, root)); |
---|
709 | }; |
---|
710 | dojo.NodeList = query.NodeList = NodeList; |
---|
711 | return query; |
---|
712 | }); |
---|