/*
 * Copyright (c) 2007 Collactive. All rights reserved.
 */

if (typeof(Collactive) == 'undefined') {
	Collactive = {};
}

// Visual effects
Collactive.Effects = {
    // Centers an element in the window (not the page!)
    // Optionally centers on a given percentage line
    centerElement: function(element, within, vPercent, hPercent) {
        if (vPercent == null) {
            vPercent = 0.3;
        }
        if (hPercent == null) {
            hPercent = 0.5;
        }

        var dims = Collactive.DomUtils.getWindowDimensions();
        var info = Collactive.DomUtils.getElementInfo(element);

        element.style.position = "absolute";
        element.style.top = Math.floor((dims.height - info.height)*vPercent) + "px";
        element.style.left = Math.floor((dims.width - info.width)*hPercent) + "px";
    },


    // Temporarily invisiblizes (is that a word?!) all elements of the given tagname
    // exceptForParent: parent of nodes we DON'T want to invisiblizes (e.g. our own messageBox)
    // mode: "hide" or "remove" - hide = set "visibility: hidden", remve = remove from parent (used to
    // get Flash movies to shut up on IE). Default is "hide"
    invisiblizeElements: function(tagName, exceptForParent, mode, debug) {
        if (mode == null) {
            mode = "hide";
        }

        if (this.invisibleElements == null) {
            this.invisibleElements = [];
        }

        var elems = document.getElementsByTagName(tagName);
		var l = elems.length;
		var arr = [];
        for (var i = 0; i < l; i++) {
			arr.push(elems[i]);
		}
        for (var i = 0; i < l; i++) {
            if (exceptForParent != null && Collactive.DomUtils.isContained(arr[i], exceptForParent)) {
                continue; // Contained by our exception element
            }

            if (arr[i].style.visibility == "hidden") {
                continue; // Already hidden!
            }
			
            if (mode == "hide") {
               arr[i].style.visibility = "hidden";
                this.invisibleElements[this.invisibleElements.length] = { mode: mode, elem: arr[i] };
            } else if (mode == "remove") {
                var info = Collactive.DomUtils.getElementInfo(arr[i]);

                var holder = document.createElement("div");
                holder.style.cssText = arr[i].style.cssText;
                holder.style.width = info.width + "px";
                holder.style.height = info.height + "px";

                var parent = arr[i].parentNode;
                this.invisibleElements[this.invisibleElements.length] = {
                    mode: mode, elem: arr[i], parent: parent, holder: holder
                };
                parent.replaceChild(holder, arr[i]);
            }
        }
    },


    // Visiblizes (?) all elements we invisiblized
    visiblizeElements: function() {
        if (this.invisibleElements == null) {
            return;
        }

        for (var i = 0; i < this.invisibleElements.length; i++) {
            var item = this.invisibleElements[i];
            if (item.mode == "hide") {
                item.elem.style.visibility = "visible";
            } else if (item.mode == "remove") {
                item.parent.replaceChild(item.elem, item.holder);
            }
        }
        this.invisibleElements = [];
    },


    // Hides all of the page
    hideAll: function() {
        /*
        var docDims = Collactive.DomUtils.getDocumentDimensions();
        var winDims = Collactive.DomUtils.getWindowDimensions();

        var height = docDims.height > winDims.height ? docDims.height : winDims.height;
        var width = docDims.width > winDims.width ? docDims.width : winDims.width;

        this._createCovers();

        this.covers[0].style.position = "absolute";
        this.covers[0].style.top = 0;
        this.covers[0].style.left = 0;
        this.covers[0].style.width = width + "px";
        this.covers[0].style.height = height + "px";
        this.covers[0].style.visibility = "visible";

        this.covers[1].style.visibility = "hidden";
        this.covers[2].style.visibility = "hidden";
        this.covers[3].style.visibility = "hidden";
        */
        this.invisiblizeElements("embed", null, "remove");
        this.invisiblizeElements("object", null, "remove");
        // TODO: hide select only in IE 6 (not 7)
        if (navigator.appName.indexOf("Microsoft") != -1) {
            this.invisiblizeElements("select", null);
        }
    },


    // Hides all of the page, except one or more elements
    hideAllExcept: function(elem) {
        this._createCovers();

        var vPadding = Collactive.COVER_VPADDING;
        var hPadding = Collactive.COVER_HPADDING;

        var docDims = Collactive.DomUtils.getDocumentDimensions();
        var winDims = Collactive.DomUtils.getWindowDimensions();
        var height = docDims.height > winDims.height ? docDims.height : winDims.height;
        var width = docDims.width > winDims.width ? docDims.width : winDims.width;

        var info = Collactive.DomUtils.getElementInfo(elem);

        // Top
        this.covers[0].style.top = 0;
        this.covers[0].style.left = 0;
        this.covers[0].style.width = width + "px";
        this.covers[0].style.height = (info.top - vPadding) + "px";

        // Bottom
        this.covers[1].style.top = (info.top + info.height + vPadding) + "px";
        this.covers[1].style.left = 0;
        this.covers[1].style.width = width + "px";
        this.covers[1].style.height = (height - (info.top + info.height)) + "px";

        // Left
        this.covers[2].style.top = (info.top - vPadding) + "px";
        this.covers[2].style.left = 0;
        this.covers[2].style.width = (info.left - hPadding) + "px";
        this.covers[2].style.height = (info.height + vPadding + vPadding) + "px";

        // Right
        this.covers[3].style.top = (info.top - vPadding) + "px";
        this.covers[3].style.left = (info.left + info.width + hPadding) + "px";
        this.covers[3].style.width = (width - (info.left + info.width + hPadding)) + "px";
        this.covers[3].style.height = (info.height + vPadding + vPadding) + "px";

        for (var i = 0; i < 4; i++) {
            this.covers[i].style.visibility = "visible";
        }
    },

    // Shows the page again (after a hideAll or hideAllExcept)
    showAll: function() {
        /*
        if (this.covers == null) {
            return;
        }

        for (var i = 0; i < 4; i++) {
            this.covers[i].style.visibility = "hidden";
        }
        */

        this.visiblizeElements();
    },


    // Creates the cover divs
    _createCovers: function() {
        if (this.covers) {
            return;
        }

        var styleSheet = [];
        styleSheet[styleSheet.length] = ".collactive_cover {";
        styleSheet[styleSheet.length] = "    -moz-opacity: 0.6;";
        styleSheet[styleSheet.length] = "    opacity: 0.6;";
        styleSheet[styleSheet.length] = "    filter:alpha(opacity=60);";
        styleSheet[styleSheet.length] = "    position: absolute;";
        styleSheet[styleSheet.length] = "    background: black;";
        styleSheet[styleSheet.length] = "    z-index: 9999;";
        styleSheet[styleSheet.length] = "    padding: 0px 0px 0px 0px;";
        styleSheet[styleSheet.length] = "    margin: 0px 0px 0px 0px;";
        styleSheet[styleSheet.length] = "    visibility: hidden;";
        styleSheet[styleSheet.length] = "}";
        Collactive.DomUtils.addStyleSheet(styleSheet.join(""));

        this.covers = [];
        for (var i = 0; i < 4; i++) {
            this.covers[i] = document.createElement("div");
            this.covers[i].className = "collactive_cover";
            Collactive.DomUtils.addToBody(this.covers[i]);
        }
    },


    // Creates a list of <option> elements for each country
    getCountryOptions: function() {
        var options = [];
        for (var code in Collactive.COUNTRY_LIST) {
            var name = Collactive.COUNTRY_LIST[code];
            if (typeof(name) != "string") {
                continue;
            }

            options[options.length] = '<option value="' + code + '">' + name + '</option>';
        }

        return options.join("");
    },


    // Creates a list of <option> elements for each month
    getMonthOptions: function() {
        var options = [];
        for (var i = 0; i < Collactive.MONTH_LIST.length; i++) {
            var month = Collactive.MONTH_LIST[i];
            options[options.length] = '<option value="' + (i + 1) + '">' + month + '</option>';
        }

        return options.join("");
    },


    // Creates a list of <option> elements for the given numeric range
    getRangeAsOptions: function(from, to) {
        var options = [];
        for (var i = from; (to > from ? i <= to : i >= to); (to > from ? i++ : i--)) {
            options[options.length] = '<option value="' + i + '">' + i + '</option>';
        }

        return options.join("");
    },


    // Returns a URL of an assistant image, given its path
    getImageUrl: function(filename) {
		return "http://" + document.location.host + "/images/assistant/" + filename;
    },

    // Flashes around an element
    flashElement: function(elem, color, width, flashLength, times) {
        if (color == null) {
            color = "red";
        }
        if (width == null) {
            width = 2;
        }
        if (flashLength == null) {
            flashLength = 150;
        }
        if (times == null) {
            times = 4;
        }

        var oldCss = elem.style.cssText;
        var timesLeft = times;
        window.setTimeout(function() {
            Collactive.Effects._flashElementImpl(timesLeft, true, elem, color, width, flashLength,
                                                 oldCss);
        }, flashLength);
    },


    // Implementation for flashElement: called repeatedly to flash the element's border
    _flashElementImpl: function(timesLeft, toggle, elem, color, width, flashLength, oldCss) {
        if (toggle) {
            elem.style.border = width + "px" + " solid " + color;
        } else {
            if (oldCss == "") { oldCss = null; }
            elem.style.cssText = oldCss;
        }

        if (!toggle && timesLeft == 0) {
            return;
        }

        toggle = !toggle;
        if (!toggle) {
            timesLeft--;
        }

        window.setTimeout(function() {
            Collactive.Effects._flashElementImpl(timesLeft, toggle, elem, color, width, flashLength,
                                                 oldCss);
        }, flashLength);
    }
};