loleaflet/README | 2 loleaflet/dist/leaflet.css | 2 loleaflet/src/layer/marker/Icon.js | 10 -- loleaflet/src/layer/tile/CalcTileLayer.js | 2 loleaflet/src/layer/tile/GridLayer.js | 5 - loleaflet/src/layer/tile/ImpressTileLayer.js | 4 loleaflet/src/layer/tile/TileLayer.js | 121 ++++++++++++++++++--------- loleaflet/src/layer/tile/WriterTileLayer.js | 2 loleaflet/src/map/handler/Map.Mouse.js | 26 +++-- 9 files changed, 105 insertions(+), 69 deletions(-)
New commits: commit c149e4bf2dff18280ccce692cb2393a70dd0e931 Author: Mihai Varga <mihai.va...@collabora.com> Date: Thu Sep 17 18:39:11 2015 +0300 loleaflet: add an offset of 2 pixels to selection handles Without this, grabbing a selection handle causes the selection to jump a line below diff --git a/loleaflet/dist/leaflet.css b/loleaflet/dist/leaflet.css index 6acc5bb..db34a9a 100644 --- a/loleaflet/dist/leaflet.css +++ b/loleaflet/dist/leaflet.css @@ -43,7 +43,6 @@ .leaflet-selection-marker-start { margin-left: -28px; - margin-top: -2px; width: 30px; height: 44px; background-image: url(images/handle_start.png); @@ -51,7 +50,6 @@ .leaflet-selection-marker-end { margin-left: -2px; - margin-top: -2px; width: 30px; height: 44px; background-image: url(images/handle_end.png); diff --git a/loleaflet/src/layer/tile/TileLayer.js b/loleaflet/src/layer/tile/TileLayer.js index f18ac0c..8962cbd 100644 --- a/loleaflet/src/layer/tile/TileLayer.js +++ b/loleaflet/src/layer/tile/TileLayer.js @@ -601,12 +601,18 @@ L.TileLayer = L.GridLayer.extend({ } if (!startMarker.isDragged) { - startMarker.setLatLng(this._textSelectionStart.getSouthWest()); + var pos = this._map.project(this._textSelectionStart.getSouthWest()); + pos = pos.subtract(new L.Point(0, 2)); + pos = this._map.unproject(pos); + startMarker.setLatLng(pos); this._map.addLayer(startMarker); } if (!endMarker.isDragged) { - endMarker.setLatLng(this._textSelectionEnd.getSouthEast()); + var pos = this._map.project(this._textSelectionEnd.getSouthEast()); + pos = pos.subtract(new L.Point(0, 2)); + pos = this._map.unproject(pos); + endMarker.setLatLng(pos); this._map.addLayer(endMarker); } } commit 8f94520e3e021086b8739efb4894346c4a7d10db Author: Mihai Varga <mihai.va...@collabora.com> Date: Thu Sep 17 18:32:53 2015 +0300 loleaflet: reworked selection handles Selection handles are now positioned relative to the text selection starting and ending points. So the start handle will alwasy be the one near the text selection start, while the end handle will be at the end, near the cursor Conflicts: loleaflet/src/layer/tile/GridLayer.js diff --git a/loleaflet/src/layer/tile/GridLayer.js b/loleaflet/src/layer/tile/GridLayer.js index 844736a..d0b49be 100644 --- a/loleaflet/src/layer/tile/GridLayer.js +++ b/loleaflet/src/layer/tile/GridLayer.js @@ -51,8 +51,9 @@ L.GridLayer = L.Layer.extend({ if (this._graphicMarker) { this._graphicMarker.remove(); } - this._startMarker.remove(); - this._endMarker.remove(); + for (var key in this._selectionHandles) { + this._selectionHandles[key].remove(); + } }, bringToFront: function () { diff --git a/loleaflet/src/layer/tile/TileLayer.js b/loleaflet/src/layer/tile/TileLayer.js index 064ee8b..f18ac0c 100644 --- a/loleaflet/src/layer/tile/TileLayer.js +++ b/loleaflet/src/layer/tile/TileLayer.js @@ -64,31 +64,24 @@ L.TileLayer = L.GridLayer.extend({ // Rectangle graphic selection this._graphicSelection = new L.LatLngBounds(new L.LatLng(0, 0), new L.LatLng(0, 0)); // Position and size of the selection start (as if there would be a cursor caret there). - this._textSelectionStart = new L.LatLngBounds(new L.LatLng(0, 0), new L.LatLng(0, 0)); - // Position and size of the selection end. - this._textSelectionEnd = new L.LatLngBounds(new L.LatLng(0, 0), new L.LatLng(0, 0)); this._lastValidPart = -1; // Cursor marker this._cursorMarker = null; // Graphic marker this._graphicMarker = null; - // Handle start marker - this._startMarker = L.marker(new L.LatLng(0, 0), { - icon: L.divIcon({ - className: 'leaflet-selection-marker-start', - iconSize: null - }), - draggable: true - }); - // Handle end marker - this._endMarker = L.marker(new L.LatLng(0, 0), { - icon: L.divIcon({ - className: 'leaflet-selection-marker-end', - iconSize: null - }), - draggable: true - }); + // Selection handle marker + this._selectionHandles = {}; + ['start', 'end'].forEach(L.bind(function (handle) { + this._selectionHandles[handle] = L.marker(new L.LatLng(0, 0), { + icon: L.divIcon({ + className: 'leaflet-selection-marker-' + handle, + iconSize: null + }), + draggable: true + }); + }, this)); + this._emptyTilesCount = 0; this._msgQueue = []; }, @@ -110,8 +103,9 @@ L.TileLayer = L.GridLayer.extend({ map.on('dragstart', this._onDragStart, this); map.on('requestloksession', this._onRequestLOKSession, this); map.on('error', this._mapOnError, this); - this._startMarker.on('drag dragend', this._onSelectionHandleDrag, this); - this._endMarker.on('drag dragend', this._onSelectionHandleDrag, this); + for (var key in this._selectionHandles) { + this._selectionHandles[key].on('drag dragend', this._onSelectionHandleDrag, this); + } this._textArea = map._textArea; this._textArea.focus(); if (this.options.readOnly) { @@ -358,7 +352,7 @@ L.TileLayer = L.GridLayer.extend({ this._twipsToLatLng(bottomRightTwips, this._map.getZoom())); } else { - this._textSelectionEnd = new L.LatLngBounds(new L.LatLng(0, 0), new L.LatLng(0, 0)); + this._textSelectionEnd = null; } }, @@ -373,7 +367,7 @@ L.TileLayer = L.GridLayer.extend({ this._twipsToLatLng(bottomRightTwips, this._map.getZoom())); } else { - this._textSelectionStart = new L.LatLngBounds(new L.LatLng(0, 0), new L.LatLng(0, 0)); + this._textSelectionStart = null; } }, @@ -469,8 +463,11 @@ L.TileLayer = L.GridLayer.extend({ }, // Is rRectangle empty? - _isEmptyRectangle: function (aBounds) { - return aBounds.getSouthWest().equals(new L.LatLng(0, 0)) && aBounds.getNorthEast().equals(new L.LatLng(0, 0)); + _isEmptyRectangle: function (bounds) { + if (!bounds) { + return true; + } + return bounds.getSouthWest().equals(new L.LatLng(0, 0)) && bounds.getNorthEast().equals(new L.LatLng(0, 0)); }, // Update cursor layer (blinking cursor). @@ -531,10 +528,10 @@ L.TileLayer = L.GridLayer.extend({ this._textArea.focus(); } - if (this._startMarker === e.target) { + if (this._selectionHandles.start === e.target) { this._postSelectTextEvent('start', aPos.x, aPos.y); } - if (this._endMarker === e.target) { + else if (this._selectionHandles.end === e.target) { this._postSelectTextEvent('end', aPos.x, aPos.y); } }, @@ -564,24 +561,62 @@ L.TileLayer = L.GridLayer.extend({ // Update text selection handlers. _onUpdateTextSelection: function () { - if (this._selections.getLayers().length !== 0) { - if (!this._isEmptyRectangle(this._textSelectionStart) && !this._startMarker.isDragged) { - this._startMarker.setLatLng(this._textSelectionStart.getSouthWest()); - this._map.addLayer(this._startMarker); + var startMarker, endMarker; + for (var key in this._selectionHandles) { + if (key === 'start') { + startMarker = this._selectionHandles[key]; } + else if (key === 'end') { + endMarker = this._selectionHandles[key]; + } + } - if (!this._isEmptyRectangle(this._textSelectionEnd) && !this._endMarker.isDragged) { - this._endMarker.setLatLng(this._textSelectionEnd.getSouthEast()); - this._map.addLayer(this._endMarker); + if (this._selections.getLayers().length !== 0 || startMarker.isDragged || endMarker.isDragged) { + if (!startMarker || !endMarker || + this._isEmptyRectangle(this._textSelectionStart) || + this._isEmptyRectangle(this._textSelectionEnd)) { + return; + } + + var startPos = this._map.project(this._textSelectionStart.getSouthWest()); + var endPos = this._map.project(this._textSelectionEnd.getSouthWest()); + var startMarkerPos = this._map.project(startMarker.getLatLng()); + if (startMarkerPos.distanceTo(endPos) < startMarkerPos.distanceTo(startPos) && startMarker._icon && endMarker._icon) { + // if the start marker is actually closer to the end of the selection + // reverse icons and markers + L.DomUtil.removeClass(startMarker._icon, 'leaflet-selection-marker-start'); + L.DomUtil.removeClass(endMarker._icon, 'leaflet-selection-marker-end'); + L.DomUtil.addClass(startMarker._icon, 'leaflet-selection-marker-end'); + L.DomUtil.addClass(endMarker._icon, 'leaflet-selection-marker-start'); + var tmp = startMarker; + startMarker = endMarker; + endMarker = tmp; + } + else if (startMarker._icon && endMarker._icon) { + // normal markers and normal icons + L.DomUtil.removeClass(startMarker._icon, 'leaflet-selection-marker-end'); + L.DomUtil.removeClass(endMarker._icon, 'leaflet-selection-marker-start'); + L.DomUtil.addClass(startMarker._icon, 'leaflet-selection-marker-start'); + L.DomUtil.addClass(endMarker._icon, 'leaflet-selection-marker-end'); + } + + if (!startMarker.isDragged) { + startMarker.setLatLng(this._textSelectionStart.getSouthWest()); + this._map.addLayer(startMarker); + } + + if (!endMarker.isDragged) { + endMarker.setLatLng(this._textSelectionEnd.getSouthEast()); + this._map.addLayer(endMarker); } } else { - this._textSelectionStart = new L.LatLngBounds(new L.LatLng(0, 0), new L.LatLng(0, 0)); - this._textSelectionEnd = new L.LatLngBounds(new L.LatLng(0, 0), new L.LatLng(0, 0)); - this._map.removeLayer(this._startMarker); - this._map.removeLayer(this._endMarker); - this._endMarker.isDragged = false; - this._startMarker.isDragged = false; + this._textSelectionStart = null; + this._textSelectionEnd = null; + for (key in this._selectionHandles) { + this._map.removeLayer(this._selectionHandles[key]); + this._selectionHandles[key].isDragged = false; + } } }, diff --git a/loleaflet/src/map/handler/Map.Mouse.js b/loleaflet/src/map/handler/Map.Mouse.js index a5f58f1..ac731a8 100644 --- a/loleaflet/src/map/handler/Map.Mouse.js +++ b/loleaflet/src/map/handler/Map.Mouse.js @@ -33,8 +33,10 @@ L.Map.Mouse = L.Handler.extend({ return; } - if (docLayer._startMarker.isDragged === true || docLayer._endMarker.isDragged === true) { - return; + for (var key in docLayer._selectionHandles) { + if (docLayer._selectionHandles[key].isDragged) { + return; + } } if (e.type === 'mousedown') { @@ -85,11 +87,11 @@ L.Map.Mouse = L.Handler.extend({ }, this)); this._holdMouseEvent = setTimeout(L.bind(this._executeMouseEvents, this), timeOut); - if (docLayer._startMarker._icon) { - L.DomUtil.removeClass(docLayer._startMarker._icon, 'leaflet-not-clickable'); - } - if (docLayer._endMarker._icon) { - L.DomUtil.removeClass(docLayer._endMarker._icon, 'leaflet-not-clickable'); + for (key in docLayer._selectionHandles) { + var handle = docLayer._selectionHandles[key]; + if (handle._icon) { + L.DomUtil.removeClass(handle._icon, 'leaflet-not-clickable'); + } } } } @@ -112,11 +114,11 @@ L.Map.Mouse = L.Handler.extend({ if (!this._map.dragging.enabled()) { mousePos = docLayer._latLngToTwips(e.latlng); docLayer._postMouseEvent('move', mousePos.x, mousePos.y, 1); - if (docLayer._startMarker._icon) { - L.DomUtil.addClass(docLayer._startMarker._icon, 'leaflet-not-clickable'); - } - if (docLayer._endMarker._icon) { - L.DomUtil.addClass(docLayer._endMarker._icon, 'leaflet-not-clickable'); + for (key in docLayer._selectionHandles) { + handle = docLayer._selectionHandles[key]; + if (handle._icon) { + L.DomUtil.addClass(handle._icon, 'leaflet-not-clickable'); + } } } } commit 6062aa08e96cf9ac5b0cd7817c7c2b66bf3d20d0 Author: Mihai Varga <mihai.va...@collabora.com> Date: Wed Sep 16 20:57:47 2015 +0300 loleaflet: revert changes to Icon.js and use divIcon instead diff --git a/loleaflet/src/layer/marker/Icon.js b/loleaflet/src/layer/marker/Icon.js index b50ca13..58d5fd3 100644 --- a/loleaflet/src/layer/marker/Icon.js +++ b/loleaflet/src/layer/marker/Icon.js @@ -15,7 +15,6 @@ L.Icon = L.Class.extend({ shadowSize: (Point) shadowAnchor: (Point) className: (String) - asDiv: (Boolean) (optional, creates the icon as a div) }, */ @@ -34,19 +33,14 @@ L.Icon = L.Class.extend({ _createIcon: function (name, oldIcon) { var src = this._getIconUrl(name); - if (!src && !this.options.asDiv) { + if (!src) { if (name === 'icon') { throw new Error('iconUrl not set in Icon options (see the docs).'); } return null; } - if (this.options.asDiv) { - var img = document.createElement('div'); - } - else { - img = this._createImg(src, oldIcon && oldIcon.tagName === 'IMG' ? oldIcon : null); - } + var img = this._createImg(src, oldIcon && oldIcon.tagName === 'IMG' ? oldIcon : null); this._setIconStyles(img, name); return img; diff --git a/loleaflet/src/layer/tile/TileLayer.js b/loleaflet/src/layer/tile/TileLayer.js index 010d3f3..064ee8b 100644 --- a/loleaflet/src/layer/tile/TileLayer.js +++ b/loleaflet/src/layer/tile/TileLayer.js @@ -75,17 +75,17 @@ L.TileLayer = L.GridLayer.extend({ this._graphicMarker = null; // Handle start marker this._startMarker = L.marker(new L.LatLng(0, 0), { - icon: L.icon({ + icon: L.divIcon({ className: 'leaflet-selection-marker-start', - asDiv: true + iconSize: null }), draggable: true }); // Handle end marker this._endMarker = L.marker(new L.LatLng(0, 0), { - icon: L.icon({ + icon: L.divIcon({ className: 'leaflet-selection-marker-end', - asDiv: true + iconSize: null }), draggable: true }); commit f29adbde376da8c3507a312a3f90dd3812b7a0f5 Author: Mihai Varga <mihai.va...@collabora.com> Date: Tue Sep 15 17:53:27 2015 +0300 loleaflet: renamed remaining currentPart to selectedPart Conflicts: loleaflet/reference.html diff --git a/loleaflet/README b/loleaflet/README index 0f6f575..1ee83a4 100644 --- a/loleaflet/README +++ b/loleaflet/README @@ -101,7 +101,7 @@ Parts (like slides in presentation, or sheets in spreadsheets): - events: map.on('updateparts', function (e) {}) where: - + e.currentPart is the current part + + e.selectedPart is the current part + e.parts == the number of parts that the document has + e.docType == 'text' | 'spreadsheet' | 'presentation' | 'drawing' | 'other' + [e.partNames] if present, part names (e.g. sheet names) diff --git a/loleaflet/src/layer/tile/CalcTileLayer.js b/loleaflet/src/layer/tile/CalcTileLayer.js index d405e2d..df1fe80 100644 --- a/loleaflet/src/layer/tile/CalcTileLayer.js +++ b/loleaflet/src/layer/tile/CalcTileLayer.js @@ -12,7 +12,7 @@ L.CalcTileLayer = L.TileLayer.extend({ command.y = parseInt(strTwips[1]); command.width = parseInt(strTwips[2]); command.height = parseInt(strTwips[3]); - command.part = this._currentPart; + command.part = this._selectedPart; } if (this._docType === 'text') { command.part = 0; diff --git a/loleaflet/src/layer/tile/ImpressTileLayer.js b/loleaflet/src/layer/tile/ImpressTileLayer.js index 1717cf3..dfb00f3 100644 --- a/loleaflet/src/layer/tile/ImpressTileLayer.js +++ b/loleaflet/src/layer/tile/ImpressTileLayer.js @@ -12,7 +12,7 @@ L.ImpressTileLayer = L.TileLayer.extend({ command.y = parseInt(strTwips[1]); command.width = parseInt(strTwips[2]); command.height = parseInt(strTwips[3]); - command.part = this._currentPart; + command.part = this._selectedPart; } var topLeftTwips = new L.Point(command.x, command.y); var offset = new L.Point(command.width, command.height); @@ -81,7 +81,7 @@ L.ImpressTileLayer = L.TileLayer.extend({ delete this._tileCache[key]; } } - if (command.part === this._currentPart && + if (command.part === this._selectedPart && command.part !== this._lastValidPart) { this._lastValidPart = command.part; this._map.fire('updatepart', {part: command.part, docType: this._docType}); diff --git a/loleaflet/src/layer/tile/WriterTileLayer.js b/loleaflet/src/layer/tile/WriterTileLayer.js index fe85e9d..5686727 100644 --- a/loleaflet/src/layer/tile/WriterTileLayer.js +++ b/loleaflet/src/layer/tile/WriterTileLayer.js @@ -12,7 +12,7 @@ L.WriterTileLayer = L.TileLayer.extend({ command.y = parseInt(strTwips[1]); command.width = parseInt(strTwips[2]); command.height = parseInt(strTwips[3]); - command.part = this._currentPart; + command.part = this._selectedPart; } command.part = 0; var topLeftTwips = new L.Point(command.x, command.y); _______________________________________________ Libreoffice-commits mailing list libreoffice-comm...@lists.freedesktop.org http://lists.freedesktop.org/mailman/listinfo/libreoffice-commits