var Showroom = new Class({
	status: true,
	initialize: function() {
		this.container = $('showroom');
		var fade = new Element('img', {'id': 'showFade', 'src': '/images/pages/showrooms/Showroom_1fade.png', 'width': 195, 'height': 153, 'alt': '', 'styles': 
			{'opacity': 0, 'top': '76px', 'left': '203px', 'z-index': '100'}});
		fade.inject(this.container);
		this.per = this.rollFade.periodical(2500);
		this.pos = 0;
		$(document.body).getElement('div.content').getElement('a.button').addEvent('click', function() { showroom.start(); });
	},
	rollFade: function() {	
		var fx = new Fx.Tween($('showFade'), {duration: 2500});

		fx.start('opacity', (showroom.status ? 1 : 0));
		showroom.status = showroom.status ? false : true;
	},
	start: function() {
		$('showFade').destroy();
		var button = $(document.body).getElement('div.content').getElement('a.button');		
		$clear(this.per);
		
		button.getElement('span').getElement('span').set('html', 'Pause');
		button.addEvent('click', function() { showroom.pause(); });
		
		this.procede();
	},
	procede: function() {
		if (this.pos!=0) {
			var allimg = this.container.getElements('img');
			allimg.each(function(element){
				element.setStyle('z-index', '10');
			});
			var las = $('showimg'+this.pos);
			las.setStyle('z-index', '100');
		}
		
		this.pos = (this.pos+1)>17 ? 1 : this.pos+1;
				
		if (!$chk($('showimg'+this.pos))) {
			var img = new Element('img', {'src': '/images/pages/showrooms/show'+this.pos+'.png','width': '657px', 'height': '438px', 'alt': '', 'id': 'showimg'+this.pos, 'styles': {'opacity': 0, 'top': 0, 'left': 0}});
			img.inject(this.container);
			var cur = $('showimg'+this.pos);
			cur.setStyle('z-index', '200');
			img.addEvent('load', function() { showroom.fade(cur); });
		} else  {
			var cur = $('showimg'+this.pos);
			cur.setStyles({'opacity': 0, 'z-index': '200'});
			this.fade(cur);
		}
	},
	fade: function(cur) {
		var fx = new Fx.Tween(cur, {duration: 2500});
		fx.start('opacity', 1);
		
		showroom.theTimer = setTimeout('showroom.procede();', 3500);
		
	},
	
	pause: function() {
		clearTimeout(showroom.theTimer);
		var button = $(document.body).getElement('div.content').getElement('a.button');
		button.removeEvents('click');
		button.getElement('span').getElement('span').set('html', 'Play');
		button.addEvent('click', function(event) { showroom.replay(); });
	},
	
	replay: function() {
		clearTimeout(showroom.theTimer);
		showroom.theTimer = setTimeout('showroom.procede();', 100);
		var button = $(document.body).getElement('div.content').getElement('a.button');		
		button.removeEvents('click');
		button.getElement('span').getElement('span').set('html', 'Pause');
		button.addEvent('click', function() { showroom.pause(); });
	}
});

var showroom;

window.addEvent('domready', function() {
	showroom = new Showroom;
});