var Gallery = {
	thumbs: [],
	currentLeft: '',
	currentWidth:'',
    selectedElem: '',
	
	init: function()
        {
          if (!$('product_thumbs'))
        	return ;
          Gallery.currentLeft = parseInt($('product_thumbs').getStyle('left').match(/-?\d+/g));
          //console.log(Gallery.currentWidth);
          Gallery.currentWidth = parseInt($('product_thumbs').getWidth() - 20);
          //console.log(Gallery.currentWidth);
	},
	
	initHover: function(){
        if (!$('product_thumbs'))
                  return ;
		Gallery.thumbs = $('product_thumbs').select("img");
		for(var i=0;i<Gallery.thumbs.length;i++)
                  {
                      if (Gallery.thumbs[i].hasClassName('active_thumb'))
                        {
                        Gallery.selectedElem = Gallery.thumbs[i];
                        }
                      else    
                        Event.observe(Gallery.thumbs[i],'click',Gallery.switchImage);                      
                  }
	},
	
	disableHover: function() {
		//for(var i=0;i<Gallery.thumbs.length;i++) 
                Event.stopObserving(Gallery.selectedElem,'click',Gallery.switchImage);
	},
		
	switchImage: function(){
             //   console.log(this);
        var src = this.src
        var path_pos = src.search('/small/')
        if (path_pos == -1)
          return false;
		//var thumbSrc = this.src.split('?',1);
		//newSrc = thumbSrc.toString().split('_',1);
		var path = src.substr(0, path_pos)+'/medium'+src.substr(path_pos+6);
		var link_path = src.substr(0, path_pos)+'/large'+src.substr(path_pos+6);
		$('product_link').href = link_path;
		new Effect.Fade('product_image', {duration:0.3, from: 1, to: 0.0001});
		setTimeout(function() {$('product_image').src = path }, 300);
		setTimeout(function() {new Effect.Appear('product_image', {duration:0.3});},300);
                Event.observe(Gallery.selectedElem,'click',Gallery.switchImage); 
                Element.removeClassName(Gallery.selectedElem, 'active_thumb')
                Element.addClassName(this, 'active_thumb')
                Gallery.selectedElem = this;
		Gallery.disableHover();
		//setTimeout(function(){console.log('Big image='+$('product_image').src.split('_',1)+'\nThumb Image='+newSrc)},400);
		//setTimeout(function() { Event.observe(Gallery.thumbs[i],'click',Gallery.switchImage);  }, 600);
	},
	
	scrollLeft: function()
        {
		if ((-Gallery.currentLeft + 780) >= Gallery.currentWidth) 
                  {
                      return false;
                  }
		$('scroll_left').removeClassName('scroll_disabled');
		var newLeft = Gallery.currentLeft - 160;
		
		
		new Effect.Move('product_thumbs', {
		  x: -160, y: 0, mode: 'relative',
		  transition: Effect.Transitions.spring
		});
		

		//console.log('scroll left:'+$('product_thumbs').style.left);
		Gallery.currentLeft = newLeft;
		//console.log(Gallery.currentLeft);
		if ((-Gallery.currentLeft + 780) >= Gallery.currentWidth) 
                  {
                      $('scroll_right').addClassName('scroll_disabled'); 
                  }
		
	},
	
	scrollRight: function(){
		if (Gallery.currentLeft >= 0) 
                  {
                      return false;
                  }
		var newLeft = Gallery.currentLeft + 160;
		$('scroll_right').removeClassName('scroll_disabled');
		new Effect.Move('product_thumbs', {
		  x: 160, y: 0, mode: 'relative',
		  transition: Effect.Transitions.spring
		});
		
		//console.log('scroll right:'+$('product_thumbs').style.left);
		Gallery.currentLeft = newLeft;
		if (Gallery.currentLeft >= 0) 
                  {
                      $('scroll_left').addClassName('scroll_disabled'); 
                  }
		//$('product_thumbs').style.left $('product_thumbs').style.left '-63px;';
	}
};

Event.observe(window,'load',function(){Gallery.initHover(); Gallery.init();});