[Libreoffice-commits] online.git: Branch 'distro/collabora/collabora-online-4-0' - loleaflet/src

[Tor Lillqvist (via logerrit)]

 loleaflet/src/dom/DomEvent.js          |    8 ++++++++
 loleaflet/src/layer/vector/SVGGroup.js |   25 +++++++++++++++++++++++++
 2 files changed, 33 insertions(+)

New commits:
commit 325c341bec6d42ff076c9a3c9ad23c228520a70f
Author:     Tor Lillqvist <tml at collabora.com>
AuthorDate: Thu Mar 28 00:07:15 2019 +0200
Commit:     Andras Timar <andras.timar at collabora.com>
CommitDate: Thu Jun 13 13:21:32 2019 +0200

    tdf#124179: Make it possible to drag an image using a touch gesture
    
    First select the image (so that the circular handles show up), then
    drag it.
    
    Change-Id: Idda55423bd38675841ed2a1ed21143d765b83ed1
    Reviewed-on: https://gerrit.libreoffice.org/73945
    Reviewed-by: Tor Lillqvist <tml at collabora.com>
    Reviewed-by: Andras Timar <andras.timar at collabora.com>
    Tested-by: Andras Timar <andras.timar at collabora.com>

diff --git a/loleaflet/src/dom/DomEvent.js b/loleaflet/src/dom/DomEvent.js
index 67e04c4ce..0d59d54aa 100644
--- a/loleaflet/src/dom/DomEvent.js
+++ b/loleaflet/src/dom/DomEvent.js
@@ -178,6 +178,9 @@ L.DomEvent = {
 
 	getMousePosition: function (e, container) {
 		if (!container) {
+			if (e.clientX === undefined && e.touches !== undefined)
+				return new L.Point(e.touches[0].clientX, e.touches[0].clientY);
+
 			return new L.Point(e.clientX, e.clientY);
 		}
 
@@ -192,6 +195,11 @@ L.DomEvent = {
 			left = top = 0;
 		}
 
+		if (e.clientX === undefined && e.touches !== undefined)
+			return new L.Point(
+				e.touches[0].clientX - left - container.clientLeft,
+				e.touches[0].clientY - top - container.clientTop);
+
 		return new L.Point(
 			e.clientX - left - container.clientLeft,
 			e.clientY - top - container.clientTop);
diff --git a/loleaflet/src/layer/vector/SVGGroup.js b/loleaflet/src/layer/vector/SVGGroup.js
index da8a40079..12c3a2931 100644
--- a/loleaflet/src/layer/vector/SVGGroup.js
+++ b/loleaflet/src/layer/vector/SVGGroup.js
@@ -9,6 +9,11 @@ L.SVGGroup = L.Layer.extend({
 		noClip: true
 	},
 
+	lastTouchEvent: {
+		clientX: 0,
+		clientY: 0
+	},
+
 	initialize: function (bounds, options) {
 		L.setOptions(this, options);
 		this._bounds = bounds;
@@ -47,6 +52,11 @@ L.SVGGroup = L.Layer.extend({
 	},
 
 	_onDragStart: function(evt) {
+		if (evt.type === 'touchstart') {
+			this.lastTouchEvent.clientX = evt.touches[0].clientX;
+			this.lastTouchEvent.clientY = evt.touches[0].clientY;
+		}
+
 		if (!this._dragShape)
 			return;
 		this._moved = false;
@@ -54,6 +64,9 @@ L.SVGGroup = L.Layer.extend({
 		L.DomEvent.on(this._dragShape, 'mousemove', this._onDrag, this);
 		L.DomEvent.on(this._dragShape, 'mouseup', this._onDragEnd, this);
 
+		L.DomEvent.on(this._dragShape, 'touchmove', this._onDrag, this);
+		L.DomEvent.on(this._dragShape, 'touchend', this._onDragEnd, this);
+
 		var data = {
 			originalEvent: evt,
 			containerPoint: this._map.mouseEventToContainerPoint(evt)
@@ -65,6 +78,11 @@ L.SVGGroup = L.Layer.extend({
 	},
 
 	_onDrag: function(evt) {
+		if (evt.type === 'touchmove') {
+			this.lastTouchEvent.clientX = evt.touches[0].clientX;
+			this.lastTouchEvent.clientY = evt.touches[0].clientY;
+		}
+
 		if (!this._dragShape)
 			return;
 
@@ -82,11 +100,17 @@ L.SVGGroup = L.Layer.extend({
 	},
 
 	_onDragEnd: function(evt) {
+		if (evt.type === 'touchend' && evt.touches.length == 0)
+			evt.touches[0] = {clientX: this.lastTouchEvent.clientX, clientY: this.lastTouchEvent.clientY};
+
 		if (!this._dragShape)
 			return;
 		L.DomEvent.off(this._dragShape, 'mousemove', this._onDrag, this);
 		L.DomEvent.off(this._dragShape, 'mouseup', this._onDragEnd, this);
 
+		L.DomEvent.off(this._dragShape, 'touchmove', this._onDrag, this);
+		L.DomEvent.off(this._dragShape, 'touchend', this._onDragEnd, this);
+
 		this._moved = false;
 		this._hideEmbeddedSVG();
 		var pos = this._map.mouseEventToLatLng(evt);
@@ -129,6 +153,7 @@ L.SVGGroup = L.Layer.extend({
 			this._path.appendChild(this._rect._path);
 			this._dragShape = this._rect._path;
 			L.DomEvent.on(this._rect._path, 'mousedown', this._onDragStart, this);
+			L.DomEvent.on(this._rect._path, 'touchstart', this._onDragStart, this);
 		}
 		this._update();
 	},