﻿var diaporamaBG = new Class({
	
	first:true,
	reference:null,
	mode: 'rand',
	modes: ['right','left','alpha','flash'],
	sizes: {w:480,h:240},
	fxOptions: {duration:500},
	fx2Options: {duration:300},
	interval: 5000,
	checkInterval:100,
	display_time: null,
	paused: false,

	initialize: function(items,options)
	{
		if(options) for(var o in options) this[o]=options[o];
		this._thecurrent = (items.length-1);
		this._theprevious = null;		
		this.items = items.setStyles({'display':'none','z-index':'0'});
		this.items.each(function(item,key){item.getElement('img').setStyle('opacity',0);});
		var positions = this.positionsCalcul(this.items[this._thecurrent]);
		var a = positions[this.mode].associate(['p','f','t','u']);
		this.items[this._thecurrent].setStyles($extend({'display':'block','z-index':'2'},JSON.decode('{"'+a.p+'":"'+a.f+a.u+'"}')));
		this.disabled = false;
		this.rand = this.mode=='rand';
		this.sequence = typeof(this.mode)=='object' ? this.mode : false;
		this.curseq = 0;
		this.timer = null;
		this.itemTimer = null;
		// this.createPause();
	},

	positionsCalcul: function(element)
	{
		var winSize = $(window).getSize()
		var tplPos = this.reference.getPosition();
		var tplSize = this.reference.getDimensions();
		var eltSize = $(element).getDimensions();
		var attrs = {
			left:  ['left',winSize.x-tplPos.x,0,'px'],
			right: ['left',-(tplPos.x)-eltSize.x,tplSize.x-eltSize.x,'px'],
			alpha: ['opacity',0,1,''],
			flash: ['opacity',0,1,'']
		};
		return attrs;
	},
	
	walk: function(n,manual)
	{
		if(this._thecurrent!==n && !this.disabled){
			this.disabled = true;
			if(manual){
				this.stop();
			}
			if(this.rand){
				this.mode = this.modes.getRandom();
			}else if(this.sequence){
				this.mode = this.sequence[this.curseq];
				this.curseq += this.curseq+1<this.sequence.length ? 1 : -this.curseq;
			}
			
			this._theprevious = this._thecurrent;
			this._thecurrent = n;
	
			var positions = this.positionsCalcul(this.items[n]);
			var a = positions[this.mode].associate(['p','f','t','u']);

			for(var i=0;i<this.items.length;i++){
				if(this._thecurrent===i){
					this.items[i].getElement('img').setStyle('opacity', 1);
					this.items[i].setStyles($extend({'display':'block','z-index':'2'},JSON.decode('{"'+a.p+'":"'+a.f+a.u+'"}')));
				}else if(this._theprevious===i){
					this.items[i].setStyles({'z-index':'1'});
				}else{
					this.items[i].setStyles({'display':'none','z-index':'0'});
				}
			}
			
			switch (this.mode)
			{
				case 'flash':
					this.items[n].set('tween',this.fxOptions).tween(a.p,a.f,a.t);
					(function(){this.items[n].set('tween',$merge(this.fx2Options,{onComplete:this.onComplete.bind(this)})).tween(a.p,a.t,a.f)}.bind(this)).delay(this.display_time);
					break;
				case 'alpha':
					
					break;
				default:
					this.items[n].set('tween',$merge(this.fxOptions,{onComplete:this.onComplete.bind(this)})).tween(a.p,a.f,a.t);
					if (this.display_time != null) 
						this.itemTimer = this.alphaAnimation.periodical(this.checkInterval,this, a);
					break;
			}
		}
	},
	
	createPause: function() 
	{
		var pause_btn = new Element('a', { href:'javascript:void(0);', style:'color:#ACACAC;position:absolute;left:0;top:0;', html:'Pause' });
		pause_btn.addEvent('click', function(){
			this.pause();
		}.bind(this));
		$(document.body).adopt(pause_btn);
	},
		
	alphaAnimation: function(a) 
	{
		var pos = this.items[this._thecurrent].getPosition(this.reference);
		if ((this.mode == 'left' && pos.x<=a.t-this.display_time) || (this.mode == 'right' && pos.x>=a.t+this.display_time)){
			$clear(this.itemTimer);
			this.items[this._thecurrent].getElement('img').set('tween', this.fx2Options).tween('opacity',1,0);
		}
	},
	
	play: function(wait){
		this.stop();
		if(!wait){
			this.next();
		}
		this.timer = this.next.periodical(this.interval,this,[false]);
	},
	
	pause: function(){
		if (!this.paused)
		{
			this.items[this._thecurrent].get('tween').pause();
			this.paused = true;
			$clear(this.timer);
		}
		else
		{
			this.items[this._thecurrent].get('tween').resume();
			this.paused = false;
			this.play(false);
		}
	},

	stop: function(){
		$clear(this.timer);
	},

	next: function(manual){
		this.walk(this._thecurrent+1<this.items.length ? this._thecurrent+1 : 0,manual);
	},

	previous: function(manual){
		this.walk(this._thecurrent>0 ? this._thecurrent-1 : this.items.length-1,manual);
	},

	onComplete: function(){
		this.disabled = false;
		this.items[this._theprevious].setStyle('display','none');
		if(this.onWalk) this.onWalk(this._thecurrent);
	}
});
