/* Create SMI namespace */
if(typeof SMI == "undefined"){ var SMI = {}; }

SMI.Slider = {
	/**
	* Hide contents and send AJAX request for new contents
	*/
	onSlide: function() {
		var year = $('select#year-sel option[selected]').val();
		$('#img-content').addClass('load-screen').removeClass('error-message');
		$('#img-content img').hide();
		$.ajax({
			type: 'GET',
			url: '/t/ajax100.aspx',
			data: 'smiyear=' + year,
			dataType: 'json',
			error: function() {
				SMI.Slider.doError();
			},
			success: function(data) {
				SMI.Slider.update(data);
			}
		});
	},
	/**
	* Update contents with retrieved data and display them
	*/
	update: function(data) {
		var handlePos = $('#handle_year-sel').position();
		$('#img-content img').load(function() {
			$('#img-content img').fadeIn(400);
		});
		$('#img-content img').attr('src', data.img_src);
		$('#text-content').html(data.content);
		$('#text-content div').css('background-position', (handlePos.left - 8) + 'px 0');
		this.updateStepNav();
	},
	/**
	* Display error message
	*/
	doError: function() {
		$('#img-content').removeClass('load-screen').addClass('error-message');
		$('#text-content').html('<div class="error-message"><h2>Ett fel inträffade</h2><p>Ett fel inträffade när nytt innehåll skulle hämtas. Försök igen.</p></div>');
		this.updateStepNav();
	},
	/**
	* Create selectbox and populate it with content from link list
	*/
	createSelect: function() {
		var links = $('#nav-year ul a');
		var contents = '<select id="year-sel">';
		var id = 0;
		for (i = 0; i < links.length; i++) {
			id = links[i].href.split('&');
			id = id[id.length - 1].split('=');
			contents = contents + '<option value="' + id[id.length - 1] + '">' + links[i].innerHTML + '</option>';
		}
		contents = contents + '</select>';
		$('#nav-year ul').replaceWith(contents);
		return links.length;
	},
	/**
	* Update step navigation with correct links
	*/
	updateStepNav: function() {
		var prevYear = $('select#year-sel option[selected]').prev().html();
		var nextYear = $('select#year-sel option[selected]').next().html();
		var newLinks = '';
		if (prevYear && $('select#year-sel option[selected]').prev().val() != '0') {
			newLinks += '<li class="prev"><a href="/' + prevYear + '/">Föregående: ' + prevYear + '</a></li>';
		}
		if (nextYear) {
			newLinks += '<li class="next"><a href="/' + nextYear + '/">Nästa: ' + nextYear + '</a></li>';
		}
		$('#nav-step').html(newLinks);
		this.initStepNav();

	},
	/**
	* Initialize step navigation
	*/
	initStepNav: function() {
		$('#img-content').bind("mouseenter", function() {
			$('#nav-step').fadeIn(300);
		}).bind("mouseleave", function() {
			$('#nav-step').fadeOut(300);
		});
		$('#nav-step li.prev a').click(function(event) {
			event.preventDefault();
			$('select#year-sel option[selected]').attr('selected', '').prev().attr('selected', 'selected');
			$('select#year-sel').change();
		});
		$('#nav-step li.next a').click(function(event) {
			event.preventDefault();
			$('select#year-sel option[selected]').attr('selected', '').next().attr('selected', 'selected');
			$('select#year-sel').change();
		});
	},
	/**
	* Initialize slider component
	*/
	init: function() {
		var labels = this.createSelect();
		$('#text-content .help').html('Dra i reglaget ovan för att välja ett årtal.');
		$('select#year-sel').change(function() {
			SMI.Slider.onSlide();
		});
		$('select#year-sel').accessibleUISlider({ labels: labels, width: 840 });
		/* Hide navigation */
		$('select#year-sel, #nav-year label, #nav-year ul').hide();
		/* Handle step navigation */
		$('#nav-step').fadeOut(400);
		this.initStepNav();
	}
};

jQuery(document).ready(function () {
	SMI.Slider.init();
});