[Libreoffice-commits] online.git: Branch 'distro/collabora/collabora-online-4' - loleaflet/css loleaflet/images loleaflet/src
Tomaž Vajngerl (via logerrit)
logerrit at kemper.freedesktop.org
Wed Oct 2 21:26:57 UTC 2019
loleaflet/css/loleaflet.css | 11 +++
loleaflet/images/table-move-marker.svg | 56 ++++++++++++++++
loleaflet/src/dom/Draggable.js | 3
loleaflet/src/layer/marker/Marker.Drag.js | 8 +-
loleaflet/src/layer/tile/TileLayer.TableOverlay.js | 71 ++++++++++++++++++++-
5 files changed, 141 insertions(+), 8 deletions(-)
New commits:
commit cd5b538c1cf17d69bec5bf29ccf351bec5fefd4c
Author: Tomaž Vajngerl <tomaz.vajngerl at collabora.co.uk>
AuthorDate: Sun Sep 29 23:41:28 2019 +0200
Commit: Tomaž Vajngerl <quikee at gmail.com>
CommitDate: Wed Oct 2 23:26:38 2019 +0200
tdf#125565 Added table move marker
Change-Id: Iffa1b969986c9f9b405d5713b56a192a1069645f
Reviewed-on: https://gerrit.libreoffice.org/79821
Reviewed-by: Tomaž Vajngerl <quikee at gmail.com>
Tested-by: Tomaž Vajngerl <quikee at gmail.com>
(cherry picked from commit d1eaa895aa6a4b5978ed4038cd6b03aebbaa6107)
Reviewed-on: https://gerrit.libreoffice.org/79823
Tested-by: Jenkins CollaboraOffice <jenkinscollaboraoffice at gmail.com>
diff --git a/loleaflet/css/loleaflet.css b/loleaflet/css/loleaflet.css
index a270af77a..8589c811c 100644
--- a/loleaflet/css/loleaflet.css
+++ b/loleaflet/css/loleaflet.css
@@ -89,6 +89,17 @@
cursor: row-resize;
}
+.table-move-marker {
+ margin-left: 0px;
+ margin-top: 0px;
+ width: 24px;
+ height: 24px;
+ background-image: url('images/table-move-marker.svg');
+ background-size: 100% 100%;
+ background-repeat: no-repeat;
+ cursor: col-resize;
+}
+
body {
margin: 0;
overflow: hidden;
diff --git a/loleaflet/images/table-move-marker.svg b/loleaflet/images/table-move-marker.svg
new file mode 100644
index 000000000..6ab8ef55a
--- /dev/null
+++ b/loleaflet/images/table-move-marker.svg
@@ -0,0 +1,56 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+ xmlns:dc="http://purl.org/dc/elements/1.1/"
+ xmlns:cc="http://creativecommons.org/ns#"
+ xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+ xmlns:svg="http://www.w3.org/2000/svg"
+ xmlns="http://www.w3.org/2000/svg"
+ xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+ xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+ viewBox="0 0 24 24"
+ version="1.1"
+ id="svg4"
+ sodipodi:docname="marker-move.svg"
+ width="24"
+ height="24"
+ inkscape:version="0.92.4 (unknown)">
+ <metadata
+ id="metadata10">
+ <rdf:RDF>
+ <cc:Work
+ rdf:about="">
+ <dc:format>image/svg+xml</dc:format>
+ <dc:type
+ rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+ <dc:title></dc:title>
+ </cc:Work>
+ </rdf:RDF>
+ </metadata>
+ <defs
+ id="defs8" />
+ <sodipodi:namedview
+ pagecolor="#ffffff"
+ bordercolor="#666666"
+ borderopacity="1"
+ objecttolerance="10"
+ gridtolerance="10"
+ guidetolerance="10"
+ inkscape:pageopacity="0"
+ inkscape:pageshadow="2"
+ inkscape:window-width="3840"
+ inkscape:window-height="2032"
+ id="namedview6"
+ showgrid="false"
+ inkscape:zoom="23.8396"
+ inkscape:cx="38.712406"
+ inkscape:cy="0.44730152"
+ inkscape:window-x="0"
+ inkscape:window-y="54"
+ inkscape:window-maximized="1"
+ inkscape:current-layer="svg4" />
+ <path
+ d="M 11.999999,0 7.3846151,5.5384611 H 11.076923 V 11.076924 H 5.5384614 V 7.3846148 L 0,12 5.5384614,16.615385 v -3.692307 h 5.5384616 v 5.538461 H 7.3846151 L 11.999999,24 16.615384,18.461539 h -3.692308 v -5.538461 h 5.538461 v 3.692307 L 24,12 18.461537,7.3846148 V 11.076924 H 12.923076 V 5.5384611 h 3.692308 z"
+ id="path2"
+ inkscape:connector-curvature="0"
+ style="fill:#4d82b8;stroke-width:1" />
+</svg>
diff --git a/loleaflet/src/dom/Draggable.js b/loleaflet/src/dom/Draggable.js
index d9f5485a8..b6cd70954 100644
--- a/loleaflet/src/dom/Draggable.js
+++ b/loleaflet/src/dom/Draggable.js
@@ -137,7 +137,7 @@ L.Draggable = L.Evented.extend({
L.DomEvent.preventDefault(e);
if (!this._moved) {
- this.fire('dragstart');
+ this.fire('dragstart', {originalEvent: e});
this._moved = true;
this._startPos = L.DomUtil.getPosition(this._element).subtract(offset);
@@ -192,6 +192,7 @@ L.Draggable = L.Evented.extend({
L.Util.cancelAnimFrame(this._animRequest);
this.fire('dragend', {
+ originalEvent: e,
distance: this._newPos.distanceTo(this._startPos)
});
} else {
diff --git a/loleaflet/src/layer/marker/Marker.Drag.js b/loleaflet/src/layer/marker/Marker.Drag.js
index d9f789235..179408e9b 100644
--- a/loleaflet/src/layer/marker/Marker.Drag.js
+++ b/loleaflet/src/layer/marker/Marker.Drag.js
@@ -58,11 +58,11 @@ L.Handler.MarkerDrag = L.Handler.extend({
this._marker.fire('down', e);
},
- _onDragStart: function () {
+ _onDragStart: function (e) {
this._marker
.closePopup()
- .fire('movestart')
- .fire('dragstart');
+ .fire('movestart', e)
+ .fire('dragstart', e);
},
_onDrag: function (e) {
@@ -86,7 +86,7 @@ L.Handler.MarkerDrag = L.Handler.extend({
_onDragEnd: function (e) {
this._marker
- .fire('moveend')
+ .fire('moveend', e)
.fire('dragend', e);
},
diff --git a/loleaflet/src/layer/tile/TileLayer.TableOverlay.js b/loleaflet/src/layer/tile/TileLayer.TableOverlay.js
index 7af0d971b..6a7cba29b 100644
--- a/loleaflet/src/layer/tile/TileLayer.TableOverlay.js
+++ b/loleaflet/src/layer/tile/TileLayer.TableOverlay.js
@@ -8,6 +8,7 @@ L.TileLayer.include({
this._tableColumnMarkers = [];
this._tableRowMarkers = [];
this._tableMarkersDragged = false;
+ this._initMoveMarkers();
this._tableSelectionColumnMarkers = [];
this._tableSelectionRowMarkers = [];
this._selectionHeaderDistanceFromTable = 6;
@@ -17,6 +18,17 @@ L.TileLayer.include({
var point = this._latLngToTwips(this._map.unproject(new L.Point(pixel, 0)));
return point.x;
},
+ _initMoveMarkers: function () {
+ this._tableMoveMarker = L.marker(new L.LatLng(0, 0), {
+ icon: L.divIcon({
+ className: 'table-move-marker',
+ iconSize: null
+ }),
+ draggable: true
+ });
+
+ this._tableMoveMarker.on('dragstart drag dragend', this._onTableMoveMarkerDrag, this);
+ },
_setMarkerPosition: function(marker) {
var point = this._twipsToLatLng(marker._positionTwips, this._map.getZoom());
point = this._map.project(point);
@@ -108,6 +120,8 @@ L.TileLayer.include({
}
this._tableSelectionRowMarkers = [];
+ this._map.removeLayer(this._tableMoveMarker);
+
// Create markers
if (this._currentTableData.rows && this._currentTableData.rows.entries.length > 0 && this._currentTableData.columns && this._currentTableData.columns.entries.length > 0) {
this._tablePositionColumnOffset = parseInt(this._currentTableData.columns.tableOffset);
@@ -146,7 +160,6 @@ L.TileLayer.include({
this._addSelectionMarkers('column', columnPositions, firstRowPosition, lastRowPosition);
rowPositions.push(parseInt(this._currentTableData.rows.left));
-
for (i = 0; i < this._currentTableData.rows.entries.length; i++) {
entry = this._currentTableData.rows.entries[i];
rowPositions.push(parseInt(entry.position));
@@ -162,9 +175,28 @@ L.TileLayer.include({
this._tableRowMarkers.push(markerX);
this._addSelectionMarkers('row', rowPositions, firstColumnPosition, lastColumnPosition);
+
+ if (this._map.getDocType() === 'presentation' && this._currentTableData.rectangle) {
+ var topLeftTwips = new L.Point(parseInt(this._currentTableData.rectangle.x), parseInt(this._currentTableData.rectangle.y));
+ var offset = new L.Point(parseInt(this._currentTableData.rectangle.width), parseInt(this._currentTableData.rectangle.height));
+ var bottomRightTwips = topLeftTwips.add(offset);
+
+ var tableRectangle = new L.LatLngBounds(
+ this._twipsToLatLng(topLeftTwips, this._map.getZoom()),
+ this._twipsToLatLng(bottomRightTwips, this._map.getZoom()));
+ this._map.addLayer(this._tableMoveMarker);
+
+ var markerRect;
+ var movePosition = new L.LatLng(tableRectangle.getNorth(), tableRectangle.getWest());
+ movePosition = this._map.project(movePosition);
+ markerRect = this._tableMoveMarker._icon.getBoundingClientRect();
+ movePosition = movePosition.subtract(new L.Point(markerRect.width + 4, markerRect.height + 4));
+ movePosition = this._map.unproject(movePosition);
+ this._tableMoveMarker.setLatLng(movePosition);
+ }
}
},
- _onZoom: function () {
+ _onZoomForTableMarkers: function () {
this._updateTableMarkers();
},
_onTableSelectedMsg: function (textMsg) {
@@ -177,7 +209,7 @@ L.TileLayer.include({
this._currentTableData = message;
this._hasTableSelection = this._currentTableData.rows != null || this._currentTableData.columns != null;
this._updateTableMarkers();
- this._map.on('zoomend', L.bind(this._onZoom, this));
+ this._map.on('zoomend', L.bind(this._onZoomForTableMarkers, this));
},
_addSelectionMarkers: function (type, positions, start, end) {
if (positions.length < 2)
@@ -300,6 +332,39 @@ L.TileLayer.include({
if (e.originalEvent)
e.originalEvent.preventDefault();
+ },
+ _createMouseEvent: function (type, inputEvent) {
+ var event = inputEvent;
+ if (inputEvent.type == 'touchstart' || inputEvent.type == 'touchmove') {
+ event = inputEvent.touches[0];
+ }
+ else if (inputEvent.type == 'touchend') {
+ event = inputEvent.changedTouches[0];
+ }
+
+ var newEvent = document.createEvent('MouseEvents');
+ newEvent.initMouseEvent(
+ type, true, true, window, 1,
+ event.screenX, event.screenY,
+ event.clientX, event.clientY,
+ false, false, false, false, 0, null
+ );
+ return newEvent;
+ },
+ _onTableMoveMarkerDrag: function (event) {
+ var mouseEvent;
+ if (event.type == 'dragstart') {
+ mouseEvent = this._createMouseEvent('mousedown', event.originalEvent);
+ this._graphicMarker._onDragStart(mouseEvent);
+ }
+ else if (event.type == 'drag') {
+ mouseEvent = this._createMouseEvent('mousemove', event.originalEvent);
+ this._graphicMarker._onDrag(mouseEvent);
+ }
+ else if (event.type == 'dragend') {
+ mouseEvent = this._createMouseEvent('mouseup', event.originalEvent);
+ this._graphicMarker._onDragEnd(mouseEvent);
+ }
}
});
More information about the Libreoffice-commits
mailing list