/****************************** siemens' new web appearance script *****/
/****************************** Copyright (c) 2007-2009 Siemens AG *****/
/***********************************************************************/
/********************************************* module HeaderVisual *****/
/***********************************************************************/
/************************************** author virtual identity AG *****/
/* $LastChangedDate: 2009-01-13 10:53:52 +0100 (Di, 13 Jan 2009) $ *****/

// swap header visuals

var HeaderVisual = Class.create();

var isHeader = false;

HeaderVisual.initialize = function() {
    if ($("headervisual-zone") && $("headertext-zone")) {
        HeaderVisual.node = $("headervisual-zone");
        HeaderVisual.defaultContentNode = $("headertext-zone").down();
      
       
        $A($("fluid-zone").getElementsByTagName("ul")).findAll(function(elt) {
            return $(elt).hasClassName("js-swap-headervisual");
        }).each(function(elt) {
            $A(elt.getElementsByTagName("li")).each(function(elt) {
                new HeaderVisual($(elt));
                isHeader = true;
            });
        });


        $A($("content-zone").getElementsByTagName("ul")).findAll(function(elt) {
            return $(elt).hasClassName("js-swap-headervisual");
        }).each(function(elt) {
            $A(elt.getElementsByTagName("li")).each(function(elt) {
                new HeaderVisual($(elt));

            });
        });
    }
}

HeaderVisual.prototype = {
    initialize: function(listItem) {
        this.id = listItem.id;
        this.source = headerVisualImages[this.id];
        this.loaded = false;
        this.active = false;

        this.initBgImage();


        listItem.observe("mouseover", function() {
            this.show();

            if (isHeader) {

              

                listItem.className = 'active';
            }

        } .bindAsEventListener(this));

        listItem.observe("mouseout", function() {
            this.hide();

            if (isHeader) {
                listItem.className = '';
                }

        } .bindAsEventListener(this));
    },

    initBgImage: function() {
        this.image = new Image;

        this.image.onload = function() {
            this.loaded = true;
            if (this.active) {
                this.hideProgress();
                this.show();
            }
        } .bindAsEventListener(this);

        this.image.src = this.source;

        this.imageNode = document.createElement("div");
        this.imageNode.className = "swap-image-container";
        this.imageNode.style.backgroundImage = "url(" + this.source + ")";
        HeaderVisual.node.up().insertBefore(this.imageNode, HeaderVisual.node);
    },

    hide: function() {
        this.active = false;
        if (!_recipeMod) {
            HeaderVisual.defaultContentNode.show();
        }

        if (!_recipeMod) {
            $("headertext-" + this.id).removeClassName("active");
        }
        if (this.loaded) {
            this.imageNode.style.display = "none";
        } else {
            this.hideProgress();
        }
    },

    hideProgress: function() {
        // not implemented
    },

    show: function() {
        this.active = true;
        if (!_recipeMod) {
            HeaderVisual.defaultContentNode.hide();
        }
        /** ff 3.0 mac fix removing headertext-container **/
        if (Info.os.isMac && Info.browser.isMozilla) {
            $$('div.headertext-content').each(function(el) {
                if (!_recipeMod) { $(el).removeClassName("active"); }
            });
            $$('div.swap-image-container').each(function(el) {
                if (!_recipeMod) { $(el).style.display = "none"; }
            });
        }

        if (!_recipeMod) { $("headertext-" + this.id).addClassName("active"); }
        if (this.loaded) {
            this.imageNode.style.display = "block";
        } else {
            this.showProgress();
        }
    },

    showProgress: function() {
        // not implemented
    }
}