[Mapbender-commits] r7188 - trunk/mapbender/http/widgets

svn_mapbender at osgeo.org svn_mapbender at osgeo.org
Fri Dec 3 10:11:33 EST 2010


Author: christoph
Date: 2010-12-03 07:11:33 -0800 (Fri, 03 Dec 2010)
New Revision: 7188

Modified:
   trunk/mapbender/http/widgets/w_measure.js
Log:
add panSubElement

Modified: trunk/mapbender/http/widgets/w_measure.js
===================================================================
--- trunk/mapbender/http/widgets/w_measure.js	2010-12-03 15:11:11 UTC (rev 7187)
+++ trunk/mapbender/http/widgets/w_measure.js	2010-12-03 15:11:33 UTC (rev 7188)
@@ -24,26 +24,30 @@
 	_isPolygon: function (pos) {
 
 		var len = this._measurePoints.length;
-		if (len < 2) {
+
+		var max = pos ? len - 1 : len - 2;
+
+		if (pos && len < 2 || !pos && len < 3) {
 			return false;
 		}
 
+		var posLocal = pos ? pos : this._measurePoints[len - 1];
+
 		var p0 = this._measurePoints[0].pos;
-		var pn = this._measurePoints[len - 1].pos;
-
-		for (var i = 0; i < len - 1; i++)  {
+		var pn = this._measurePoints[max].pos;
+		for (var i = 0; i < max; 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)
+				p0.x, p0.y, posLocal.x, posLocal.y)
 			) {
 				return false;
 			}
 			if (this._lineIntersect(
 				pi.x, pi.y, pj.x, pj.y,
-				pn.x, pn.y, pos.x, pos.y)
+				pn.x, pn.y, posLocal.x, posLocal.y)
 			) {
 				this._currentPolygonIsInvalid = true;
 				return false;
@@ -168,6 +172,14 @@
 		}
 		return null;
 	},
+	_calculateTotalDistance: function () {
+		for (var i = 0; i < count(this._measurePoints); i++) {
+
+		}
+	},
+	_calculatePerimeter: function () {
+
+	},
 	_isPointSnapped: function (p1, p2) {
 		return p1.dist(p2) <= this.options.measurePointDiameter/2;
 	},
@@ -194,31 +206,31 @@
 
 		var str_path = "";
 
-		if (!drawOptions.highlightFirst) {
+		if (pos && drawOptions && !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)) {
+				if (drawOptions && drawOptions.highlightLast && k === len - 1) {
+					continue;
+				}
 
+				if (drawOptions && drawOptions.drawPoints &&
+					(k === 0 && !this._polygonIsInvalid || k >= len - 2 && !drawOptions.highlightFirst)) {
+
 					var circle = this._canvas.circle(q.x, q.y, this.options.measurePointDiameter);
 
 					if (k === 0) {
 						circle.attr({
-							fill: drawOptions.highlightFirst ?
+							fill: drawOptions && drawOptions.highlightFirst ?
 								this.options.pointFillSnapped : this.options.pointFillDefault,
 							stroke: "none",
 							opacity: this.options.opacity
@@ -226,7 +238,7 @@
 					}
 					else {
 						circle.attr({
-							fill: drawOptions.highlightLast && k === len - 2 ?
+							fill: drawOptions && drawOptions.highlightLast && k === len - 2 ?
 								this.options.pointFillSnapped : this.options.pointFillDefault,
 							stroke: "none",
 							opacity: this.options.opacity
@@ -235,12 +247,12 @@
 				}
 			}
 		}
-		if (!drawOptions.highlightFirst) {
+		if (pos && drawOptions && !drawOptions.highlightFirst) {
 			this._measurePoints.pop();
 		}
 
 
-		if (this._isPolygon(this._measurePoints, pos) && !drawOptions.highlightLast && !this.polygonIsInvalid) {
+		if (this._isPolygon(this._measurePoints, pos) && drawOptions && !drawOptions.highlightLast && !this.polygonIsInvalid) {
 			var poly = this._canvas.path(str_path + 'Z');
 			poly.attr({
 				fill: drawOptions.highlightFirst ?
@@ -255,9 +267,9 @@
 
 		var line = this._canvas.path(str_path);
 		line.attr({
-			stroke: drawOptions.highlightFirst || drawOptions.highlightLast ?
+			stroke: drawOptions && (drawOptions.highlightFirst || drawOptions.highlightLast) ?
 				this.options.lineStrokeSnapped : this.options.lineStrokeDefault,
-			"stroke-width": drawOptions.highlightLast ?
+			"stroke-width": drawOptions && drawOptions.highlightLast ?
 				this.options.lineStrokeWidthSnapped : this.options.lineStrokeWidthDefault,
 			opacity: this.options.opacity
 		});
@@ -284,26 +296,38 @@
 					this._map.convertPixelToReal(mousePos)
 		};
 
-		this._trigger("onmeasure", null, pos);
 
+		var measureData = {
+			pos: pos
+		};
 
-		var previousPoint = this._measurePoints.length > 0 ?
-			this._measurePoints[this._measurePoints.length - 1].pos : null;
+		var len = this._measurePoints.length;
+		var previousPoint = len > 0 ?
+			this._measurePoints[len - 1].pos : null;
 
 		this._currentDistance = this._calculateDistance(
 			previousPoint,
 			pos.pos
 		);
 
-		if (this._measurePoints.length > 0) {
-			this._trigger("onmeasuredistance", null, this._currentDistance);
+		if (len > 0) {
+			measureData.currentDistance = this._currentDistance;
+			measureData.totalDistance = this._measurePoints[len - 1].totalDistance + this._currentDistance;
+			if (len > 1) {
+				measureData.perimeter = measureData.totalDistance + this._calculateDistance(
+					this._measurePoints[0].pos,
+					pos.pos
+				);
+			}
 		}
 
 		if (this._isPolygon(this._measurePoints, pos) && !this._polygonIsInvalid) {
 			this._currentArea = this._calculateArea(pos);
-			this._trigger("onmeasurearea", null, this._currentArea);
+			measureData.area = this._currentArea;
 		}
 
+		this._trigger("update", null, measureData);
+
 		this._draw(pos, {
 			highlightFirst: firstPointSnapped,
 			highlightLast: lastPointSnapped,
@@ -313,6 +337,8 @@
 	_reinitialize: function (e) {
 		this._canvas.clear();
 		this._measurePoints = [];
+		this._measurePoints.closedPolygon = false;
+		this._measurePoints.closedLine = false;
 
 //			hideMeasureData();
 
@@ -336,13 +362,18 @@
 	_addPoint: function (e) {
 		var mousePos = this._map.getMousePosition(e);
 
+		var len = this._measurePoints.length;
+
 		var pos = {
 			mousePos: mousePos,
 			pos: this._map.convertPixelToReal(mousePos),
-			distance: this._currentDistance
+			distance: this._currentDistance,
+			totalDistance: len > 0 ? 
+				this._measurePoints[len - 1].totalDistance + this._currentDistance :
+				this._currentDistance
 		};
 
-		this._trigger("pointadded", null, pos);
+//		this._trigger("pointadded", null, pos);
 
 		var firstPointSnapped = this._isFirstPointSnapped(mousePos);
 		var lastPointSnapped = this._isLastPointSnapped(mousePos);
@@ -360,6 +391,8 @@
 				drawPoints: false
 			});
 			this._addLastPoint(e);
+			this._measurePoints.closedPolygon = firstPointSnapped;
+			this._measurePoints.closedLine = lastPointSnapped;
 		}
 		else {
 			this._measurePoints.push(pos);
@@ -376,9 +409,53 @@
 		}
 		return true;
 	},
+	_redraw: function () {
+		if (!$(this.element).data("mb_measure")) {
+			return;
+		}
+		var len = this._measurePoints.length;
+		if (len === 0) {
+			return;
+		}
+		for (var i = 0; i < len; i++) {
+			var p = this._measurePoints[i];
+			p.mousePos = this._map.convertRealToPixel(p.pos);
+		}
+		if (this._measurePoints.closedPolygon) {
+			this._draw(undefined, {
+				highlightFirst: true,
+				highlightLast: false,
+				drawPoints: false
+			});
+		}
+		else if (this._measurePoints.closedLine) {
+			this._draw(undefined, {
+				highlightFirst: false,
+				highlightLast: true,
+				drawPoints: false
+			});
+		}
+		else {
+			this._draw(undefined, {
+				highlightFirst: false,
+				highlightLast: false,
+				drawPoints: false
+			});
+		}
+	},
 	_init: function () {
+		if (this._measurePoints.closedLine || this._measurePoints.closedPolygon) {
+			this._measurePoints = [];
+		}
+		this.element
+			.bind("click", $.proxy(this, "_addPoint"))
+			.bind("mousemove", $.proxy(this, "_measure"))
+			.css("cursor", "crosshair");
+
 	},
 	_create: function () {
+		this._measurePoints = [];
+		
 		// ":maps" is a Mapbender selector which
 		// checks if an element is a Mapbender map
 		this.element = this.element.filter(":maps");
@@ -387,28 +464,34 @@
 			$.error("This widget must be applied to a Mapbender map.");
 		}
 
-		this.element
-			.bind("click", $.proxy(this, "_addPoint"))
-			.bind("mousemove", $.proxy(this, "_measure"))
-			.css("cursor", "crosshair");
-
 		this._map = this.element.mapbender();
+		this._map.events.afterMapRequest.register($.proxy(this._redraw, this));
 		this._srs = this._map.getSrs();
 
-		var $canvas = $("<div />").css({
+		this._$canvas = $("<div />").css({
 			"z-index": 100,
 			"position": "relative"
 		}).appendTo(this.element);
-		this._canvas = Raphael($canvas.get(0), this._map.getWidth(), this._map.getHeight());
+		this._canvas = Raphael(this._$canvas.get(0), this._map.getWidth(), this._map.getHeight());
+		mb_registerPanSubElement($(this._canvas.canvas).parent().get(0));
 	},
-	destroy: function () {
+	// the measured geometry will be available, the events will be deleted
+	deactivate: function () {
 		this.element
 			.unbind("click", this._addPoint)
 			.unbind("mousemove", this._measure)
+			.unbind("click", this._reinitialize)
 			.css("cursor", "default");
-
+	},
+	// delete everything
+	destroy: function () {
+		this.deactivate();
 		this._canvas.clear();
+		this._measurePoints = [];
+		this._$canvas.remove();
+		this._map.events.afterMapRequest.unregister($.proxy(this._redraw, this));
 
 		$.Widget.prototype.destroy.apply(this, arguments); // default destroy
+		$(this.element).data("mb_measure", null);
 	}
 });



More information about the Mapbender_commits mailing list