//-------------------------------------------------------------------------
//
// Generic API for getting/setting position attributes.
//
//-------------------------------------------------------------------------

// variables

    /**
      *
      * Browser identification flags.
      *
      */

    var isCSS, isW3C, isIEx, isCompatible;

    function getCSS () { return isCSS; }

// updaters

    /**
      *
      * Sets the browser identification flags or redirects to another page.
      *
      */

    function setVariables ()
    {
        if (document.images) {

            isCSS = (document.body && document.body.style) ? true : false;
            isW3C = (isCSS && document.getElementById) ? true : false;
            isIEx = (isCSS && document.all) ? true : false;
        }
        if (!isW3C && !isIEx) {

            // Redirect
            top.location.href = no_dhtml.html
        }

        isCompatible
              = (document.compatMode)
                && (document.compatMode.indexOf ("CSS1") >= 0);

        return true;
    }

    /**
      *
      * Sets the size of an element to the given width and height.
      * The element is to be identified by its id.
      *
      * @param theElementId the id of the element to be updated.
      *
      * @param theWidth the new width.
      *
      * @param theHeight the new height.
      *
      */

    function setSize (theElementId, theWidth, theHeight)
    {
        var theElement = getElementStyle (theElementId);

        theElement.width = theWidth + "px";
        theElement.height = theHeight + "px";

        return true;
    }

    /**
      *
      * Sets the width of an element to the given value.  The element
      * is to be identified by its id.
      *
      * @param theElementId the id of the element to be updated.
      *
      * @param theWidth the new width.
      *
      */

    function setWidth (theElementId, theWidth)
    {
        var theElement = getElementStyle (theElementId);

        theElement.width = theWidth + "px";

        return true;
    }

    /**
      *
      * Sets the height of an element to the given value.  The element
      * is to be identified by its id.
      *
      * @param theElementId the id of the element to be updated.
      *
      * @param theHeight the new height.
      *
      */

    function setHeight (theElementId, theHeight)
    {
        var theElement = getElementStyle (theElementId);

        theElement.height = theHeight + "px";

        return true;
    }

    /**
      *
      * Sets the position of an element to the given value; if X or Y are
      * negative, then the position relative to the bottom or right is set.
      * The element is to be identified by its id.
      *
      * @param theElementId the id of the element to be updated.
      *
      * @param theXPosition the new X-position.
      *
      * @param theYPosition the new Y-position.
      *
      * @param theZPosition the new Z-position.
      *
      */

    function setPosition (theElementId, theXPosition, theYPosition, theZPosition)
    {
        var theElement = getElementStyle (theElementId);

        // Set X position
        if (theXPosition < 0)
            theElement.right = (-theXPosition) + "px";
        else
            theElement.left = theXPosition + "px";

        // Set Y position
        if (theYPosition < 0)
            theElement.bottom = (-theYPosition) + "px";
        else
            theElement.top = theYPosition + "px";

        // Set Z position
        theElement.zIndex = theZPosition;

        return true;
    }

    /**
      *
      * Sets the X-position of an element to the given value; if X is
      * negative, then the position relative to the right is set.
      * The element is to be identified by its id.
      *
      * @param theElementId the id of the element to be updated.
      *
      * @param theXPosition the new X-position.
      *
      */

    function setXPosition (theElementId, theXPosition)
    {
        var theElement = getElementStyle (theElementId);

        if (theXPosition < 0)
            theElement.right = (-theXPosition) + "px";
        else
            theElement.left = theXPosition + "px";

        return true;
    }

    /**
      *
      * Sets the Y-position of an element to the given value; if Y is
      * negative, then the position relative to the bottom is set.
      * The element is to be identified by its id.
      *
      * @param theElementId the id of the element to be updated.
      *
      * @param theYPosition the new Y-position.
      *
      */

    function setYPosition (theElementId, theYPosition)
    {
        var theElement = getElementStyle (theElementId);

        if (theYPosition < 0)
            theElement.bottom = (-theYPosition) + "px";
        else
            theElement.top = theYPosition + "px";

        return true;
    }

    /**
      *
      * Sets the Z-position of an element to the given value.  The
      * element is to be identified by its id.
      *
      * @param theElementId the id of the element to be updated.
      *
      * @param theZPosition the new Z-position.
      *
      */

    function setZPosition (theElementId, theZPosition)
    {
        var theElement = getElementStyle (theElementId);

        theElement.zIndex = theZPosition;

        return true;
    }

    /**
      *
      * Sets the alignment of an element to the given value.
      *
      * @param theElementId the id of the element to be updated.
      *
      * @param theAlignment the new alignment.
      *
      */

    function setAlignment (theElementId, theAlignment)
    {
        var theElement = getElementStyle (theElementId);

        theElement.align = theAlignment;

        return true;
    }

    /**
      *
      * Shows the element with the given id.
      *
      * @param theElementId the id of the element to be shown.
      *
      */

    function show (theElementId)
    {
        var theElement = getElementStyle (theElementId);

        theElement.visibility = "visible";

        return true;
    }

    /**
      *
      * Hides the element with the given id.
      *
      * @param theElementId the id of the element to be hidden.
      *
      */

    function hide (theElementId)
    {
        var theElement = getElementStyle (theElementId);

        theElement.visibility = "hidden";

        return true;
    }

// inspectors

    /**
      *
      * Returns the available window width.
      *
      * @return an <code>Int</code> giving the available window width.
      *
      */

    function getAvailableWidth ()
    {
        if (typeof (window.innerWidth) == 'number') {

            // Non-IE
            return window.innerWidth;
        }
        else if (isCompatible) {

            return document.body.parentElement.clientWidth;
        }
        else if (document.documentElement
                 && document.documentElement.clientWidth) {

            // IE 6+ in 'standards compliant mode'
            return document.documentElement.clientWidth;
        }
        else if (document.body && document.body.clientWidth) {

            // IE 4 compatible
            return document.body.clientWidth;
        }
        else {

            return 0;
        }
    }

    /**
      *
      * Returns the available window height.
      *
      * @return an <code>Int</code> giving the available window height.
      *
      */

    function getAvailableHeight ()
    {
        if (typeof (window.innerHeight) == 'number') {

            // Non-IE
            return window.innerHeight;
        }
        else if (isCompatible) {

            return document.body.parentElement.clientHeight;
        }
        else if (document.documentElement
                 && document.documentElement.clientHeight) {

            // IE 6+ in 'standards compliant mode'
            return document.documentElement.clientHeight;
        }
        else if (document.body && document.body.clientHeight) {

            // IE 4 compatible
            return document.body.clientHeight;
        }
        else {

            return 0;
        }
    }

    /**
      *
      * Gets an element by its element id.
      *
      * @return the <code>Element</code> with the given element id.
      *
      */

    function getElement (theElementId)
    {
        if (isW3C) {

            return document.getElementById (theElementId);
        }
        else if (isIEx) {

            return document.all (theElementId);
        }
        else {

            return theElementId;
        }
    }

    /**
      *
      * Get an element (or its style object) by its id.
      *
      * @return the <code>Element</code> with the given element id.
      *
      */

    function getElementStyle (theElementId)
    {
        theElement = getElement (theElementId);

        if (theElement.style)
            return theElement.style;
        else
            return theElement;
    }

    /**
      *
      * Returns the value of the "width" attribute of the element with
      * the given id.
      *
      * @return an <code>Int</code> giving the value of the "width"
      *         attribute of the element with the given id.
      *
      */

    function getWidth (theElementId)
    {
//http://bytes.com/topic/javascript/answers/460556-firefox-getcomputedstyle-width-returning-auto
//alert (window.getComputedStyle (getElement (theElementID), null).width);
//alert ("looking for " + theElementId + "; result = " + getElementStyle (theElementId));
//alert ("looking for " + theElementId + "; result = " + window.getComputedStyle (getElement (theElementId), null).getPropertyValue ("width"));
//        return parseInt (window.getComputedStyle (getElement (theElementId), null).getPropertyValue ("width"));
        return parseInt (getElementStyle (theElementId).width);
    }

    /**
      *
      * Returns the value of the "height" attribute of the element with
      * the given id.
      *
      * @return an <code>Int</code> giving the value of the "height"
      *         attribute of the element with the given id.
      *
      */

    function getHeight (theElementId)
    {
        return parseInt (getElementStyle (theElementId).height);
    }

    /**
      *
      * Returns the value of the "top" attribute of the element with
      * the given id.
      *
      * @return an <code>Int</code> giving the value of the "top"
      *         attribute of the element with the given id.
      *
      */

    function getTop (theElementId)
    {
        return parseInt (getElementStyle (theElementId).top);
    }

    /**
      *
      * Returns the value of the "bottom" attribute of the element with
      * the given id.
      *
      * @return an <code>Int</code> giving the value of the "bottom"
      *         attribute of the element with the given id.
      *
      */

    function getBottom (theElementId)
    {
        return parseInt (getElementStyle (theElementId).bottom);
    }

    /**
      *
      * Returns the value of the "left" attribute of the element with
      * the given id.
      *
      * @return an <code>Int</code> giving the value of the "left"
      *         attribute of the element with the given id.
      *
      */

    function getLeft (theElementId)
    {
        return parseInt (getElementStyle (theElementId).left);
    }

    /**
      *
      * Returns the value of the "right" attribute of the element with
      * the given id.
      *
      * @return an <code>Int</code> giving the value of the "right"
      *         attribute of the element with the given id.
      *
      */

    function getRight (theElementId)
    {
        return parseInt (getElementStyle (theElementId).right);
    }

    /**
      *
      * Returns the value of the "zIndex" attribute of the element with
      * the given id.
      *
      * @return an <code>Int</code> giving the value of the "zIndex"
      *         attribute of the element with the given id.
      *
      */

    function getZ (theElementId)
    {
        return parseInt (getElementStyle (theElementId).zIndex);
    }