/** * A base library for Shadowbox used as a standalone (without another base * library/adapter combination). * * This file is part of Shadowbox. * * Shadowbox is an online media viewer application that supports all of the * web's most popular media publishing formats. Shadowbox is written entirely * in JavaScript and CSS and is highly customizable. Using Shadowbox, website * authors can showcase a wide assortment of media in all major browsers without * navigating users away from the linking page. * * Shadowbox is released under version 3.0 of the Creative Commons Attribution- * Noncommercial-Share Alike license. This means that it is absolutely free * for personal, noncommercial use provided that you 1) make attribution to the * author and 2) release any derivative work under the same or a similar * license. * * If you wish to use Shadowbox for commercial purposes, licensing information * can be found at http://mjijackson.com/shadowbox/. * * @author      Michael J. I. Jackson <mjijackson@gmail.com> * @copyright   2007-2008 Michael J. I. Jackson * @license     http://creativecommons.org/licenses/by-nc-sa/3.0/ * @version     SVN: $Id: shadowbox-base.js 103 2008-06-27 06:19:21Z mjijackson $ */// create the Shadowbox object firstvar Shadowbox = {};Shadowbox.lib = function(){    // local style camelizing for speed    var styleCache = {};    var camelRe = /(-[a-z])/gi;    var camelFn = function(m, a){        return a.charAt(1).toUpperCase();    };    var toCamel = function(style){        var camel;        if(!(camel = styleCache[style])){            camel = styleCache[style] = style.replace(camelRe, camelFn);        }        return camel;    };    var view = document.defaultView;    var alphaRe = /alpha\([^\)]*\)/gi;    /**     * Sets the opacity of the given element to the specified level.     *     * @param   {HTMLElement}   el          The element     * @param   {Number}        opacity     The opacity to use     * @return  void     * @private     * @static     */    var setOpacity = function(el, opacity){        var s = el.style;        if(window.ActiveXObject){ // IE            s.zoom = 1; // give "layout"            s.filter = (s.filter || '').replace(alphaRe, '') +                (opacity == 1 ? '' : ' alpha(opacity=' + (opacity * 100) + ')');        }else{            s.opacity = opacity;        }    };    return {        adapter: 'standalone',        /**         * Gets the value of the style on the given element. This function         * adapted from Ext.Element.getStyle().         *         * @param   {HTMLElement}   el      The DOM element         * @param   {String}        style   The name of the style (e.g. margin-top)         * @return  {mixed}                 The value of the given style         * @public         * @static         */        getStyle: function(){            return view && view.getComputedStyle                ? function(el, style){                    var v, cs, camel;                    if(style == 'float') style = 'cssFloat';                    if(v = el.style[style]) return v;                    if(cs = view.getComputedStyle(el, '')){                        return cs[toCamel(style)];                    }                    return null;                }                : function(el, style){                    var v, cs, camel;                    if(style == 'opacity'){                        if(typeof el.style.filter == 'string'){                            var m = el.style.filter.match(/alpha\(opacity=(.+)\)/i);                            if(m){                                var fv = parseFloat(m[1]);                                if(!isNaN(fv)) return (fv ? fv / 100 : 0);                            }                        }                        return 1;                    }else if(style == 'float'){                        style = 'styleFloat';                    }                    var camel = toCamel(style);                    if(v = el.style[camel]) return v;                    if(cs = el.currentStyle) return cs[camel];                    return null;                };        }(),        /**         * Sets the style on the given element to the given value. May be an         * object to specify multiple values. This function adapted from         * Ext.Element.setStyle().         *         * @param   {HTMLElement}   el      The DOM element         * @param   {String/Object} style   The name of the style to set if a         *                                  string, or an object of name =>         *                                  value pairs         * @param   {String}        value   The value to set the given style to         * @return  void         * @public         * @static         */        setStyle: function(el, style, value){            if(typeof style == 'string'){                var camel = toCamel(style);                if(camel == 'opacity'){                    setOpacity(el, value);                }else{                    el.style[camel] = value;                }            }else{                for(var s in style){                    this.setStyle(el, s, style[s]);                }            }        },        /**         * Gets a reference to the given element.         *         * @param   {String/HTMLElement}    el      The element to fetch         * @return  {HTMLElement}                   A reference to the element         * @public         * @static         */        get: function(el){            return typeof el == 'string' ? document.getElementById(el) : el;        },        /**         * Removes an element from the DOM.         *         * @param   {HTMLElement}       el      The element to remove         * @return  void         * @public         * @static         */        remove: function(el){            el.parentNode.removeChild(el);        },        /**         * Gets the target of the given event. The event object passed will be         * the same object that is passed to listeners registered with         * addEvent().         *         * @param   {mixed}             e       The event object         * @return  {HTMLElement}               The event's target element         * @public         * @static         */        getTarget: function(e){            var t = e.target ? e.target : e.srcElement;            return t.nodeType == 3 ? t.parentNode : t;        },        /**         * Gets the page X/Y coordinates of the mouse event in an [x, y] array.         * The page coordinates should be relative to the document, and not the         * viewport. The event object provided here will be the same object that         * is passed to listeners registered with addEvent().         *         * @param   {mixed}         e       The event object         * @return  {Array}                 The page X/Y coordinates         * @public         * @static         */        getPageXY: function(e){            var x = e.pageX || (e.clientX +                (document.documentElement.scrollLeft || document.body.scrollLeft));            var y = e.pageY || (e.clientY +                (document.documentElement.scrollTop || document.body.scrollTop));            return [x, y];        },        /**         * Prevents the event's default behavior. The event object here will         * be the same object that is passed to listeners registered with         * addEvent().         *         * @param   {mixed}             e       The event object         * @return  void         * @public         * @static         */        preventDefault: function(e){            if(e.preventDefault){                e.preventDefault();            }else{                e.returnValue = false;            }        },        /**         * Gets the key code of the given event object (keydown). The event         * object here will be the same object that is passed to listeners         * registered with addEvent().         *         * @param   {mixed}         e       The event object         * @return  {Number}                The key code of the event         * @public         * @static         */        keyCode: function(e){            return e.which ? e.which : e.keyCode;        },        /**         * Adds an event listener to the given element. It is expected that this         * function will be passed the event as its first argument.         *         * @param   {HTMLElement}   el          The DOM element to listen to         * @param   {String}        name        The name of the event to register         *                                      (i.e. 'click', 'scroll', etc.)         * @param   {Function}      handler     The event handler function         * @return  void         * @public         * @static         */        addEvent: function(el, name, handler){            if(el.addEventListener){                el.addEventListener(name, handler, false);            }else if(el.attachEvent){                el.attachEvent('on' + name, handler);            }        },        /**         * Removes an event listener from the given element.         *         * @param   {HTMLElement}   el          The DOM element to stop listening to         * @param   {String}        name        The name of the event to stop         *                                      listening for (i.e. 'click')         * @param   {Function}      handler     The event handler function         * @return  void         * @public         * @static         */        removeEvent: function(el, name, handler){            if(el.removeEventListener){                el.removeEventListener(name, handler, false);            }else if(el.detachEvent){                el.detachEvent('on' + name, handler);            }        },        /**         * Appends an HTML fragment to the given element.         *         * @param   {HTMLElement}       el      The element to append to         * @param   {String}            html    The HTML fragment to use         * @return  void         * @public         * @static         */        append: function(el, html){            if(el.insertAdjacentHTML){                el.insertAdjacentHTML('BeforeEnd', html);            }else if(el.lastChild){                var range = el.ownerDocument.createRange();                range.setStartAfter(el.lastChild);                var frag = range.createContextualFragment(html);                el.appendChild(frag);            }else{                el.innerHTML = html;            }        }    };}();