|
1
|
/*
|
|
2
|
Author: Mike Adair mike.adairATccrs.nrcan.gc.ca
|
|
3
|
License: LGPL as per: http://www.gnu.org/copyleft/lesser.html
|
|
4
|
|
|
5
|
$Id$
|
|
6
|
*/
|
|
7
|
|
|
8
|
/**
|
|
9
|
* Tool to click and drag a map pane to achieve a recentering of the map.
|
|
10
|
* This tool processes screen coordinates and stores AOI in the current map
|
|
11
|
* projection coordinates.
|
|
12
|
*
|
|
13
|
* @constructor
|
|
14
|
* @base ToolBase
|
|
15
|
* @param toolNode The tool node from the Config XML file.
|
|
16
|
* @param model The model object that contains this tool.
|
|
17
|
*/
|
|
18
|
|
|
19
|
function DragPanHandler(toolNode, model) {
|
|
20
|
ToolBase.apply(this, new Array(toolNode, model));
|
|
21
|
|
|
22
|
/**
|
|
23
|
* Process the mouseup action. This will reset the AOI on the model by
|
|
24
|
* shifting the AOI by the maount that the mouse was dragged.
|
|
25
|
* @param objRef Pointer to this DragPanHandler object.
|
|
26
|
* @param targetNode The HTML node that the event occured on
|
|
27
|
*/
|
|
28
|
this.mouseUpHandler = function(objRef,targetNode) {
|
|
29
|
if (objRef.enabled) {
|
|
30
|
if (objRef.dragging) {
|
|
31
|
objRef.dragging = false;
|
|
32
|
|
|
33
|
//set new AOI in context, only if it's been moved
|
|
34
|
if ((objRef.deltaP==0) && (objRef.deltaL==0)) return;
|
|
35
|
var width = objRef.model.getWindowWidth();
|
|
36
|
var height = objRef.model.getWindowHeight();
|
|
37
|
var ul = objRef.model.extent.getXY( new Array( -objRef.deltaP, -objRef.deltaL) ); //(0,0) was the original ul AOI
|
|
38
|
var lr = objRef.model.extent.getXY( new Array( width-objRef.deltaP, height-objRef.deltaL) ); //(w,h) was the original lr AOI
|
|
39
|
objRef.model.setParam("aoi",new Array(ul,lr));
|
|
40
|
}
|
|
41
|
}
|
|
42
|
}
|
|
43
|
|
|
44
|
/**
|
|
45
|
* Process a mouse down action by starting the drag pan action.
|
|
46
|
* @param objRef Pointer to this DragPanHandler object.
|
|
47
|
* @param targetNode The HTML node that the event occured on
|
|
48
|
*/
|
|
49
|
this.mouseDownHandler = function(objRef,targetNode) {
|
|
50
|
if (objRef.enabled) {
|
|
51
|
//objRef.containerNode = document.getElementById( objRef.parentWidget.containerId );
|
|
52
|
objRef.dragging = true;
|
|
53
|
objRef.anchorPoint = targetNode.evpl;
|
|
54
|
objRef.deltaP = 0;
|
|
55
|
objRef.deltaL = 0;
|
|
56
|
//Michael Jenik added this
|
|
57
|
//objRef.oldPos stores the old positions of targetNode.childNodes divs
|
|
58
|
var images=targetNode.childNodes;
|
|
59
|
objRef.oldPos = new Array(images.length);
|
|
60
|
for(var i=0; i<images.length; i++) {
|
|
61
|
var img=images.item(i);
|
|
62
|
var P = img.style.left;
|
|
63
|
var L = img.style.top;
|
|
64
|
if(P && L)
|
|
65
|
objRef.oldPos[i] = new Array(parseInt(P),parseInt(L));
|
|
66
|
else
|
|
67
|
objRef.oldPos[i] = new Array(0,0);
|
|
68
|
}
|
|
69
|
|
|
70
|
}
|
|
71
|
}
|
|
72
|
|
|
73
|
/**
|
|
74
|
* Process a mousemove action. This method uses DHTML to move the map layers
|
|
75
|
* and sets deltaP and deltaL properties on this tool to be used in mouse up.
|
|
76
|
* @param objRef Pointer to this DragPanHandler object.
|
|
77
|
* @param targetNode The HTML node that the event occured on
|
|
78
|
*/
|
|
79
|
this.mouseMoveHandler = function(objRef,targetNode) {
|
|
80
|
if (objRef.enabled) {
|
|
81
|
if (objRef.dragging) {
|
|
82
|
objRef.deltaP = targetNode.evpl[0] - objRef.anchorPoint[0];
|
|
83
|
objRef.deltaL = targetNode.evpl[1] - objRef.anchorPoint[1];
|
|
84
|
|
|
85
|
//use this form if dragging the container node children
|
|
86
|
//var images=targetNode.getElementsByTagName("div");
|
|
87
|
var images=targetNode.childNodes;
|
|
88
|
for(var i=0; i<images.length; i++) {
|
|
89
|
var img=images.item(i);
|
|
90
|
//Michael Jenik added the plus ...
|
|
91
|
img.style.left=objRef.deltaP + objRef.oldPos[i][0]+'px';
|
|
92
|
img.style.top=objRef.deltaL + objRef.oldPos[i][1]+'px';
|
|
93
|
}
|
|
94
|
|
|
95
|
//use this form if dragging the container node
|
|
96
|
//var containerNode = document.getElementById(objRef.parentWidget.containerNodeId);
|
|
97
|
//containerNode.style.left = objRef.deltaP;
|
|
98
|
//containerNode.style.top = objRef.deltaL;
|
|
99
|
|
|
100
|
}
|
|
101
|
}
|
|
102
|
}
|
|
103
|
|
|
104
|
//register the listeners on the model
|
|
105
|
this.model.addListener('mousedown',this.mouseDownHandler,this);
|
|
106
|
this.model.addListener('mousemove',this.mouseMoveHandler,this);
|
|
107
|
this.model.addListener('mouseup',this.mouseUpHandler,this);
|
|
108
|
}
|
|
109
|
|
|
110
|
|