[Mapbender-commits] r6876 - in trunk/mapbender/http: . plugins widgets

svn_mapbender at osgeo.org svn_mapbender at osgeo.org
Thu Sep 2 11:46:09 EDT 2010


Author: christoph
Date: 2010-09-02 15:46:09 +0000 (Thu, 02 Sep 2010)
New Revision: 6876

Added:
   trunk/mapbender/http/plugins/mb_pan.js
   trunk/mapbender/http/widgets/
   trunk/mapbender/http/widgets/w_measure.js
   trunk/mapbender/http/widgets/w_pan.js
Modified:
   trunk/mapbender/http/plugins/mb_map.js
   trunk/mapbender/http/plugins/mb_navigation.js
   trunk/mapbender/http/plugins/mb_pane.js
   trunk/mapbender/http/plugins/mb_zoomBar.js
Log:
preparation for demo

Modified: trunk/mapbender/http/plugins/mb_map.js
===================================================================
--- trunk/mapbender/http/plugins/mb_map.js	2010-09-02 15:45:31 UTC (rev 6875)
+++ trunk/mapbender/http/plugins/mb_map.js	2010-09-02 15:46:09 UTC (rev 6876)
@@ -83,7 +83,7 @@
 
 	// pseudo slippy map
 	mapObject.slippy = 
-		options.slippy === 1 ? true : false;
+		options.slippy === 1 && !$.browser.msie ? true : false;
 /*	
 	// set restricted extent
 	if (typeof options.restrictedExtent !== "undefined") {

Modified: trunk/mapbender/http/plugins/mb_navigation.js
===================================================================
--- trunk/mapbender/http/plugins/mb_navigation.js	2010-09-02 15:45:31 UTC (rev 6875)
+++ trunk/mapbender/http/plugins/mb_navigation.js	2010-09-02 15:46:09 UTC (rev 6876)
@@ -29,8 +29,7 @@
  * http://svn.osgeo.org/mapbender/trunk/mapbender/license/license.txt
  */
 
-var iconDim = 16;
-var iconOffset = 10;
+var iconDim = 18;
 var $this = $(this);
 
 Mapbender.events.init.register(function () {
@@ -39,32 +38,35 @@
 		var id = $target.attr("id");
 
 		var positionArrow = function ($domElement, direction) {
-			var top, left;
+			var top = parseInt($this.css("top"), 10);
+			var left = parseInt($this.css("left"), 10);
+			var iconOffsetTop = isNaN(top) ? 10 : top;
+			var iconOffsetLeft = isNaN(left) ? 10 : left;
 			switch (direction) {
 				case "n":
 					top = (
-						iconOffset
+						iconOffsetTop
 					) + "px";
-					left = (iconOffset + iconDim) + "px";
+					left = (iconOffsetLeft + iconDim/2) + "px";
 					break;
 				case "s":
-					top = (iconOffset + 2*iconDim) + "px";
-					left = (iconOffset + iconDim) + "px";
+					top = (iconOffsetTop + 2*iconDim) + "px";
+					left = (iconOffsetLeft + iconDim/2) + "px";
 					break;
 				case "w":
-					top = (iconOffset + iconDim) + "px";
-					left = (iconOffset + iconDim/2) + "px"
+					top = (iconOffsetTop + iconDim) + "px";
+					left = (iconOffsetLeft) + "px"
 					break;
 				case "e":
-					top = (iconOffset + iconDim) + "px";
-					left = (iconOffset + iconDim*1.5) + "px"
+					top = (iconOffsetTop + iconDim) + "px";
+					left = (iconOffsetLeft + iconDim) + "px"
 					break;
 			}
 			$domElement.css({
 				top: top,
 				left: left,
 				position:"absolute",
-				zIndex: 1000
+				zIndex: $this.css("z-index")
 			});
 		};
 		
@@ -76,7 +78,7 @@
 					"id='" + id + "_" + dir + "' class=" + 
 					"'ui-icon ui-corner-all ui-state-default ui-icon-triangle-1-" + dir + 
 					"'></span>"
-				).click(function (e) {
+				).mousedown(function (e) {
 					$target.mapbender(function () {
 						this.pan(dir);
 					});
@@ -87,7 +89,8 @@
 				}).mouseout(function () {
 					$(this).removeClass("ui-state-hover");
 					return true;
-				}).appendTo($target);
+				}).css("cursor", "pointer")
+				.appendTo($target);
 				positionArrow($arrow, dir);
 				
 				$target.mapbender(function () {

Added: trunk/mapbender/http/plugins/mb_pan.js
===================================================================
--- trunk/mapbender/http/plugins/mb_pan.js	                        (rev 0)
+++ trunk/mapbender/http/plugins/mb_pan.js	2010-09-02 15:46:09 UTC (rev 6876)
@@ -0,0 +1,10 @@
+var $pan = $(this);
+
+var PanApi = function (o) {
+	var that = this;
+	Mapbender.events.init.register(function () {
+		options.$target.pan();
+	});
+};
+
+$pan.mapbender(new PanApi(options));

Modified: trunk/mapbender/http/plugins/mb_pane.js
===================================================================
--- trunk/mapbender/http/plugins/mb_pane.js	2010-09-02 15:45:31 UTC (rev 6875)
+++ trunk/mapbender/http/plugins/mb_pane.js	2010-09-02 15:46:09 UTC (rev 6876)
@@ -9,9 +9,15 @@
  *
  * SQL:
  * > INSERT INTO gui_element(fkey_gui_id, e_id, e_pos, e_public, e_comment, e_title, e_element, e_src, e_attributes, e_left, e_top, e_width, e_height, e_z_index, e_more_styles, e_content, e_closetag, e_js_file, e_mb_mod, e_target, e_requires, e_url) VALUES('<appId>','pane',1,1,'','','div','','',NULL ,NULL ,NULL ,NULL ,NULL ,'height:100%;width:100%','','div','../plugins/mb_pane.js','','','jq_layout','http://layout.jquery-dev.net');
- * > INSERT INTO gui_element_vars(fkey_gui_id, fkey_e_id, var_name, var_value, context, var_type) VALUES('<appId>', 'outer_pane', 'north', 'outer_pane_north', '' ,'var');
- * > INSERT INTO gui_element_vars(fkey_gui_id, fkey_e_id, var_name, var_value, context, var_type) VALUES('<appId>', 'outer_pane', 'south', 'outer_pane_south', '' ,'var');
- * > INSERT INTO gui_element_vars(fkey_gui_id, fkey_e_id, var_name, var_value, context, var_type) VALUES('<appId>', 'outer_pane', 'center', 'content_pane', '' ,'var');
+ * > INSERT INTO gui_element_vars(fkey_gui_id, fkey_e_id, var_name, var_value, context, var_type) VALUES('<appId>', 'pane', 'north', 'id of target element', '' ,'var');
+ * > INSERT INTO gui_element_vars(fkey_gui_id, fkey_e_id, var_name, var_value, context, var_type) VALUES('<appId>', 'pane', 'south', 'id of target element', '' ,'var');
+ * > INSERT INTO gui_element_vars(fkey_gui_id, fkey_e_id, var_name, var_value, context, var_type) VALUES('<appId>', 'pane', 'east', 'id of target element', '' ,'var');
+ * > INSERT INTO gui_element_vars(fkey_gui_id, fkey_e_id, var_name, var_value, context, var_type) VALUES('<appId>', 'pane', 'west', 'id of target element', '' ,'var');
+ * > INSERT INTO gui_element_vars(fkey_gui_id, fkey_e_id, var_name, var_value, context, var_type) VALUES('<appId>', 'pane', 'center', 'id of target element', '' ,'var');
+ * > INSERT INTO gui_element_vars(fkey_gui_id, fkey_e_id, var_name, var_value, context, var_type) VALUES('<appId>', 'pane', 'layoutOptions', '{
+	applyDefaultStyles: true
+}', '' ,'var');
+
  *
  * Help:
  * http://www.mapbender.org/<wiki site name>
@@ -31,15 +37,6 @@
  * http://svn.osgeo.org/mapbender/trunk/mapbender/license/license.txt
  */
 
-
-INSERT INTO gui_element_vars(fkey_gui_id, fkey_e_id, var_name, var_value, context, var_type) VALUES('Metadateneditor_sprint15', 'outer_pane', 'layoutOptions', '{
-resizable: false,
-north__size:225,
-south__size:36
-}', '' ,'var');
-
-
-
 var $pane = $(this);
 
 var PaneApi = function (o) {
@@ -65,14 +62,16 @@
 
 	var resizeSubPanes = function (name, element, state, options, layoutName) {
 		try {
-			$(element).mapbender("setDimensions", $(element).innerWidth(), $(element).innerHeight());
+			var w = element.innerWidth()-options.spacing_open;
+			var h = element.innerHeight()-options.spacing_open;
+			element.mapbender("setDimensions", w, h);
 		}
 		catch (e) {
 			new Mapbender.Notice("Mapframe1 not present.");
 		}
 		
 		try {
-			$(element).mapbender("updateSize", element);
+			element.mapbender("updateSize", element);
 		}
 		catch (e) {
 			new Mapbender.Notice("OpenLayers not present.");

Modified: trunk/mapbender/http/plugins/mb_zoomBar.js
===================================================================
--- trunk/mapbender/http/plugins/mb_zoomBar.js	2010-09-02 15:45:31 UTC (rev 6875)
+++ trunk/mapbender/http/plugins/mb_zoomBar.js	2010-09-02 15:46:09 UTC (rev 6876)
@@ -57,14 +57,32 @@
 
 var ZoomBarApi = function () {
 	var that = this;
+	var skipMapRequest = false;
 
 	this.events = {
 		updated: new Mapbender.Event(),
 		slided: new Mapbender.Event()
 	};
 	
+	var findClosestScaleIndex = function (someScale) {
+		var len = options.level.length;
+		if (someScale < options.level[0]) {
+			return options.level.length - 1;
+		}
+		if (someScale >= options.level[len - 1]) {
+			return 0;
+		}
+		for (var i = 0; i < len-1; i++) {
+			if (someScale >= options.level[i] && someScale < options.level[i+1]) {
+				return options.level.length - 1 - i;
+			}
+		}
+		return 0;
+	};
+	
 	// repaint with current scale after the slider has been moved
 	this.events.updated.register(function (obj) {
+		$zoomBar.attr("title", "1:" + obj.scale);
 		options.$target.mapbender(function () {
 			this.repaintScale(null, null, obj.scale);
 		});
@@ -78,23 +96,44 @@
 		step: 1,
 		value: options.defaultLevel,
 		change: function (event, ui) {
+			var currentScale = options.$target.mapbender().getScale();
+			var scale = options.level[options.level.length - ui.value-1]; 
+			$zoomBar.attr("title", "1:" + scale);
+			
+			if (skipMapRequest) {
+				return;
+			}
 			that.events.updated.trigger({
-				scale: options.level[options.level.length-1-ui.value]
+				scale: scale
 			});
+			return false;
 		},
 		slide: function (event, ui) {
+			var scale = options.level[options.level.length-1-ui.value];
 			that.events.slided.trigger({
-				scale: options.level[options.level.length-1-ui.value]
+				scale: scale
 			});
 		}
 	});
 
 	// Set default scale on init
 	Mapbender.events.init.register(function () {
-		that.events.updated.trigger({
-			scale: options.level[options.level.length-1-options.defaultLevel]
+		$zoomBar.appendTo(options.$target);
+		
+		var initialScale = options.level[options.level.length-1-options.defaultLevel];
+		var closestScaleIndex = findClosestScaleIndex(initialScale);
+		$zoomBar.slider("value", closestScaleIndex);
+
+		options.$target.mapbender().events.afterMapRequest.register(function () {
+			var currentScale = options.$target.mapbender().getScale();
+			var closestScaleIndex = findClosestScaleIndex(currentScale);
+			skipMapRequest = true;
+			$zoomBar.slider("value", closestScaleIndex);
+			skipMapRequest = false;
 		});
+
 	});
+	
 };
 
 $zoomBar.mapbender(new ZoomBarApi());

Added: trunk/mapbender/http/widgets/w_measure.js
===================================================================
--- trunk/mapbender/http/widgets/w_measure.js	                        (rev 0)
+++ trunk/mapbender/http/widgets/w_measure.js	2010-09-02 15:46:09 UTC (rev 6876)
@@ -0,0 +1,418 @@
+$.widget("mapbender.measure", {
+	options: {
+		opacity: 0.6,
+		measurePointDiameter: 10,
+		polygonFillSnapped: "#FC3",
+		polygonFillDefault: "#FFF",
+		polygonStrokeWidthDefault: 1,
+		polygonStrokeWidthSnapped: 5,
+		lineStrokeDefault: "#C9F",
+		lineStrokeSnapped: "#F30",
+		lineStrokeWidthDefault: 3,
+		lineStrokeWidthSnapped: 5,
+		pointFillSnapped: "#F90",
+		pointFillDefault: "#CCF"
+	},
+	_measurePoints: [],
+	_map: undefined,
+	_srs: undefined,
+	_currentDistance: 0,
+	_totalDistance: 0,
+	_polygonIsInvalid: false,
+	_currentPolygonIsInvalid: false,
+	_canvas: undefined,
+	_isPolygon: function (pos) {
+
+		var len = this._measurePoints.length;
+		if (len < 2) {
+			return false;
+		}
+
+		var p0 = this._measurePoints[0].pos;
+		var pn = this._measurePoints[len - 1].pos;
+
+		for (var i = 0; i < len - 1; i++)  {
+			var pi = this._measurePoints[i].pos;
+			var pj = this._measurePoints[i + 1].pos;
+
+			if (i > 0 && this._lineIntersect(
+				pi.x, pi.y, pj.x, pj.y, 
+				p0.x, p0.y, pos.x, pos.y)
+			) {
+				return false;
+			}
+			if (this._lineIntersect(
+				pi.x, pi.y, pj.x, pj.y, 
+				pn.x, pn.y, pos.x, pos.y)
+			) {
+				this._currentPolygonIsInvalid = true;
+				return false;
+			}
+		}
+		this._currentPolygonIsInvalid = false;
+		return true;
+	},
+	_lineIntersect: function ( x1, y1, x2, y2, x3, y3, x4, y4 ) {
+		var isOnSegment = function (xi, yi, xj, yj, xk, yk) {
+			// changed <= to < so the segments are allowed to touch!
+			 return (xi < xk || xj < xk) && 
+					(xk < xi || xk < xj) &&
+			        (yi < yk || yj < yk) && 
+					(yk < yi || xk < yj);
+		};
+		
+		var computeDirection = function (xi, yi, xj, yj, xk, yk) {
+			var a = (xk - xi) * (yj - yi);
+			var b = (xj - xi) * (yk - yi);
+			return a < b ? -1 : a > b ? 1 : 0;
+		};
+		
+		var e1 = computeDirection(x3, y3, x4, y4, x1, y1);
+		var e2 = computeDirection(x3, y3, x4, y4, x2, y2);
+		var e3 = computeDirection(x1, y1, x2, y2, x3, y3);
+		var e4 = computeDirection(x1, y1, x2, y2, x4, y4);
+		return (((e1 > 0 && e2 < 0) || (e1 < 0 && e2 > 0)) &&
+			((e3 > 0 && e4 < 0) || (e3 < 0 && e4 > 0))) ||
+			(e1 === 0 && isOnSegment(x3, y3, x4, y4, x1, y1)) ||
+			(e2 === 0 && isOnSegment(x3, y3, x4, y4, x2, y2)) ||
+			(e3 === 0 && isOnSegment(x1, y1, x2, y2, x3, y3)) ||
+			(e4 === 0 && isOnSegment(x1, y1, x2, y2, x4, y4));
+	},
+	_toRad: function (deg) {
+		return deg * Math.PI/180;
+	},
+	//
+	// calculate area
+	//
+	_calculateAreaMetric: function (pos) {
+		if (this._measurePoints.length < 2) {
+			return null;
+		}
+		
+		var area = 0;
+		var p0 = this._measurePoints[0].pos, pi, pj;
+		for (var i = 0; i < this._measurePoints.length - 1; i++)  {
+			pi = this._measurePoints[i].pos;
+			pj = this._measurePoints[i + 1].pos;
+			area += (pi.y + pj.y) * (pi.x - pj.x) / 2;
+		}
+		area += (p0.y + pj.y) * (p0.x - pj.x) / 2;
+		return Math.abs(area);
+	},
+	_calculateAreaGeographic: function (pos) {
+		if (this._measurePoints.length < 2) {
+			return null;
+		}
+		
+		// add current point and first point
+		this._measurePoints.push({
+			pos: pos
+		});
+		this._measurePoints.push(this._measurePoints[0]);
+		
+        var area = 0.0;
+        var p1, p2;
+        for(var i=0; i<this._measurePoints.length-1; i++) {
+            p1 = this._measurePoints[i].pos;
+            p2 = this._measurePoints[i+1].pos;
+			var c = this._toRad(p2.x - p1.x) *
+                    (2 + Math.sin(toRad(p1.y)) +
+                    Math.sin(toRad(p2.y)));
+            area += c;
+        }
+        area = area * 6378137.0 * 6378137.0 / 2.0;
+
+		// remove current point and first point
+		this._measurePoints.pop();
+		this._measurePoints.pop();
+
+		return Math.abs(area);
+	},
+	_calculateArea: function (pos) {
+		switch (this._map.getSrs()) {
+			case "EPSG:4326":
+				return this._calculateAreaGeographic(pos);
+			default:	
+				return this._calculateAreaMetric(pos);
+		}
+		return null;
+	},
+	//
+	// calculate distance
+	//
+	_calculateDistanceGeographic: function (a, b) {
+		var lon_from = this._toRad(a.x);
+		var lat_from = this._toRad(a.y);
+		var lon_to = this._toRad(b.x);
+		var lat_to = this._toRad(b.y);
+		return Math.abs(6371229 * Math.acos(
+			Math.sin(lat_from) * Math.sin(lat_to) + 
+			Math.cos(lat_from) * Math.cos(lat_to) * 
+			Math.cos(lon_from - lon_to)
+		));
+	},
+	_calculateDistanceMetric: function (a, b) {
+		return Math.abs(Math.sqrt(
+			Math.pow(Math.abs(b.x - a.x), 2) + 
+			Math.pow(Math.abs(b.y - a.y), 2)
+		));
+	},
+	_calculateDistance: function (a, b) {
+		if (a !== null && b !== null) {
+			switch (this._map.getSrs()) {
+				case "EPSG:4326":
+					return this._calculateDistanceGeographic(a, b);
+				default:	
+					return this._calculateDistanceMetric(a, b);
+			}
+		}
+		return null;
+	},
+	_isPointSnapped: function (p1, p2) {
+		return p1.dist(p2) <= this.options.measurePointDiameter/2;
+	},
+	_isFirstPointSnapped: function (p) {
+		if (this._measurePoints.length > 0 ) {
+			var pos0 = this._measurePoints[0].mousePos;
+			if (this._measurePoints.length > 2 && this._isPointSnapped(pos0, p)) {
+				return true;
+			}
+		}
+		return false;
+	},
+	_isLastPointSnapped: function (p) {
+		if (this._measurePoints.length > 0 ) {
+			var posn = this._measurePoints[this._measurePoints.length - 1].mousePos;
+			if (this._measurePoints.length > 1 && this._isPointSnapped(posn, p)) {
+				return true;
+			}
+		}
+		return false;
+	},
+	_draw: function (pos, drawOptions) {
+		this._canvas.clear();
+		
+		var str_path = "";
+
+		if (!drawOptions.highlightFirst) {
+			this._measurePoints.push(pos);
+		}
+
+		var len = this._measurePoints.length;
+		if (len > 0) {
+			for (var k=0; k < len; k++) {
+				if (drawOptions.highlightLast && k === len - 1) {
+					continue;
+				}
+
+				var pk = this._measurePoints[k].pos;
+				var q = this._measurePoints[k].mousePos;
+
+				str_path += (k === 0) ? 'M' : 'L';
+				str_path += q.x + ' ' + q.y;
+				
+				if (drawOptions.drawPoints && 
+					(k === 0 && !this._polygonIsInvalid || k >= len - 2)) {
+
+					var circle = this._canvas.circle(q.x, q.y, this.options.measurePointDiameter);
+					
+					if (k === 0) {
+						circle.attr({
+							fill: drawOptions.highlightFirst ? 
+								this.options.pointFillSnapped : this.options.pointFillDefault,
+							stroke: "none",
+							opacity: this.options.opacity
+						});
+					}
+					else {
+						circle.attr({
+							fill: drawOptions.highlightLast && k === len - 2 ? 
+								this.options.pointFillSnapped : this.options.pointFillDefault,
+							stroke: "none",
+							opacity: this.options.opacity
+						});
+					}
+				}
+			}
+		}
+		if (!drawOptions.highlightFirst) {
+			this._measurePoints.pop();
+		}
+		
+	
+		if (this._isPolygon(this._measurePoints, pos) && !drawOptions.highlightLast && !this.polygonIsInvalid) {
+			var poly = this._canvas.path(str_path + 'Z');
+			poly.attr({
+				fill: drawOptions.highlightFirst ? 
+					this.options.polygonFillSnapped : this.options.polygonFillDefault, 
+				stroke: drawOptions.highlightFirst || drawOptions.highlightLast ? 
+					this.options.lineStrokeSnapped: this.options.lineStrokeDefault, 
+				"stroke-width": drawOptions.highlightFirst ? 
+					this.options.polygonStrokeWidthSnapped : this.options.polygonStrokeWidthDefault, 
+				opacity: this.options.opacity
+			});
+		}
+
+		var line = this._canvas.path(str_path);
+		line.attr({
+			stroke: drawOptions.highlightFirst || drawOptions.highlightLast ? 
+				this.options.lineStrokeSnapped : this.options.lineStrokeDefault, 
+			"stroke-width": drawOptions.highlightLast ? 
+				this.options.lineStrokeWidthSnapped : this.options.lineStrokeWidthDefault, 
+			opacity: this.options.opacity
+		});
+		line.toFront();   
+	},
+	_measure: function (e) {
+		var self = $(this).data("measure");
+
+		if (self._srs !== self._map.getSrs()){
+//			button.stop();
+			return;
+		}
+
+		var mousePos = self._map.getMousePosition(e);
+
+		
+		var firstPointSnapped = self._isFirstPointSnapped(mousePos) 
+			&& !self._polygonIsInvalid;
+		var lastPointSnapped = self._isLastPointSnapped(mousePos);
+
+
+		var pos = {
+			mousePos: mousePos,
+			pos: self._firstPointSnapped ? 
+				self._measurePoints[0].pos : lastPointSnapped ? 
+					self._measurePoints[self._measurePoints.length - 1].pos : 
+					self._map.convertPixelToReal(mousePos)
+		};
+
+		self._trigger("onmeasure", null, pos);
+		
+		var previousPoint = self._measurePoints.length > 0 ? 
+			self._measurePoints[self._measurePoints.length - 1].pos : null;
+
+		self._currentDistance = self._calculateDistance(
+			previousPoint, 
+			pos.pos
+		);
+
+		if (self._isPolygon(self._measurePoints, pos) && !self._polygonIsInvalid) {
+//			updateArea(self._calculateArea(pos));
+		}
+		else {
+//			measureDialog.find(".mb-measure-area").parent().hide();		
+		}
+
+		self._draw(pos, {
+			highlightFirst: firstPointSnapped, 
+			highlightLast: lastPointSnapped,
+			drawPoints: true
+		});		
+	},
+	reinitialize: function (e) {
+		var self = $(this).data("measure");
+		self._canvas.clear();
+		self._measurePoints = [];
+			
+//			hideMeasureData();
+			
+		self._polygonIsInvalid = false;
+		self._currentPolygonIsInvalid = false;
+		self._totalDistance = 0;
+			
+		self.element
+			.bind("click", self._addPoint)
+			.bind("mousemove", self._measure)
+			.unbind("click", self._reinitialize)
+			.css("cursor", "crosshair");
+		return false;
+	},
+	_addLastPoint: function (e) {
+		this.element.unbind("click", this._addPoint)
+			.unbind("mousemove", this._measure)
+			.css("cursor", "auto")
+			.bind("click", this._reinitialize);
+	},	
+	_addPoint: function (e) {
+		var self = $(this).data("measure");
+
+		var mousePos = self._map.getMousePosition(e);
+
+		var pos = {
+			mousePos: mousePos,
+			pos: self._map.convertPixelToReal(mousePos),
+			distance: self._currentDistance
+		};
+
+		self._trigger("pointadded", null, pos);
+		
+		var firstPointSnapped = self._isFirstPointSnapped(mousePos);
+		var lastPointSnapped = self._isLastPointSnapped(mousePos);
+		
+		self._isPolygon(self._measurePoints, pos);
+		if (self._currentPolygonIsInvalid) {
+			self._polygonIsInvalid = true;
+		}
+		self._currentPolygonIsInvalid = false;
+
+		if (lastPointSnapped || firstPointSnapped) {
+			self._draw(pos, {
+				highlightFirst: firstPointSnapped, 
+				highlightLast: lastPointSnapped,
+				drawPoints: false
+			});
+			self._addLastPoint(e);
+		}
+		else {
+			self._measurePoints.push(pos);
+
+			self._totalDistance += self._currentDistance;
+			self._currentDistance = 0;
+			
+			lastPointSnapped = self._isLastPointSnapped(pos.mousePos);
+			self._draw(pos, {
+				highlightFirst: firstPointSnapped, 
+				highlightLast: lastPointSnapped,
+				drawPoints: true
+			});
+		}
+		return true;
+	},
+	_init: function () {
+		console.log(this.element);
+	},
+	_create: function () {
+		// ":maps" is a Mapbender selector which 
+		// checks if an element is a Mapbender map
+		this.element = this.element.filter(":maps");
+
+		if (!this.element.jquery || this.element.size() === 0) {
+			$.error("This widget must be applied to a Mapbender map.");
+		}
+		
+		this.element
+			.bind("click", this._addPoint)
+			.bind("mousemove", this._measure)
+			.css("cursor", "crosshair");		
+
+		this._map = this.element.mapbender();
+		this._srs = this._map.getSrs();
+		
+		var $canvas = $("<div />").css({
+			"z-index": 100,
+			"position": "relative"
+		}).appendTo(this.element);
+		this._canvas = Raphael($canvas.get(0), this._map.getWidth(), this._map.getHeight());
+	},
+	destroy: function () {
+		this.element
+			.unbind("click", this._addPoint)
+			.unbind("mousemove", this._measure)
+			.css("cursor", "default");		
+
+		this._canvas.clear();
+
+		$.Widget.prototype.destroy.apply(this, arguments); // default destroy
+	}
+});

Added: trunk/mapbender/http/widgets/w_pan.js
===================================================================
--- trunk/mapbender/http/widgets/w_pan.js	                        (rev 0)
+++ trunk/mapbender/http/widgets/w_pan.js	2010-09-02 15:46:09 UTC (rev 6876)
@@ -0,0 +1,74 @@
+$.widget("mapbender.pan", {
+	active: false,
+	_startPos: null,
+	_stopPos: null,
+	_map: null,
+	_panStart: function (e) {
+
+		this._startPos = this._map.getMousePosition(e);
+		this._stopPos = new Point(this._startPos);
+		this.active = true;
+		this.element.children().eq(0)
+			.bind("mouseup", $.proxy(this, "_panStop"))
+			.bind("mousemove", $.proxy(this, "_panMove"))
+			.css("cursor", "move");		
+	},
+	_panMove: function (e) {
+		if (!this.active) {
+			return false;
+		}
+		this._stopPos = this._map.getMousePosition(e);
+		var dif = this._stopPos.minus(this._startPos);
+		this._map.moveMap(dif.x, dif.y);
+		return false;		
+	},
+	_panStop: function (e) {
+		if (!this.active) {
+			return false;
+		}
+		if (!this._map) {
+			return false;
+		}
+		this.active = false;
+		var dif = this._stopPos.minus(this._startPos);
+		var widthHeight = new Mapbender.Point(
+			this._map.getWidth(),
+			this._map.getHeight()
+		);
+		var center = widthHeight.times(0.5).minus(dif);
+		var realCenter = this._map.convertPixelToReal(center);   
+		this._map.moveMap();
+		this._map.zoom(false, 1.0, realCenter);   
+		this.element.children().eq(0)
+			.unbind("mousemove", this._panMove)
+			.unbind("mouseup", this._panStop)
+			.css("cursor", "default");		
+		return false;		
+	},
+	_init: function () {
+	},
+	_create: function () {
+		// ":maps" is a Mapbender selector which 
+		// checks if an element is a Mapbender map
+		this.element = this.element.filter(":maps");
+
+		if (!this.element.jquery || this.element.size() === 0) {
+			$.error("This widget must be applied to a Mapbender map.");
+		}
+		
+		this._map = this.element.mapbender();
+
+		this.element.children().eq(0)
+			.bind("mousedown", $.proxy(this, "_panStart"));		
+
+	},
+	destroy: function () {
+		this.children().eq(0)
+			.unbind("mousedown", this._panStart)
+			.unbind("mousemove", this._panMove)
+			.unbind("mouseup", this._panStop)
+			.css("cursor", "default");		
+
+		$.Widget.prototype.destroy.apply(this, arguments); // default destroy
+	}
+});



More information about the Mapbender_commits mailing list