/*
 * AJAX loader for servers
 */
window.addEvent('domready', function(){
	// Set up container with static height
	var container = $$('.products .servers')[0];
	container.setStyle('height', container.getSize().y);

	// Set up inner container for easy updating of the content
	var innerContainer = new Element('div').inject(container, 'top').adopt(container.getElements('.server'));

	// Set up loader to show while requesting
	var loader = new Element('div', {
		'class': 'loader'
	}).set('opacity', 0).set('tween', {
		duration: 1200
	}).inject(container, 'top');

	// Get elements to add event to
	var elements = $$('.products .cpu li a');

	// Set up requester
	var requester = new Request.HTML({
		link: 'cancel',
		update: innerContainer,
		onRequest: function(){
			// Show loader
			loader.set('opacity', 1);
		},
		onSuccess: function(responseDOM){
			// Update sIFR
			if (sIFR && sIFR.update){
				sIFR.update();
			}
			// Hide loader (with some delay, so sIFR can update in the background)
			(function(){
				loader.fade(0);
			}).delay(3000);
		}
	});

	// Add event to elements
	elements.addEvent('click', function(){
		// Blur link (removes outline)
		this.blur();
		
		// Do not update contents of active item
		if (this.getParent('li').hasClass('active')) return;

		// Set current item to active
		elements.getParent('li').removeClass('active');
		this.getParent('li').addClass('active');

		// Request content
		requester.get('index.ajax.' + this.href.substring(this.href.indexOf('#') + 1) + '.html');
	});
});
