
//Requires jQuery.

//wait for the DOM to be loaded
$( document ).ready( function() {
	
	//Generic site elements.
	GenSiteElements.init();
	
	//Layout.
	SetLayout.init();
	
	//IE6 FIX.
	ieSixFix.init();
	
	//Navigation.
	MainNav.init();
	ContentNav.init();
	
	//Home page
	HomePage.init();
	
	//UI
	Ui.init();
	
	/*
	$( 'form div#securityWrapper' ).hide();
	
	$( 'a#securityToggleBtn' ).toggle(
		function(){ $( 'form div#securityWrapper' ).show(); }
		,
		function(){ $( 'form div#securityWrapper' ).hide(); }
	);
	*/
	
} ); //DOM load function


//Handles content navigation.
ContentNav = 
{
	init : function()
	{
		ContentNav.setLayout();
		ContentNav.setNav();
	}
	,
	setLayout : function()
	{
		//Inject dom elements to facilitate graphics.
		$( 'div#contentNavList' ).append( '<div class="headerTopLeft"></div>' );
		$( 'div#contentNavList' ).append( '<div class="headerTopRight"></div>' );
		$( '<div class="header"></div>' ).insertAfter( 'div#contentNavList h3' );
		$( 'div#contentNavList div.header' ).append( '<div class="left"></div>' );
		$( 'div#contentNavList div.header' ).append( '<div class="right"></div>' );
		$( 'div#contentNavList' ).append( '<div class="footer"></div>' );
		$( 'div#contentNavList' ).append( '<div class="footerLeft"></div>' );
		$( 'div#contentNavList' ).append( '<div class="footerRight"></div>' );
	}
	,
	setNav : function()
	{
		$( 'div#contentNav div#contentNavList ul' ).treeview({
			persist: "location",
			collapsed: true,
			unique: true,
			animated: "fast"
		});
	}
};//end ContentNav


//Handles setting extra DOM functionality for generic site elements.
GenSiteElements =
{
	//handles setting up site elements
	init : function()
	{
		//GenSiteElements.setBlockquotes();
		GenSiteElements.setOrderedLists();
		//GenSiteElements.setExternalLinks();
	}//end function init
	,
	//handles setting up block quotes
	setBlockquotes : function()
	{
		$( 'blockquote' ).each( function(){
			var myTitle = $( this ).attr( 'title' );
			var myCite = $( this ).attr( 'cite' );
			$( this ).prepend( '<h3>' + myTitle + '</h3>' );
			$( this ).append( '<p class="cite"><a href=\"' + myCite + '\">Source</a></p>' );
		} );
	}//end function setBlockquotes
	,
	//handles setting ordered list
	setOrderedLists : function( pmLimitSel )
	{
		//Check if limiting selector. Eg: Lightbox setup.
		var mySel = ( pmLimitSel == undefined ) ? "" : pmLimitSel ;
		
		//Edit ordered list dom to allow independant styling of numbers and content.
		$( 'ol li' ).wrapInner( '<span class="olItemContent"></span>' );
		//Activate ordered list styling via adding class - edit styles in stylesheet.
		$( 'ol' ).addClass( 'javaScriptStyled' );
	}
	,
	//handles external links
	setExternalLinks : function()
	{
		$( 'a[rel="external"]' ).each( function(){
			$( this ).addClass( 'externalLink' );
			
		} );
		
		//$( 'a[rel="external"]' ).click( function(){
			
			//window.open( $( this ).attr( 'href' ) );
			//return( false );
		//} );
	}//end function setExternalLinks
	
	
};//end GenSiteElements


//Handles setting up home page.
HomePage = 
{
	init : function()
	{
		//Check if on home page.
		if( !$( 'body' ).hasClass( 'home' ) ){ return; };
		
		HomePage.setHeroImageGallery();
		NewsTicker.init();
		//HomePage.setColumnHeights();
	}
	,
	setHeroImageGallery : function()
	{
		$( 'div#homeBanner div#homebannerImgGallery' ).cycle( { fx: 'fade', timeout: 4000, pause: 0, cleartypeNoBg: true  } );
	}
	,
	setColumnHeights : function()
	{
		/*
		var myHomeColHtArray = new Array();
		myHomeColHtArray.push( $( 'div.homeColumn' ).eq(1).height() );
		myHomeColHtArray.push( $( 'div.homeColumn' ).eq(2).height() );
		myHomeColHtArray.push( $( 'div.homeColumn' ).eq(3).height() );
		var myHeight = 0;
		var myHeightIndex = -1;
		for( var i=0; i < myHomeColHtArray.length; i++ )
		{
			if( myHomeColHtArray[i] > myHeight ){ myHeight = myHomeColHtArray[i]; myHeightIndex = i };
		};//end for
		alert( myHeightIndex + " with " + myHeight );
		
		$( 'div.homeColumn' ).eq(2).children( 'div.showcase' ).eq(0).height( myHeight - 35 );
		*/
	}
}//end HomePage


//Handles IE6 fixes.
//Use on elements which should degrade reasonably gracefully if JavaScript is not available.
ieSixFix = 
{
	init : function()
	{
		ieSixFix.setFooter();
		ieSixFix.setForms();
	}//end init
	,
	setFooter : function()
	{
		$( 'div#footer ul li:first-child' ).addClass( 'first' );
	}
	,
	setForms : function()
	{
		$( 'form input[type="text"]' ).addClass( 'textField' );
		$( 'form input[type="password"]' ).addClass( 'password' );
	}//end setForms
};//end ieSixFix


//Handles main navigation.
MainNav = 
{
	pSelectedClass : 'selected'
	,
	init : function()
	{
		MainNav.setNav();
	}//end init
	,
	setNav : function()
	{
		//Check for selected section. Insert selected class if so.
		$( 'div#nav > ul > li' ).each( function( pmIndex ){
			var myClassList = $( this ).attr( 'class' ).split( ' ' );
			var myHasClass = false;
			for( var i=0; i < myClassList.length; i++ )
			{
				if( $( 'body' ).hasClass( myClassList[i] ) ){ myHasClass = true; break; };
			};//end for
			$( this ).toggleClass( MainNav.pSelectedClass, myHasClass );
		} );
	}//end setNav
};//end MainNav object


//Handles the news ticker.
//Note - had issues with LiScroller plugin.
NewsTicker = 
{
	scrollListId : 'ul#newsTicker'
	,
	velocity : 0
	,
	pScrollIntervalId : 0
	,
	init : function()
	{
		//Inject graphics dom elements.
		//$( NewsTicker.scrollListId ).wrap( '<div id="newsTickerWrapper"></div>' );
		//Show news list.
		//$( 'body.home div#news ul' ).css( 'display', 'block' );
		
		//Set rollover functionality to pause/ unpause ticker.
		$( NewsTicker.scrollListId ).hover(
			function(){
				NewsTicker.stop();
			}
			,
			function(){
				NewsTicker.start();
			}
		);
		
		//start news scrolling.
		//NewsTicker.start( NewsTicker.getScrollWidth(), NewsTicker.velocity );
		
		//Start ticker list at far left of mask (hidden).
		var myMaskWidth = $( NewsTicker.scrollListId ).parent().outerWidth(false);
		$( NewsTicker.scrollListId ).css( "left", myMaskWidth + "px" );
		
		NewsTicker.start();
	}
	,
	start : function( pmTravelWidth, pmVelocity )
	{
		NewsTicker.pScrollIntervalId = setInterval(
			function(){
				var myPosY = $( NewsTicker.scrollListId ).position().left - 3;
				var myLimit = NewsTicker.getListWidth() * -1;
				if( myPosY < myLimit ){ myPosY = $( NewsTicker.scrollListId ).parent().outerWidth(false);; };
				$( NewsTicker.scrollListId ).css( { "left" : myPosY + "px" } );
				//console.log( myLimit, " , ", myPosY );
			}
			,
			40
		);
	}
	,
	stop : function()
	{
		clearInterval( NewsTicker.pScrollIntervalId );
	}
	,
	getListWidth : function()
	{
		var myListWidth = 0;
		$( NewsTicker.scrollListId ).find( 'li' ).each( function(){
			myListWidth += $(this).outerWidth(true);
		} );
		return( myListWidth );
	}
	,
	getScrollWidth : function()
	{
		var myMaskWidth = $( NewsTicker.scrollListId ).parent().outerWidth(false);
		var myListWidth = NewsTicker.getListWidth();
		return( myMaskWidth + myListWidth );
	}
}//end NewsTicker.


//Handles setting layout.
SetLayout = 
{
	init : function()
	{
		SetLayout.setPage(); //Setup page wrapper.
		SetLayout.setNav(); //Setup nav links.
		SetLayout.setHeader(); //Setup header elements.
		SetLayout.setShowcases();
		SetLayout.setLinks();
		SetLayout.setLists();
		SetLayout.setHelp();
		SetLayout.setNotes();
		
	}//end init
	,
	setPage : function()
	{
		//Inject these graphics divs into the page div to facilitate corners and borders.
		$( 'div#page' ).append( '<div class="top"></div>' );
		$( 'div#page' ).append( '<div class="topLeft"></div>' );
		$( 'div#page' ).append( '<div class="topRight"></div>' );
		$( 'div#page' ).append( '<div class="left"></div>' );
		$( 'div#page' ).append( '<div class="right"></div>' );
		$( 'div#page' ).append( '<div class="bottomLeft"></div>' );
		$( 'div#page' ).append( '<div class="bottom"></div>' );
		$( 'div#page' ).append( '<div class="bottomRight"></div>' );
	}//end setPage
	,
	setNav : function()
	{
		//Inject these graphics divs into the main nav links to facilitate corners.
		$( 'div#nav ul li a' ).append( '<span class="left"></span>' );
		$( 'div#nav ul li a' ).append( '<span class="right"></span>' );
	}//end setNav
	,
	setHeader : function()
	{
		//Inject graphics divs into header login form.
		$( 'div#header form#headerLoginForm' ).append( '<div class="left"></div>' );
		$( 'div#header form#headerLoginForm' ).append( '<div class="right"></div>' );
	}//end setHeader
	,
	setShowcases : function()
	{
		//Iterate through showcases.
		$( 'div.showcase' ).each( function( pmIndex ){
			//Wrap all function box content.
			$( this ).wrapInner( '<div class="showcaseContent"></div>' );
			//Get the header ref. Assuming h3 is the main header. Use h4's inside showcase.
			var myHdr = $( this ).find( 'div.showcaseContent h3' );
			//Set alt class if no header found.
			if( myHdr.size() == 0 ){ $( this ).addClass( 'showcaseNoHeader' ); };
			//Move header before content wrapper.
			$( this ).children( 'div.showcaseContent' ).before( myHdr );
		} );
		
		//Inject graphics divs.
		$( 'div.showcase' ).append( '<div class="headerTopLeft"></div>' );
		$( 'div.showcase' ).append( '<div class="headerTopRight"></div>' );
		$( '<div class="header"></div>' ).insertAfter( 'div.showcase h3' );
		$( 'div.showcase div.header' ).append( '<div class="left"></div>' );
		$( 'div.showcase div.header' ).append( '<div class="right"></div>' );
		$( 'div.showcase' ).append( '<div class="footerLeft"></div>' );
		$( 'div.showcase' ).append( '<div class="footer"></div>' );
		$( 'div.showcase' ).append( '<div class="footerRight"></div>' );
		
		//Ensure showcase captures any floated content.
		$( 'div.showcase' ).append( '<div class="clearAll"></div>' );
	}//end setShowcases
	,
	setLinks : function( pmLimitSel )
	{
		//Check if limiting selector. Eg: Lightbox setup.
		var mySel = ( pmLimitSel == undefined ) ? "" : pmLimitSel ;
		
		//Button link list.
		$( mySel + ' ul.buttonLinkList > li > a' ).addClass( 'buttonLink' );
		$( mySel + ' a.buttonLink' ).append( '<span class="left"></span>' );
		$( mySel + ' a.buttonLink' ).append( '<span class="right"></span>' );
		$( mySel + ' ul.buttonLinkList' ).after( '<div class="clearAll"></div>' );
	}
	,
	setLists : function( pmLimitSel )
	{
		//Check if limiting selector. Eg: Lightbox setup.
		var mySel = ( pmLimitSel == undefined ) ? "" : pmLimitSel ;
		
		$( mySel + 'dl.columns' ).each( function( pmIndex ){
			//Wrap dt/dd pairs with divs.						
			var myLength = $(this).children('dt').size();
			for( var i=0; i < myLength; i++ )
			{
				$(this).children( "dt:eq(0),dd:eq(0)" ).wrapAll( '<div></div>' );
			};//end for
			
			//Add clearing div to ensure height of each div.
			$(this).children( 'div' ).append( '<div class="clearAll"></div>' );
			
			//Set class to initiate styling.
			$(this).addClass( 'columnsList' );
			$(this).children( 'div:odd' ).addClass('odd');
			$(this).children( 'div:even' ).addClass('even');
			
		} );
		//$( 'dl.columns > div' ).css( 'border','1px solid #ff0000' );
	}
	,
	setLightboxContent : function()
	{
		//Limit setup to lightbox.
		//Links.
		//$( 'div#lightbox ul.buttonLinkList > li > a' ).addClass( 'buttonLink' );
		//$( 'div#lightbox a.buttonLink' ).append( '<span class="left"></span>' );
		//$( 'div#lightbox a.buttonLink' ).append( '<span class="right"></span>' );
		//$( 'div#lightbox ul.buttonLinkList' ).after( '<div class="clearAll"></div>' );
		SetLayout.setLinks( 'div#lightbox' );
		SetLayout.setLists( 'div#lightbox' );
		SetLayout.setHelp( 'div#lightbox' );
		GenSiteElements.setOrderedLists( 'div#lightbox' );
	}//end setLightboxContent
	,
	setHelp : function( pmLimitSel )
	{
		//Check if limiting selector. Eg: Lightbox setup.
		var mySel = ( pmLimitSel == undefined ) ? "" : pmLimitSel ;
		
		$( mySel + ' a.help' ).wrap( '<div class="helpWrapper"></div>' );
		$( mySel + ' p.help' ).wrap( '<div class="helpWrapper"></div>' );
	}
	,
	setNotes : function()
	{
//		$( 'body' ).append( '<div id="notes"></div>' );
//		$( 'div#notes' ).append( '<p><a id="notesToggle" href="javascript">show notes</a></p>' );
//		$( 'div#notes a#notesToggle' ).toggle( function(){ $( 'div#notesContent' ).show(); $('a#notesToggle').text('hide notes'); }, function(){ $( 'div#notesContent' ).hide(); $('a#notesToggle').text('show notes'); } );
//		$( 'div#notes' ).append( '<div id="notesContent"></div>' );
//		$( 'div#notesContent' ).append( '<ul id="notesLinkList"></ul>' );
//		$( 'ul#notesLinkList' ).append( '<li><a href="home.html">Home</a></li>' );
//		$( 'ul#notesLinkList' ).append( '<li><a href="template_ads.html">Advertisements</a></li>' );
//		$( 'ul#notesLinkList' ).append( '<li><a href="students.html">Students</a></li>' );
//		$( 'ul#notesLinkList' ).append( '<li><a href="pre-launch-registration.html">Pre Launch Registration</a></li>' );
//		$( 'ul#notesLinkList' ).append( '<li><a href="style-guide.html">Style Guide</a></li>' );
//		$( 'ul#notesLinkList' ).append( '<li><a href="template_1column.html">1 Column Template</a></li>' );
//		$( 'ul#notesLinkList' ).append( '<li><a href="template_2column.html">2 Column Template</a></li>' );
//		$( 'ul#notesLinkList' ).append( '<li><a href="template_2columnNav.html">2 Column Template (Nav)</a></li>' );
//		$( 'ul#notesLinkList' ).append( '<li><a href="template_3column.html">3 Column Template</a></li>' );
//		$( 'ul#notesLinkList' ).append( '<li><a href="tools_accordian.html">Tools : Accordian</a></li>' );
//		$( 'ul#notesLinkList' ).append( '<li><a href="tools_lightbox.html">Tools : Light Box</a></li>' );
//		$( 'ul#notesLinkList' ).append( '<li><a href="tools_tables.html">Tools : Tables</a></li>' );
//		$( 'ul#notesLinkList' ).append( '<li><a href="tools_tabs.html">Tools : Tabs</a></li>' );
//		$( 'ul#notesLinkList' ).append( '<li><a href="tools_tooltips.html">Tools : Tool Tips</a></li>' );	
	}
	
}//end SetLayout


//----UI

Ui = 
{
	init : function()
	{
		Ui.setTabs();
		Ui.setDataTables();
		ToolTips.init();
		AccordianTreeList.init();
		Ui.setGraph();
		LightBox.init();
		Ui.setAccordian();
		Ui.setCalendars();
	
	}//end init
	,
	setAccordian : function()
	{
		$( "div.accordion" ).tabs( "div.accordion div.pane", { tabs: 'h2', effect: 'slide', initialIndex: 0 } );
	}//end setAccordian
	,
	setTabs : function()
	{
		//Activate tabs.
		//Single tabs.
		var api = $( 'div.tabs ul.headers' ).tabs( 'div.tabs div.panes > div.pane', { effect: 'fade', fadeInSpeed: 400, fadeOutSpeed: 0, initialIndex: 0, api : true } );
		$( 'div.tabs a.next' ).click( function(){ api.next(); } );
		$( 'div.tabs a.prev' ).click( function(){ api.prev(); } );
		
		//Tabs set (nested).
		$( 'div.tabsSet ul.headers' ).tabs( '> .pane', { initialIndex: 0 } );
	}
	,
	setDataTables : function()
	{
		$( 'table.dataTable' ).dataTable( {
			"bPaginate": true,
			"sPaginationType": "full_numbers",
			"iDisplayLength": 5,
			"bLengthChange": true,
			"bFilter": true,
			"bSort": true,
			"bInfo": true,
			"bAutoWidth": true,
			"oLanguage":
				{
					"sSearch": "Refine your search:",
					"sLengthMenu": 'Display <select><option value="5">5</option><option value="10">10</option><option value="20">20</option><option value="30">30</option><option value="40">40</option><option value="50">50</option><option value="-1">All</option></select> records'
				}
		} );
		
		$('div.dataTables_filter').append('<p class="help tooltip" title="Use this box to refine your Search (eg, Bondi or NOW or 20-25)">Help</p>');
		SetLayout.setHelp();
	}//end setDataTables
	,
	setCalendars : function()
	{
		$('div.datepicker').datepicker({
			inline: true
		});
	}
	,
	setGraph : function()
	{
		//Graph test
		var api = new jGCharts.Api();
		var options =
		{
			data : [[50], [35], [13], [2]],
			type : 'p',
			legend : ['Great','Good','Ok','Bad'],
			axis_labels : ['Great','Good','Ok','Bad'],
			colors : ['9ec3df']
		}
    	$('<img>')
    		.attr('src', api.make(options))
    		.appendTo("div#graphTotal");
			
		var api = new jGCharts.Api();
		var options =
		{
			data : [[78.2], [11.2], [7.4], [3.4]],
			type : 'p',
			legend : ['Great','Good','Ok','Bad'],
			axis_labels : ['Great','Good','Ok','Bad'],
			colors : ['9ec3df']
		}
    	$('<img>')
    		.attr('src', api.make(options))
    		.appendTo("div#graph1");
			
	}//end setGraph
}//end Ui


AccordianTreeList = 
{
	init : function()
	{
		AccordianTreeList.resetAll();
		
		$( 'div.accordianTreeList dt a' ).click(function()
  		{
    		$(this).parent("dt").next("dd").slideToggle(100).siblings("dd").slideUp("fast");
  		});
	}
	,
	resetAll : function()
	{
		$( 'div.accordianTreeList dd' ).hide();
	}
}//AccordianTreeList


LightBox =
{
	init : function()
	{
		LightBox.setDom();
		LightBox.setup();
	}//end init
	,
	setup : function()
	{
		$("a[rel=#lightbox]").overlay( {
			left: "center",
			top: "center",
			onBeforeLoad: function(){
				//Show loading animation.
				var wrap = this.getContent().find( "div.contentWrap" );
				$( wrap ).html( '<img src="images/ajax-loader-indicator-big.gif" style="position: absolute; left: 47%; top: 47%;" />' );
			},
			onLoad: function() { 
	            // grab wrapper element inside content 
	            var wrap = this.getContent().find(".contentWrap"); 
	 			var target = this.getTrigger().attr("href");
				var sel = "div#contentMain";
				var set = target + " " + sel; 
            	// load the page specified in the trigger 
				wrap.load( set, {}, function(){
					FontReplacement.setHeader1(); //Set header 1 for new content.
					SetLayout.setLightboxContent(); //Set links for new content.
					Forms.init(); //Set forms in new content.
				} );
        	},
			expose: { color: '#000000', opacity: 0.5, loadSpeed: 0 }
		} );
	}
	,
	setDom : function()
	{
		$( "body" ).append( '<div id="lightbox"><div class="contentWrap"></div></div>' );
		$( "div#lightbox" ).append( '<div class="topLeft"></div>' );
		$( "div#lightbox" ).append( '<div class="top"></div>' );
		$( "div#lightbox" ).append( '<div class="topRight"></div>' );
		$( "div#lightbox" ).append( '<div class="left"></div>' );
		$( "div#lightbox" ).append( '<div class="right"></div>' );
		$( "div#lightbox" ).append( '<div class="bottomLeft"></div>' );
		$( "div#lightbox" ).append( '<div class="bottom"></div>' );
		$( "div#lightbox" ).append( '<div class="bottomRight"></div>' );
	}//end setDom
}//end LightBox


ToolTips =
{
	init : function()
	{
		//Inject tooltip dom elements.
		$( 'body' ).append( '<div id="tooltip"></div>' );
		
		//Setup tooltip elements.
		$( 'img.tooltip' ).tooltip( { tip: 'div#tooltip', position: 'top center', offset: [-10,0], delay: 0, onBeforeShow: function(){ ToolTips.setToolTip(); } } );
		$( 'a.tooltip' ).tooltip( { tip: 'div#tooltip', position: 'top center', offset: [-10,0], delay: 0, onBeforeShow: function(){ ToolTips.setToolTip(); } } );
		$( 'table tr.new' ).tooltip( { tip: 'div#tooltip', position: 'top center', offset: [-10,0], delay: 0, onBeforeShow: function(){ ToolTips.setToolTip( { ttClass: 'alert' } ); } } );
		$( 'p.tooltip' ).tooltip( { tip: 'div#tooltip', position: 'top center', offset: [-10,0], delay: 0, onBeforeShow: function(){ ToolTips.setToolTip(); } } );
	}
	,
	setToolTip : function( pmParams )
	{
		//Check for parameters.
		if( pmParams == undefined ){ pmParams = { ttClass: '' }; };
		var myClass = pmParams.ttClass;
		$( 'div#tooltip' ).attr( 'class', myClass );
		
		//Add tooltip pointer.
		$( 'div#tooltip' ).append( '<div class="pointer"></div>' );
		//Position pointer.
		var myPosX = ( $( 'div#tooltip' ).outerWidth()/2 ) - 10;
		$( 'div#tooltip div.pointer' ).css( { "left" : myPosX + "px" } );
	}
}//end ToolTips
