Gallery = Class.create({
  element: null,
  displayImage: null,

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

    this.displayImage = this.element.down('img');
    this.element.select('.product-image').each(function(image) {
      var anchor = image.down('a')
      anchor.observe('click', this.loadImage.bindAsEventListener(this));
    }.bind(this));
  },

  loadImage: function(event) {
    var element = Event.element(event);
    event.stop();

    if (this._selectedImage) this._selectedImage.removeClassName('active');
    this._selectedImage = element.up('.product-image');
    this._selectedImage.addClassName('active');

    this.displayImage.src = element.src.replace('-thumb.png', '.jpg');
  }
});
