﻿var viewportwidth;
var viewportheight;  
var contentsTop = 0;
var toggleTop = 0;

function PageInit()
{
    //if the page doesn't have content[landing] then don't set things up
    if ($chk($('content'))) {  
        reSize();
        addNavigation();
        addToggleContents();
    }
   
    SetCountDown();
    
    if (viewportheight == null || viewportheight == null)
        getViewPort();
}

function SetCountDown()
{
    //Calculate Days Left
    var wedding = new Date(2010, 9, 02);
    var today = new Date();
    
    //Set 1 day in milliseconds
    var one_day=1000*60*60*24;
    
    //Calculate difference btw the two dates, and convert to days
    if ($chk($('daysLeft'))){
        $('daysLeft').set('html',Math.ceil((wedding.getTime()-today.getTime())/(one_day)));
        $('countdown').setStyle('display','inline');
    }
    
    if (this.location.href.contains('index.html'))
    {
        var fx = new Fx.Tween($('countdown'), {
            property: 'opacity',
	        duration: 500, 
	        transition: Fx.Transitions.Quart.easeInOut,
	        link: 'chain'});
        fx.start(1,0).start(0,1);
    }
}

function addNavigation()
{
    //get all the navigation list items and add hover and select events    
    $$('#subNav li').each(function (el){
        el.addEvent('click', subSelect.bind(el));
        el.addEvent('mouseover', subHover);
        el.addEvent('mouseout', subOut);        
    });
}

/* Sub Menu Functions */
function subSelect()
{
    var selLI = this;
    
    //Loop through each subNav's lis and mark the current one to selected.
    $$('#subNav li').each(function (elLI){
        //if it was previously current = mark _sel as inactive and regular as active
        if (elLI.hasClass('current')) {
            elLI.removeClass('current');
            elLI.getElements('img').each( function (elIMG) {
                if (elIMG.hasClass('main')) {
                    elIMG.removeClass('inactive');
                }else{
                    elIMG.addClass('inactive');
                }
            });    
        }
                
        //if the selected one = mark _sel as active and regular as main active
        if (elLI == selLI) {
            elLI.addClass('current');
            elLI.getElements('img').each( function (elIMG) {
                if (elIMG.src.contains('_sel')) {
                    elIMG.removeClass('inactive');
                }else{
                    elIMG.addClass('inactive');
                }
            }); 
        }
    });
    
    //Fire the pages's unique subSelect
    pageSelect();
}

function subHover()
{
    //mark the hover image as the selected one
    this.getElements('img').each( function (elIMG) {
        if (elIMG.src.contains('_hov')) {
            elIMG.removeClass('inactive');
        }else{
            elIMG.addClass('inactive');
        }
    });    
}

function subOut()
{
    var selLI = this;
    //mark the hover image as the selected one
    selLI.getElements('img').each( function (elIMG) {
        if (selLI.hasClass('current')) {
            if (elIMG.src.contains('_sel')) {
                elIMG.removeClass('inactive');
            }else{
                elIMG.addClass('inactive');
            }
        }else{      
            if (elIMG.hasClass('main')) {
                elIMG.removeClass('inactive');
            }else{
                elIMG.addClass('inactive');
            }
        }
    });
}

/* Sub Menu Functions */



function addToggleContents()
{
    var tPos = $('displayToggle').getPosition();
    
    $('displayToggle').addEvent('click', function(){
        if ($('displayToggle').getPosition().y > 0) {
            $('displayToggle').tween('top', tPos, 0);
            $('content').tween('top', tPos, 0-$('content').getSize().y-$('content').getPosition().y);
            $('tHide').setStyle('display','none');
            $('tShow').setStyle('display','inline');
        }else{
            $('displayToggle').tween('top', 0, toggleTop);
            $('content').tween('top', $('content').getPosition().y, contentsTop);
            $('tHide').setStyle('display','inline');
            $('tShow').setStyle('display','none');
        }
    });
}

function reSize()
{
    getViewPort();  
    CenterContainer();
    
    //Set the margins on the bar and the container to the max top and bottom if it might get cut off
    var boxHeight = $('content').getSize().y + $('menu').getSize().y;
    var boxPadding = $('content').getStyle('top').toInt() + $('menu').getStyle('bottom').toInt();
    
    if (boxHeight+boxPadding > viewportheight)
    {
        $('content').setStyle('top','0px');
        $('menu').setStyle('bottom','0px');
        var tTop = $('content').getSize().y - $('displayToggle').getSize().y;
        $('displayToggle').setStyle('top',tTop);
        toggleTop = tTop;
    }
}

function getViewPort()
{             
     // the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight
     if (typeof window.innerWidth != 'undefined') {
          viewportwidth = window.innerWidth,
          viewportheight = window.innerHeight
     }else if (typeof document.documentElement != 'undefined'
         && typeof document.documentElement.clientWidth !=
         'undefined' && document.documentElement.clientWidth != 0) {
            // IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)
            viewportwidth = document.documentElement.clientWidth,
            viewportheight = document.documentElement.clientHeight
     }else{
            // older versions of IE     
            viewportwidth = document.getElementsByTagName('body')[0].clientWidth,
            viewportheight = document.getElementsByTagName('body')[0].clientHeight
     }
     
     //document.writeln('<p>Your viewport width is '+viewportwidth+'x'+viewportheight+'</p>');
     //document.writeln('<p>vs. Mootools: ' + $(window).getWidth() + 'x' + $(window).getHeight() + '</p>');
     
     //use mootools to get window size
//     var mooHeight = $(window).getHeight();
//     var mooWidth = $(window).getWidth();    
}

function CenterContainer() {    
    var cSize = $('content').getSize();         
    var cCtrTop = ((viewportheight - cSize.y)/10);
    var cMdlLeft = ((viewportwidth - cSize.x)/2);
    
    if (cCtrTop < 0)
        cCtrTop =0;
    if (cMdlLeft < 0)
        cMdlLeft  =0;           
    $('content').setStyle('top',cCtrTop);
    $('content').setStyle('left',cMdlLeft);    
    contentsTop = cCtrTop;
    
    $('menu').setStyle('bottom','30px');
    
    //Place the toggle box
    var tSize = $('displayToggle').getSize();
    var tTop = (cCtrTop + cSize.y) - tSize.y;
    var tLeft = cMdlLeft - tSize.x;
    $('displayToggle').setStyle('top',tTop);
    $('displayToggle').setStyle('left',tLeft);   
    toggleTop = tTop;             
}
