/**
 * dynamic_tab_engine.js
 *
 * script file for /store/wireless/services/email/sms_promo.asp
 * dynamic-tab functionality
 *
 */
 
    var page_loaded 		= false;
    var default_height  	= 46; // default
    var extended_background	= '/images/blank.gif'; // default
    var displayType
	var displayType2
	
    function drawTabMatrix() {
        
        var tabs = '';
        var tab_on = tab_matrix.tab_on;
        
        for ( idx in tab_matrix ) {
            
            // skip the tab_on property, it's a duplicate
            if ( idx == "tab_on" ) { continue }
            
            var tab = tab_matrix[idx];
            
            if ( tab.name == tab_on.name ) {
                tab_src = tab_on.on.src;
            } else {
                tab_src = tab.src;
            }
            
            tabs += (
                    '<td width="' + tab.width + '" onclick="setTab(\'' + idx + '\')">'
                +       '<img name="' + tab.name + '" src="' + tab_src + '" width="' + tab.width + '" + height="' + tab.height + '" alt="' + tab.alt + '" border="0">'
                +   '</td>'
            );
        }
        
        var html = (
                '<table cellpadding="0" cellspacing="0" border="0" width="100%">'
            +       '<tr>'
            +           tabs
            +           '<td background="' + extended_background + '"><img src="/images/blank.gif" width="1" height="46" alt=""></td>'
            +       '</tr>'
            +   '</table>'
        );
        
        //document.write( html );
		var tab_matrix_div = document.getElementById("tab_matrix_");
		tab_matrix_div.innerHTML = html;
        
        // turn on the default tab
        setTab('tab_on');
    }
    
	
    function Tab ( name ) {
        
        this.name           = name;
        this.height         = default_height;
        this.width          = "";
        this.alt            = "";
        this.display_height = 0;
        
        return this;
    }
    
	
    function setTab( tab_name ) { 
    
        // the tab that is currently "on"
        var currently_on    = tab_matrix.tab_on;
        
        // the tab that was clicked
        var this_tab        = tab_matrix[tab_name];
        
        // store the tab that was clicked
        tab_matrix.tab_on   = this_tab;
        
        // turn the one that is on to "off" and the clicked one to "on"
        document.images[currently_on.name].src  = currently_on.off.src;
        document.images[this_tab.name].src      = this_tab.on.src;
        
        if ( page_loaded == true ) {
			var currently_on_element 	= document.getElementById( currently_on.name + '_' );
			var this_tab_element 		= document.getElementById( this_tab.name + '_' );
			if (((displayType=="visible")||(displayType=="inherit"))&&(displayType2=="none")) {
				currently_on_element.style.display	= "none";
	            document.images.page_sizer.height 	= tab_matrix.tab_on.display_height;
				this_tab_element.style.display 		= "block";
			}
			else{
				currently_on_element.style.visibility	= "hidden";
	            document.images.page_sizer.height 		= tab_matrix.tab_on.display_height;
				this_tab_element.style.visibility 		= "visible";
			}
        }
    }
    
    
    
    
    function initTabMatrix() {
        
        // set global
        page_loaded = true;
        
        // determine and store the height of each div
        for ( idx in tab_matrix ) {
            var name = tab_matrix[idx].name + "_";
			var div_element = document.getElementById( name );
			tab_matrix[idx].display_height = div_element.clientHeight;
        }
        
        document.images.page_sizer.height = tab_matrix.tab_on.display_height;
		var tab_on_element = document.getElementById( tab_matrix.tab_on.name + '_' );

			if( tab_on_element.currentStyle) {
				displayType = tab_on_element.currentStyle.visibility;
				displayType2 = tab_on_element.currentStyle.display;
			}
			else if (window.getComputedStyle) {
				displayType = document.defaultView.getComputedStyle(tab_on_element,'').getPropertyValue("visibility");
				displayType2 = document.defaultView.getComputedStyle(tab_on_element,'').getPropertyValue("display");
			}
			
			if (((displayType=="visible")||(displayType=="inherit"))&&(displayType2=="none")) {
				tab_on_element.style.display 		= "block";
			}
			else{
				tab_on_element.style.visibility 		= "visible";
			}
		
		drawTabMatrix();
    }
    
   	

	
	function getQuerystringValue ( queryname ) {
	
		var querystring = location.search.substring( 1 ); // drop the ? character
		var fields = querystring.split( '&' );
		var query_value = '';
		
		for ( i=0; i<fields.length; i++ ) {
			var name_value = fields[i].split( '=' );
			
			if ( name_value[0] == queryname ) {
				query_value = name_value[1];
			}
		}
		
		return query_value;
	}
	
	
	
	function setTargetTab ( tab_matrix ) {
	
		var targettab = getQuerystringValue ( "targettab" );
		
		if ( targettab != "" ) {
			
			for ( ttab in tab_matrix ) {
				if ( ttab == "tab_" + targettab ) {
					tab_matrix.tab_on = eval( "tab_matrix.tab_" + targettab);
				}
			}
		}
	}
	
	