/*

	Slide-effekt for Drinktips på grans.no
	Laget av Anders Hvidsten @ Siteman AS 2010
	
	Sist endret 23.02.2010

*/


var bredde = 350;
var current = 1;
var forrige;
var neste = 2;

// Velg type
// type 1: Slide
// type 2: Fade
var type = 2;

var oldCurrent;

var bilder = new Array();
bilder[1] = 'img-ruschian';
bilder[2] = 'img-ruschian';
bilder[3] = 'img-ruschian';

bilder[4] = 'img-clubsoda';
bilder[5] = 'img-clubsoda';
bilder[6] = 'img-clubsoda';

bilder[7] = 'img-selters';
bilder[8] = 'img-selters';
bilder[9] = 'img-selters';

bilder[10] = 'img-bitterlemon';
bilder[11] = 'img-bitterlemon';
bilder[12] = 'img-bitterlemon';

bilder[13] = 'img-tonic';
bilder[14] = 'img-tonic';
bilder[15] = 'img-tonic';
bilder[16] = 'img-tonic';
bilder[17] = 'img-tonic';


$(document).ready(function(){
	// FJERN HOVEDMENY
	$("#menu").remove();
	$('#nav').append('<a href="/" title="Tilbake til hovedsiden"><span>Tilbake til hovedsiden</span></a>');
	
	oldCurrent = current;
	var innhold = $("#innhold");
	var artikler = innhold.find(".artikkel");
	
	forrige = artikler.length-1;
	
	var counter = 0;
	var menyKol = $(document.createElement('div'));
	menyKol.attr('id', 'menyKol');
	
	var menyTittel = $(document.createElement('h6'));
	menyTittel.text('Drinker');
	
	var innholdKol = $(document.createElement('div'));
	innholdKol.attr('id', 'innholdKol');
	
	var slideWrapper = $(document.createElement('div'));
	slideWrapper.attr('id', 'slideWrapper');
	var innerSlider = $(document.createElement('div'));
	if(type == 1) {
		innerSlider.attr('id', 'innerSlider');
	}
	else if(type == 2) {
		innerSlider.attr('id', 'innerFader');
	}
	var drinkMeny = $(document.createElement('ul'));
	
	var generelleTips = $(document.createElement('div'));
	generelleTips.attr('id', 'generelleTips');
	
	var slideNav = $(document.createElement('div'));
	slideNav.attr('id', 'relNav');
	var slideNavForrige = $(document.createElement('a'));
	slideNavForrige.attr('id', 'relForrige');
	slideNavForrige.attr('rel', 'dtm-'+forrige);
	slideNavForrige.text('< Forrige');
	var slideNavNeste = $(document.createElement('a'));
	slideNavNeste.attr('id', 'relNeste');
	
	slideNavNeste.attr('rel', 'dtm-'+neste);
	slideNavNeste.text('Neste >')
	slideNav.append(slideNavForrige);
	slideNav.append(slideNavNeste);
	
	$(artikler).each(function(){
		var tittel = $(this).find("h1:first").text();
		var innerart = $(this).find(".innerart");
		// LAGER MENYPUNKTER
		if(counter == 0) {
			var artTittel = $(document.createElement('h6'));
			artTittel.text(tittel);
			generelleTips.append(artTittel);
			generelleTips.append(innerart);
		}
		else {
			var drinkLi = $(document.createElement('li'));
			var drinkLiSpan = $(document.createElement('span'));
			var drinkLiA = $(document.createElement('a'));
			if(counter == 1) {
				drinkLiA.addClass('aktiv');
			}
			
			drinkLiA.attr('id', 'dtm-'+counter);
			//drinkLiA.attr('rel', 'dta-'+counter);
			
			drinkLiSpan.text(tittel);
			
			drinkLiA.append(drinkLiSpan);
			drinkLi.append(drinkLiA);
			drinkMeny.append(drinkLi);
			
			// LAGER INNHOLDET
			var drinkInner = $(document.createElement('div'));
			var drinkTittel = $(document.createElement('h6'));
			drinkTittel.text(tittel);
			drinkInner.attr('id', 'dta-'+counter);
			drinkInner.addClass('drinkInner');
			if(counter == 1 && type == 2) {
				drinkInner.addClass('visible');
			}
			drinkInner.append(drinkTittel);
			drinkInner.append(innerart);
			innerSlider.append(drinkInner);
		}
		counter++;
	});
	menyKol.append(menyTittel);
	menyKol.append(drinkMeny);
	//alert(menyKol.html());
	slideWrapper.append(innerSlider);
	innholdKol.append(slideWrapper);
	innholdKol.append(generelleTips);
	innholdKol.append(slideNav);
	//alert(innholdKol.html());
	innhold.html('');
	innhold.append(menyKol);
	innhold.append(innholdKol);
	
	// LAGE FUNKSJONALITET FOR SLIDER
	$("#menyKol a").click(function() {
		$("#menyKol a").removeClass('aktiv');
		$(this).addClass('aktiv');
		var navDrink = $(this).attr('id');
		current = Number(navDrink.replace('dtm-', ''));
		forrige = current-1;
		if(forrige < 1) {
			forrige = artikler.length-1;
		}
		neste = current+1;
		if(neste > artikler.length-1) {
			neste = 1;
		}
		oppdaterInnhold();
	});
	
	$("#relForrige").click(function() {
		var rel = $(this).attr('rel');
		$("#menyKol a").removeClass('aktiv');
		$("#"+rel).addClass('aktiv');
		current = Number(rel.replace('dtm-', ''));
		forrige = current-1;
		if(forrige < 1) {
			forrige = artikler.length-1;
		}
		neste = current+1;
		if(neste > artikler.length-1) {
			neste = 1;
		}
		oppdaterInnhold();
	});
	
	$("#relNeste").click(function() {
		var rel = $(this).attr('rel');
		$("#menyKol a").removeClass('aktiv');
		$("#"+rel).addClass('aktiv');
		current = Number(rel.replace('dtm-', ''));
		forrige = current-1;
		if(forrige < 1) {
			forrige = artikler.length-1;
		}
		neste = current+1;
		if(neste > artikler.length-1) {
			neste = 1;
		}
		oppdaterInnhold();
	});
	
	function oppdaterInnhold(){
		oppdaterBilde();
		oppdaterForrigeNeste();
		if(type == 1) {
			slideInnhold();
		} else if(type == 2) {
			fadeInnhold();
		}
		oldCurrent = current;
	}
	function slideInnhold() {
		var intID = (current * bredde) - bredde ;
		$('#innerSlider' ).animate({'marginLeft' : ('-' + intID) } , 500);
	}
	function fadeInnhold() {
		$("#dta-"+oldCurrent).fadeOut(200, function() {
			$("#dta-"+current).fadeIn(200);
		})
	}

	function oppdaterForrigeNeste() {
		$("#relForrige").attr('rel', 'dtm-'+forrige);
		$("#relNeste").attr('rel', 'dtm-'+neste);
	}
	
	function oppdaterBilde() {
		var bilde = bilder[current];
		if(!$("#"+bilde).hasClass('visible')) {
			$("#bildeKol .visible").fadeOut(400, function() {
				$(this).removeClass('visible');
				$("#"+bilde).addClass('visible');
				$("#"+bilde).fadeIn(400);
			})
			
			//$("#bildeKol div").removeClass('visible');
			//$("#"+bilde).addClass('visible');
		}
	}
})