function getHash()
{
	var hash = window.location.hash;	

	if (hash) {
		return hash.substring(1);				
	}
}

var currentView;
var isFading = false;

window.addEvent('domready', function() {
	
	var hash = getHash();

	if (hash && document.getElementById(hash))
	{
		setView(hash);
	}
	else
	{
		// Display the default view
		setView("basics");		
	}
});

function setView(view)
{
	if (isFading) {
		return;
	}

	isFading = true;
	
	// Identify the views
	var newView = document.getElementById(view);
	var oldView = currentView;
	
	if (oldView)
	{	
		// Menu Items
		document.getElementById(oldView.id + "-Item").className = "";
		document.getElementById(newView.id + "-Item").className = "current";
		
		// Update the hash to the new view
		window.location.hash = view;
	
		// Fade the views
		oldView.fadeOut({
			onComplete: function() {
				newView.fadeIn({
					onComplete: function() {
						currentView = newView;
						isFading = false;
					}
				});
			}
		});
	
		/* For cross-dissolve:
		newView.fadeIn({
			onComplete: function() { currentView = newView; }
		});
	
		*/
	}
	else
	{
		// Must be first time if currentView hasn't been set, so we just fade in the new view

		document.getElementById(newView.id + "-Item").className = "current";
		window.location.hash = view;

		newView.fadeIn({
			onComplete: function() {
				currentView = newView;
				isFading = false;
			}			
		});
	}
}

Element.prototype.fadeOut = function()
{
	var options = arguments[0];
	if (options) {
		var onCompleteFunction = options.onComplete;
	}
	
	var element = this;
	var duration = 300;
			
	new Fx.Tween(element, {
		duration: duration,
		onComplete: function() {
			element.style.display = 'none';
			if (onCompleteFunction) {
				onCompleteFunction();
			}
		}
	}).start('opacity', 1, 0);			
}

Element.prototype.fadeIn = function()
{
	var options = arguments[0];
	if (options) {
		var onCompleteFunction = options.onComplete;
	}
	else {
		var onCompleteFunction = function() {};
	}		
			
	this.style.display = 'block';
	
	var duration = 300;

	new Fx.Tween(this, {
		duration: duration,
		onComplete: onCompleteFunction
	}).start('opacity', 0, 1);
}