/* ***********************************************************Example 4-3 (DHTMLAPI.js)"Dynamic HTML:The Definitive Reference"2nd Editionby Danny GoodmanPublished by O'Reilly & Associates  ISBN 1-56592-494-0http://www.oreilly.comCopyright 2002 Danny Goodman.  All Rights Reserved.************************************************************ */// DHTMLapi.js custom API for cross-platform// object positioning by Danny Goodman (http://www.dannyg.com).// Release 2.0. Supports NN4, IE, and W3C DOMs.// Global variablesvar isCSS, isW3C, isIE4, isNN4, isIE6CSS;// Initialize upon load to let all browsers establish content objectsfunction initDHTMLAPI() {    if (document.images) {        isCSS = (document.body && document.body.style) ? true : false;        isW3C = (isCSS && document.getElementById) ? true : false;        isIE4 = (isCSS && document.all) ? true : false;        isNN4 = (document.layers) ? true : false;        isIE6CSS = (document.compatMode && document.compatMode.indexOf("CSS1") >= 0) ? true : false;    }}// Set event handler to initialize APIwindow.onload = initDHTMLAPI;// Seek nested NN4 layer from string namefunction seekLayer(doc, name) {    var theObj;    for (var i = 0; i < doc.layers.length; i++) {        if (doc.layers[i].name == name) {            theObj = doc.layers[i];            break;        }        // dive into nested layers if necessary        if (doc.layers[i].document.layers.length > 0) {            theObj = seekLayer(document.layers[i].document, name);        }    }    return theObj;}// Convert object name string or object reference// into a valid element object referencefunction getRawObject(obj) {    var theObj;    if (typeof obj == "string") {        if (isW3C) {            theObj = document.getElementById(obj);        } else if (isIE4) {            theObj = document.all(obj);        } else if (isNN4) {            theObj = seekLayer(document, obj);        }    } else {        // pass through object reference        theObj = obj;    }    return theObj;}// Convert object name string or object reference// into a valid style (or NN4 layer) referencefunction getObject(obj) {    var theObj = getRawObject(obj);    if (theObj && isCSS) {        theObj = theObj.style;    }    return theObj;}// Position an object at a specific pixel coordinatefunction shiftTo(obj, x, y) {    var theObj = getObject(obj);    if (theObj) {        if (isCSS) {            // equalize incorrect numeric value type            var units = (typeof theObj.left == "string") ? "px" : 0             theObj.left = x + units;            theObj.top = y + units;        } else if (isNN4) {            theObj.moveTo(x,y)        }    }}// Move an object by x and/or y pixelsfunction shiftBy(obj, deltaX, deltaY) {    var theObj = getObject(obj);    if (theObj) {        if (isCSS) {            // equalize incorrect numeric value type            var units = (typeof theObj.left == "string") ? "px" : 0             theObj.left = getObjectLeft(obj) + deltaX + units;            theObj.top = getObjectTop(obj) + deltaY + units;        } else if (isNN4) {            theObj.moveBy(deltaX, deltaY);        }    }}// Set the z-order of an objectfunction setZIndex(obj, zOrder) {    var theObj = getObject(obj);    if (theObj) {        theObj.zIndex = zOrder;    }}// Set the background color of an objectfunction setBGColor(obj, color) {    var theObj = getObject(obj);    if (theObj) {        if (isNN4) {            theObj.bgColor = color;        } else if (isCSS) {            theObj.backgroundColor = color;        }    }}// Set the visibility of an object to visiblefunction show(obj) {    var theObj = getObject(obj);    if (theObj) {        theObj.visibility = "visible";    }}// Set the visibility of an object to hiddenfunction hide(obj) {    var theObj = getObject(obj);    if (theObj) {        theObj.visibility = "hidden";    }}// Retrieve the x coordinate of a positionable objectfunction getObjectLeft(obj)  {    var elem = getRawObject(obj);    var result = 0;    if (document.defaultView) {        var style = document.defaultView;        var cssDecl = style.getComputedStyle(elem, "");        result = cssDecl.getPropertyValue("left");    } else if (elem.currentStyle) {        result = elem.currentStyle.left;    } else if (elem.style) {        result = elem.style.left;    } else if (isNN4) {        result = elem.left;    }    return parseInt(result);}// Retrieve the y coordinate of a positionable objectfunction getObjectTop(obj)  {    var elem = getRawObject(obj);    var result = 0;    if (document.defaultView) {        var style = document.defaultView;        var cssDecl = style.getComputedStyle(elem, "");        result = cssDecl.getPropertyValue("top");    } else if (elem.currentStyle) {        result = elem.currentStyle.top;    } else if (elem.style) {        result = elem.style.top;    } else if (isNN4) {        result = elem.top;    }    return parseInt(result);}// Retrieve the rendered width of an elementfunction getObjectWidth(obj)  {    var elem = getRawObject(obj);    var result = 0;    if (elem.offsetWidth) {        result = elem.offsetWidth;    } else if (elem.clip && elem.clip.width) {        result = elem.clip.width;    } else if (elem.style && elem.style.pixelWidth) {        result = elem.style.pixelWidth;    }    return parseInt(result);}// Retrieve the rendered height of an elementfunction getObjectHeight(obj)  {    var elem = getRawObject(obj);    var result = 0;    if (elem.offsetHeight) {        result = elem.offsetHeight;    } else if (elem.clip && elem.clip.height) {        result = elem.clip.height;    } else if (elem.style && elem.style.pixelHeight) {        result = elem.style.pixelHeight;    }    return parseInt(result);}// Return the available content width space in browser windowfunction getInsideWindowWidth() {    if (window.innerWidth) {        return window.innerWidth;    } else if (isIE6CSS) {        // measure the html element's clientWidth        return document.body.parentElement.clientWidth    } else if (document.body && document.body.clientWidth) {        return document.body.clientWidth;    }    return 0;}// Return the available content height space in browser windowfunction getInsideWindowHeight() {    if (window.innerHeight) {        return window.innerHeight;    } else if (isIE6CSS) {        // measure the html element's clientHeight        return document.body.parentElement.clientHeight    } else if (document.body && document.body.clientHeight) {        return document.body.clientHeight;    }    return 0;}var scrollEngaged = false;var scrollInterval;var scrollBars = new Array();function getElementStyle(elemID, IEStyleAttr, CSSStyleAttr) {    var elem = document.getElementById(elemID);    if (elem.currentStyle) {        return elem.currentStyle[IEStyleAttr];    } else if (window.getComputedStyle) {        var compStyle = window.getComputedStyle(elem, "");        return compStyle.getPropertyValue(CSSStyleAttr);    }    return "";}function scrollBar(ownerID, ownerContentID, upID, dnID) {    this.ownerID = ownerID;    this.ownerContentID = ownerContentID;    this.index = scrollBars.length;    this.upButton = document.getElementById(upID);    this.dnButton = document.getElementById(dnID);    this.upButton.index = this.index;    this.dnButton.index = this.index;        this.ownerHeight = parseInt(getElementStyle(this.ownerID, "height", "height"));    this.contentElem = document.getElementById(ownerContentID);    this.contentFontSize = parseInt(getElementStyle(this.ownerContentID,         "fontSize", "font-size"));    this.contentScrollHeight = (this.contentElem.scrollHeight) ?         this.contentElem.scrollHeight : this.contentElem.offsetHeight;    this.initScroll = initScroll;}function initScroll() {    this.upButton.onmousedown = handleScrollClick;    this.upButton.onmouseup = handleScrollStop;    this.upButton.oncontextmenu = blockEvent;    this.dnButton.onmousedown = handleScrollClick;    this.dnButton.onmouseup = handleScrollStop;    this.dnButton.oncontextmenu = blockEvent;        var isIEMac = (navigator.appName.indexOf("Explorer") != -1 && navigator.userAgent.indexOf("Mac") != -1);    if (!isIEMac) {        document.getElementById("innerWrapper0").style.overflow = "hidden";    }}function handleScrollStop() {    scrollEngaged = false;}function blockEvent(evt) {    evt = (evt) ? evt : event;    evt.cancelBubble = true;    return false;}function handleScrollClick(evt) {    var fontSize;    evt = (evt) ? evt : event;    var target = (evt.target) ? evt.target : evt.srcElement;    var index = target.index;    fontSize = scrollBars[index].contentFontSize;    fontSize = (target.className == "lineup") ? fontSize : -fontSize;    scrollEngaged = true;    scrollBy(index, parseInt(fontSize));    scrollInterval = setInterval("scrollBy(" + index + ", " +         parseInt(fontSize) + ")", 100);    evt.cancelBubble = true;    return false;}function scrollBy(index, px) {    var scroller = scrollBars[index];    var elem = document.getElementById(scroller.ownerContentID);    var top = parseInt(elem.style.top);    var scrollHeight = parseInt(scroller.contentScrollHeight);    var height = scroller.ownerHeight;    if (scrollEngaged && top + px >= -scrollHeight + height && top + px <= 0) {        shiftBy(elem, 0, px);    } else {        clearInterval(scrollInterval);    }}function initScrollers() {    scrollBars[0] = new scrollBar("outerWrapper0", "innerWrapper0", "lineup0",         "linedown0");    scrollBars[0].initScroll();}