analytics/webcontent/dojo17/dojox/drawing/ui/dom/Pan.js

// wrapped by build app
define("dojox/drawing/ui/dom/Pan", ["dijit","dojo","dojox","dojo/require!dojox/drawing/plugins/_Plugin"], function(dijit,dojo,dojox){
dojo.provide("dojox.drawing.ui.dom.Pan");
dojo.require("dojox.drawing.plugins._Plugin");
dojo.deprecated("dojox.drawing.ui.dom.Pan", "It may not even make it to the 1.4 release.", 1.4);

dojox.drawing.ui.dom.Pan = dojox.drawing.util.oo.declare(
	// NOTE:
	//			dojox.drawing.ui.dom.Pan is DEPRECATED.
	//			This was a temporary DOM solution. Use the non-dom
	//			tools for Toobar and Plugins.
	//
	// summary:
	//		A plugin that allows for a scrolling canvas. An action
	//		tool is added to the toolbar that allows for panning. Holding
	//		the space bar is a shortcut to that action. The canvas will
	//		only pan and scroll if there are objects out of the viewable
	//		area.
	// example:
	//		|	<div dojoType="dojox.drawing.Toolbar" drawingId="drawingNode" class="drawingToolbar vertical">
	//		|		<div tool="dojox.drawing.tools.Line" selected="true">Line</div>
	//		|		<div plugin="dojox.drawing.ui.dom.Pan" options="{}">Pan</div>
	//		|	</div>
	//
	dojox.drawing.plugins._Plugin,
	function(options){
		
		this.domNode = options.node;
		var _scrollTimeout;
		dojo.connect(this.domNode, "click", this, "onSetPan");
		dojo.connect(this.keys, "onKeyUp", this, "onKeyUp");
		dojo.connect(this.keys, "onKeyDown", this, "onKeyDown");
		dojo.connect(this.anchors, "onAnchorUp", this, "checkBounds");
		dojo.connect(this.stencils, "register", this, "checkBounds");
		dojo.connect(this.canvas, "resize", this, "checkBounds");
		dojo.connect(this.canvas, "setZoom", this, "checkBounds");
		dojo.connect(this.canvas, "onScroll", this, function(){
			if(this._blockScroll){
				this._blockScroll = false;
				return;
			}
			_scrollTimeout && clearTimeout(_scrollTimeout);
			_scrollTimeout = setTimeout(dojo.hitch(this, "checkBounds"), 200);
		});
		this._mouseHandle = this.mouse.register(this);
		// This HAS to be called after setting initial objects or things get screwy.
		//this.checkBounds();
	},{
		selected:false,
		type:"dojox.drawing.ui.dom.Pan",
		
		onKeyUp: function(evt){
			if(evt.keyCode == 32){
				this.onSetPan(false);
			}
		},
		
		onKeyDown: function(evt){
			if(evt.keyCode == 32){
				this.onSetPan(true);
			}
		},
		
		onSetPan: function(/*Boolean | Event*/ bool){
			if(bool === true || bool === false){
				this.selected = !bool;
			}
			if(this.selected){
				this.selected = false;
				dojo.removeClass(this.domNode, "selected");
			}else{
				this.selected = true;
				dojo.addClass(this.domNode, "selected");
			}
			this.mouse.setEventMode(this.selected ? "pan" : "");
		},
		
		onPanDrag: function(obj){
			var x = obj.x - obj.last.x;
			var y = obj.y - obj.last.y;
			this.canvas.domNode.parentNode.scrollTop -= obj.move.y;
			this.canvas.domNode.parentNode.scrollLeft -= obj.move.x;
			this.canvas.onScroll();
		},
		
		onStencilUp: function(obj){
			// this gets called even on click-off because of the
			// issues with TextBlock deselection
			this.checkBounds();
		},
		onStencilDrag: function(obj){
			// this gets called even on click-off because of the
			// issues with TextBlock deselection
			//this.checkBounds();
		},
		
		checkBounds: function(){
			
			//watch("CHECK BOUNDS DISABLED", true); return;
			
			
			// summary:
			//		Scans all items on the canvas and checks if they are out of
			// 		bounds. If so, a scroll bar (in Canvas) is shown. If the position
			// 		is left or top, the canvas is scrolled all items are relocated
			// 		the distance of the scroll. Ideally, it should look as if the
			// 		items do not move.
			
			// logging stuff here so it can be turned on and off. This method is
			// very high maintenance.
			var log = function(){
				///console.log.apply(console, arguments);
			};
			var warn = function(){
				//console.warn.apply(console, arguments);
			};
			//console.clear();
			//console.time("check bounds");
			var t=Infinity, r=-Infinity, b=-Infinity, l=Infinity,
				sx=0, sy=0, dy=0, dx=0,
				mx = this.stencils.group ? this.stencils.group.getTransform() : {dx:0, dy:0},
				sc = this.mouse.scrollOffset(),
				// scY, scX: the scrollbar creates the need for extra dimension
				scY = sc.left ? 10 : 0,
				scX = sc.top ? 10 : 0,
				// ch, cw: the current size of the canvas
				ch = this.canvas.height,
				cw = this.canvas.width,
				z = this.canvas.zoom,
				// pch, pcw: the normal size of the canvas (not scrolled)
				// these could change if the container resizes.
				pch = this.canvas.parentHeight,
				pcw = this.canvas.parentWidth;
			
			
			this.stencils.withSelected(function(m){
				var o = m.getBounds();
				warn("SEL BOUNDS:", o);
				t = Math.min(o.y1 + mx.dy, t);
				r = Math.max(o.x2 + mx.dx, r);
				b = Math.max(o.y2 + mx.dy, b);
				l = Math.min(o.x1 + mx.dx, l);
			});
			
			this.stencils.withUnselected(function(m){
				var o = m.getBounds();
				warn("UN BOUNDS:", o);
				t = Math.min(o.y1, t);
				r = Math.max(o.x2, r);
				b = Math.max(o.y2, b);
				l = Math.min(o.x1, l);
			});
			
			b *= z;
			var xscroll = 0, yscroll = 0;
			log("Bottom test", "b:", b, "z:", z, "ch:", ch, "pch:", pch, "top:", sc.top, "sy:", sy);
			if(b > pch || sc.top ){
				log("*bottom scroll*");
				// item off bottom
				ch = Math.max(b, pch + sc.top);
				sy = sc.top;
				xscroll += this.canvas.getScrollWidth();
			}else if(!sy && ch>pch){
				log("*bottom remove*");
				// item moved from bottom
				ch = pch;
			}
			
			r *= z;
			if(r > pcw || sc.left){
				//log("*right scroll*");
				// item off right
				cw = Math.max(r, pcw + sc.left);
				sx = sc.left;
				yscroll += this.canvas.getScrollWidth();
			}else if(!sx && cw>pcw){
				//log("*right remove*");
				// item moved from right
				cw = pcw;
			}
			
			// add extra space for scrollbars
			// double it to give some breathing room
			cw += xscroll*2;
			ch += yscroll*2;
			
			this._blockScroll = true;
			
			// selected items are not transformed. The selection itself is
			// and the items are on de-select
			this.stencils.group && this.stencils.group.applyTransform({dx:dx, dy:dy});
			
			// non-selected items are transformed
			this.stencils.withUnselected(function(m){
				m.transformPoints({dx:dx, dy:dy});
			});
			
			this.canvas.setDimensions(cw, ch, sx, sy);
			
			//console.timeEnd("check bounds");
		}
	}
);

dojox.drawing.ui.dom.Pan.setup = {
	name:"dojox.drawing.ui.dom.Pan",
	tooltip:"Pan Tool",
	iconClass:"iconPan"
};

dojox.drawing.register(dojox.drawing.ui.dom.Pan.setup, "plugin");
});