Index: openacs-4/packages/ajaxhelper/www/resources/yui/dom/dom.js =================================================================== RCS file: /usr/local/cvsroot/openacs-4/packages/ajaxhelper/www/resources/yui/dom/dom.js,v diff -u -r1.3 -r1.4 --- openacs-4/packages/ajaxhelper/www/resources/yui/dom/dom.js 8 Sep 2007 14:22:03 -0000 1.3 +++ openacs-4/packages/ajaxhelper/www/resources/yui/dom/dom.js 9 Apr 2009 17:03:50 -0000 1.4 @@ -1,8 +1,8 @@ /* -Copyright (c) 2007, Yahoo! Inc. All rights reserved. +Copyright (c) 2009, Yahoo! Inc. All rights reserved. Code licensed under the BSD License: http://developer.yahoo.net/yui/license.txt -version: 2.3.0 +version: 2.7.0 */ /** * The dom module provides helper methods for manipulating Dom elements. @@ -11,162 +11,135 @@ */ (function() { - var Y = YAHOO.util, // internal shorthand - getStyle, // for load time browser branching - setStyle, // ditto - id_counter = 0, // for use with generateId + YAHOO.env._id_counter = YAHOO.env._id_counter || 0; // for use with generateId (global to save state if Dom is overwritten) + + // internal shorthand + var Y = YAHOO.util, + lang = YAHOO.lang, + UA = YAHOO.env.ua, + trim = YAHOO.lang.trim, propertyCache = {}, // for faster hyphen converts - reClassNameCache = {}; // cache regexes for className - - // brower detection - var isOpera = YAHOO.env.ua.opera, - isSafari = YAHOO.env.ua.webkit, - isGecko = YAHOO.env.ua.gecko, - isIE = YAHOO.env.ua.ie; - - // regex cache - var patterns = { - HYPHEN: /(-[a-z])/i, // to normalize get/setStyle - ROOT_TAG: /^body|html$/i // body for quirks mode, html for standards - }; + reCache = {}, // cache className regexes + RE_TABLE = /^t(?:able|d|h)$/i, // for _calcBorders + RE_COLOR = /color$/i, - var toCamel = function(property) { - if ( !patterns.HYPHEN.test(property) ) { - return property; // no hyphens - } - - if (propertyCache[property]) { // already converted - return propertyCache[property]; - } - - var converted = property; - - while( patterns.HYPHEN.exec(converted) ) { - converted = converted.replace(RegExp.$1, - RegExp.$1.substr(1).toUpperCase()); - } - - propertyCache[property] = converted; - return converted; - //return property.replace(/-([a-z])/gi, function(m0, m1) {return m1.toUpperCase()}) // cant use function as 2nd arg yet due to safari bug - }; - - var getClassRegEx = function(className) { - var re = reClassNameCache[className]; - if (!re) { - re = new RegExp('(?:^|\\s+)' + className + '(?:\\s+|$)'); - reClassNameCache[className] = re; - } - return re; - }; + // DOM aliases + document = window.document, + documentElement = document.documentElement, - // branching at load instead of runtime - if (document.defaultView && document.defaultView.getComputedStyle) { // W3C DOM method - getStyle = function(el, property) { - var value = null; - - if (property == 'float') { // fix reserved word - property = 'cssFloat'; - } - - var computed = document.defaultView.getComputedStyle(el, ''); - if (computed) { // test computed before touching for safari - value = computed[toCamel(property)]; - } - - return el.style[property] || value; - }; - } else if (document.documentElement.currentStyle && isIE) { // IE method - getStyle = function(el, property) { - switch( toCamel(property) ) { - case 'opacity' :// IE opacity uses filter - var val = 100; - try { // will error if no DXImageTransform - val = el.filters['DXImageTransform.Microsoft.Alpha'].opacity; - - } catch(e) { - try { // make sure its in the document - val = el.filters('alpha').opacity; - } catch(e) { - } - } - return val / 100; - case 'float': // fix reserved word - property = 'styleFloat'; // fall through - default: - // test currentStyle before touching - var value = el.currentStyle ? el.currentStyle[property] : null; - return ( el.style[property] || value ); - } - }; - } else { // default to inline only - getStyle = function(el, property) { return el.style[property]; }; - } + // string constants + OWNER_DOCUMENT = 'ownerDocument', + DEFAULT_VIEW = 'defaultView', + DOCUMENT_ELEMENT = 'documentElement', + COMPAT_MODE = 'compatMode', + OFFSET_LEFT = 'offsetLeft', + OFFSET_TOP = 'offsetTop', + OFFSET_PARENT = 'offsetParent', + PARENT_NODE = 'parentNode', + NODE_TYPE = 'nodeType', + TAG_NAME = 'tagName', + SCROLL_LEFT = 'scrollLeft', + SCROLL_TOP = 'scrollTop', + GET_BOUNDING_CLIENT_RECT = 'getBoundingClientRect', + GET_COMPUTED_STYLE = 'getComputedStyle', + CURRENT_STYLE = 'currentStyle', + CSS1_COMPAT = 'CSS1Compat', + _BACK_COMPAT = 'BackCompat', + _CLASS = 'class', // underscore due to reserved word + CLASS_NAME = 'className', + EMPTY = '', + SPACE = ' ', + C_START = '(?:^|\\s)', + C_END = '(?= |$)', + G = 'g', + POSITION = 'position', + FIXED = 'fixed', + RELATIVE = 'relative', + LEFT = 'left', + TOP = 'top', + MEDIUM = 'medium', + BORDER_LEFT_WIDTH = 'borderLeftWidth', + BORDER_TOP_WIDTH = 'borderTopWidth', - if (isIE) { - setStyle = function(el, property, val) { - switch (property) { - case 'opacity': - if ( YAHOO.lang.isString(el.style.filter) ) { // in case not appended - el.style.filter = 'alpha(opacity=' + val * 100 + ')'; - - if (!el.currentStyle || !el.currentStyle.hasLayout) { - el.style.zoom = 1; // when no layout or cant tell - } - } - break; - case 'float': - property = 'styleFloat'; - default: - el.style[property] = val; - } - }; - } else { - setStyle = function(el, property, val) { - if (property == 'float') { - property = 'cssFloat'; - } - el.style[property] = val; - }; - } + // brower detection + isOpera = UA.opera, + isSafari = UA.webkit, + isGecko = UA.gecko, + isIE = UA.ie; - var testElement = function(node, method) { - return node && node.nodeType == 1 && ( !method || method(node) ); - }; - /** * Provides helper methods for DOM elements. * @namespace YAHOO.util * @class Dom + * @requires yahoo, event */ - YAHOO.util.Dom = { + Y.Dom = { + CUSTOM_ATTRIBUTES: (!documentElement.hasAttribute) ? { // IE < 8 + 'for': 'htmlFor', + 'class': CLASS_NAME + } : { // w3c + 'htmlFor': 'for', + 'className': _CLASS + }, + /** * Returns an HTMLElement reference. * @method get * @param {String | HTMLElement |Array} el Accepts a string to use as an ID for getting a DOM reference, an actual DOM reference, or an Array of IDs and/or HTMLElements. * @return {HTMLElement | Array} A DOM reference to an HTML element or an array of HTMLElements. */ get: function(el) { - if (!el || el.tagName || el.item) { // null, HTMLElement, or HTMLCollection - return el; - } + var id, nodes, c, i, len; - if (YAHOO.lang.isString(el)) { // HTMLElement or null - return document.getElementById(el); - } - - if (el.splice) { // Array of HTMLElements/IDs - var c = []; - for (var i = 0, len = el.length; i < len; ++i) { - c[c.length] = Y.Dom.get(el[i]); + if (el) { + if (el[NODE_TYPE] || el.item) { // Node, or NodeList + return el; } + + if (typeof el === 'string') { // id + id = el; + el = document.getElementById(el); + if (el && el.id === id) { // IE: avoid false match on "name" attribute + return el; + } else if (el && document.all) { // filter by name + el = null; + nodes = document.all[id]; + for (i = 0, len = nodes.length; i < len; ++i) { + if (nodes[i].id === id) { + return nodes[i]; + } + } + } + return el; + } - return c; + if (el.DOM_EVENTS) { // YAHOO.util.Element + el = el.get('element'); + } + + if ('length' in el) { // array-like + c = []; + for (i = 0, len = el.length; i < len; ++i) { + c[c.length] = Y.Dom.get(el[i]); + } + + return c; + } + + return el; // some other object, just pass it back } - return el; // some other object, just pass it back + return null; }, + getComputedStyle: function(el, property) { + if (window[GET_COMPUTED_STYLE]) { + return el[OWNER_DOCUMENT][DEFAULT_VIEW][GET_COMPUTED_STYLE](el, null)[property]; + } else if (el[CURRENT_STYLE]) { + return Y.Dom.IE_ComputedStyle.get(el, property); + } + }, + /** * Normalizes currentStyle and ComputedStyle. * @method getStyle @@ -175,14 +148,55 @@ * @return {String | Array} The current value of the style property for the element(s). */ getStyle: function(el, property) { - property = toCamel(property); - - var f = function(element) { - return getStyle(element, property); - }; - - return Y.Dom.batch(el, f, Y.Dom, true); + return Y.Dom.batch(el, Y.Dom._getStyle, property); }, + + // branching at load instead of runtime + _getStyle: function() { + if (window[GET_COMPUTED_STYLE]) { // W3C DOM method + return function(el, property) { + property = (property === 'float') ? property = 'cssFloat' : + Y.Dom._toCamel(property); + + var value = el.style[property], + computed; + + if (!value) { + computed = el[OWNER_DOCUMENT][DEFAULT_VIEW][GET_COMPUTED_STYLE](el, null); + if (computed) { // test computed before touching for safari + value = computed[property]; + } + } + + return value; + }; + } else if (documentElement[CURRENT_STYLE]) { + return function(el, property) { + var value; + + switch(property) { + case 'opacity' :// IE opacity uses filter + value = 100; + try { // will error if no DXImageTransform + value = el.filters['DXImageTransform.Microsoft.Alpha'].opacity; + + } catch(e) { + try { // make sure its in the document + value = el.filters('alpha').opacity; + } catch(err) { + } + } + return value / 100; + case 'float': // fix reserved word + property = 'styleFloat'; // fall through + default: + property = Y.Dom._toCamel(property); + value = el[CURRENT_STYLE] ? el[CURRENT_STYLE][property] : null; + return ( el.style[property] || value ); + } + }; + } + }(), /** * Wrapper for setting style properties of HTMLElements. Normalizes "opacity" across modern browsers. @@ -192,85 +206,187 @@ * @param {String} val The value to apply to the given property. */ setStyle: function(el, property, val) { - property = toCamel(property); - - var f = function(element) { - setStyle(element, property, val); - - }; - - Y.Dom.batch(el, f, Y.Dom, true); + Y.Dom.batch(el, Y.Dom._setStyle, { prop: property, val: val }); }, + + _setStyle: function() { + if (isIE) { + return function(el, args) { + var property = Y.Dom._toCamel(args.prop), + val = args.val; + + if (el) { + switch (property) { + case 'opacity': + if ( lang.isString(el.style.filter) ) { // in case not appended + el.style.filter = 'alpha(opacity=' + val * 100 + ')'; + + if (!el[CURRENT_STYLE] || !el[CURRENT_STYLE].hasLayout) { + el.style.zoom = 1; // when no layout or cant tell + } + } + break; + case 'float': + property = 'styleFloat'; + default: + el.style[property] = val; + } + } else { + } + }; + } else { + return function(el, args) { + var property = Y.Dom._toCamel(args.prop), + val = args.val; + if (el) { + if (property == 'float') { + property = 'cssFloat'; + } + el.style[property] = val; + } else { + } + }; + } + + }(), /** - * Gets the current position of an element based on page coordinates. Element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false). + * Gets the current position of an element based on page coordinates. + * Element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false). * @method getXY - * @param {String | HTMLElement | Array} el Accepts a string to use as an ID, an actual DOM reference, or an Array of IDs and/or HTMLElements + * @param {String | HTMLElement | Array} el Accepts a string to use as an ID, an actual DOM + * reference, or an Array of IDs and/or HTMLElements * @return {Array} The XY position of the element(s) */ getXY: function(el) { - var f = function(el) { - - // has to be part of document to have pageXY - if ( (el.parentNode === null || el.offsetParent === null || - this.getStyle(el, 'display') == 'none') && el != document.body) { - return false; - } - - var parentNode = null; - var pos = []; - var box; - var doc = el.ownerDocument; + return Y.Dom.batch(el, Y.Dom._getXY); + }, - if (el.getBoundingClientRect) { // IE - box = el.getBoundingClientRect(); - return [box.left + Y.Dom.getDocumentScrollLeft(el.ownerDocument), box.top + Y.Dom.getDocumentScrollTop(el.ownerDocument)]; - } - else { // safari, opera, & gecko - pos = [el.offsetLeft, el.offsetTop]; - parentNode = el.offsetParent; + _canPosition: function(el) { + return ( Y.Dom._getStyle(el, 'display') !== 'none' && Y.Dom._inDoc(el) ); + }, - // safari: if el is abs or any parent is abs, subtract body offsets - var hasAbs = this.getStyle(el, 'position') == 'absolute'; + _getXY: function() { + if (document[DOCUMENT_ELEMENT][GET_BOUNDING_CLIENT_RECT]) { + return function(node) { + var scrollLeft, scrollTop, box, doc, + off1, off2, mode, bLeft, bTop, + floor = Math.floor, // TODO: round? + xy = false; - if (parentNode != el) { - while (parentNode) { - pos[0] += parentNode.offsetLeft; - pos[1] += parentNode.offsetTop; - if (isSafari && !hasAbs && - this.getStyle(parentNode,'position') == 'absolute' ) { - hasAbs = true; // we need to offset if any parent is absolutely positioned + if (Y.Dom._canPosition(node)) { + box = node[GET_BOUNDING_CLIENT_RECT](); + doc = node[OWNER_DOCUMENT]; + scrollLeft = Y.Dom.getDocumentScrollLeft(doc); + scrollTop = Y.Dom.getDocumentScrollTop(doc); + xy = [floor(box[LEFT]), floor(box[TOP])]; + + if (isIE && UA.ie < 8) { // IE < 8: viewport off by 2 + off1 = 2; + off2 = 2; + mode = doc[COMPAT_MODE]; + bLeft = _getComputedStyle(doc[DOCUMENT_ELEMENT], BORDER_LEFT_WIDTH); + bTop = _getComputedStyle(doc[DOCUMENT_ELEMENT], BORDER_TOP_WIDTH); + + if (UA.ie === 6) { + if (mode !== _BACK_COMPAT) { + off1 = 0; + off2 = 0; + } } - parentNode = parentNode.offsetParent; + + if ((mode == _BACK_COMPAT)) { + if (bLeft !== MEDIUM) { + off1 = parseInt(bLeft, 10); + } + if (bTop !== MEDIUM) { + off2 = parseInt(bTop, 10); + } + } + + xy[0] -= off1; + xy[1] -= off2; + } + + if ((scrollTop || scrollLeft)) { + xy[0] += scrollLeft; + xy[1] += scrollTop; + } + + // gecko may return sub-pixel (non-int) values + xy[0] = floor(xy[0]); + xy[1] = floor(xy[1]); + } else { } - if (isSafari && hasAbs) { //safari doubles in this case - pos[0] -= el.ownerDocument.body.offsetLeft; - pos[1] -= el.ownerDocument.body.offsetTop; - } - } - - parentNode = el.parentNode; + return xy; + }; + } else { + return function(node) { // ff2, safari: manually calculate by crawling up offsetParents + var docScrollLeft, docScrollTop, + scrollTop, scrollLeft, + bCheck, + xy = false, + parentNode = node; - // account for any scrolled ancestors - while ( parentNode.tagName && !patterns.ROOT_TAG.test(parentNode.tagName) ) - { - // work around opera inline/table scrollLeft/Top bug - if (Y.Dom.getStyle(parentNode, 'display').search(/^inline|table-row.*$/i)) { - pos[0] -= parentNode.scrollLeft; - pos[1] -= parentNode.scrollTop; + if (Y.Dom._canPosition(node) ) { + xy = [node[OFFSET_LEFT], node[OFFSET_TOP]]; + docScrollLeft = Y.Dom.getDocumentScrollLeft(node[OWNER_DOCUMENT]); + docScrollTop = Y.Dom.getDocumentScrollTop(node[OWNER_DOCUMENT]); + + // TODO: refactor with !! or just falsey + bCheck = ((isGecko || UA.webkit > 519) ? true : false); + + // TODO: worth refactoring for TOP/LEFT only? + while ((parentNode = parentNode[OFFSET_PARENT])) { + xy[0] += parentNode[OFFSET_LEFT]; + xy[1] += parentNode[OFFSET_TOP]; + if (bCheck) { + xy = Y.Dom._calcBorders(parentNode, xy); + } + } + + // account for any scrolled ancestors + if (Y.Dom._getStyle(node, POSITION) !== FIXED) { + parentNode = node; + + while ((parentNode = parentNode[PARENT_NODE]) && parentNode[TAG_NAME]) { + scrollTop = parentNode[SCROLL_TOP]; + scrollLeft = parentNode[SCROLL_LEFT]; + + //Firefox does something funky with borders when overflow is not visible. + if (isGecko && (Y.Dom._getStyle(parentNode, 'overflow') !== 'visible')) { + xy = Y.Dom._calcBorders(parentNode, xy); + } + + if (scrollTop || scrollLeft) { + xy[0] -= scrollLeft; + xy[1] -= scrollTop; + } + } + xy[0] += docScrollLeft; + xy[1] += docScrollTop; + + } else { + //Fix FIXED position -- add scrollbars + if (isOpera) { + xy[0] -= docScrollLeft; + xy[1] -= docScrollTop; + } else if (isSafari || isGecko) { + xy[0] += docScrollLeft; + xy[1] += docScrollTop; + } + } + //Round the numbers so we get sane data back + xy[0] = Math.floor(xy[0]); + xy[1] = Math.floor(xy[1]); + } else { } - - parentNode = parentNode.parentNode; - } - - - return pos; - }; - - return Y.Dom.batch(el, f, Y.Dom, true); - }, + return xy; + }; + } + }(), // NOTE: Executing for loadtime branching /** * Gets the current X position of an element based on page coordinates. The element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false). @@ -309,46 +425,59 @@ * @param {Boolean} noRetry By default we try and set the position a second time if the first fails */ setXY: function(el, pos, noRetry) { - var f = function(el) { - var style_pos = this.getStyle(el, 'position'); - if (style_pos == 'static') { // default to relative - this.setStyle(el, 'position', 'relative'); - style_pos = 'relative'; - } + Y.Dom.batch(el, Y.Dom._setXY, { pos: pos, noRetry: noRetry }); + }, - var pageXY = this.getXY(el); - if (pageXY === false) { // has to be part of doc to have pageXY - return false; - } - - var delta = [ // assuming pixels; if not we will have to retry - parseInt( this.getStyle(el, 'left'), 10 ), - parseInt( this.getStyle(el, 'top'), 10 ) - ]; - - if ( isNaN(delta[0]) ) {// in case of 'auto' - delta[0] = (style_pos == 'relative') ? 0 : el.offsetLeft; - } - if ( isNaN(delta[1]) ) { // in case of 'auto' - delta[1] = (style_pos == 'relative') ? 0 : el.offsetTop; - } - - if (pos[0] !== null) { el.style.left = pos[0] - pageXY[0] + delta[0] + 'px'; } - if (pos[1] !== null) { el.style.top = pos[1] - pageXY[1] + delta[1] + 'px'; } - - if (!noRetry) { - var newXY = this.getXY(el); + _setXY: function(node, args) { + var pos = Y.Dom._getStyle(node, POSITION), + setStyle = Y.Dom.setStyle, + xy = args.pos, + noRetry = args.noRetry, - // if retry is true, try one more time if we miss - if ( (pos[0] !== null && newXY[0] != pos[0]) || - (pos[1] !== null && newXY[1] != pos[1]) ) { - this.setXY(el, pos, true); - } - } + delta = [ // assuming pixels; if not we will have to retry + parseInt( Y.Dom.getComputedStyle(node, LEFT), 10 ), + parseInt( Y.Dom.getComputedStyle(node, TOP), 10 ) + ], + + currentXY, + newXY; - }; + if (pos == 'static') { // default to relative + pos = RELATIVE; + setStyle(node, POSITION, pos); + } + + currentXY = Y.Dom._getXY(node); + + if (!xy || currentXY === false) { // has to be part of doc to have xy + return false; + } - Y.Dom.batch(el, f, Y.Dom, true); + if ( isNaN(delta[0]) ) {// in case of 'auto' + delta[0] = (pos == RELATIVE) ? 0 : node[OFFSET_LEFT]; + } + if ( isNaN(delta[1]) ) { // in case of 'auto' + delta[1] = (pos == RELATIVE) ? 0 : node[OFFSET_TOP]; + } + + if (xy[0] !== null) { // from setX + setStyle(node, LEFT, xy[0] - currentXY[0] + delta[0] + 'px'); + } + + if (xy[1] !== null) { // from setY + setStyle(node, TOP, xy[1] - currentXY[1] + delta[1] + 'px'); + } + + if (!noRetry) { + newXY = Y.Dom._getXY(node); + + // if retry is true, try one more time if we miss + if ( (xy[0] !== null && newXY[0] != xy[0]) || + (xy[1] !== null && newXY[1] != xy[1]) ) { + Y.Dom._setXY(node, { pos: xy, noRetry: true }); + } + } + }, /** @@ -382,12 +511,12 @@ */ getRegion: function(el) { var f = function(el) { - if ( (el.parentNode === null || el.offsetParent === null || - this.getStyle(el, 'display') == 'none') && el != document.body) { - return false; + var region = false; + if ( Y.Dom._canPosition(el) ) { + region = Y.Region.getRegion(el); + } else { } - var region = Y.Region.getRegion(el); return region; }; @@ -417,14 +546,21 @@ /** * Returns a array of HTMLElements with the given class. * For optimized performance, include a tag and/or root node when possible. + * Note: This method operates against a live collection, so modifying the + * collection in the callback (removing/appending nodes, etc.) will have + * side effects. Instead you should iterate the returned nodes array, + * as you would with the native "getElementsByTagName" method. * @method getElementsByClassName * @param {String} className The class name to match against * @param {String} tag (optional) The tag name of the elements being collected * @param {String | HTMLElement} root (optional) The HTMLElement or an ID to use as the starting point * @param {Function} apply (optional) A function to apply to each element when found + * @param {Any} o (optional) An optional arg that is passed to the supplied method + * @param {Boolean} overrides (optional) Whether or not to override the scope of "method" with "o" * @return {Array} An array of elements that have the given class name */ - getElementsByClassName: function(className, tag, root, apply) { + getElementsByClassName: function(className, tag, root, apply, o, overrides) { + className = lang.trim(className); tag = tag || '*'; root = (root) ? Y.Dom.get(root) : null || document; if (!root) { @@ -433,17 +569,18 @@ var nodes = [], elements = root.getElementsByTagName(tag), - re = getClassRegEx(className); + hasClass = Y.Dom.hasClass; for (var i = 0, len = elements.length; i < len; ++i) { - if ( re.test(elements[i].className) ) { + if ( hasClass(elements[i], className) ) { nodes[nodes.length] = elements[i]; - if (apply) { - apply.call(elements[i], elements[i]); - } } } + if (apply) { + Y.Dom.batch(nodes, apply, o, overrides); + } + return nodes; }, @@ -455,61 +592,90 @@ * @return {Boolean | Array} A boolean value or array of boolean values */ hasClass: function(el, className) { - var re = getClassRegEx(className); + return Y.Dom.batch(el, Y.Dom._hasClass, className); + }, - var f = function(el) { - return re.test(el.className); - }; + _hasClass: function(el, className) { + var ret = false, + current; - return Y.Dom.batch(el, f, Y.Dom, true); + if (el && className) { + current = Y.Dom.getAttribute(el, CLASS_NAME) || EMPTY; + if (className.exec) { + ret = className.test(current); + } else { + ret = className && (SPACE + current + SPACE). + indexOf(SPACE + className + SPACE) > -1; + } + } else { + } + + return ret; }, /** * Adds a class name to a given element or collection of elements. * @method addClass * @param {String | HTMLElement | Array} el The element or collection to add the class to * @param {String} className the class name to add to the class attribute + * @return {Boolean | Array} A pass/fail boolean or array of booleans */ addClass: function(el, className) { - var f = function(el) { - if (this.hasClass(el, className)) { - return false; // already present + return Y.Dom.batch(el, Y.Dom._addClass, className); + }, + + _addClass: function(el, className) { + var ret = false, + current; + + if (el && className) { + current = Y.Dom.getAttribute(el, CLASS_NAME) || EMPTY; + if ( !Y.Dom._hasClass(el, className) ) { + Y.Dom.setAttribute(el, CLASS_NAME, trim(current + SPACE + className)); + ret = true; } - - - el.className = YAHOO.lang.trim([el.className, className].join(' ')); - return true; - }; - - return Y.Dom.batch(el, f, Y.Dom, true); + } else { + } + + return ret; }, /** * Removes a class name from a given element or collection of elements. * @method removeClass * @param {String | HTMLElement | Array} el The element or collection to remove the class from * @param {String} className the class name to remove from the class attribute + * @return {Boolean | Array} A pass/fail boolean or array of booleans */ removeClass: function(el, className) { - var re = getClassRegEx(className); - - var f = function(el) { - if (!this.hasClass(el, className)) { - return false; // not present - } + return Y.Dom.batch(el, Y.Dom._removeClass, className); + }, + + _removeClass: function(el, className) { + var ret = false, + current, + newClass, + attr; - - var c = el.className; - el.className = c.replace(re, ' '); - if ( this.hasClass(el, className) ) { // in case of multiple adjacent - this.removeClass(el, className); + if (el && className) { + current = Y.Dom.getAttribute(el, CLASS_NAME) || EMPTY; + Y.Dom.setAttribute(el, CLASS_NAME, current.replace(Y.Dom._getClassRegex(className), EMPTY)); + + newClass = Y.Dom.getAttribute(el, CLASS_NAME); + if (current !== newClass) { // else nothing changed + Y.Dom.setAttribute(el, CLASS_NAME, trim(newClass)); // trim after comparing to current class + ret = true; + + if (Y.Dom.getAttribute(el, CLASS_NAME) === '') { // remove class attribute if empty + attr = (el.hasAttribute && el.hasAttribute(_CLASS)) ? _CLASS : CLASS_NAME; + el.removeAttribute(attr); + } } - el.className = YAHOO.lang.trim(el.className); // remove any trailing spaces - return true; - }; - - return Y.Dom.batch(el, f, Y.Dom, true); + } else { + } + + return ret; }, /** @@ -519,32 +685,42 @@ * @param {String | HTMLElement | Array} el The element or collection to remove the class from * @param {String} oldClassName the class name to be replaced * @param {String} newClassName the class name that will be replacing the old class name + * @return {Boolean | Array} A pass/fail boolean or array of booleans */ replaceClass: function(el, oldClassName, newClassName) { - if (!newClassName || oldClassName === newClassName) { // avoid infinite loop - return false; - } - - var re = getClassRegEx(oldClassName); + return Y.Dom.batch(el, Y.Dom._replaceClass, { from: oldClassName, to: newClassName }); + }, - var f = function(el) { - - if ( !this.hasClass(el, oldClassName) ) { - this.addClass(el, newClassName); // just add it if nothing to replace - return true; // NOTE: return - } - - el.className = el.className.replace(re, ' ' + newClassName + ' '); + _replaceClass: function(el, classObj) { + var className, + from, + to, + ret = false, + current; - if ( this.hasClass(el, oldClassName) ) { // in case of multiple adjacent - this.replaceClass(el, oldClassName, newClassName); + if (el && classObj) { + from = classObj.from; + to = classObj.to; + + if (!to) { + ret = false; + } else if (!from) { // just add if no "from" + ret = Y.Dom._addClass(el, classObj.to); + } else if (from !== to) { // else nothing to replace + // May need to lead with DBLSPACE? + current = Y.Dom.getAttribute(el, CLASS_NAME) || EMPTY; + className = (SPACE + current.replace(Y.Dom._getClassRegex(from), SPACE + to)). + split(Y.Dom._getClassRegex(to)); + + // insert to into what would have been the first occurrence slot + className.splice(1, 0, SPACE + to); + Y.Dom.setAttribute(el, CLASS_NAME, trim(className.join(EMPTY))); + ret = true; } + } else { + } - el.className = YAHOO.lang.trim(el.className); // remove any trailing spaces - return true; - }; - - return Y.Dom.batch(el, f, Y.Dom, true); + return ret; }, /** @@ -560,11 +736,15 @@ var f = function(el) { if (el && el.id) { // do not override existing ID return el.id; - } + } - var id = prefix + id_counter++; + var id = prefix + YAHOO.env._id_counter++; if (el) { + if (el[OWNER_DOCUMENT].getElementById(id)) { // in case one already exists + // use failed id plus prefix to help ensure uniqueness + return Y.Dom.generateId(el, id + prefix); + } el.id = id; } @@ -584,59 +764,60 @@ */ isAncestor: function(haystack, needle) { haystack = Y.Dom.get(haystack); - if (!haystack || !needle) { return false; } + needle = Y.Dom.get(needle); - var f = function(node) { - if (haystack.contains && node.nodeType && !isSafari) { // safari contains is broken - return haystack.contains(node); + var ret = false; + + if ( (haystack && needle) && (haystack[NODE_TYPE] && needle[NODE_TYPE]) ) { + if (haystack.contains && haystack !== needle) { // contains returns true when equal + ret = haystack.contains(needle); } - else if ( haystack.compareDocumentPosition && node.nodeType ) { - return !!(haystack.compareDocumentPosition(node) & 16); - } else if (node.nodeType) { - // fallback to crawling up (safari) - return !!this.getAncestorBy(node, function(el) { - return el == haystack; - }); + else if (haystack.compareDocumentPosition) { // gecko + ret = !!(haystack.compareDocumentPosition(needle) & 16); } - return false; - }; - - return Y.Dom.batch(needle, f, Y.Dom, true); + } else { + } + return ret; }, /** * Determines whether an HTMLElement is present in the current document. * @method inDocument * @param {String | HTMLElement} el The element to search for + * @param {Object} doc An optional document to search, defaults to element's owner document * @return {Boolean} Whether or not the element is present in the current document */ - inDocument: function(el) { - var f = function(el) { // safari contains fails for body so crawl up - if (isSafari) { - while (el = el.parentNode) { // note assignment - if (el == document.documentElement) { - return true; - } - } - return false; - } - return this.isAncestor(document.documentElement, el); - }; - - return Y.Dom.batch(el, f, Y.Dom, true); + inDocument: function(el, doc) { + return Y.Dom._inDoc(Y.Dom.get(el), doc); }, + + _inDoc: function(el, doc) { + var ret = false; + if (el && el[TAG_NAME]) { + doc = doc || el[OWNER_DOCUMENT]; + ret = Y.Dom.isAncestor(doc[DOCUMENT_ELEMENT], el); + } else { + } + return ret; + }, /** * Returns a array of HTMLElements that pass the test applied by supplied boolean method. * For optimized performance, include a tag and/or root node when possible. + * Note: This method operates against a live collection, so modifying the + * collection in the callback (removing/appending nodes, etc.) will have + * side effects. Instead you should iterate the returned nodes array, + * as you would with the native "getElementsByTagName" method. * @method getElementsBy * @param {Function} method - A boolean method for testing elements which receives the element as its only argument. * @param {String} tag (optional) The tag name of the elements being collected * @param {String | HTMLElement} root (optional) The HTMLElement or an ID to use as the starting point * @param {Function} apply (optional) A function to apply to each element when found + * @param {Any} o (optional) An optional arg that is passed to the supplied method + * @param {Boolean} overrides (optional) Whether or not to override the scope of "method" with "o" * @return {Array} Array of HTMLElements */ - getElementsBy: function(method, tag, root, apply) { + getElementsBy: function(method, tag, root, apply, o, overrides, firstOnly) { tag = tag || '*'; root = (root) ? Y.Dom.get(root) : null || document; @@ -649,45 +830,61 @@ for (var i = 0, len = elements.length; i < len; ++i) { if ( method(elements[i]) ) { - nodes[nodes.length] = elements[i]; - if (apply) { - apply(elements[i]); + if (firstOnly) { + nodes = elements[i]; + break; + } else { + nodes[nodes.length] = elements[i]; } } } + if (apply) { + Y.Dom.batch(nodes, apply, o, overrides); + } + return nodes; }, /** - * Returns an the method(s) return value(s). + * Returns the first HTMLElement that passes the test applied by the supplied boolean method. + * @method getElementBy + * @param {Function} method - A boolean method for testing elements which receives the element as its only argument. + * @param {String} tag (optional) The tag name of the elements being collected + * @param {String | HTMLElement} root (optional) The HTMLElement or an ID to use as the starting point + * @return {HTMLElement} + */ + getElementBy: function(method, tag, root) { + return Y.Dom.getElementsBy(method, tag, root, null, null, null, true); + }, + + /** + * Runs the supplied method against each item in the Collection/Array. * The method is called with the element(s) as the first arg, and the optional param as the second ( method(el, o) ). * @method batch * @param {String | HTMLElement | Array} el (optional) An element or array of elements to apply the method to * @param {Function} method The method to apply to the element(s) * @param {Any} o (optional) An optional arg that is passed to the supplied method - * @param {Boolean} override (optional) Whether or not to override the scope of "method" with "o" - * @return {Any | Array} The return value(s) from the supplied methods + * @param {Boolean} overrides (optional) Whether or not to override the scope of "method" with "o" + * @return {Any | Array} The return value(s) from the supplied method */ - batch: function(el, method, o, override) { - el = (el && el.tagName) ? el : Y.Dom.get(el); // skip get() when possible + batch: function(el, method, o, overrides) { + var collection = [], + scope = (overrides) ? o : window; + + el = (el && (el[TAG_NAME] || el.item)) ? el : Y.Dom.get(el); // skip get() when possible + if (el && method) { + if (el[TAG_NAME] || el.length === undefined) { // element or not array-like + return method.call(scope, el, o); + } - if (!el || !method) { + for (var i = 0; i < el.length; ++i) { + collection[collection.length] = method.call(scope, el[i], o); + } + } else { return false; } - var scope = (override) ? o : window; - - if (el.tagName || (!el.item && !el.slice)) { // not a collection or array, just run the method - return method.call(scope, el, o); - } - - var collection = []; - - for (var i = 0, len = el.length; i < len; ++i) { - collection[collection.length] = method.call(scope, el[i], o); - } - return collection; }, @@ -697,9 +894,9 @@ * @return {Int} The height of the actual document (which includes the body and its margin). */ getDocumentHeight: function() { - var scrollHeight = (document.compatMode != 'CSS1Compat') ? document.body.scrollHeight : document.documentElement.scrollHeight; + var scrollHeight = (document[COMPAT_MODE] != CSS1_COMPAT || isSafari) ? document.body.scrollHeight : documentElement.scrollHeight, + h = Math.max(scrollHeight, Y.Dom.getViewportHeight()); - var h = Math.max(scrollHeight, Y.Dom.getViewportHeight()); return h; }, @@ -709,8 +906,8 @@ * @return {Int} The width of the actual document (which includes the body and its margin). */ getDocumentWidth: function() { - var scrollWidth = (document.compatMode != 'CSS1Compat') ? document.body.scrollWidth : document.documentElement.scrollWidth; - var w = Math.max(scrollWidth, Y.Dom.getViewportWidth()); + var scrollWidth = (document[COMPAT_MODE] != CSS1_COMPAT || isSafari) ? document.body.scrollWidth : documentElement.scrollWidth, + w = Math.max(scrollWidth, Y.Dom.getViewportWidth()); return w; }, @@ -720,12 +917,12 @@ * @return {Int} The height of the viewable area of the page (excludes scrollbars). */ getViewportHeight: function() { - var height = self.innerHeight; // Safari, Opera - var mode = document.compatMode; + var height = self.innerHeight, // Safari, Opera + mode = document[COMPAT_MODE]; if ( (mode || isIE) && !isOpera ) { // IE, Gecko - height = (mode == 'CSS1Compat') ? - document.documentElement.clientHeight : // Standards + height = (mode == CSS1_COMPAT) ? + documentElement.clientHeight : // Standards document.body.clientHeight; // Quirks } @@ -739,12 +936,12 @@ */ getViewportWidth: function() { - var width = self.innerWidth; // Safari - var mode = document.compatMode; + var width = self.innerWidth, // Safari + mode = document[COMPAT_MODE]; if (mode || isIE) { // IE, Gecko, Opera - width = (mode == 'CSS1Compat') ? - document.documentElement.clientWidth : // Standards + width = (mode == CSS1_COMPAT) ? + documentElement.clientWidth : // Standards document.body.clientWidth; // Quirks } return width; @@ -759,8 +956,8 @@ * @return {Object} HTMLElement or null if not found */ getAncestorBy: function(node, method) { - while (node = node.parentNode) { // NOTE: assignment - if ( testElement(node, method) ) { + while ( (node = node[PARENT_NODE]) ) { // NOTE: assignment + if ( Y.Dom._testElement(node, method) ) { return node; } } @@ -797,7 +994,7 @@ return null; } var method = function(el) { - return el.tagName && el.tagName.toUpperCase() == tagName.toUpperCase(); + return el[TAG_NAME] && el[TAG_NAME].toUpperCase() == tagName.toUpperCase(); }; return Y.Dom.getAncestorBy(node, method); @@ -816,7 +1013,7 @@ getPreviousSiblingBy: function(node, method) { while (node) { node = node.previousSibling; - if ( testElement(node, method) ) { + if ( Y.Dom._testElement(node, method) ) { return node; } } @@ -851,7 +1048,7 @@ getNextSiblingBy: function(node, method) { while (node) { node = node.nextSibling; - if ( testElement(node, method) ) { + if ( Y.Dom._testElement(node, method) ) { return node; } } @@ -882,7 +1079,7 @@ * @return {Object} HTMLElement or null if not found */ getFirstChildBy: function(node, method) { - var child = ( testElement(node.firstChild, method) ) ? node.firstChild : null; + var child = ( Y.Dom._testElement(node.firstChild, method) ) ? node.firstChild : null; return child || Y.Dom.getNextSiblingBy(node.firstChild, method); }, @@ -912,7 +1109,7 @@ if (!node) { return null; } - var child = ( testElement(node.lastChild, method) ) ? node.lastChild : null; + var child = ( Y.Dom._testElement(node.lastChild, method) ) ? node.lastChild : null; return child || Y.Dom.getPreviousSiblingBy(node.lastChild, method); }, @@ -936,8 +1133,8 @@ * @return {Array} A static array of HTMLElements */ getChildrenBy: function(node, method) { - var child = Y.Dom.getFirstChildBy(node, method); - var children = child ? [child] : []; + var child = Y.Dom.getFirstChildBy(node, method), + children = child ? [child] : []; Y.Dom.getNextSiblingBy(child, function(node) { if ( !method || method(node) ) { @@ -962,7 +1159,7 @@ return Y.Dom.getChildrenBy(node); }, - + /** * Returns the left scroll value of the document * @method getDocumentScrollLeft @@ -971,7 +1168,7 @@ */ getDocumentScrollLeft: function(doc) { doc = doc || document; - return Math.max(doc.documentElement.scrollLeft, doc.body.scrollLeft); + return Math.max(doc[DOCUMENT_ELEMENT].scrollLeft, doc.body.scrollLeft); }, /** @@ -982,7 +1179,7 @@ */ getDocumentScrollTop: function(doc) { doc = doc || document; - return Math.max(doc.documentElement.scrollTop, doc.body.scrollTop); + return Math.max(doc[DOCUMENT_ELEMENT].scrollTop, doc.body.scrollTop); }, /** @@ -996,11 +1193,11 @@ newNode = Y.Dom.get(newNode); referenceNode = Y.Dom.get(referenceNode); - if (!newNode || !referenceNode || !referenceNode.parentNode) { + if (!newNode || !referenceNode || !referenceNode[PARENT_NODE]) { return null; } - return referenceNode.parentNode.insertBefore(newNode, referenceNode); + return referenceNode[PARENT_NODE].insertBefore(newNode, referenceNode); }, /** @@ -1014,17 +1211,137 @@ newNode = Y.Dom.get(newNode); referenceNode = Y.Dom.get(referenceNode); - if (!newNode || !referenceNode || !referenceNode.parentNode) { + if (!newNode || !referenceNode || !referenceNode[PARENT_NODE]) { return null; } if (referenceNode.nextSibling) { - return referenceNode.parentNode.insertBefore(newNode, referenceNode.nextSibling); + return referenceNode[PARENT_NODE].insertBefore(newNode, referenceNode.nextSibling); } else { - return referenceNode.parentNode.appendChild(newNode); + return referenceNode[PARENT_NODE].appendChild(newNode); } + }, + + /** + * Creates a Region based on the viewport relative to the document. + * @method getClientRegion + * @return {Region} A Region object representing the viewport which accounts for document scroll + */ + getClientRegion: function() { + var t = Y.Dom.getDocumentScrollTop(), + l = Y.Dom.getDocumentScrollLeft(), + r = Y.Dom.getViewportWidth() + l, + b = Y.Dom.getViewportHeight() + t; + + return new Y.Region(t, r, b, l); + }, + + /** + * Provides a normalized attribute interface. + * @method setAttibute + * @param {String | HTMLElement} el The target element for the attribute. + * @param {String} attr The attribute to set. + * @param {String} val The value of the attribute. + */ + setAttribute: function(el, attr, val) { + attr = Y.Dom.CUSTOM_ATTRIBUTES[attr] || attr; + el.setAttribute(attr, val); + }, + + + /** + * Provides a normalized attribute interface. + * @method getAttibute + * @param {String | HTMLElement} el The target element for the attribute. + * @param {String} attr The attribute to get. + * @return {String} The current value of the attribute. + */ + getAttribute: function(el, attr) { + attr = Y.Dom.CUSTOM_ATTRIBUTES[attr] || attr; + return el.getAttribute(attr); + }, + + _toCamel: function(property) { + var c = propertyCache; + + function tU(x,l) { + return l.toUpperCase(); + } + + return c[property] || (c[property] = property.indexOf('-') === -1 ? + property : + property.replace( /-([a-z])/gi, tU )); + }, + + _getClassRegex: function(className) { + var re; + if (className !== undefined) { // allow empty string to pass + if (className.exec) { // already a RegExp + re = className; + } else { + re = reCache[className]; + if (!re) { + // escape special chars (".", "[", etc.) + className = className.replace(Y.Dom._patterns.CLASS_RE_TOKENS, '\\$1'); + re = reCache[className] = new RegExp(C_START + className + C_END, G); + } + } + } + return re; + }, + + _patterns: { + ROOT_TAG: /^body|html$/i, // body for quirks mode, html for standards, + CLASS_RE_TOKENS: /([\.\(\)\^\$\*\+\?\|\[\]\{\}])/g + }, + + + _testElement: function(node, method) { + return node && node[NODE_TYPE] == 1 && ( !method || method(node) ); + }, + + _calcBorders: function(node, xy2) { + var t = parseInt(Y.Dom[GET_COMPUTED_STYLE](node, BORDER_TOP_WIDTH), 10) || 0, + l = parseInt(Y.Dom[GET_COMPUTED_STYLE](node, BORDER_LEFT_WIDTH), 10) || 0; + if (isGecko) { + if (RE_TABLE.test(node[TAG_NAME])) { + t = 0; + l = 0; + } + } + xy2[0] += l; + xy2[1] += t; + return xy2; } }; + + var _getComputedStyle = Y.Dom[GET_COMPUTED_STYLE]; + // fix opera computedStyle default color unit (convert to rgb) + if (UA.opera) { + Y.Dom[GET_COMPUTED_STYLE] = function(node, att) { + var val = _getComputedStyle(node, att); + if (RE_COLOR.test(att)) { + val = Y.Dom.Color.toRGB(val); + } + + return val; + }; + + } + + // safari converts transparent to rgba(), others use "transparent" + if (UA.webkit) { + Y.Dom[GET_COMPUTED_STYLE] = function(node, att) { + var val = _getComputedStyle(node, att); + + if (val === 'rgba(0, 0, 0, 0)') { + val = 'transparent'; + } + + return val; + }; + + } })(); /** * A region is a representation of an object on a grid. It is defined @@ -1048,6 +1365,13 @@ this.top = t; /** + * The region's top extent + * @property y + * @type Int + */ + this.y = t; + + /** * The region's top extent as index, for symmetry with set/getXY * @property 1 * @type Int @@ -1076,11 +1400,32 @@ this.left = l; /** + * The region's left extent + * @property x + * @type Int + */ + this.x = l; + + /** * The region's left extent as index, for symmetry with set/getXY * @property 0 * @type Int */ this[0] = l; + + /** + * The region's total width + * @property width + * @type Int + */ + this.width = this.right - this.left; + + /** + * The region's total height + * @property height + * @type Int + */ + this.height = this.bottom - this.top; }; /** @@ -1114,10 +1459,10 @@ * @return {Region} The overlap region, or null if there is no overlap */ YAHOO.util.Region.prototype.intersect = function(region) { - var t = Math.max( this.top, region.top ); - var r = Math.min( this.right, region.right ); - var b = Math.min( this.bottom, region.bottom ); - var l = Math.max( this.left, region.left ); + var t = Math.max( this.top, region.top ), + r = Math.min( this.right, region.right ), + b = Math.min( this.bottom, region.bottom ), + l = Math.max( this.left, region.left ); if (b >= t && r >= l) { return new YAHOO.util.Region(t, r, b, l); @@ -1134,10 +1479,10 @@ * @return {Region} The union region */ YAHOO.util.Region.prototype.union = function(region) { - var t = Math.min( this.top, region.top ); - var r = Math.max( this.right, region.right ); - var b = Math.max( this.bottom, region.bottom ); - var l = Math.min( this.left, region.left ); + var t = Math.min( this.top, region.top ), + r = Math.max( this.right, region.right ), + b = Math.max( this.bottom, region.bottom ), + l = Math.min( this.left, region.left ); return new YAHOO.util.Region(t, r, b, l); }; @@ -1153,6 +1498,8 @@ ", right: " + this.right + ", bottom: " + this.bottom + ", left: " + this.left + + ", height: " + this.height + + ", width: " + this.width + "}" ); }; @@ -1164,13 +1511,12 @@ * @static */ YAHOO.util.Region.getRegion = function(el) { - var p = YAHOO.util.Dom.getXY(el); + var p = YAHOO.util.Dom.getXY(el), + t = p[1], + r = p[0] + el.offsetWidth, + b = p[1] + el.offsetHeight, + l = p[0]; - var t = p[1]; - var r = p[0] + el.offsetWidth; - var b = p[1] + el.offsetHeight; - var l = p[0]; - return new YAHOO.util.Region(t, r, b, l); }; @@ -1192,23 +1538,262 @@ y = x[1]; // dont blow away x yet x = x[0]; } - - /** - * The X position of the point, which is also the right, left and index zero (for Dom.getXY symmetry) - * @property x - * @type Int - */ - - this.x = this.right = this.left = this[0] = x; - - /** - * The Y position of the point, which is also the top, bottom and index one (for Dom.getXY symmetry) - * @property y - * @type Int - */ - this.y = this.top = this.bottom = this[1] = y; + + YAHOO.util.Point.superclass.constructor.call(this, y, x, y, x); }; -YAHOO.util.Point.prototype = new YAHOO.util.Region(); +YAHOO.extend(YAHOO.util.Point, YAHOO.util.Region); -YAHOO.register("dom", YAHOO.util.Dom, {version: "2.3.0", build: "442"}); +(function() { +/** + * Add style management functionality to DOM. + * @module dom + * @for Dom + */ + +var Y = YAHOO.util, + CLIENT_TOP = 'clientTop', + CLIENT_LEFT = 'clientLeft', + PARENT_NODE = 'parentNode', + RIGHT = 'right', + HAS_LAYOUT = 'hasLayout', + PX = 'px', + OPACITY = 'opacity', + AUTO = 'auto', + BORDER_LEFT_WIDTH = 'borderLeftWidth', + BORDER_TOP_WIDTH = 'borderTopWidth', + BORDER_RIGHT_WIDTH = 'borderRightWidth', + BORDER_BOTTOM_WIDTH = 'borderBottomWidth', + VISIBLE = 'visible', + TRANSPARENT = 'transparent', + HEIGHT = 'height', + WIDTH = 'width', + STYLE = 'style', + CURRENT_STYLE = 'currentStyle', + +// IE getComputedStyle +// TODO: unit-less lineHeight (e.g. 1.22) + re_size = /^width|height$/, + re_unit = /^(\d[.\d]*)+(em|ex|px|gd|rem|vw|vh|vm|ch|mm|cm|in|pt|pc|deg|rad|ms|s|hz|khz|%){1}?/i, + + ComputedStyle = { + get: function(el, property) { + var value = '', + current = el[CURRENT_STYLE][property]; + + if (property === OPACITY) { + value = Y.Dom.getStyle(el, OPACITY); + } else if (!current || (current.indexOf && current.indexOf(PX) > -1)) { // no need to convert + value = current; + } else if (Y.Dom.IE_COMPUTED[property]) { // use compute function + value = Y.Dom.IE_COMPUTED[property](el, property); + } else if (re_unit.test(current)) { // convert to pixel + value = Y.Dom.IE.ComputedStyle.getPixel(el, property); + } else { + value = current; + } + + return value; + }, + + getOffset: function(el, prop) { + var current = el[CURRENT_STYLE][prop], // value of "width", "top", etc. + capped = prop.charAt(0).toUpperCase() + prop.substr(1), // "Width", "Top", etc. + offset = 'offset' + capped, // "offsetWidth", "offsetTop", etc. + pixel = 'pixel' + capped, // "pixelWidth", "pixelTop", etc. + value = '', + actual; + + if (current == AUTO) { + actual = el[offset]; // offsetHeight/Top etc. + if (actual === undefined) { // likely "right" or "bottom" + value = 0; + } + + value = actual; + if (re_size.test(prop)) { // account for box model diff + el[STYLE][prop] = actual; + if (el[offset] > actual) { + // the difference is padding + border (works in Standards & Quirks modes) + value = actual - (el[offset] - actual); + } + el[STYLE][prop] = AUTO; // revert to auto + } + } else { // convert units to px + if (!el[STYLE][pixel] && !el[STYLE][prop]) { // need to map style.width to currentStyle (no currentStyle.pixelWidth) + el[STYLE][prop] = current; // no style.pixelWidth if no style.width + } + value = el[STYLE][pixel]; + } + return value + PX; + }, + + getBorderWidth: function(el, property) { + // clientHeight/Width = paddingBox (e.g. offsetWidth - borderWidth) + // clientTop/Left = borderWidth + var value = null; + if (!el[CURRENT_STYLE][HAS_LAYOUT]) { // TODO: unset layout? + el[STYLE].zoom = 1; // need layout to measure client + } + + switch(property) { + case BORDER_TOP_WIDTH: + value = el[CLIENT_TOP]; + break; + case BORDER_BOTTOM_WIDTH: + value = el.offsetHeight - el.clientHeight - el[CLIENT_TOP]; + break; + case BORDER_LEFT_WIDTH: + value = el[CLIENT_LEFT]; + break; + case BORDER_RIGHT_WIDTH: + value = el.offsetWidth - el.clientWidth - el[CLIENT_LEFT]; + break; + } + return value + PX; + }, + + getPixel: function(node, att) { + // use pixelRight to convert to px + var val = null, + styleRight = node[CURRENT_STYLE][RIGHT], + current = node[CURRENT_STYLE][att]; + + node[STYLE][RIGHT] = current; + val = node[STYLE].pixelRight; + node[STYLE][RIGHT] = styleRight; // revert + + return val + PX; + }, + + getMargin: function(node, att) { + var val; + if (node[CURRENT_STYLE][att] == AUTO) { + val = 0 + PX; + } else { + val = Y.Dom.IE.ComputedStyle.getPixel(node, att); + } + return val; + }, + + getVisibility: function(node, att) { + var current; + while ( (current = node[CURRENT_STYLE]) && current[att] == 'inherit') { // NOTE: assignment in test + node = node[PARENT_NODE]; + } + return (current) ? current[att] : VISIBLE; + }, + + getColor: function(node, att) { + return Y.Dom.Color.toRGB(node[CURRENT_STYLE][att]) || TRANSPARENT; + }, + + getBorderColor: function(node, att) { + var current = node[CURRENT_STYLE], + val = current[att] || current.color; + return Y.Dom.Color.toRGB(Y.Dom.Color.toHex(val)); + } + + }, + +//fontSize: getPixelFont, + IEComputed = {}; + +IEComputed.top = IEComputed.right = IEComputed.bottom = IEComputed.left = + IEComputed[WIDTH] = IEComputed[HEIGHT] = ComputedStyle.getOffset; + +IEComputed.color = ComputedStyle.getColor; + +IEComputed[BORDER_TOP_WIDTH] = IEComputed[BORDER_RIGHT_WIDTH] = + IEComputed[BORDER_BOTTOM_WIDTH] = IEComputed[BORDER_LEFT_WIDTH] = + ComputedStyle.getBorderWidth; + +IEComputed.marginTop = IEComputed.marginRight = IEComputed.marginBottom = + IEComputed.marginLeft = ComputedStyle.getMargin; + +IEComputed.visibility = ComputedStyle.getVisibility; +IEComputed.borderColor = IEComputed.borderTopColor = + IEComputed.borderRightColor = IEComputed.borderBottomColor = + IEComputed.borderLeftColor = ComputedStyle.getBorderColor; + +Y.Dom.IE_COMPUTED = IEComputed; +Y.Dom.IE_ComputedStyle = ComputedStyle; +})(); +(function() { +/** + * Add style management functionality to DOM. + * @module dom + * @for Dom + */ + +var TO_STRING = 'toString', + PARSE_INT = parseInt, + RE = RegExp, + Y = YAHOO.util; + +Y.Dom.Color = { + KEYWORDS: { + black: '000', + silver: 'c0c0c0', + gray: '808080', + white: 'fff', + maroon: '800000', + red: 'f00', + purple: '800080', + fuchsia: 'f0f', + green: '008000', + lime: '0f0', + olive: '808000', + yellow: 'ff0', + navy: '000080', + blue: '00f', + teal: '008080', + aqua: '0ff' + }, + + re_RGB: /^rgb\(([0-9]+)\s*,\s*([0-9]+)\s*,\s*([0-9]+)\)$/i, + re_hex: /^#?([0-9A-F]{2})([0-9A-F]{2})([0-9A-F]{2})$/i, + re_hex3: /([0-9A-F])/gi, + + toRGB: function(val) { + if (!Y.Dom.Color.re_RGB.test(val)) { + val = Y.Dom.Color.toHex(val); + } + + if(Y.Dom.Color.re_hex.exec(val)) { + val = 'rgb(' + [ + PARSE_INT(RE.$1, 16), + PARSE_INT(RE.$2, 16), + PARSE_INT(RE.$3, 16) + ].join(', ') + ')'; + } + return val; + }, + + toHex: function(val) { + val = Y.Dom.Color.KEYWORDS[val] || val; + if (Y.Dom.Color.re_RGB.exec(val)) { + var r = (RE.$1.length === 1) ? '0' + RE.$1 : Number(RE.$1), + g = (RE.$2.length === 1) ? '0' + RE.$2 : Number(RE.$2), + b = (RE.$3.length === 1) ? '0' + RE.$3 : Number(RE.$3); + + val = [ + r[TO_STRING](16), + g[TO_STRING](16), + b[TO_STRING](16) + ].join(''); + } + + if (val.length < 6) { + val = val.replace(Y.Dom.Color.re_hex3, '$1$1'); + } + + if (val !== 'transparent' && val.indexOf('#') < 0) { + val = '#' + val; + } + + return val.toLowerCase(); + } +}; +}()); +YAHOO.register("dom", YAHOO.util.Dom, {version: "2.7.0", build: "1799"});