(function() {

	// utility function
	function $(id) {
		return document.getElementById(id);
	}
	
	// go down to header
	location.href = '#h';
	scrollTo(0, 0);

	// set current hash & width
	var hash  = location.hash.substr(1);
	var width = window.innerWidth;

	// the previous page url (for back button)
	var prev = null;

	// the update timer
	var timer = null;

	// on load, start periodic updates
	window.onload = function() {

		// we're not in 'site' action, return
		if (!$('list')) return;

		// set update interval
		timer = setInterval(update, 300);

		// attach events on links
		var links = $('list').getElementsByTagName('a');
		for (var i=0; i<links.length; i++) {
			links[i].onclick = function() {
				scrollTo(0, 0);
			}
		}
		
		$('back').onclick = function(event) {
			history.back();
			return false;
		};
	};

	function slide(from, to, back) {

		// slide config
		var steps = 5;
		var duration = 500;

		// percent complete
		var percent = 100;
		var step = percent / steps;

		// show to block
		to.style.display = 'block';

		function slider() {

			percent -= step;

			if (percent <= 0) {
				clearInterval(slimer);
				percent = 0;
			}

			from.style.left = (back ? 100-percent : percent-100)+"%"; // -20% to -100%
			to.style.left = (back ? -percent : percent)+"%"; // 80% to 0%

			if (percent == 0)
				from.style.display = 'none';	
		}
		
		// start sliding
		var slimer = setInterval(slider, duration / steps);
	}

	// check if something changed and update page
	function update() {

		// get current hash
		newHash = location.hash.substr(1);

		if (newHash == "") {
			clearInterval(timer);
			history.go(-1);
		}

		// if hash changed
		if (hash != newHash) {

			// back to list
			if (newHash == 'h') {
				details = hash.split('-')[1];
				slide($('details-'+details), $('list'), 1);
			}
				
			// check details
			else {
				details = newHash.split('-')[1];
				slide($('list'), $('details-'+details), 0);
			}
			
			// go back to header
			scrollTo(0, 0);
			hash = newHash;
		}

		// if orientation changed, go to header
		if (window.innerWidth != width) {
			width = window.innerWidth;
			scrollTo(0, 0);
		}			
	}

})();