var ProductViewer = Class.create({
	initialize: function(el) {
		this.elem = el;
		this.wrapper = this.elem.down('.wrapper');
		this.index = 0;
		this.display_number = 4;
		nouveaute = this.elem.down('.nouveaute');
		this.nouveaute_width = nouveaute.getWidth() + parseInt(nouveaute.getStyle('margin-left')) + parseInt(nouveaute.getStyle('margin-right'))
		wrapper_width = this.elem.select('.nouveaute').length * this.nouveaute_width;
		this.wrapper.setStyle({width: wrapper_width+'px'});
		
		this.timer = new PeriodicalExecuter(function(pe) {
			this.next(null, true);
		}.bind(this), 5);
	},
	next: function(ev, timer) {
		if(!timer) {
			this.timer.stop();
		}
		this.index++;
		if(this.index >= (this.wrapper.select('.nouveaute').length / this.display_number))
			this.index = 0;
		this.goTo(this.index);
	},
	goTo: function(index) {
		offset = index * (this.nouveaute_width * this.display_number)
		new Effect.Move(this.wrapper, {x: - (offset), mode: 'absolute'})
	}
})

Element._update = Element.update

var Utils = {
  update: function(element, content) {
    // Call "super" update
    if(content)
      Element._update(element, content)
    enable(element);
  }
}

Element.addMethods(Utils);

function enable(element) {
	element.select('.product_viewer').each(function(el) {
		new ProductViewer(el);
	})
}

/*
 * Update body when window loaded
 * $(document.body).update and not document.body.update for bug fix
 */

Event.observe(window, 'load', function() {
//  $(document.body).update($(document.body).innerHTML);
enable($(document.body));
})