var SliderNews = Class.create();
SliderNews.prototype = {
	initialize: function(idList, idDetails, json, delay, comments) {
		this.idList = idList;
		this.idDetails = idDetails;
		this.delay = delay;
		this.comments = comments; // array che contiene il numero di commenti per articolo

		var loading = '<img src="/polymedia/js/loading.gif" style="margin-top: 140px; margin-left: 150px; padding: 0px;">'
		new Insertion.Top($(this.idDetails), loading);
		this.newstick = new VerticalTicker(this.idList, this.idDetails, 0, this.delay, this.comments); // l'indice di partenza per ora non e' parametrico

		new Ajax.Request(json, {
				method: 'get',
				onSuccess: this.launchNewsTicker.bind(this),
				onFailure: function(){
					$(this.idDetails).update('<div style="margin-top: 140px; text-align: center;">Error</div>');
				}
		});
	},

	launchNewsTicker: function(transport){
		var newsDetails;
		//console.log('before: ' + newsDetails);
		eval(transport.responseText); // defines newsDetails
		//console.log('after: ' + newsDetails);
		this.newstick.start(newsDetails);
	}
};

var VerticalTicker = Class.create();
VerticalTicker.prototype = {
	initialize: function(idList, idDetails, currentIndex, delay, comments) {
		this.idList = idList;
		this.idDetails = idDetails;
		this.delay = delay;
//		this.comments = comments;
		this.currentIndex = currentIndex;
		this.pe = null; // la variabile che contiene il ref al periodical executer
		this.preloadedImage = null;
		this.started = false;
	},

	start: function(newsDetails){
		this.newsDetails = newsDetails;
		
		// imposto il class dell'ul in base al numero degli elementi contenuti
		var length = this.newsDetails.news.length;
		$(this.idList).addClassName('numNews_0'+ length);
		
		// inserisco i titoli nel box che fa il ticker
		for (var i = 0; i < this.newsDetails.news.length; i++) {
			var tot = this.newsDetails.news.length;
			var filename = '';
			if ( tot <= 2) filename = this.newsDetails.news[i].imageThumb_02;
			else if ( tot == 3) filename = this.newsDetails.news[i].imageThumb_03;
			else if ( tot == 4) filename = this.newsDetails.news[i].imageThumb_04;
			else if ( tot <= 6) filename = this.newsDetails.news[i].imageThumb_06;
			else if ( tot <= 8) filename = this.newsDetails.news[i].imageThumb_08;			
			//var dotIndex = filename.lastIndexOf('.');
			//filename = filename.substring(0, dotIndex) + '_0' + length + filename.substring(dotIndex);
			var tagTitle = '<li><h2><a href="'+this.newsDetails.news[i].link+'" title="'+this.newsDetails.news[i].title+'">';
			tagTitle += '<img src="' + filename + '" >';
			tagTitle += '</a></h2></li>';
			new Insertion.Bottom($(this.idList), tagTitle); // bottom cosi' il primo inserito alla fine e' il primo in alto
		}
		//preload della prima immagine
		this.preloadImg(0);
		this.showDetails(0);
		$$('#' + this.idList + ' li')[0].addClassName('sel');
		this.currentIndex = 0;
		this.pe = new PeriodicalExecuter(this.tickerExe.bind(this), this.delay);
		this.started = true;
		// Eventi di hover

		for(var i = 0; i< $$('#' + this.idList + ' li').length; i++){
			Event.observe($$('#' + this.idList + ' li')[i], 'mouseover', this.pauseTickerExe.bind(this, i));
			Event.observe($$('#' + this.idList + ' li')[i], 'mouseout', this.unpauseTickerExe.bind(this,i));	
		}

	},
	
	pauseTickerExe: function(index){
		this.pe.stop();
		this.started = false;

		for (var i=0; i < $$('#' + this.idList + ' li').length; i++){
			if( (i != index) && ($$('#' + this.idList + ' li')[i].hasClassName('sel') )) {
				$$('#' + this.idList + ' li')[i].removeClassName('sel');
			}
		}
		this.currentIndex = index;
		this.preloadImg(index);
		this.showDetails(index);
	},
	
	unpauseTickerExe: function(index){		
		this.tickerExe(); // cosi' non devo aspettare 5 sec per vedere il primo quando tolgo il mouse
		if (this.started == false) {
			this.pe = new PeriodicalExecuter(this.tickerExe.bind(this), this.delay);
			this.started= true;
		}
	},
	
	preloadImg: function(index){
		this.preloadedImage = new Image();
		this.preloadedImage.src = this.newsDetails.news[index].image;
		this.preloadedImage.title = this.newsDetails.news[index].title;
		this.preloadedImage.alt = this.newsDetails.news[index].title;
	},
	
	tickerExe: function(){
		var prevIndex = 0;
		var length = $$('#' + this.idList + ' li').length;
		prevIndex = this.getPrevIndex();
		$$('#' + this.idList + ' li')[prevIndex].removeClassName('sel');
		$$('#' + this.idList + ' li')[this.currentIndex].addClassName('sel');
		
		this.showDetails(this.currentIndex);
		
		if (this.currentIndex == (length - 1)) {
			this.currentIndex = 0;
		}
		else {
			this.currentIndex++;
		}
		// currentIndex gia' incrementato, faccio il preload della prossima immagine
		this.preloadImg(this.currentIndex);
	},
	
	showDetails: function(index){
		$(this.idDetails).update(this.preloadedImage);

		// dettaglio
		var htmlString = '<div class="mainNews ' + this.newsDetails.news[index].position + '"><div class="txtBox_cms">' 
			+ '<h1><a href="' + this.newsDetails.news[index].link + '" target="_top" title="' + this.newsDetails.news[index].title
			+ '">' + this.newsDetails.news[index].title + '</a></h1><p>' + this.newsDetails.news[index].caption;
		htmlString += '</div><span class="retino"></span>';
		new Insertion.Bottom($(this.idDetails), htmlString);
	},
	
	getPrevIndex: function(){
		if(this.currentIndex == 0) {
			prevIndex = $$('#' + this.idList + ' li').length - 1;
		}
		else { 
			prevIndex = this.currentIndex -1;
		}
		return prevIndex;
	}
};