(function($) {
	$.fn.panorama = function(options) {
		this.each(function(){ 
			var settings = {
				pano_width: 92,
				speed: 22222,
				direction: 'left',
				control_display: 'auto',
				start_position: 22,
				auto_start: false,
				mode_360: true
			};
			if(options) $.extend(settings, options);
		
			//var eWidth = parseInt($("#pan_img").attr('width'));
			//var eHeight = parseInt($("#pan_img").attr('height'));
			var eWidth = parseInt($(this).attr('width'));
			var eHeight = parseInt($(this).attr('height'));
			var currentElement = this;
			var pan_img;
			var pano, rama;
					

			//$(this).css('position', 'relative')
				//.css('margin', '0')
				//.css('padding', '0')
				//.css('border', 'none')
			$(this).wrap("<div id='rama'></div>");
			if (settings.mode_360) 
				$(this).clone().insertAfter(this);
				//pan_img = $(this).children();
				//pan_img.clone().insertAfter(pan_img);
				//$("#move").append("<h1 style='position:absolute;top:12px;left:12px;color:#FFF;'>DREW</h1>");
			
			rama = $(this).parent();
			rama.wrap("<div id='pano'></div>");
			//rama.wrap("<div id='pano'></div>").parent().css('width',settings.pano_width+'%')
				//.append("<div class='panorama-control'><a href='#' class='panorama-control-left'><<</a> <a href='#' class='panorama-control-pause'>x</a> <a href='#' class='panorama-control-right'>>></a> </div>");
			
			pano = rama.parent();
			arrows = pano.parent();
	arrows.find('div#ll').bind('mouseover', function() {
	$(rama).stop();
		settings.direction = 'right';
		pan_ani(rama, eWidth, settings);
		return false;
	});
	arrows.find('div#ll').bind('mouseout', function() {
		$(rama).stop();
		return false;
	});
			
	arrows.find('div#rr').bind('mouseover', function() {
	$(rama).stop();
		settings.direction = 'left';
		pan_ani(rama, eWidth, settings);
		return false;
	});
	arrows.find('div#rr').bind('mouseout', function() {
	$(rama).stop();
		return false;
	});
			
			//pano.css('height', eHeight+'px').find('a.panorama-control-left').bind('click', function() {
				//$(rama).stop();
				//settings.direction = 'right';
				//pan_ani(rama, eWidth, settings);
				//return false;
			//});
			//pano.bind('click', function() {
			//	$(rama).stop();
			//});
			//pano.find('a.panorama-control-right').bind('click', function() {
			//	$(rama).stop();
			//	settings.direction = 'left';
			//	pan_ani(rama, eWidth, settings);
			//	return false;
			//});
			//pano.find('a.panorama-control-pause').bind('click', function() {
			//	$(rama).stop();
			//	return false;
			//});
			
			//if (settings.control_display == 'yes') {
			//	pano.find('.panorama-control').show();
			//} else {
			//	pano.bind('mouseover', function(){
			//		$(this).find('.panorama-control').show();
			//		return false;
			//	}).bind('mouseout', function(){
			//		$(this).find('.panorama-control').hide();
			//		return false;
			//	});
				
			//}
		
			$(this).parent().css('margin-left', '-'+settings.start_position+'px');

			if (settings.auto_start) 
				pan_ani(rama, eWidth, settings);
			
		}
	
		
		);
		function pan_ani(e, eWidth, settings) {
			currentPosition = 0-parseInt($(e).css('margin-left'));
			
			if (settings.direction == 'right') {
				
				$(e).animate({marginLeft: 0}, ((settings.speed / eWidth) * (currentPosition)) , 'linear', function (){ 
					if (settings.mode_360) {
						$(e).css('marginLeft', '-'+(parseInt(parseInt(eWidth))+'px'));
						pan_ani(e, eWidth, settings);
					}
				});
			} else {
 				
				var rightlimit;
				if (settings.mode_360) 
					rightlimit = eWidth;
				else
					rightlimit = eWidth-settings.pano_width;
					
				$(e).animate({marginLeft: -rightlimit}, ((settings.speed / rightlimit) * (rightlimit - currentPosition)), 'linear', function (){ 
					if (settings.mode_360) {
						$(e).css('margin-left', 0); 
						pan_ani(e, eWidth, settings);
					}
				});
			}

			
		}
		

		
	};

$(document).ready(function(){
	$("#pan_img").panorama();
	
});
})(jQuery);