var Gallery = Class.create({
  initialize:function(gal_container){
    this.gal_scroll_step  = 74;

    this.gal_container    = gal_container;
    this.gal_big_pic      = this.gal_container.down('div.gal-big-pic img');
    this.gal_big_pic2     = this.gal_container.down('div.gal-big-pic a');
    this.gal_pic_id 	  = $('pic_id');
    this.gal_prev         = this.gal_container.down('a.gal-prev');
    this.gal_next         = this.gal_container.down('a.gal-next');
    this.gal_next         = this.gal_container.down('a.gal-next');
//    this.gal_thumbs_links = this.gal_container.down('ul.gal-thumbs').getElementsByTagName('a');
    this.gal_thumbs_ul    = this.gal_container.down('ul.gal-thumbs');
    this.gal_thumbs_container = this.gal_container.down('div.gal-thumb-container');
    this.gal_nav=this.gal_container.down('div.gal-nav');
    this.gal_offset = 0;
    
    gal_thumbs_w =0;
    $A(this.gal_thumbs_ul.getElementsByTagName('li')).each(function(g_li){
      gal_thumbs_w+=Element.getWidth(g_li);
    })
    
    this.gal_thumbs_ul.setStyle({
      width:gal_thumbs_w+'px'
    })
  
  //this.preloadImages();
  this.setObservers();
  },
  
  setObservers:function(){
    var self = this;
    $A(self.gal_thumbs_links).each(function(thumb_link){
      Event.observe(thumb_link, 'click', self.showBigPic.bindAsEventListener(self))
    })
    
    Event.observe(this.gal_prev,'click', this.scrollThumbs.bindAsEventListener(this));
    Event.observe(this.gal_next,'click', this.scrollThumbs.bindAsEventListener(this));
  },
  
 /*  preloadImages:function(){
      var self =this;
      $A(this.gal_thumbs_links).each(function(gal_thumb_link){
        g_image     = new Image();
        g_image.writeAttribute("src",gal_thumb_link.readAttribute('href'));
      })
   },
 */
  showBigPic:function(event){
    Event.stop(event)
    big_pic_src=event.findElement('a').readAttribute('href')
    big_pic_img_id=event.findElement('img').readAttribute('id').gsub('thumb_','')
//    alert(big_pic_src);
//    this.gal_big_pic.writeAttribute('src', big_pic_src)
    this.gal_big_pic2.writeAttribute('href', big_pic_src)
    this.gal_pic_id.value=big_pic_img_id

  },
  
  scrollThumbs:function(event){
    Event.stop(event)
    scroll_button = Event.element(event);
    
    this.gal_offset=scroll_button.hasClassName('gal-prev') ? 
      //Math.max(this.gal_offset-this.gal_scroll_step, 0) 
      (this.gal_offset-this.gal_scroll_step >= 0 ? this.gal_offset-this.gal_scroll_step : this.gal_thumbs_ul.getWidth()-this.gal_thumbs_container.getWidth() )
      :
      ((this.gal_offset+this.gal_scroll_step > this.gal_thumbs_ul.getWidth()-this.gal_thumbs_container.getWidth()) ? 0 : this.gal_offset+this.gal_scroll_step)
      //Math.min(this.gal_offset+this.gal_scroll_step, this.gal_thumbs_ul.getWidth()-this.gal_thumbs_container.getWidth())
    new Effect.ScrollHorizontal(this.gal_thumbs_container,{to:this.gal_offset, duration:0.5});
  }
})

Event.observe(window,'load', function() {
 $$('div.gal-container').each(function(gallery){
  new Gallery(gallery);
 })
})