[Libreoffice-commits] online.git: loleaflet/src

[Dennis Francis (via logerrit)]

 loleaflet/src/layer/tile/CanvasTileLayer.js |   23 ++++++++++++++++++-----
 1 file changed, 18 insertions(+), 5 deletions(-)

New commits:
commit 0d366059e9659c60d80673ddcadb3e72ab2b85bd
Author:     Dennis Francis <dennis.francis at collabora.com>
AuthorDate: Fri Aug 7 14:36:42 2020 +0530
Commit:     Dennis Francis <dennis.francis at collabora.com>
CommitDate: Wed Aug 12 10:18:30 2020 +0200

    loleaflet: use the empty tile-container as a proxy...
    
    ... for the canvas to get the mouse-move+drag events and the various
    touch events. This is needed because the canvas element (created by
    L.CanvasTileLayer) is a sibling of the map-pane div and not a decendant.
    Any change in canvas-size is also applied on the tile-container. Also if
    there is a move event, counter adjust the tile-container position so
    that it is precisely over the canvas at all times.
    
    Change-Id: I5d5bc070c0063c5f24c4b1cb1448db0ce19841bd
    Reviewed-on: https://gerrit.libreoffice.org/c/online/+/100480
    Tested-by: Jenkins
    Tested-by: Jenkins CollaboraOffice <jenkinscollaboraoffice at gmail.com>
    Reviewed-by: Dennis Francis <dennis.francis at collabora.com>

diff --git a/loleaflet/src/layer/tile/CanvasTileLayer.js b/loleaflet/src/layer/tile/CanvasTileLayer.js
index 13a1c0f40..51941a73a 100644
--- a/loleaflet/src/layer/tile/CanvasTileLayer.js
+++ b/loleaflet/src/layer/tile/CanvasTileLayer.js
@@ -119,6 +119,15 @@ L.CanvasTilePainter = L.Class.extend({
 		this._width = parseInt(this._canvas.style.width);
 		this._height = parseInt(this._canvas.style.height);
 		this.clear();
+		this._syncTileContainerSize();
+	},
+
+	_syncTileContainerSize: function () {
+		var tileContainer = this._layer._container;
+		if (tileContainer) {
+			tileContainer.style.width = this._width + 'px';
+			tileContainer.style.height = this._height + 'px';
+		}
 	},
 
 	clear: function () {
@@ -416,11 +425,6 @@ L.CanvasTileLayer = L.TileLayer.extend({
 
 		this._canvas = L.DomUtil.create('canvas', '', this._canvasContainer);
 		this._painter = new L.CanvasTilePainter(this, L.getDpiScaleFactor());
-
-		// FIXME: A hack to get the Hammer events from the pane, which does not happen with
-		// no tile img's in it.
-		this._container.style.width = this._canvas.style.width;
-		this._container.style.height = this._canvas.style.height;
 		this._container.style.position = 'absolute';
 
 		if (L.Browser.cypressTest) {
@@ -431,6 +435,15 @@ L.CanvasTileLayer = L.TileLayer.extend({
 		this._map.on('moveend', this._painter.stopUpdates, this._painter);
 		this._map.on('zoomend', this._painter.update, this._painter);
 		this._map.on('splitposchanged', this._painter.update, this._painter);
+		this._map.on('move', this._syncTilePanePos, this);
+	},
+
+	_syncTilePanePos: function () {
+		var tilePane = this._container.parentElement;
+		if (tilePane) {
+			var mapPanePos = this._map._getMapPanePos();
+			L.DomUtil.setPosition(tilePane, new L.Point(-mapPanePos.x , -mapPanePos.y));
+		}
 	},
 
 	hasSplitPanesSupport: function () {