analytics/webcontent/dojo17/dojox/drawing/manager/Mouse.js

// wrapped by build app
define("dojox/drawing/manager/Mouse", ["dijit","dojo","dojox"], function(dijit,dojo,dojox){
dojo.provide("dojox.drawing.manager.Mouse");

dojox.drawing.manager.Mouse = dojox.drawing.util.oo.declare(
	// summary:
	//		Master object (instance) that tracks mouse
	//		events. A new instance is created for each
	//		Drawing object.
	// description:
	//		You could connect to any method or event in this
	//		class, but it is designed to have the object
	//		'registered'. All objects with the current event
	//		will be called directly.
	//
	//		Custom events are used often. In addition to
	//		standard events onDown, onUp, onDrag, etc, if
	//		a certain object is clicked upon (or dragged, etc),
	//		that object's drawingType will create the custom event,
	//		such as onAnchorDown, or onStencilDown.
	//
	function(/* Object */options){
		this.util = options.util;
		this.keys = options.keys;
		this.id = options.id || this.util.uid("mouse");
		this.currentNodeId = "";
		this.registered = {};
	},
	
	{
		// doublClickSpeed: Number
		//		Milliseconds between clicks to
		//		register as for onDoubleClick
		doublClickSpeed:400,
		
		// private properties
		
		_lastx:0,
		_lasty:0,
		__reg:0,
		_downOnCanvas:false,
		
/*=====
CustomEventMethod: function(){
	// summary:
	//		The custom event method that an Object that has
	//		registered with manager.Mouse can receive.
	//		Can contain any or all of the following methods
	//		and they will be called as mouse events. All events
	//		will be sent a EventObject event object.
	//	NOTE:
	//		Events happen anywhere in the document unless
	//		otherwise noted.
	//
	//	onMove
	//		Fires on mousemove when mouse is up
	//	onDown
	//		Fires on mousedown *on the canvas*
	//	onDrag
	//		Fires on mousemove when mouse is down
	//	onUp
	//		Fires on mouseup, anywhere in the document
	//	onStencilDown
	//		Fired on mousedown on a Stencil
	//	onStencilDrag
	//		Fired when mouse moves and mose is down on a Stencil
	//	onStencilUp
	//		Fired on mouseup off of a Stencil
	//	on[Custom]Up|Down|Move
	//		Custom events can bet set and fired by setting a
	//		different drawingType on a Stencil, or by calling
	//		setEventMode(customEventName)
},
EventObject: function(){
	// summary:
	//		The custom event object that is sent to registered objects
	//		and their respective methods.
	//	NOTE: Most event objects are the same with the exception
	//		of the onDown events, which have fewer.
	//
	// All event properties included onDown:
	//
	//	id: String
	//		Id of the focused object
	//	pageX: Number
	//		The X coordinate of the mouse from the left side of
	//		the document.
	//	pageY: Number
	//		The Y coordinate of the mouse from the top of
	//		the document.
	//	x:	Number
	//		The X coordinate of the mouse from the left side
	//		of the canvas
	//	y:	Number
	//		The Y coordinate of the mouse from the top
	//		of the canvas
	//
	// These event properties are *not* in onDown:
	//
	//	last:	Object
	//		The x and y coordinates of the last mousemove
	//		relative to the canvas
	//	move: Object
	//		The x and y amounts the mouse moved since the last event
	//	orgX:	Number
	//		The left side of the canvas from the side of the document
	//	orgY:	Number
	//		The top of the canvas from the top of the document
	//	scroll: Object
	//		The 'top' and 'left' scroll amounts of the canvas.
	//	start:	Object
	//		The x and y coordinates of the mousedown event
	//	withinCanvas: Boolean
	//		Whether the event happened within the Canvas or not
	
},
=====*/
			
		init: function(/* HTMLNode*/node){
			//	summary:
			//		Internal. Initializes mouse.
			//
			this.container = node;
			this.setCanvas();
			var c;
			var _isDown = false;
			dojo.connect(this.container, "rightclick", this, function(evt){
				console.warn("RIGHTCLICK")
			});
			
			dojo.connect(document.body, "mousedown", this, function(evt){
				//evt.preventDefault();
				//dojo.stopEvent(evt);
			});
			
			dojo.connect(this.container, "mousedown", this, function(evt){
				this.down(evt);
				// Right click shouldn't trigger drag
				if(evt.button != dojo.mouseButtons.RIGHT){
					_isDown = true;
					c = dojo.connect(document, "mousemove", this, "drag");
				}
			});
			dojo.connect(document, "mouseup", this, function(evt){
				dojo.disconnect(c);
				_isDown = false;
				this.up(evt);
			});
			dojo.connect(document, "mousemove", this, function(evt){
				if(!_isDown){
					this.move(evt);
				}
			});
			dojo.connect(this.keys, "onEsc", this, function(evt){
				this._dragged = false;
			});
		},
		
		setCanvas: function(){
			// summary:
			//		Internal. Sets canvas position
			var pos = dojo.coords(this.container.parentNode);
			this.origin = dojo.clone(pos);
		},
		
		scrollOffset: function(){
			// summary:
			// 	Gets scroll offset of canvas
			return {
				top:this.container.parentNode.scrollTop,
				left:this.container.parentNode.scrollLeft
			}; // Object
		},

		resize: function(width,height){
			if(this.origin){
				this.origin.w=width;
				this.origin.h=height;
			}
		},

		register: function(/* Object*/scope){
			// summary:
			//		All objects (Stencils) should register here if they
			//		use mouse events. When registering, the object will
			//		be called if it has that method.
			//	argument:
			//		The object to be called
			//	Returns: handle
			//		Keep the handle to be used for disconnection.
			// See: CustomEventMethod and EventObject
			//
			var handle = scope.id || "reg_"+(this.__reg++);
			if(!this.registered[handle]){ this.registered[handle] = scope; }
			return handle; // String
		},
		unregister: function(handle){
			// summary:
			// 		Disconnects object. Mouse events are no longer
			//		called for it.
			if(!this.registered[handle]){ return; }
			delete this.registered[handle];
		},
		
		_broadcastEvent:function(strEvt, obj){
			// summary:
			//		Fire events to all registered objects.
			//
			//console.log("mouse.broadcast:", strEvt, obj)
			for(var nm in this.registered){
				if(this.registered[nm][strEvt]) this.registered[nm][strEvt](obj);
			}
		},
		
		onDown: function(obj){
			// summary:
			// 		Create on[xx]Down event and send to broadcaster.
			//		Could be connected to.
			//console.info("onDown:", this.eventName("down"))
			this._broadcastEvent(this.eventName("down"), obj);
		},
		
		onDrag: function(obj){
			// summary:
			// 		Create on[xx]Drag event and send to broadcaster.
			//		Could be connected to.
			//
			var nm = this.eventName("drag");
			if(this._selected && nm == "onDrag"){
				nm = "onStencilDrag"
			}
			this._broadcastEvent(nm, obj);
		},
		
		onMove: function(obj){
			// summary:
			// 		Create onMove event and send to broadcaster.
			//		Could be connected to.
			//		Note: onMove never uses a custom event
			//		Note: onMove is currently not enabled in the app.
			//
			this._broadcastEvent("onMove", obj);
		},
		
		overName: function(obj,evt){
			var nm = obj.id.split(".");
			evt = evt.charAt(0).toUpperCase() + evt.substring(1);
			if(nm[0] == "dojox" && (dojox.drawing.defaults.clickable || !dojox.drawing.defaults.clickMode)){
				return "onStencil"+evt;
			}else{
				return "on"+evt;
			}
			
		},
		
		onOver: function(obj){
			// summary:
			//
			this._broadcastEvent(this.overName(obj,"over"), obj);
		},
		
		onOut: function(obj){
			// summary:
			//
			this._broadcastEvent(this.overName(obj,"out"), obj);
		},
		
		onUp: function(obj){
			// summary:
			// 		Create on[xx]Up event and send to broadcaster.
			//		Could be connected to.
			//
			// 	blocking first click-off (deselect), largely for TextBlock
			// 	TODO: should have param to make this optional?
			var nm = this.eventName("up");
			
			if(nm == "onStencilUp"){
				this._selected  = true;
			}else if(this._selected && nm == "onUp"){ //////////////////////////////////////////
				nm = "onStencilUp";
				this._selected = false;
			}
			
			console.info("Up Event:", this.id, nm, "id:", obj.id);
			this._broadcastEvent(nm, obj);
			
			// Silverlight double-click handled in Silverlight class
			if(dojox.gfx.renderer == "silverlight"){ return; }
			
			// Check Double Click
			// If a double click is detected, the onDoubleClick event fires,
			// but does not replace the normal event. They both fire.
			this._clickTime = new Date().getTime();
			if(this._lastClickTime){
				if(this._clickTime-this._lastClickTime<this.doublClickSpeed){
					var dnm = this.eventName("doubleClick");
					console.warn("DOUBLE CLICK", dnm, obj);
					this._broadcastEvent(dnm, obj);
				}else{
					//console.log("    slow:", this._clickTime-this._lastClickTime)
				}
			}
			this._lastClickTime = this._clickTime;
			
		},
		
		zoom: 1,
		setZoom: function(zoom){
			// summary:
			// 		Internal. Sets the mouse zoom percentage to
			//		that of the canvas
			this.zoom = 1/zoom;
		},
		
		setEventMode: function(mode){
			// summary:
			//		Sets the mouse mode s that custom events can be called.
			//		Also can 'disable' events by using a bogus mode:
			// 		|	mouse.setEventMode("DISABLED")
			//		(unless any object subscribes to this event,
			//		it is effectively disabled)
			//
			this.mode = mode ? "on" + mode.charAt(0).toUpperCase() + mode.substring(1) :  "";
		},
		
		eventName: function(name){
			// summary:
			//		Internal. Determine the event name
			//
			name = name.charAt(0).toUpperCase() + name.substring(1);
			if(this.mode){
				if(this.mode == "onPathEdit"){
					return "on"+name;
				}
				if(this.mode == "onUI"){
					//return "on"+name;
				}
				return this.mode + name;
			}else{
				//Allow a mode where stencils aren't clickable
				if(!dojox.drawing.defaults.clickable && dojox.drawing.defaults.clickMode){return "on"+name;}
				var dt = !this.drawingType || this.drawingType=="surface" || this.drawingType=="canvas" ? "" : this.drawingType;
				var t = !dt ? "" : dt.charAt(0).toUpperCase() + dt.substring(1);
				return "on"+t+name;
			}
		},
		
		up: function(evt){
			// summary:
			//		Internal. Create onUp event
			//
			this.onUp(this.create(evt));
		},
		
		down: function(evt){
			// summary:
			//		Internal. Create onDown event
			//
			this._downOnCanvas = true;
			var sc = this.scrollOffset();
			var dim = this._getXY(evt);
			this._lastpagex = dim.x;
			this._lastpagey = dim.y;
			var o = this.origin;
			var x = dim.x - o.x + sc.left;
			var y = dim.y - o.y + sc.top;
			
			var withinCanvas = x>=0 && y>=0 && x<=o.w && y<=o.h;
			x*= this.zoom;
			y*= this.zoom;
			
			o.startx = x;
			o.starty = y;
			this._lastx = x;
			this._lasty = y;
			
			this.drawingType = this.util.attr(evt, "drawingType") || "";
			var id = this._getId(evt);
			//console.log("DOWN:", this.id, id, withinCanvas);
			//console.log("this.drawingType:", this.drawingType);
			
			if(evt.button == dojo.mouseButtons.RIGHT && this.id == "mse"){
				//Allow right click events to bubble for context menus
			}else{
				evt.preventDefault();
				dojo.stopEvent(evt);
			}
			this.onDown({
				mid:this.id,
				x:x,
				y:y,
				pageX:dim.x,
				pageY:dim.y,
				withinCanvas:withinCanvas,
				id:id
			});
			
		},
		over: function(obj){
			// summary:
			//		Internal.
			//
			this.onOver(obj);
		},
		out: function(obj){
			// summary:
			//		Internal.
			//
			this.onOut(obj);
		},
		move: function(evt){
			// summary:
			//		Internal.
			//
			var obj = this.create(evt);
			if(this.id=="MUI"){
				//console.log("obj.id:", obj.id, "was:", this.currentNodeId)
			}
			if(obj.id != this.currentNodeId){
				// TODO: I wonder if an ID is good enough
				//	that would avoid the mixin
				var outObj = {};
				for(var nm in obj){
					outObj[nm] = obj[nm];
				}
				outObj.id = this.currentNodeId;
				this.currentNodeId && this.out(outObj);
				obj.id && this.over(obj);
				this.currentNodeId = obj.id;
			}
			this.onMove(obj);
		},
		drag: function(evt){
			// summary:
			//		Internal. Create onDrag event
			this.onDrag(this.create(evt, true));
		},
		create: function(evt, squelchErrors){
			// summary:
			//		Internal. Create EventObject
			//
			var sc = this.scrollOffset();
			var dim = this._getXY(evt);
			
			var pagex = dim.x;
			var pagey = dim.y;
			
			var o = this.origin;
			var x = dim.x - o.x + sc.left;
			var y = dim.y - o.y + sc.top;

			var withinCanvas = x>=0 && y>=0 && x<=o.w && y<=o.h;
			x*= this.zoom;
			y*= this.zoom;
			
			var id = withinCanvas ? this._getId(evt, squelchErrors) : "";
			var ret = {
				mid:this.id,
				x:x,
				y:y,
				pageX:dim.x,
				pageY:dim.y,
				page:{
					x:dim.x,
					y:dim.y
				},
				orgX:o.x,
				orgY:o.y,
				last:{
					x: this._lastx,
					y: this._lasty
				},
				start:{
					x: this.origin.startx, //+ sc.left,
					y: this.origin.starty //+ sc.top
				},
				move:{
					x:pagex - this._lastpagex,
					y:pagey - this._lastpagey
				},
				scroll:sc,
				id:id,
				withinCanvas:withinCanvas
			};
			
			//console.warn("MSE LAST:", x-this._lastx, y-this._lasty)
			this._lastx = x;
			this._lasty = y;
			this._lastpagex = pagex;
			this._lastpagey = pagey;
			dojo.stopEvent(evt);
			return ret; //Object
		},
		_getId: function(evt, squelchErrors){
			// summary:
			//		Internal. Gets ID of focused node.
			return this.util.attr(evt, "id", null, squelchErrors); // String
		},
		_getXY: function(evt){
			// summary:
			//		Internal. Gets mouse coords to page.
			return {x:evt.pageX, y:evt.pageY}; // Object
		},
		
		setCursor: function(cursor,/* HTMLNode*/node){
			// summary:
			//		Sets the cursor for  a given node.  If no
			//		node is specified the containing node is used.
			if(!node){
				dojo.style(this.container, "cursor", cursor);
			}else{
				dojo.style(node, "cursor", cursor);
			}
		}
	}
);

});