$.fn.panView = function(width,height) {
	this.each(function(){
				
		var panViewWidthType = 'static';
		var panViewHeightType = 'static';
		var panId = this.id + "Pan";
		var panMaskId = this.id + "PanMask";
		var mode;
		var mouseState = 'up';
		var mouseStartX = 0;
		var mouseStartY = 0;
		var mouseDropX = 0;
		var mouseDropY = 0;
		var cssWidth;
		var cssHeight;
		var eThis = this; 
		
		// check arguments
		if(width == 'auto') {		
			width = 554;
			panViewWidthType = 'dynamic';
		}
		if(height == 'auto') {
			height = (this.clientHeight < document.body.clientHeight) ? this.clientHeight : document.body.clientHeight;
			panViewHeightType = 'dynamic';
		}
		
		var bounds = new GetElementBounds(eThis);

		function MouseEvent(e) {
			this.e = e ? e : window.event; 
			this.source = e.target ? e.target : e.srcElement;
			this.x = this.e.pageX ? this.e.pageX : this.e.clientX;
			this.y = this.e.pageY ? this.e.pageY : this.e.clientY;
			if(window.event) {
				this.x = (document.body.scrollLeft) ? this.x + document.body.scrollLeft : this.x;
				this.y = (document.body.scrollTop) ? this.y + document.body.scrollTop : this.y;
			}
		}

		function GetElementBounds(o) {
			if($.browser.opera && o.clientWidth<554){
				this.width = $(o).attr("width");
			}else{
				this.width = o.clientWidth;
			}			
			if($.browser.opera && o.clientHeight<100){
				this.height = $(o).attr("height");
			}else{
				this.height = o.clientHeight;
			}	
					
			this.minX = (width - this.width);
			this.minY = (height - this.height);
			this.maxX = 0;
			this.maxY = 0;
			//$("#test").prepend("COMPLETE: "+o.complete+"<br />OBJECT: "+ o+ "<br />width: "+ width+ "<br />height: "+ height+"<br />this.width: "+ this.width+"<br />this.height: "+ this.height+"<br />----------<br />");
			
		}

		function go(iter) {
		
			if(iter>bounds.minY){				
				$('div#' + panMaskId).css('top',iter + 'px');
				iter = iter - 15;
				setTimeout(function(){
					go(iter);
				},50);				
			}			
		}
		
		$(this).wrap('<div id="' + panId + '" style="width:' + width + 'px; height:' + height + 'px; overflow:hidden; position: relative;"><div id="' + panMaskId + '" style="left:0px;top:0px;position:relative;"></div></div>');
		$(this).css("visibility", "visible");
		
		$(document).resize(function(e) {
			if(panViewWidthType == 'dynamic') {
				width = (this.clientWidth < document.body.clientWidth) ? this.clientWidth : document.body.clientWidth;
				$('div#' + panId).css('width',width + 'px');
			}
			if(panViewHeightType == 'dynamic') {
				height = (this.clientHeight < document.body.clientHeight) ? this.clientHeight : document.body.clientHeight;
				$('div#' + panId).css('height',height + 'px');
			}
			if(panViewWidthType == 'dynamic' || panViewHeightType == 'dynamic') {
				
				bounds = null;
				bounds = new GetElementBounds(eThis);
				
				mouseStartX = 0;
				mouseStartY = 0;
				mouseDropX = 0;
				mouseDropY = 0;
				
				$('div#' + panMaskId).css('left', 0 + 'px').css('top',0 + 'px');

			}

		});

		$('div#' + panId).mousedown(function(e) {
			
			mouseState = 'down';
			
			var me = new MouseEvent(e);
			
			mouseStartX = me.x;
			mouseStartY = me.y;	
		
			me = null;
			
			$(this).css('cursor','pointer');

			return false
		});

		$('div#' + panId).mouseup(function(e) {

			mouseState = 'up';
			
			mouseDropX = parseInt($('div#' + panMaskId).get(0).style.left);
			mouseDropY = parseInt($('div#' + panMaskId).get(0).style.top);

			$(this).css('cursor','pointer');

		});
		
		$("#cien_top").mouseover(function(e) {
		
			//$('div#' + panMaskId).animate({'top': bounds.minY}, 800);
			
		
		});		
		
		$("#cien_bottom").mouseover(function(e) {
		
			//$('div#' + panMaskId).animate({'top': bounds.maxY}, 800);
		
		});
		
		
		/*
		$("#right_content").mousemove(function(e) {
		
			var d=document; 
			if (typeof window.innerWidth!='undefined') { 
				var szer = window.innerWidth; 
				var wys = window.innerHeight; 
			} else { 
				if (d.documentElement && typeof d.documentElement.clientWidth!='undefined' && d.documentElement.clientWidth!=0) { 
					var szer = d.documentElement.clientWidth; 
					var wys = d.documentElement.clientHeight; 
				} else { 
					if (d.body && typeof d.body.clientWidth!='undefined') { 
						var szer = d.body.clientWidth; 
						var wys = d.body.clientHeight; 
					} 
				} 
			}
					
			var me = new MouseEvent(e);
			var ePan = $('div#' + panId).get(0);	
			
			var y = e.pageY - 82;
			var top_size = bounds.minY;
			var bottom_size = 0;
			var skala = top_size/468;
			var przes = parseInt(skala*y);	
			$('div#' + panMaskId).css('top', przes);
			
			//$("#test").append(skala+"*"+y+", ");	
			
		});
		*/	
		

		$(document.body).mousemove(function(e) {
		
			var d=document; 
			if (typeof window.innerWidth!='undefined') { 
				var szer = window.innerWidth; 
				var wys = window.innerHeight; 
			} else { 
				if (d.documentElement && typeof d.documentElement.clientWidth!='undefined' && d.documentElement.clientWidth!=0) { 
					var szer = d.documentElement.clientWidth; 
					var wys = d.documentElement.clientHeight; 
				} else { 
					if (d.body && typeof d.body.clientWidth!='undefined') { 
						var szer = d.body.clientWidth; 
						var wys = d.body.clientHeight; 
					} 
				} 
			}
				
			wys = $("#main").height()+$("#footer").height();
				
					
			var me = new MouseEvent(e);
			var ePan = $('div#' + panId).get(0);		
		
			var y = parseInt(e.pageY);
			var top_size = bounds.minY;
			var skala = top_size/wys;
			var przes = parseInt(skala*y);	
			$('div#' + panMaskId).css('top', przes);	
		
			var x = parseInt(e.pageX);
			var left_size = bounds.minX;
			var skala2 = left_size/szer;
			var przes2 = parseInt(skala2*x);	
			$('div#' + panMaskId).css('left', przes2);
			
			
		});

	});
};