﻿TabControl =
{
    timerId: null,
    msg: new Array("Follow the clues.", "Save the day.", "Click here to begin."),
    newMsg: "",
    arrayCounter: 0,
    counter: 0,
    timeout: 40,

    scroll: function() 
    {

        TabControl.timeout = 40;

        TabControl.newMsg = TabControl.newMsg + TabControl.msg[TabControl.arrayCounter].charAt(TabControl.counter);
        document.getElementById('linkText').innerHTML = TabControl.newMsg;
        TabControl.counter ++;

        if (TabControl.counter >= TabControl.msg[TabControl.arrayCounter].length) 
        {
            TabControl.counter = 0;
            TabControl.timeout = 1000;
            TabControl.newMsg = "";
            TabControl.arrayCounter ++;
            if (TabControl.arrayCounter > 2)
            {
                TabControl.timeout = 3000;
                TabControl.arrayCounter = 0;
            }
        }

        TabControl.timerId = setTimeout("TabControl.scroll()", TabControl.timeout);
        return true;
    },

    initialize: function()
    {
        TabControl.fixTabOffsetAll();

        TabControl.currentTab = "blue";
        TabControl.tabClicked("red");
        document.getElementById('splash').style.display = 'block';
        
//        bg.style.display = 'block';
        TabControl.fixTabOffsetAll(); //For some reason Firefox needs this a second time.
        
    }, 
    
    enterSite: function()
    {
        document.getElementById('splash').style.display = 'none'; 
        document.getElementById('headlines').style.display = 'block';
        document.getElementById('background').style.display = 'block'; 
        TabControl.fixTabOffsetAll(); 
        TabControl.scroll();
    },

    fixTabOffsetAll: function()
    {
        TabControl.fixTabOffset("red");
        TabControl.fixTabOffset("blue");
        TabControl.fixTabOffset("yellow");
        TabControl.fixTabOffset("green");
        TabControl.fixTabOffset("orange");
        TabControl.fixTabOffset("purple");    
        
        var bg = document.getElementById("background");
        var content = document.getElementById("contentDiv");
        var offset = bg.offsetLeft + 100;
        content.style.left = offset.toString() + "px";
        var yOffset = bg.offsetTop + 50;
        content.style.top = yOffset.toString() + "px";
        
        var clip = document.getElementById("clip");
        clip.style.left = offset.toString() + "px";
        clip.style.top = yOffset.toString() + "px";
        
        var headlines = document.getElementById("headlines");
        var headlinesOffset = bg.offsetLeft + 70;
        headlines.style.left = headlinesOffset.toString() + "px";
        
        var bottomLinks = document.getElementById('bottomLinks');
        var bottomLinksOffset = bg.offsetLeft + 100;
        var bottomLinksYOffset = bg.offsetTop + 785;
        bottomLinks.style.left = bottomLinksOffset.toString() + "px";
        bottomLinks.style.top = bottomLinksYOffset.toString() + "px";
        
        var splash = document.getElementById("splashPic");
        var splashOffset = splash.offsetLeft + 43;
        var splashYOffset = splash.offsetTop + 75;
        var splashOverlay = document.getElementById("splashOverlay");
        splashOverlay.style.left = splashOffset.toString() + "px";
        splashOverlay.style.top = splashYOffset.toString() + "px";
        splashOverlay.style.display = 'block';
        
        //ceDiv
        var ceDiv = document.getElementById("ceDiv");
        var ceDivOffset = splash.offsetLeft + 468;
        var ceDivYOffset = splash.offsetTop + 75;
        ceDiv.style.left = ceDivOffset.toString() + "px";
        ceDiv.style.top = ceDivYOffset.toString() + "px";
        ceDiv.style.display = 'block';
        
        
        switch (TabControl.currentTab)
        {
            case "red":
                RedPage.resize();
                break;

            case "blue":
                BluePage.resize();
                break;

            case "yellow":
                YelloPage.resize();
                break;

            case "green":
                GreenPage.resize();
                break;

            case "orange":
                OrangePage.resize();
                break;

            case "purple":
                PurplePage.resize();
                break;
        } 
        
        
    },
        
    fixTabOffset: function(color)
    {
        var bg = document.getElementById("background");
        var tab = document.getElementById(color + "Text");
        var offset = bg.offsetLeft + 43;
        tab.style.left = offset.toString() + "px";
        var yOffset = bg.offsetTop;

        switch (color)
        {
            case "red":
                yOffset += 50;
                break;

            case "blue":
                yOffset += 168;
                break;

            case "yellow":
                yOffset += 287;
                break;

            case "green":
                yOffset += 405;
                break;

            case "orange":
                yOffset += 523;
                break;

            case "purple":
                yOffset += 641;
                break;
        } 
        
        tab.style.top = yOffset.toString() + "px";
        
        TabControl.mouseOverTab(color);
        TabControl.mouseOutTab(color);

    },
    
    tabClicked: function(color)
    {
        if (color != TabControl.currentTab)
        {
            document.getElementById("contentDiv").style.display = 'none';
            document.getElementById("tabBG").src = "images/" + color + "_up.jpg";
            var oldColor = TabControl.currentTab;
            TabControl.currentTab = color;
            TabControl.mouseOutTab(oldColor);
            TabControl.mouseOverTab(color);
            TabControl.loadPage("content/" + color + "Page.xml");
            
            switch (color)
            {
                case "red":
                    RedPage.clicked();
                    break;

                case "blue":
                    BluePage.clicked();
                    break;

                case "yellow":
                    YellowPage.clicked();
                    break;

                case "green":
                    GreenPage.clicked();
                    break;

                case "orange":
                    OrangePage.clicked();
                    break;

                case "purple":
                    PurplePage.clicked();
                    break;
            } 
            document.getElementById("contentDiv").style.display = 'block';            
        }
        document.getElementById('clip').style.display = 'block';
        
    },
    
    mouseOverTab: function(color)
    {
        document.getElementById(color + "Text").src = "images/" + color + "_highlight.gif";
        if (TabControl.currentTab == "red" && color == "yellow")
        {
            var uprising = document.getElementById('uprising');
            if (uprising)
            {
                uprising.style.display = 'block';
            }
        }
        else if (TabControl.currentTab == "red" && color == "green")
        {
            var learn = document.getElementById('learn');
            if (learn)
            {
                learn.style.display = 'block';
            }
        }
    },
    
    mouseOutTab: function(color)
    {
        if (TabControl.currentTab != color)
        {
            document.getElementById(color + "Text").src = "images/" + color + "_text.gif";
        }
        if (TabControl.currentTab == "red" && color == "yellow")
        {
            var uprising = document.getElementById('uprising');
            if (uprising)
            {
                uprising.style.display = 'none';
            }
        }
        else if (TabControl.currentTab == "red" && color == "green")
        {
            var learn = document.getElementById('learn');
            if (learn)
            {
                learn.style.display = 'none';
            }
        }
    },
    
//    loadPage: function(pageUrl)
//    {
//	    if (document.implementation && document.implementation.createDocument)
//	    {
//		    xmlDoc = document.implementation.createDocument("", "", null);
//		    xmlDoc.onload = TabControl.setContent;
//	    }
//	    else if (window.ActiveXObject)
//	    {
//		    xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
//		    xmlDoc.onreadystatechange = function () {
//			    if (xmlDoc.readyState == 4) TabControl.setContent()
//		        };
// 	    }
//	    else
//	    {
//		    alert('Your browser can\'t handle this script');
//		    return;
//	    }

//	    xmlDoc.load(pageUrl);
//    },

    setContentOld: function()
    {
        var contentDiv = document.getElementById('contentDiv');
        
        if (xmlDoc.lastChild)
        {
            if (window.ActiveXObject)
            {                        
                contentDiv.innerHTML = xmlDoc.lastChild.text;
            }
            else
            {
                contentDiv.innerHTML = xmlDoc.lastChild.textContent;            
            }
        }      
    },
    
    loadPage: function(pageUrl) 
    {
    
//        if (XMLHttpRequest)
//        {
        try
        {
            http = new XMLHttpRequest();

            var myurl = pageUrl; 
            http.open("GET", myurl, true);
            http.onreadystatechange = TabControl.setContent;
            http.send(null);
        }
        catch (err)
        {
	        if (document.implementation && document.implementation.createDocument)
	        {
		        xmlDoc = document.implementation.createDocument("", "", null);
		        xmlDoc.onload = TabControl.setContentOld;
	        }
	        else if (window.ActiveXObject)
	        {
		        xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
		        xmlDoc.onreadystatechange = function () {
			        if (xmlDoc.readyState == 4) TabControl.setContentOld()
		            };
 	        }
	        else
	        {
		        alert('Your browser can\'t handle this script');
		        return;
	        }

	        xmlDoc.load(pageUrl);
        }
    },
    
    setContent: function() 
    {
        var contentDiv = document.getElementById('contentDiv');
        if (http.readyState == 4) 
        {
            if (window.ActiveXObject)
            {                        
                contentDiv.innerHTML = http.responseXML.lastChild.text;
            }
            else
            {
                contentDiv.innerHTML = http.responseXML.lastChild.textContent;            
            }
        }
    }, 
    
    fixClip: function()
    {
        document.getElementById("clip").src = "images/clippedClip.gif";
    },
    
    videoClicked: function()
    {
        window.open('video.html');
    }
    
};