Stripe = function(){
    
	//costante
	this.stepno = 12;
	
	this.offset = 0;
	
	this.page = 1;
	
	this.search = null;
	
	this.element = null;
	
	//browser window dimension
	this.clientW = document.documentElement.clientWidth;
	this.clientH = document.documentElement.clientHeight;
	
	//stripe and screens dimension
	//this.width = 5.73 * ( this.clientW / 8 );
	this.width = this.clientW - 128;
	this.height = this.clientH - footerheight - 73;
      
	//step in pixel
	this.step = this.clientW / this.stepno;
    
	//search results and results length
	this.results = null;
	this.lenght = null;
	
	//screens array
	this.screens = new Array();
	
	this.shiftindex;
	this.first = true;
	this.onNext = false;
	this.onPrev = false;
	
	this.build = function(s, o){
		
		this.offset = o;
		
		this.offsetposition = this.offset;
	 	this.shiftindex = this.offset;
		
		//initial position
		if (this.offset == 0)
			this.offsetposition -= 1;
		else if (this.offset == 7)
			this.offsetposition += 1;
		else this.offsetposition -= 1;
	    
		//initial position
		this.initPos = ((this.clientW - this.width) / 2) + ((this.offsetposition) * this.clientW); 
		//actual position
		this.pos = this.initPos;
		//first stop position
		this.stop = this.initPos;
		
		//element attribute set-up
		this.element = document.createElement('DIV');
		this.element.setAttribute("id","stripe");
		this.element.setAttribute("class","stripe");
    	
    		//element style set-up
		this.style = this.element.style;	
		this.style.width = this.width + "px";
		this.style.height = this.height + "px";
		this.style.left = this.initPos + "px";
    	
    		//Build the Screens
    		this.buildScreens(s,0);
    	
    	}
    
    this.buildScreens = function(s, p){

		this.page = p;
		
		var coeff = this.page * 8;
	
		//search results and results length
		this.results = s;
		this.lenght = this.results.length;
		
		for(var i=0; i<this.lenght; i++){
				
			var screen = new Screen(this.results[i], i+coeff, this.width, this.height);
			screen.build();
			this.screens.push(screen);			
			this.element.appendChild(screen.element);
												
		}
		
		this.next();

    }
        
    this.next = function(){
		
		onload_frame = true;    	
    	
		var n = this.lenght - 1;
					
		if(this.shiftindex < n && !this.onNext){	
    		    		
	    	this.stop += this.clientW;
				
			diffr = this.stepno;
			
			//aggiorno l'indice
			if(!this.first) {
				this.screens[this.shiftindex].turnOff();
				this.shiftindex += 1;
			}else this.first = false;
			
			this.onNext = true;
			
			//esegue il movimento	
			this.moveToNext();
			    		
			if(previews != null){
	
				/*new Effect.Move(previews.anchors[(this.lenght - 1) - (this.shiftindex - 1)].id, {
					x: 0, y: previews.move, mode: 'relative', duration: 0.1,
					afterFinish: function(){ new Effect.Move(previews.anchors[n - stripe.shiftindex].id, 
						{x: 0, y: -previews.move, mode: 'relative', duration: 0.1});}});*/
				
				var previous = previews.previews_images[n - stripe.shiftindex + 1];
				
				var current =  previews.previews_images[n - stripe.shiftindex];

				current.style.background="#fff";
				previous.style.background="#93a5c5";
				if((this.shiftindex > ((previews.numberOfImage * previews.page) - 1)) && 
						(this.shiftindex - ((previews.numberOfImage * previews.page) - 1) == 1)) previews.nextPage();
			
			}
    		
    	}
    	
    }
    
    this.moveToNext = function(){	
			
		if(diffr > 0){
												
			stripe.pos = stripe.pos + stripe.step;		
			stripe.style.left = stripe.pos + 'px';
			
			diffr--;
			
			setTimeout(stripe.moveToNext, 0);
			
		}else{
			
			stripe.onNext = false;
			stripe.screens[stripe.shiftindex].turnOn();
			
		}
    
    } 
    
    this.multipleNext = function(i){	

		stripe.screens[stripe.shiftindex].turnOff();
		
		stripe.shiftindex += i;	
									
		stripe.pos = stripe.pos + (i * stripe.clientW);		
		stripe.style.left = stripe.pos + 'px';
		
		stripe.screens[stripe.shiftindex].turnOn();
		
    } 
    
    /************************************************************************************* 
     ************************************************************************************* 
     *************************************************************************************/
    
    this.prev = function(){
		
	onload_frame = true;
	
	var n = this.lenght - 1;
	
	if(this.shiftindex > 0 && !this.onPrev){
    		
    		this.stop -= this.clientW;
    		
    		diffl = this.stepno;
			
		this.screens[this.shiftindex].turnOff();
			
    		this.shiftindex -= 1;
    		
    		this.onPrev = true;
    		
    		this.moveToPrev(); 
    		
    		if(previews != null){
				//mette il bordo in modalit� selezionato
				/*new Effect.Move(previews.anchors[(this.lenght - 1) - (this.shiftindex + 1)].id, {
				  x: 0, y: previews.move, mode: 'relative', duration: 0.1,
				  afterFinish: function(){ new Effect.Move(previews.anchors[n-stripe.shiftindex].id, 
				  		{x: 0, y: -previews.move, mode: 'relative', duration: 0.1});}});*/			
				var previous = previews.previews_images[(this.lenght - 1) - (this.shiftindex + 1)];
				var current =  previews.previews_images[n - stripe.shiftindex];
				current.style.background="#fff";
				previous.style.background="#93a5c5";
				if(this.shiftindex == ((previews.numberOfImage * (previews.page-1)) - 1)) previews.prevPage();

			}
					
    	}
	
    }
    
    this.moveToPrev = function(){
				
		if(diffl > 0){
			
			stripe.pos = stripe.pos - stripe.step;
			
			stripe.style.left = stripe.pos + 'px'; 
						
			diffl--;
					
			setTimeout(stripe.moveToPrev, 0);
		
		}else{
			
			stripe.onPrev = false;
    		stripe.screens[stripe.shiftindex].turnOn();
			
		}
    	
    } 
    
    this.multiplePrev = function(i){	

		stripe.screens[stripe.shiftindex].turnOff();
		
		stripe.shiftindex -= i;	
									
		stripe.pos = stripe.pos - (i * stripe.clientW);		
		stripe.style.left = stripe.pos + 'px';
	
    	stripe.screens[stripe.shiftindex].turnOn();
    		
    }

}

function multipleShift(i){
	
	var oldShiftIndex = (stripe.lenght - 1) - stripe.shiftindex;
	var newShiftIndex = i ;

	if(newShiftIndex != oldShiftIndex){
				
		if(newShiftIndex < oldShiftIndex){
			
			stripe.multipleNext(oldShiftIndex-newShiftIndex);
			 //str.next(i-str.shiftindex);
			 //str.onNext=false;
		}else{
			stripe.multiplePrev(newShiftIndex-oldShiftIndex);
			 //str.prev(str.shiftindex-i)
			 //str.onPrev=false;
		}
	
	}

}