API Docs for: 3.8.0
Show:

File: dom/js/selector-css2.js

  1. /**
  2.  * The selector module provides helper methods allowing CSS2 Selectors to be used with DOM elements.
  3.  * @module dom
  4.  * @submodule selector-css2
  5.  * @for Selector
  6.  */

  7. /*
  8.  * Provides helper methods for collecting and filtering DOM elements.
  9.  */

  10. var PARENT_NODE = 'parentNode',
  11.     TAG_NAME = 'tagName',
  12.     ATTRIBUTES = 'attributes',
  13.     COMBINATOR = 'combinator',
  14.     PSEUDOS = 'pseudos',

  15.     Selector = Y.Selector,

  16.     SelectorCSS2 = {
  17.         _reRegExpTokens: /([\^\$\?\[\]\*\+\-\.\(\)\|\\])/,
  18.         SORT_RESULTS: true,

  19.         // TODO: better detection, document specific
  20.         _isXML: (function() {
  21.             var isXML = (Y.config.doc.createElement('div').tagName !== 'DIV');
  22.             return isXML;
  23.         }()),

  24.         /**
  25.          * Mapping of shorthand tokens to corresponding attribute selector
  26.          * @property shorthand
  27.          * @type object
  28.          */
  29.         shorthand: {
  30.             '\\#(-?[_a-z0-9]+[-\\w\\uE000]*)': '[id=$1]',
  31.             '\\.(-?[_a-z]+[-\\w\\uE000]*)': '[className~=$1]'
  32.         },

  33.         /**
  34.          * List of operators and corresponding boolean functions.
  35.          * These functions are passed the attribute and the current node's value of the attribute.
  36.          * @property operators
  37.          * @type object
  38.          */
  39.         operators: {
  40.             '': function(node, attr) { return Y.DOM.getAttribute(node, attr) !== ''; }, // Just test for existence of attribute
  41.             '~=': '(?:^|\\s+){val}(?:\\s+|$)', // space-delimited
  42.             '|=': '^{val}-?' // optional hyphen-delimited
  43.         },

  44.         pseudos: {
  45.            'first-child': function(node) {
  46.                 return Y.DOM._children(node[PARENT_NODE])[0] === node;
  47.             }
  48.         },

  49.         _bruteQuery: function(selector, root, firstOnly) {
  50.             var ret = [],
  51.                 nodes = [],
  52.                 tokens = Selector._tokenize(selector),
  53.                 token = tokens[tokens.length - 1],
  54.                 rootDoc = Y.DOM._getDoc(root),
  55.                 child,
  56.                 id,
  57.                 className,
  58.                 tagName;

  59.             if (token) {
  60.                 // prefilter nodes
  61.                 id = token.id;
  62.                 className = token.className;
  63.                 tagName = token.tagName || '*';

  64.                 if (root.getElementsByTagName) { // non-IE lacks DOM api on doc frags
  65.                     // try ID first, unless no root.all && root not in document
  66.                     // (root.all works off document, but not getElementById)
  67.                     if (id && (root.all || (root.nodeType === 9 || Y.DOM.inDoc(root)))) {
  68.                         nodes = Y.DOM.allById(id, root);
  69.                     // try className
  70.                     } else if (className) {
  71.                         nodes = root.getElementsByClassName(className);
  72.                     } else { // default to tagName
  73.                         nodes = root.getElementsByTagName(tagName);
  74.                     }

  75.                 } else { // brute getElementsByTagName()
  76.                     child = root.firstChild;
  77.                     while (child) {
  78.                         // only collect HTMLElements
  79.                         // match tag to supplement missing getElementsByTagName
  80.                         if (child.tagName && (tagName === '*' || child.tagName === tagName)) {
  81.                             nodes.push(child);
  82.                         }
  83.                         child = child.nextSibling || child.firstChild;
  84.                     }
  85.                 }
  86.                 if (nodes.length) {
  87.                     ret = Selector._filterNodes(nodes, tokens, firstOnly);
  88.                 }
  89.             }

  90.             return ret;
  91.         },
  92.        
  93.         _filterNodes: function(nodes, tokens, firstOnly) {
  94.             var i = 0,
  95.                 j,
  96.                 len = tokens.length,
  97.                 n = len - 1,
  98.                 result = [],
  99.                 node = nodes[0],
  100.                 tmpNode = node,
  101.                 getters = Y.Selector.getters,
  102.                 operator,
  103.                 combinator,
  104.                 token,
  105.                 path,
  106.                 pass,
  107.                 value,
  108.                 tests,
  109.                 test;

  110.             for (i = 0; (tmpNode = node = nodes[i++]);) {
  111.                 n = len - 1;
  112.                 path = null;
  113.                
  114.                 testLoop:
  115.                 while (tmpNode && tmpNode.tagName) {
  116.                     token = tokens[n];
  117.                     tests = token.tests;
  118.                     j = tests.length;
  119.                     if (j && !pass) {
  120.                         while ((test = tests[--j])) {
  121.                             operator = test[1];
  122.                             if (getters[test[0]]) {
  123.                                 value = getters[test[0]](tmpNode, test[0]);
  124.                             } else {
  125.                                 value = tmpNode[test[0]];
  126.                                 if (test[0] === 'tagName' && !Selector._isXML) {
  127.                                     value = value.toUpperCase();    
  128.                                 }
  129.                                 if (typeof value != 'string' && value !== undefined && value.toString) {
  130.                                     value = value.toString(); // coerce for comparison
  131.                                 } else if (value === undefined && tmpNode.getAttribute) {
  132.                                     // use getAttribute for non-standard attributes
  133.                                     value = tmpNode.getAttribute(test[0], 2); // 2 === force string for IE
  134.                                 }
  135.                             }

  136.                             if ((operator === '=' && value !== test[2]) ||  // fast path for equality
  137.                                 (typeof operator !== 'string' && // protect against String.test monkey-patch (Moo)
  138.                                 operator.test && !operator.test(value)) ||  // regex test
  139.                                 (!operator.test && // protect against RegExp as function (webkit)
  140.                                         typeof operator === 'function' && !operator(tmpNode, test[0], test[2]))) { // function test

  141.                                 // skip non element nodes or non-matching tags
  142.                                 if ((tmpNode = tmpNode[path])) {
  143.                                     while (tmpNode &&
  144.                                         (!tmpNode.tagName ||
  145.                                             (token.tagName && token.tagName !== tmpNode.tagName))
  146.                                     ) {
  147.                                         tmpNode = tmpNode[path];
  148.                                     }
  149.                                 }
  150.                                 continue testLoop;
  151.                             }
  152.                         }
  153.                     }

  154.                     n--; // move to next token
  155.                     // now that we've passed the test, move up the tree by combinator
  156.                     if (!pass && (combinator = token.combinator)) {
  157.                         path = combinator.axis;
  158.                         tmpNode = tmpNode[path];

  159.                         // skip non element nodes
  160.                         while (tmpNode && !tmpNode.tagName) {
  161.                             tmpNode = tmpNode[path];
  162.                         }

  163.                         if (combinator.direct) { // one pass only
  164.                             path = null;
  165.                         }

  166.                     } else { // success if we made it this far
  167.                         result.push(node);
  168.                         if (firstOnly) {
  169.                             return result;
  170.                         }
  171.                         break;
  172.                     }
  173.                 }
  174.             }
  175.             node = tmpNode = null;
  176.             return result;
  177.         },

  178.         combinators: {
  179.             ' ': {
  180.                 axis: 'parentNode'
  181.             },

  182.             '>': {
  183.                 axis: 'parentNode',
  184.                 direct: true
  185.             },


  186.             '+': {
  187.                 axis: 'previousSibling',
  188.                 direct: true
  189.             }
  190.         },

  191.         _parsers: [
  192.             {
  193.                 name: ATTRIBUTES,
  194.                 re: /^\uE003(-?[a-z]+[\w\-]*)+([~\|\^\$\*!=]=?)?['"]?([^\uE004'"]*)['"]?\uE004/i,
  195.                 fn: function(match, token) {
  196.                     var operator = match[2] || '',
  197.                         operators = Selector.operators,
  198.                         escVal = (match[3]) ? match[3].replace(/\\/g, '') : '',
  199.                         test;

  200.                     // add prefiltering for ID and CLASS
  201.                     if ((match[1] === 'id' && operator === '=') ||
  202.                             (match[1] === 'className' &&
  203.                             Y.config.doc.documentElement.getElementsByClassName &&
  204.                             (operator === '~=' || operator === '='))) {
  205.                         token.prefilter = match[1];


  206.                         match[3] = escVal;

  207.                         // escape all but ID for prefilter, which may run through QSA (via Dom.allById)
  208.                         token[match[1]] = (match[1] === 'id') ? match[3] : escVal;

  209.                     }

  210.                     // add tests
  211.                     if (operator in operators) {
  212.                         test = operators[operator];
  213.                         if (typeof test === 'string') {
  214.                             match[3] = escVal.replace(Selector._reRegExpTokens, '\\$1');
  215.                             test = new RegExp(test.replace('{val}', match[3]));
  216.                         }
  217.                         match[2] = test;
  218.                     }
  219.                     if (!token.last || token.prefilter !== match[1]) {
  220.                         return match.slice(1);
  221.                     }
  222.                 }
  223.             },
  224.             {
  225.                 name: TAG_NAME,
  226.                 re: /^((?:-?[_a-z]+[\w-]*)|\*)/i,
  227.                 fn: function(match, token) {
  228.                     var tag = match[1];

  229.                     if (!Selector._isXML) {
  230.                         tag = tag.toUpperCase();
  231.                     }

  232.                     token.tagName = tag;

  233.                     if (tag !== '*' && (!token.last || token.prefilter)) {
  234.                         return [TAG_NAME, '=', tag];
  235.                     }
  236.                     if (!token.prefilter) {
  237.                         token.prefilter = 'tagName';
  238.                     }
  239.                 }
  240.             },
  241.             {
  242.                 name: COMBINATOR,
  243.                 re: /^\s*([>+~]|\s)\s*/,
  244.                 fn: function(match, token) {
  245.                 }
  246.             },
  247.             {
  248.                 name: PSEUDOS,
  249.                 re: /^:([\-\w]+)(?:\uE005['"]?([^\uE005]*)['"]?\uE006)*/i,
  250.                 fn: function(match, token) {
  251.                     var test = Selector[PSEUDOS][match[1]];
  252.                     if (test) { // reorder match array and unescape special chars for tests
  253.                         if (match[2]) {
  254.                             match[2] = match[2].replace(/\\/g, '');
  255.                         }
  256.                         return [match[2], test];
  257.                     } else { // selector token not supported (possibly missing CSS3 module)
  258.                         return false;
  259.                     }
  260.                 }
  261.             }
  262.             ],

  263.         _getToken: function(token) {
  264.             return {
  265.                 tagName: null,
  266.                 id: null,
  267.                 className: null,
  268.                 attributes: {},
  269.                 combinator: null,
  270.                 tests: []
  271.             };
  272.         },

  273.         /*
  274.             Break selector into token units per simple selector.
  275.             Combinator is attached to the previous token.
  276.          */
  277.         _tokenize: function(selector) {
  278.             selector = selector || '';
  279.             selector = Selector._parseSelector(Y.Lang.trim(selector));
  280.             var token = Selector._getToken(),     // one token per simple selector (left selector holds combinator)
  281.                 query = selector, // original query for debug report
  282.                 tokens = [],    // array of tokens
  283.                 found = false,  // whether or not any matches were found this pass
  284.                 match,         // the regex match
  285.                 test,
  286.                 i, parser;

  287.             /*
  288.                 Search for selector patterns, store, and strip them from the selector string
  289.                 until no patterns match (invalid selector) or we run out of chars.

  290.                 Multiple attributes and pseudos are allowed, in any order.
  291.                 for example:
  292.                     'form:first-child[type=button]:not(button)[lang|=en]'
  293.             */
  294.             outer:
  295.             do {
  296.                 found = false; // reset after full pass
  297.                 for (i = 0; (parser = Selector._parsers[i++]);) {
  298.                     if ( (match = parser.re.exec(selector)) ) { // note assignment
  299.                         if (parser.name !== COMBINATOR ) {
  300.                             token.selector = selector;
  301.                         }
  302.                         selector = selector.replace(match[0], ''); // strip current match from selector
  303.                         if (!selector.length) {
  304.                             token.last = true;
  305.                         }

  306.                         if (Selector._attrFilters[match[1]]) { // convert class to className, etc.
  307.                             match[1] = Selector._attrFilters[match[1]];
  308.                         }

  309.                         test = parser.fn(match, token);
  310.                         if (test === false) { // selector not supported
  311.                             found = false;
  312.                             break outer;
  313.                         } else if (test) {
  314.                             token.tests.push(test);
  315.                         }

  316.                         if (!selector.length || parser.name === COMBINATOR) {
  317.                             tokens.push(token);
  318.                             token = Selector._getToken(token);
  319.                             if (parser.name === COMBINATOR) {
  320.                                 token.combinator = Y.Selector.combinators[match[1]];
  321.                             }
  322.                         }
  323.                         found = true;
  324.                     }
  325.                 }
  326.             } while (found && selector.length);

  327.             if (!found || selector.length) { // not fully parsed
  328.                 Y.log('query: ' + query + ' contains unsupported token in: ' + selector, 'warn', 'Selector');
  329.                 tokens = [];
  330.             }
  331.             return tokens;
  332.         },

  333.         _replaceMarkers: function(selector) {
  334.             selector = selector.replace(/\[/g, '\uE003');
  335.             selector = selector.replace(/\]/g, '\uE004');

  336.             selector = selector.replace(/\(/g, '\uE005');
  337.             selector = selector.replace(/\)/g, '\uE006');
  338.             return selector;
  339.         },

  340.         _replaceShorthand: function(selector) {
  341.             var shorthand = Y.Selector.shorthand,
  342.                 re;

  343.             for (re in shorthand) {
  344.                 if (shorthand.hasOwnProperty(re)) {
  345.                     selector = selector.replace(new RegExp(re, 'gi'), shorthand[re]);
  346.                 }
  347.             }

  348.             return selector;
  349.         },

  350.         _parseSelector: function(selector) {
  351.             var replaced = Y.Selector._replaceSelector(selector),
  352.                 selector = replaced.selector;

  353.             // replace shorthand (".foo, #bar") after pseudos and attrs
  354.             // to avoid replacing unescaped chars
  355.             selector = Y.Selector._replaceShorthand(selector);

  356.             selector = Y.Selector._restore('attr', selector, replaced.attrs);
  357.             selector = Y.Selector._restore('pseudo', selector, replaced.pseudos);

  358.             // replace braces and parens before restoring escaped chars
  359.             // to avoid replacing ecaped markers
  360.             selector = Y.Selector._replaceMarkers(selector);
  361.             selector = Y.Selector._restore('esc', selector, replaced.esc);

  362.             return selector;
  363.         },

  364.         _attrFilters: {
  365.             'class': 'className',
  366.             'for': 'htmlFor'
  367.         },

  368.         getters: {
  369.             href: function(node, attr) {
  370.                 return Y.DOM.getAttribute(node, attr);
  371.             },

  372.             id: function(node, attr) {
  373.                 return Y.DOM.getId(node);
  374.             }
  375.         }
  376.     };

  377. Y.mix(Y.Selector, SelectorCSS2, true);
  378. Y.Selector.getters.src = Y.Selector.getters.rel = Y.Selector.getters.href;

  379. // IE wants class with native queries
  380. if (Y.Selector.useNative && Y.config.doc.querySelector) {
  381.     Y.Selector.shorthand['\\.(-?[_a-z]+[-\\w]*)'] = '[class~=$1]';
  382. }


  383.