/*
//	jQuery.easing.def = "easeInOutBack";
var arRooms = [ 'fitting-room-furniture-1.png', 'fitting-room-furniture-2.png',
		'fitting-room-furniture-3.png' ];
var nRoom = 0, nCanvas = -1;
var nRoomsCount = arRooms.length;

var arImages = [];
for ( var i = 1; i <= 36; i++) {
	var no = (i >= 10) ? "" + i : "0" + i;
	arImages.push("images/tapete/peisaje/b00" + no + ".jpg");
}
*/

function ValmondeShowroom(options) {

	function log() {
		
		if (window.console && window.console.log)
			window.console.log('[showroom] ' + Array.prototype.join.call(arguments,' '));
		//$('body').append('<div>'+Array.prototype.join.call(arguments,' ')+'</div>');
	};

	var self = this;

	this.options = {
		id : null,
		idStart :"vstart",
		idStop :"vstop",
		idNext :"vnext",
		idPrev :"vprev",
		idNoRepeat : "repeat0",
		idRepeat : "repeat1",
		arRooms : [],
		autoplay : false,
		room : 0,
		msFade :1000,
		arRooms : [],
		arImages : [],
		arLinks : [],
		selected : -1,
		shadow : true,
		roomid : 0
	};

	if (typeof options != 'object')
		return;

	for (prop in options) 
	{
		this.options[prop] = options[prop];
	}
	
	// DISABLE FOR IE -----------------
	if( $.browser.msie)
		this.options.shadow = false;

	if( self.options.selected > -1)
		self.options.selected = self.options.selected - 1;
		
	var nRoomsCount = self.options.arRooms.length;
	var nRoom = self.options.room;
	if( (nRoom >= 0) && (nRoom < self.options.arRooms.length))
	{
		$("#fitting-room-furniture").css( {"background-image" :"url(images/" + self.options.arRooms[nRoom] + ")"});
	}
	else
	{
		$("#fitting-room-furniture").css( {"background-image" :"url()"});
	}
	var nCanvas = self.options.selected; //=-1;

	$('#fitting-room').pngFix();
		
	this.jBtnStart = $('#' + this.options.idStart);
	this.jBtnStop = $('#' + this.options.idStop);
	this.jBtnNext = $('#' + this.options.idNext);
	this.jBtnPrev = $('#' + this.options.idPrev);
	this.jBtnRepeat = $('#' + this.options.idRepeat);
	this.jBtnNoRepeat = $('#' + this.options.idNoRepeat);
	this.jRoomCanvas = $("#fitting-room-canvas");
	if( this.options.shadow)
	{
		this.jCanvas = $("#fitting-room-canvas img");
		if( !this.jCanvas.length)
		{
			// create image
			this.jCanvas = $('<img src=""/>').appendTo(this.jRoomCanvas);
			this.jCanvas.css({
				display : 'block'
				,position : 'absolute'
				,top : 0
				,left : -1000
				,border : '1px solid #ccc'
				,zIndex : 12
			});

			// create shadow
			this.jCanvasSh = $('<div/>').appendTo(this.jRoomCanvas);
			this.jCanvasSh
				.attr('id', 'fitting-room-canvas-sh')
				.css({
					position : 'absolute'
					,top : 0
					,left : -1000
					,width : 100
					,height : 100
					//,border : '1px solid red'
					,display : 'block'
					,zIndex : 11
				})
				.addClass($.browser.msie ? 'x-ie-shadow' : 'x-shadow');
			if( $.browser.msie)
			{
				this.jCanvasSh.get(0).style.filter="progid:DXImageTransform.Microsoft.alpha(opacity=80) progid:DXImageTransform.Microsoft.Blur(pixelradius="+6+")";
				//alert(this.jCanvasSh.prev().get(0).tagName);
				//this.jCanvasSh.insertBefore(this.jCanvasSh.prev());
			}
			else
			{
				this.jCanvasSh.html( '<div class="xst"><div class="xstl"></div><div class="xstc"></div><div class="xstr"></div></div><div class="xsc"><div class="xsml"></div><div class="xsmc"></div><div class="xsmr"></div></div><div class="xsb"><div class="xsbl"></div><div class="xsbc"></div><div class="xsbr"></div></div>');
			}
			
		}
	}
	$("#fitting-room-overlay").css({
		zIndex : 20
		, opacity: 0.1
		, backgroundColor : '#fff'
	});

	var fading = false;
	var timer = 0;
	var started = false;

	$('#deco a').click( function(e) {
		var room = parseInt(this.id.charAt(4));
		self.setDeco(room - 1);
	});

	$('#fitting-room-cmd-decor a').click( function(e) {
		var room = parseInt(this.id.charAt(5));
		self.setDeco(room - 1);
	});

	this.setDeco = function(room) {
		if (nRoom == room)
			return;
			
		$.get('a-ajax-push.php', {'room': room, 'id' : self.options.roomid} );
		
		var divRoom = $("#fitting-room-furniture");
		fading = true;
		divRoom.animate(
			{
				marginLeft :"800px"
			}
			, parseInt(self.options.msFade), "easeInOutBack",
			function() {
				nRoom = room;
				if (nRoom >= nRoomsCount)
					nRoom = -1;
				if (nRoom != -1) {
					var image = "url(images/" + self.options.arRooms[nRoom] + ")";
					divRoom.css( {
						"background-image" :image
					});
					
					divRoom.pngFix();
					
					fading = true;
					divRoom.animate( {
						// marginTop: "0px"
							marginLeft :"0px"
						}, parseInt(self.options.msFade)
						// , 2000
							, "easeInOutBack"
							// , "easeInOutBounce"
							, function() {
								fading = false;
							});
				} else {
					divRoom.css( {
						marginLeft :"0px"
					});
					divRoom.css( {
						"background-image" :"url()"
					});
					fading = false;
				}
			}
		);
	}

	$("#fitting-room-overlay").click( function(event) {
		if( self.options.arLinks[nCanvas])
		{
			window.location = self.options.arLinks[nCanvas]; 
		}
	});

	this.jBtnStop.css( {
		"opacity" :0.3
	});

	this.attach = function(id) {
	}

	this.start = function() {
		log('start');

		if (started) {
			log('skip');
			return;
		}

		started = true;

		self.jBtnStart.css( {
			"opacity" :0.3
		});
		self.jBtnStop.css( {
			"opacity" :1
		});

		play();
	}
	
	function setImage(iCanvas, callback) {

		log( 'nCanvas = ' + iCanvas);
			
		if( !self.options.shadow)
		{
			var src = self.options.arImages[iCanvas];
			
			if( self.jRoomCanvas.css('background-repeat') == 'repeat')
			{
				var pos = src.lastIndexOf('.');
				if( pos != -1)
				{
					var s1 = src.substr(0,pos);
					var s2 = src.substr(pos);
					src = s1 + 'th' + s2;
				}
			}
			
			src = "url(" + src + ")";
			
			self.jRoomCanvas.css( { 'background-image' : src , 'left': 0});
			if(typeof callback == 'function')
				callback();
		}
		else
		{
			var src = self.options.arImages[iCanvas];
			var canvas = self.jCanvas.get(0);
			//canvas.src = src;
			
			var newImg = new Image();
			newImg.src = src;
			
			if( newImg.complete)
			{
				canvas.src = src;
				var w = newImg.width;
				var h = newImg.height;
				self.jCanvas.css('left', (self.jCanvas.parent().innerWidth()-w)/2);
				self.jCanvas.css('top', (320-h)/2);
				
				log('img:', w, h, src);
				
				var pos = self.jCanvas.position();
				var left = pos.left;
				var top = pos.top;
				
				self.jCanvas.css({
					'width' : w
					, 'height' : h
				});
				
				if( $.browser.msie)
				{
					self.jCanvasSh.css({
						'width' : w+3,
						'height' : h-3,
						'left' : left-6,
						'top' : top});
				}
				else
				{
					self.jCanvasSh.css({
						'width' : w+12,
						'height' : h,
						'left' : left-6,
						'top' : top+6});
					$('.xstc', self.jCanvasSh).css({ 'width' : w});
					$('.xsmc', self.jCanvasSh).css({ 'width' : w});
					$('.xsbc', self.jCanvasSh).css({ 'width' : w});
					$('.xsc', self.jCanvasSh).css({ 'height' : h-12});
				}
				self.jCanvasSh.show();
				if(typeof callback == 'function')
					callback();
			}
			else
			{
				newImg.onload = function(){
					log( 'canvas.onload');
					
					canvas.src = src;
					var w = this.width;
					var h = this.height;
					self.jCanvas.css('left', (self.jCanvas.parent().innerWidth()-w)/2);
					self.jCanvas.css('top', (320-h)/2);
					
					log('img:', w, h);
					
					var pos = self.jCanvas.position();
					var left = pos.left;
					var top = pos.top;
					
					self.jCanvas.css({
						'width' : w
						, 'height' : h
					});
					
					if( self.jCanvasSh)
					{
						if( $.browser.msie)
						{
							self.jCanvasSh.css({
								'width' : w+3,
								'height' : h-3,
								'left' : left-6,
								'top' : top});
						}
						else
						{
							self.jCanvasSh.css({
								'width' : w+12,
								'height' : h,
								'left' : left-6,
								'top' : top+6});
							$('.xstc', self.jCanvasSh).css({ 'width' : w});
							$('.xsmc', self.jCanvasSh).css({ 'width' : w});
							$('.xsbc', self.jCanvasSh).css({ 'width' : w});
							$('.xsc', self.jCanvasSh).css({ 'height' : h-12});
						}
						self.jCanvasSh.show();
					}
					if(typeof callback == 'function')
						callback();
				}
			}
		}
	}

	function play() {

		log('fade out');
		self.jRoomCanvas.animate( 
			{
				opacity :0
			}
			, 1000
			, "linear"
			, function() {
			
				nCanvas++;
				if (nCanvas >= self.options.arImages.length)
					nCanvas = 0;
				
				setImage(nCanvas, function(){
					log('fade in');
					self.jRoomCanvas.animate( 
						{
							opacity :1
						}
						, 1000
						, "linear"
						, function() {
							timer = setTimeout( function() {
								started && play();
								}
								, 3000);
							log('timer', timer);
						}
					);
				});
			}
		);
	}

	this.stop = function() {
		log('stop');

		if (started) {
			clearTimeout(timer);
			timer = 0;
			log('clearTimeout');
			log(timer);
			started = false;

			self.jBtnStart.css( {
				opacity :1
			});
			self.jBtnStop.css( {
				opacity :0.3
			});
		}
	}

	this.next = function() {
		self.stop();

		nCanvas++;
		if (nCanvas >= self.options.arImages.length)
			nCanvas = 0;
		setImage(nCanvas);
	}

	this.prev = function() {
		self.stop();

		nCanvas--;
		if (nCanvas < 0)
			nCanvas = self.options.arImages.length -1;
		setImage(nCanvas);
	}

	// $(document).accesskey('ctrl+left', self.prev, false);
	$(document).accesskey('ctrl+left', self.prev, false);
	$(document).accesskey('ctrl+right', self.next, false);
	$(document).accesskey('ctrl+up', self.start, false);
	$(document).accesskey('ctrl+down', self.stop, false);
	$(document).accesskey('ctrl+space', function() {
		self.setDeco(nRoom + 1);
	}, false);
	/*
	 * $(document).keydown( function (e) { if( window.console)
	 * window.console.log(e.keyCode);
	 * 
	 * switch(e.keyCode) { case 37 : // arrow left self.prev(); return
	 * false; break;
	 * 
	 * case 39 : // arrow right self.next(); break;
	 * 
	 * case 38 : // arrow up self.start(); break;
	 * 
	 * case 40 : // arrow down self.stop(); break;
	 * 
	 * case 32: // space self.setDeco(nRoom+1); break; } });
	 */

	this.jBtnNext.click( function(e) {
		self.next();
	});

	this.jBtnPrev.click( function(e) {
		self.prev();
	});

	this.jBtnStart.click( function(e) {
		self.start();
	});

	this.jBtnStop.click( function(e) {
		self.stop();
	});

	this.jBtnRepeat.click( function(e) {
		self.jRoomCanvas.css('background-repeat','repeat-x');
	});

	this.jBtnNoRepeat.click( function(e) {
		self.jRoomCanvas.css('background-repeat','no-repeat');
	});


	if (options.autoplay)
		self.start();

	// if( $.browser.msie)
	// self.options.msFade = 0;
}