Merge branch '533-coordinates-of-polygon' into 'devel_12.1.x'

Resolve "coordinates of polygon are not computed properly when polygon goes outside map"

See merge request !457

frontend-js/src/main/js/map/canvas/GoogleMaps/GoogleMapsApiCanvas.js

@@ -519,12 +519,11 @@ GoogleMapsApiCanvas.prototype.getSelectedArea = function () {
 GoogleMapsApiCanvas.prototype.areaToString = function (area) {
   var len = area.getPath().length;
   var path = area.getPath();
-  var res = "";
+  var points = [];
   for (var i = 0; i < len; i++) {
-    var point = this.fromLatLngToPoint(path.getAt(i));
-    res += point.x.toFixed(2) + "," + point.y.toFixed(2) + ";";
+    points.push(this.fromLatLngToPoint(path.getAt(i)));
   }
-  return res;
+  return this.pointsToString(points);
 };
 
 /**

frontend-js/src/main/js/map/canvas/MapCanvas.js

@@ -354,4 +354,24 @@ MapCanvas.prototype.latLngToPoint = function (latLng) {
   return point;
 };
 
+/**
+ *
+ * @param {Point[]} points
+ * @returns {string}
+ */
+MapCanvas.prototype.pointsToString = function (points) {
+  var self = this;
+  var result = "";
+  for (var i = 0; i < points.length; i++) {
+    var point = points[i];
+    var x = point.x;
+    if (x >= self.getOptions().width * 2) {
+      x -= 360 * self.pixelsPerLonDegree_ * self.zoomFactor;
+    }
+    result += x.toFixed(2) + "," + point.y.toFixed(2) + ";";
+  }
+  return result;
+};
+
+
 module.exports = MapCanvas;

frontend-js/src/main/js/map/canvas/OpenLayers/OpenLayerCanvas.js

@@ -133,14 +133,14 @@ function OpenLayerCanvas(element, options) {
     //there is nothing in the api that allows for it
     return self.callListeners("mouseup");
   });
-  map.on("pointerdrag", function (evt) {
+  map.on("pointerdrag", function () {
     if (!dragStarted) {
       dragStarted = true;
       return self.callListeners("dragstart");
     }
   });
 
-  map.getView().on('change:resolution', function (e) {
+  map.getView().on('change:resolution', function () {
     var zoom = map.getView().getZoom();
     if (zoom === Math.floor(zoom)) {
       return self.callListeners("zoom_changed");
@@ -154,7 +154,7 @@ function OpenLayerCanvas(element, options) {
   // change mouse cursor when over marker
   $(map.getViewport()).on('mousemove', function (e) {
     var pixel = map.getEventPixel(e.originalEvent);
-    var hit = map.forEachFeatureAtPixel(pixel, function (feature, layer) {
+    var hit = map.forEachFeatureAtPixel(pixel, function () {
       return true;
     });
     if (hit) {
@@ -365,7 +365,7 @@ OpenLayerCanvas.prototype.setZoom = function (zoom) {
 };
 
 /**
- * @returns {string}
+ * @returns {string|null}
  */
 OpenLayerCanvas.prototype.getBackgroundId = function () {
   var layers = this._layers;
@@ -562,13 +562,12 @@ OpenLayerCanvas.prototype.triggerEvent = function (type, data) {
  * @returns {string}
  */
 OpenLayerCanvas.prototype.featureToString = function (feature) {
-  var result = "";
+  var points = [];
   var coordinates = feature.getGeometry().getCoordinates()[0];
   for (var i = 0; i < coordinates.length; i++) {
-    var point = this.fromProjectionToPoint(coordinates[i]);
-    result += point.x.toFixed(2) + "," + point.y.toFixed(2) + ";";
+    points.push(this.fromProjectionToPoint(coordinates[i]));
   }
-  return result;
+  return this.pointsToString(points);
 };
 
 module.exports = OpenLayerCanvas;

frontend-js/src/test/js/map/canvas/MapCanvas-test.js

@@ -2,6 +2,7 @@
 require("../../mocha-config");
 
 var MapCanvas = require('../../../../main/js/map/canvas/MapCanvas');
+var Point = require('../../../../main/js/map/canvas/Point');
 
 var chai = require('chai');
 var assert = chai.assert;
@@ -33,4 +34,31 @@ describe('MapCanvas', function () {
     assert.ok(canvas.triggerListeners);
   });
 
+  describe("pointsToString", function () {
+    it("proper values", function () {
+
+      var canvas = new MapCanvas(testDiv, {
+        tileSize: 256,
+        minZoom: 2,
+        height: 600,
+        width: 800
+      });
+      var result = canvas.pointsToString([new Point(17, 10), new Point(12, 15)]);
+      assert.ok(result.indexOf("15") >= 0);
+      assert.ok(result.indexOf("17") >= 0);
+    });
+
+    it("exceeded values", function () {
+
+      var canvas = new MapCanvas(testDiv, {
+        tileSize: 256,
+        minZoom: 2,
+        height: 600,
+        width: 800
+      });
+      var result = canvas.pointsToString([new Point(2000, 10), new Point(12, 15)]);
+      assert.ok(result.indexOf("2000") === -1);
+    });
+  });
+
 });