Gallery = Class.create({
  element: null,
  currentSlide: false,

  initialize: function(element) {
    this.element = $(element);
    if (!this.element) return;

    this.build();
    if (this.slides.length == 1) return;
    this.setupObservers();
  },

  build: function() {
    this.slides = this.element.select('img.slide');
    this.thumbs = this.element.select('#gallery_thumbs img');
    this.showSlide(0, true);
  },

  setupObservers: function() {
    this.thumbs.each(function(thumb) {
      thumb.observe('click', function(e) {
        this.showSlide(this.thumbs.indexOf(thumb), true);
        e.stop();
      }.bind(this));
    }.bind(this));
  },

  showSlide: function(index, immediate) {
    if (this.currentSlide !== false && this.currentSlide == index) return;

    if (immediate) {
      if (this.currentSlide !== false) {
        this.slides[this.currentSlide].setStyle('visibility:hidden');
        if (this.thumbs[this.currentSlide]) this.thumbs[this.currentSlide].removeClassName('active');
      }
      this.slides[index].setStyle('visibility:visible');
      if (this.thumbs[index]) this.thumbs[index].addClassName('active');
      this.currentSlide = index;
    } else {
      
    }
  }
});