/*
	Welcome to my javascrpt file
	Please don't directly rip it all off, but feel free to use some of it
*/


// define the jquery '$' global variable, to make JSLint happy
/*global $ */



// Let's not pollute the gobal namespace
var DHDHome = {
	
	options:
	{
		scrollElement: $('#wrapper'),
		scrollTime: 1000,
		backgroundTime: 500,
		superfun:
		{
			last:0
		}
	},

	// here's all the pages, and some information about them…
	pages: {
		
		"home": {
			title: "",
			backgroundColor: "#00B6D1",
			backgroundImage: "/images/home.jpg"
		},
		
		"about": {
			title: "About",
			backgroundColor: "#809f57",
			backgroundImage: "/images/about.jpg"
		},
		
		"contact": {
			title: "Contact",
			backgroundColor: "#248000",
			backgroundImage: "/images/contact.jpg"
		},
		
		"folio": {
			contact: "Portfolio",
			backgroundColor: "#6Fa8ad",
			backgroundImage: "/images/folio.jpg"
		}
		
	},
		
	// animate to the chosen page
	setPage: function(pageName, lastPageName)
	{
		if(this.isValidPage(pageName))
		{
			var targetTopOffset = $('#'+pageName).offset().top + $('#wrapper').attr('scrollTop');
			
			//var targetLeftOffset = $(this.hash).offset().left + $(scrollElement).attr('scrollLeft');
			
			// set target to be set later
			var target = pageName;
			
			// do the animation, but stop any current animations first
			$('#wrapper').stop().animate({scrollTop: targetTopOffset},this.options.scrollTime,
				function()
				{
					// run after the animation
					
					// set the URL to the new anchor
					location.hash = target;
				}
			);
			
			this.setupPage(pageName, lastPageName);
		}
	},
	
	// set the page background, nav bar, title, etc
	setupPage: function(pageName, lastPageName)
	{
		if(this.isValidPage(pageName) && pageName != DHDSite.currentPage)
		{	

			// track page views with Google Analytics
			pageTracker._trackPageview(pageName);

			
			$('body').stop().animate({backgroundColor: this.pages[pageName].backgroundColor},this.options.backgroundTime);
			
			$('#bg_'+DHDSite.currentPage).hide();//stop().fadeOut(this.options.backgroundTime);
			$('#bg_'+pageName)/*.show('slow')*/.stop().fadeIn(this.options.backgroundTime);
			
			
			DHDSite.setupPage(pageName);
			
			
		}
	},
	
	// checks that the location.hash is a valid page, so I don't accidentally remove the background and things like that when the hash is changed without changing the page
	isValidPage: function(pageName)
	{
		return this.pages[pageName] != null;
	},
	
	
	
	/*
	*	Based on some code from Zachstronaut
	*	http://www.zachstronaut.com/posts/2009/01/18/jquery-smooth-scroll-bugs.html
	*	It’s been modified a little, so it works on a single element, rather than the whole page
	*/
	
	setupSmoothScroll: function()
	{
		function filterPath(string)
		{
			return string.replace(/^\//,'').replace(/(index|default).[a-zA-Z]{3,4}$/,'').replace(/\/$/,'');
		}
	
		var locationPath = filterPath(location.pathname);
		
		
		/*
		var scrollElement = 'html, body';
		$('html, body').each(function () {
			var initScrollTop = $(this).attr('scrollTop');
			$(this).attr('scrollTop', initScrollTop + 1);
			if ($(this).attr('scrollTop') == initScrollTop + 1) {
				scrollElement = this.nodeName.toLowerCase();
				$(this).attr('scrollTop', initScrollTop);
				return false;
			}	
		});
		*/
		
		var scrollElement = '#wrapper';
		
		$('a[href*=#]').each(function()
		{
			var thisPath = filterPath(this.pathname) || locationPath;
			
			if (locationPath == thisPath
				&& (location.hostname == this.hostname || !this.hostname)
				&& this.hash.replace(/#/, '')
				)
			{
				if ($(this.hash).length)
				{
					$(this).click(function(event)
					{
						// stop the link from activating
						event.preventDefault();
						
						// set the page
						DHDHome.setPage( (this.hash).substring(1) );
						
						//location.hash = this.hash;

					
					// end of click event	
					});
				
				// end of if hash
				}
			}
		});

	},
	
	
	onHistory: function(e)
	{
		//e.preventDefault();
		
		//alert(e);
		
		//DHDHome.setPage(e);
		
		DHDHome.setPage(location.hash.substring(1));
	},
	
	
	navBackground:
	{
		/*
		normal:	{backgroundPosition:"(0px 0)", color:'#FFF', 'textShadow': '0px 1px 2px #000'},
		hover:	{backgroundPosition:"(-125px 0)", color:'#FFF', 'textShadow': '0px 1px 2px #000'},
		selected: {backgroundPosition:"(-250px 0)", color:'#000', 'textShadow': '0px 1px 2px #fff'}
		*/
		
		normal:	{backgroundPosition:"(0 0px)", color:'#FFF'/*, 'textShadow': '0px 1px 2px #000'*/},
		hover:	{backgroundPosition:"(0 -80px)", color:'#FFF'/*, 'textShadow': '0px 1px 2px #000'*/},
		selected: {backgroundPosition:"(0 -160px)", color:'#000'/*, 'textShadow': '0px -1px 0px #fff'*/}
	},


	getTransformProperty: function (element)
	{
		var properties = ['transform', 'WebkitTransform', 'MozTransform'];
		var p;

		while (p = properties.shift())
		{
			if (typeof element.style[p] != 'undefined')
			{
				return p;
			}
		}
		return false;
	},



	// based on http://www.zachstronaut.com/posts/2009/02/17/animate-css-transforms-firefox-webkit.html
	setupTransform: function()
	{

		if(DHDHome.getTransformProperty(document.getElementById('contact_paper')))
		{
			$('#contact_paper').append('<a href="javascript:void(0)" id="contact_superfun">Super fun fun button</a>');
			$('#contact_superfun').click(function(){


				var div = document.getElementById('contact_paper');
				var property = DHDHome.getTransformProperty(div);

				if (property)
				{
					var limit=500;
					var d = DHDHome.options.superfun.last;
					var superfun = 
					setInterval(
						function () {
							div.style[property] = 'rotate(+' + (d+=1 % 360) + 'deg)';
							if((d-DHDHome.options.superfun.last)>= limit)
							{
								DHDHome.options.superfun.last = d;
								clearInterval(superfun);
							}
						},
						50
					);
				}

				/*
				var div2 = document.getElementById('contact');
				var property2 = DHDHome.getTransformProperty(div2);

				if (property2)
				{
					var d2=0;
					var superfun2=
					setInterval(
						function () {
							div2.style[property2] = 'rotate(+' + (d2+=0.2 % 360) + 'deg)';
						},
						50
					);
				}*/
			});


			
		}
		
		
	},


	
	setup: function()
	{
				
		this.setupSmoothScroll();
		
		
		var currentPage = location.hash.substring(1);
		
		$('#background div').hide();
		
		
		if(this.isValidPage(currentPage))
			this.setPage(currentPage);
		else
			this.setPage("home");
		
		
		
		// setup history 'hijax'
		$.history.init(this.onHistory);
		

		// a little bit of fun…
		this.setupTransform();



		

	}
};



// setup everything when the page is ready…
$(document).ready(function() {
	DHDHome.setup();
});

