Event.observe(window, 'load', init_selector, false);



function init_selector(){

lastvisible = 0;
lfvisible = 0;

xthumbs = $$('.thumb');
xfeatures = $$('.feature');


xhrefs = $$('.thumb a');
timg = $$('.thumb img');
viewports = $$('.viewport');
captions = $$('.caption');


viewports[0].setStyle({'display': 'block'});
//captions[0].setStyle({'display': 'block'});
c= 0;
d= 0

	xfeatures.each(function(item){
	item.prop = d;
	item.status = false;
	d++
	item.onmousedown = function(){
	if(lastvisible != this.prop){
				killByUID(lastvisible);
				if(lastvisible != 0){
				timg[lastvisible-4].removeClassName('active');
			}
				killByUID(lfvisible);
    			showByUID(this.prop);
    			lfvisible = this.prop;
	}
	}
	
	
	
	
	
	
	
	
	});
    xthumbs.each(function(item) {
		item.prop = d;
		item.status = false;
		d++
		item.onmousedown=function() {

		if(!videomode){
				killVidByUID(lastvisible);
    			showVidByUID(this.prop);
    			}
    			killByUID(lfvisible);
    			killByUID(lastvisible);
    			showByUID(this.prop);
if(lastvisible != 0){
    	    	timg[lastvisible-4].removeClassName('active');
				xthumbs[lastvisible-4].status = false;
			
}

	lastvisible = this.prop;
    item.status = true;
    	   	    
    	   	    }
  	 	
  	 
  	 	   
  	 	item.onmouseover=function() {
  	 		timg[this.prop-4].addClassName('active');
  	 	}
  	 	   
  	 	item.onmouseout=function() {
			if(!item.status){
				timg[this.prop-4].removeClassName('active');
			}
  		}   
  	 	   
  	 	   
	});	
	
d= 0;


   viewports.each(function(item) {
		item.prop = d;
		
		 
		 d++;
	});	



}


function killByUID(uid){
      captions[uid].setStyle({'display': 'none'});
}


function showByUID(uid){
   captions[uid].setStyle({'display': 'block'});


}



function killVidByUID(uid){
   viewports[uid].setStyle({'display': 'none'});
}


function showVidByUID(uid){
   viewports[uid].setStyle({'display': 'block'});


}