/**
 * This JS shows and handles any content in a head-up-display
 * by given HTML-String, width and height
 * 
 * @copyright  2011 Traveltainment
 * @author     Tobias Schwarzkopf
 * @version    1.0
 * @link       http://www.vidado.com/tools/ttHudBox/js/ttHudBoxCustomer_360010.js
 * @since      Datei vorhanden seit 13.05.2011
 * @license    ...
 */
 
/**
 * function for element shortcut
 * @param idName {String} document element name
 * @returns {Object} document element object
 */
 function $Id(idName) {
    return document.getElementById(idName);
 }

/**
 * ttHudBox Instanz
 * @type Object
 */
function ttHudBox(name) {
    this.name = typeof(name) != 'undefined' ? name : 'ttHud';
}

ttHudBox.prototype = {
    /**
     * global variables
     * opac {Float} value of opacity
     * flagHud {Boolean} flag, if hud is displayed
     * flagContent {Boolean} flag, if hudContent is displayed
     * globalContentWidth {Int} width of hudContent
     * globalContentheight {Int} height of hudContent
     */
    opac                     : 0.0,
    flagHud                  : false,
    flagContent              : false,
    globalContentWidth       : 0,
    globalContentHeight      : 0,
    
    /**
     * function for generating a HUD-Box
     * @param url {String} adress of content
     * @param width {Int} width of content
     * @param height {Int} height of content
     */
    ttGenerateHudBox : function(content, contentWidth, contentHeight, customerHeadHeight, ttIframeScroll, isUrl) {
        this.globalContentWidth       = contentWidth;
        this.globalContentHeight      = contentHeight;
        
        //--- generate HUD-Box --------------------------------------
        if($Id('ttHudBox') == null || typeof($Id('ttHudBox')) == 'undefined') {
            var opacDiv = document.createElement('div');        
            var opacDiv_id = document.createAttribute('id');
            opacDiv_id.nodeValue = 'ttHudBox';        
            opacDiv.setAttributeNode(opacDiv_id);
            document.body.appendChild(opacDiv);
            opacDiv.onclick = function() {
                setTimeout('ttHud.ttFadeOutHudBox()', 10);
            }
        }
        
        //--- generate HUD-Box --------------------------------------
        if($Id('ttHudContainer') == null || typeof($Id('ttHudContainer')) == 'undefined') {
            var opacDiv = document.createElement('div');        
            var opacDiv_id = document.createAttribute('id');
            opacDiv_id.nodeValue = 'ttHudContainer';        
            opacDiv.setAttributeNode(opacDiv_id);        
            document.body.appendChild(opacDiv);
        }
        
        //--- fill HUD-Box ------------------------------------------
        this.flagHud = true;
        if (typeof(ttIframeScroll) == 'undefined') {
            ttIframeScroll = 'auto';
        }
        if (typeof(isUrl) == 'undefined' || isUrl !== true) {
            isUrl = false;
        }
        this.ttFillHudBox(content, parseInt(contentWidth), parseInt(contentHeight), ttIframeScroll, isUrl);
    },
    
    /**
     * function for fading in the HUD-Box
     */
    ttFadeInHudBox : function() {
        if (typeof detail != 'undefined' && detail == 'zielgebiet' && navigator.appName == 'Microsoft Internet Explorer') {
                this.opac  = 0.6;
                $Id('ttHudBox').style.filter        = 'alpha(opacity='+(parseInt(this.opac * 100))+')';
                $Id('ttHudBox').style.display       = 'block';
                $Id('ttHudContainer').style.display = 'block';
                return;
        }
        if (this.opac <= 0.6) {
            if (this.opac == 0) {
                $Id('ttHudContentWait').style.display = 'block';
                $Id('ttHudBox').style.display         = 'block';
            }
            $Id('ttHudBox').style.opacity = this.opac;
            $Id('ttHudBox').style.filter  = 'alpha(opacity='+(parseInt(this.opac * 100))+')';
            this.opac += 0.1;
            setTimeout(function(){ttHud.ttFadeInHudBox()}, 10);
        } else {
            this.opac  = 0.6;
            $Id('ttHudContainer').style.display = 'block';
        }
    },
    
    /**
     * function for fading out the HUD-Box
     */
    ttFadeOutHudBox : function() {
        this.flagHud = false;
        if ($Id('ttHudContentDivContent')) {
            $Id('ttHudContentDivContent').innerHTML     = '';
            $Id('ttHudContentDivContent').style.display = 'none';
        }
        if ($Id('ttHudContainer')) {
            $Id('ttHudContainer').innerHTML            = '';
            $Id('ttHudContainer').style.display        = 'none';
        }
        this.flagContent = false;
        if (typeof(detail) != 'undefined' && detail == 'zielgebiet' && navigator.appName == 'Microsoft Internet Explorer') {
                this.opac  = 0.0;
                $Id('ttHudBox').style.filter  = 'alpha(opacity='+(parseInt(this.opac * 100))+')';
                $Id('ttHudBox').style.display = 'none';
                $Id('ttHudBox').innerHTML     = '';
                return;
        }
        if (this.opac >= 0.0) {
            $Id('ttHudBox').style.opacity = this.opac;
            $Id('ttHudBox').style.filter  = 'alpha(opacity='+(parseInt(this.opac * 100))+')';
            this.opac -= 0.1;
            setTimeout('ttHud.ttFadeOutHudBox()', 10);
        } else {
            this.opac = 0.0;
            $Id('ttHudBox').style.display = 'none';
            $Id('ttHudBox').innerHTML     = '';
        }
        if (typeof isMerkzettel != 'undefined' && isMerkzettel === true) {
            isMerkzettel = false;
        }
    },
    
    /**
     * function for opening content as HUD
     * @param url {String} adress of content
     * @param width {Int} width of content
     * @param height {Int} height of content
     */
    ttFillHudBox : function(content, contentWidth, contentHeight, ttIframeScroll, isUrl) {
        $Id('ttHudBox').style.width  = '100%';
        $Id('ttHudBox').style.height = '100%';
        
        var ttFolder = '';
        if (typeof(engine) != 'undefined' && (engine == 'erde' || engine == 'fewo')) {
            ttFolder = '../';
        }
        
        //$Id('ttHudBox').innerHTML = '<iframe src="/tools/ttHudBox/ttHudBoxIframe.html" class="ttHudBoxIframe" width="100%" height="100%" scrolling="no"></iframe>';
        
        $Id('ttHudContainer').style.width  = contentWidth + 'px';
        $Id('ttHudContainer').style.height = (contentHeight + 40) + 'px';
        
        //--- generate content --------------------------------------
        var strHudContent = '<div id="ttHudContentDiv" style="width: ' + contentWidth + 'px; height: ' + (contentHeight + 38) + 'px;">';
        strHudContent    += '   <div id="ttHudContentWait" style="height: ' + contentHeight + 'px; width: ' + (contentWidth - 8) + 'px;"></div>';
        strHudContent    += '   <div id="ttHudContentDivHead" style="width: ' + contentWidth + 'px;">';
        strHudContent    += '       <div class="ttHudContentDivHeadLeft"><img src="/kunden_parameter/expDe/ibe_v2/images/exp/hudBox/ecke_oben_links.gif" border="0"></div>';
        strHudContent    += '       <div class="ttHudContentDivHeadCenter" style="width: ' + (contentWidth - 18)+ 'px;">' + spacerImg + '</div>';
        strHudContent    += '       <div class="ttHudContentDivHeadRight"><img src="/kunden_parameter/expDe/ibe_v2/images/exp/hudBox/ecke_oben_rechts.gif" border="0"></div>';
        strHudContent    += '       ' + clearBothDiv;
        strHudContent    += '       <div id="ttHudContentDivClose" style="left: ' + (contentWidth - 114) + 'px;"><span onclick="setTimeout(\'ttHud.ttFadeOutHudBox()\', 10);" class="hidePrint">Schließen</span></div>';
        strHudContent    += '   </div>';
        if(isUrl) {
            strHudContent    += '   <div id="ttHudContentDivContent" style="width: ' + (contentWidth - 24) + 'px;height: ' + (contentHeight - 30) + 'px;padding-top:30px;">';
            strHudContent    += '       <iframe src="' + content + '" width="' + (contentWidth - 9) + '" height="100%" frameborder="0" scrolling="no"></iframe>';
            strHudContent    += '   </div>';
        } else {
            strHudContent    += '   <div id="ttHudContentDivContent" style="width: ' + (contentWidth - 24) + 'px;height: ' + contentHeight + 'px;">';
            strHudContent    += '       ' + content;
            strHudContent    += '   </div>';
        }
        strHudContent    += '   <div id="ttHudContentDivFoot" style="top: ' + (contentHeight + 19) + 'px; width: ' + contentWidth + 'px;">';
        strHudContent    += '       <div class="ttHudContentDivFootLeft"><img src="/kunden_parameter/expDe/ibe_v2/images/exp/hudBox/ecke_unten_links.gif" border="0"></div>';
        strHudContent    += '       <div class="ttHudContentDivFootCenter" style="width: ' + (contentWidth - 18)+ 'px;">' + spacerImg + '</div>';
        strHudContent    += '       <div class="ttHudContentDivFootRight"><img src="/kunden_parameter/expDe/ibe_v2/images/exp/hudBox/ecke_unten_rechts.gif" border="0"></div>';
        strHudContent    += '       ' + clearBothDiv;
        strHudContent    += '</div>';
        
        //--- fill HUD-Box with content and display it --------------
        $Id('ttHudContainer').innerHTML = strHudContent;
        this.ttFadeInHudBox();
        
        $Id('ttHudContentWait').style.display  = 'none';
        
        //--- position HUD-Box at the center of the window ----------
        setTimeout('ttHud.ttPositionHudContainer(\'' + contentWidth + '\', \'' + contentHeight + '\')', 1);
    },
    
    /**
     * function for positioning the HUD-Box
     * @param contentWidth {Int} width of content
     * @param contentHeight {Int} height of content
     */
    ttPositionHudContainer : function(contentWidth, contentHeight) {
        var scrollPos = 0;
        if (typeof( window.pageYOffset ) == 'number') {
            //--- Netscape compliant --------------------------------
            scrollPos = window.pageYOffset;
        } else if (document.body && document.body.scrollTop) {
            //--- DOM compliant -------------------------------------
            scrollPos = document.body.scrollTop;
        } else if (document.documentElement && document.documentElement.scrollTop) {
            //--- IE6 standards compliant mode ----------------------
            scrollPos = document.documentElement.scrollTop;
        }
        
        var wSize = ttHud.getWinSize();
        
        $Id('ttHudBox').style.width  = wSize.width + 'px';
        $Id('ttHudBox').style.height = wSize.height + 'px';
        
        var hudBoxOffsetWidth        = parseInt($Id('ttHudBox').offsetWidth);
        var hudBoxOffsetHeight       = parseInt($Id('ttHudBox').offsetHeight);
        var hudContainerOffsetWidth  = parseInt(contentWidth);
        var hudContainerOffsetHeight = parseInt(contentHeight);
        
        var centerPosHorizontal = ((wSize.width - hudContainerOffsetWidth) / 2 >= 1 ? ((wSize.width - hudContainerOffsetWidth) / 2) : '0'); 
        var centerPosVertical   = ((wSize.height - hudContainerOffsetHeight) / 2 >= 1 ? ((wSize.height - hudContainerOffsetHeight) / 2) : '0'); 
        
        $Id('ttHudContainer').style.marginLeft = (parseInt(centerPosHorizontal)) + 'px';
        $Id('ttHudContainer').style.marginTop  = (scrollPos + parseInt(centerPosVertical)) + 'px';
        
        var marginLeft = parseInt($Id('ttHudContainer').style.marginLeft);
        var marginTop  = parseInt($Id('ttHudContainer').style.marginTop);
        
        //--- minimum left margin -----------------------------------
        if (hudBoxOffsetWidth < hudContainerOffsetWidth + marginLeft + 15) {
            $Id('ttHudContainer').style.marginLeft = '15px';
        }
        //--- minimum top margin ------------------------------------
        if (hudBoxOffsetHeight < hudContainerOffsetHeight + marginTop + 15) {
            $Id('ttHudContainer').style.marginTop = '15px';
        }
        
        $Id('ttHudBox').style.width = '100%';
        if (hudBoxOffsetWidth < document.body.offsetWidth) {
            $Id('ttHudBox').style.width = (document.body.offsetWidth) + 'px';
        }
        
        $Id('ttHudBox').style.height = '100%';
        if (hudBoxOffsetHeight < document.body.offsetHeight) {
            $Id('ttHudBox').style.height = (document.body.offsetHeight) + 'px';
        }
        
        //--- if body height ist not valid --------------------------
        if (document.body.offsetHeight == 0) {
            $Id('ttHudBox').style.height = '10000px';
        }
        
        if (document.body.offsetHeight > $Id('ttHudBox').offsetHeight) {
            centerPosVertical            = ((document.body.offsetHeight - $Id('ttHudBox').offsetHeight) / 2 >= 1 ? ((document.body.offsetHeight - $Id('ttHudBox').offsetHeight) / 2) : '0'); 
            $Id('ttHudBox').style.height = (document.body.offsetHeight + scrollPos) + 'px';
        }
        
        //--- top margin correction if scrolled ---------------------
        if (scrollPos > 0) {
            $Id('ttHudContainer').style.marginTop = (scrollPos + parseInt(centerPosVertical)) + 'px';
        }
        
        if (ttHud.flagContent == false) {
            setTimeout('ttHud.ttshowContent()', 700);
            ttHud.flagContent = true;
        }
    },
    
    /**
     * function for displaying the HUD-content
     */
    ttshowContent : function() {
        $Id('ttHudContentDivContent').style.display = 'block';
    },
    
    /**
     * function for adapting the HUD-Box at resize action
     */
    ttResizeAction : function () {
        if(ttHud.flagHud && typeof($Id('ttHudBox') != 'undefined') && $Id('ttHudBox')) {
            setTimeout('ttHud.ttPositionHudContainer(' + ttHud.globalContentWidth + ', ' + ttHud.globalContentHeight + ')', 1);
        }
    },
    
    /**
     * function for positioning the HUD-Box
     * @param win {Object} browser window
     * @returns s {Object} window size object
     */
    getWinSize : function(win) {
        if (!win) {
            win = window;
        }
        var s = new Object();
        if (typeof win.innerWidth != 'undefined') {
            s.width  = win.innerWidth;
            s.height = win.innerHeight;
        } else {
            var obj  = this.getBody(win);
            s.width  = parseInt(obj.clientWidth);
            s.height = parseInt(obj.clientHeight);
        }
        return s;
    },
    
    /**
     * function for getting browser mode
     * @param win {Object} window object
     * @returns mode {Object} browser mode object
     */
    getBody : function(win) {
        if (win.document.compatMode && win.document.compatMode == "CSS1Compat") {
            var mode = win.document.documentElement;
        } else {
            var mode = win.document.body || null;
        }
        return mode;
    }
};

/**
 * ttHudBox Instanz
 * @var {Object} ttHud
 */
var ttHud = new ttHudBox('ttHud');

/**
 * event handler for resize action
 */
window.onresize = ttHud.ttResizeAction;