var activeUrl = "";
var activeId = 0;
var navigation;

document.observe("dom:loaded", function() {
	var anchors = $$('#nav a');
	navigation = anchors;

	for(var i = 0; i < anchors.length; i++) {
		
		var anchor = anchors[i];
		
		if(anchor.readAttribute("rel") == "navigation") {
			
			anchor.onclick = function(e) {
				
				var url = clearUrl(this.href);
				
				activeId = this.title;
				SWFAddress.setValue(url);
				this.blur();
				
				return false;
			}
		}
	}
	
});

SWFAddress.onChange = function() {  
     // Your code goes here.  
	var value = clearUrl(SWFAddress.getValue());
	
	if(value == "") {
		return;
	}
	
	httpRequest(value);
	updateNavigation(value);
	updateLanguages(value);
}

function clearUrl(url) {
	
	if(url.substr(0, 7) == "http://") {
		url = url.substr(7);
	} else {
		url = url;
	}
	
	return url.substr(url.indexOf("/")+1);
}


function httpRequest(url) {
	new Ajax.Updater('content', url, {
	  parameters: { ajax: "content" },
		onSuccess: function(transport) {
			new Effect.Opacity('content', { to: 1, duration: 0.1 });
			$('loader').style.display = "none";
		} 
	});
	
	new Effect.Opacity('content', { to: 0, duration: 0.1 });
	$('loader').style.display = "block";
}

function updateLanguages(url) {
	new Ajax.Updater('meta', url, {
	  parameters: { ajax: "languages" }
	});
}

function updateNavigation(url) {
	activeUrl = url;
	
	for(var i = 0; i < navigation.length; i++) {

		if(activeUrl == clearUrl(navigation[i].href)) {
			navigation[i].morph('active', { duration: 0.3, transition: Effect.Transitions.sinoidal,  afterFinish: function(effect) { effect.element.className = 'active';effect.element.style.paddingLeft = ''; } });
		} else {
				//navigation[i].className = "";
				//navigation[i].className = 'inactive';
				navigation[i].morph('padding-left: 17px;', { duration: 0.3, transition: Effect.Transitions.sinoidal, afterFinish: function(effect) { effect.element.className = '';effect.element.style.paddingLeft = ''; } });
		}
	}
}
