loleaflet/src/layer/AnnotationManager.js | 25 +++++++----------- loleaflet/src/layer/marker/Annotation.js | 37 ++++++++++++++++++++++++--- loleaflet/src/layer/tile/GridLayer.js | 13 +++++---- loleaflet/src/layer/tile/ImpressTileLayer.js | 4 -- loleaflet/src/layer/tile/WriterTileLayer.js | 14 +++++----- loleaflet/src/map/Map.js | 15 ++++++++++ 6 files changed, 74 insertions(+), 34 deletions(-)
New commits: commit ad4103eb49b973e5657ae978c0a1b1c89430abbe Author: Henry Castro <hcas...@collabora.com> Date: Tue Dec 5 08:04:54 2017 -0400 loleaflet: fix comments that are cut off at the bottom of the page Change-Id: Idadaa0dfcd4f3c9f02e8878d243b5d3e34087606 diff --git a/loleaflet/src/layer/AnnotationManager.js b/loleaflet/src/layer/AnnotationManager.js index 09601615..7b1cdf4e 100644 --- a/loleaflet/src/layer/AnnotationManager.js +++ b/loleaflet/src/layer/AnnotationManager.js @@ -128,7 +128,7 @@ L.AnnotationManager = L.Class.extend({ if (comment.author in this._map._viewInfoByUserName) { comment.avatar = this._map._viewInfoByUserName[comment.author].userextrainfo.avatar; } - this._items.push(L.annotation(this._map.options.maxBounds.getSouthEast(), comment).addTo(this._map)); + this._items.push(L.annotation(this._map.options.docBounds.getSouthEast(), comment).addTo(this._map)); } if (this._items.length > 0) { if (!ordered) { @@ -137,7 +137,6 @@ L.AnnotationManager = L.Class.extend({ Math.abs(a._data.anchorPos.min.x) - Math.abs(b._data.anchorPos.min.x); }); } - this._map._docLayer._updateMaxBounds(true); this.layout(); } }, @@ -156,7 +155,7 @@ L.AnnotationManager = L.Class.extend({ if (changecomment.author in this._map._viewInfoByUserName) { changecomment.avatar = this._map._viewInfoByUserName[changecomment.author].userextrainfo.avatar; } - this._items.push(L.annotation(this._map.options.maxBounds.getSouthEast(), changecomment).addTo(this._map)); + this._items.push(L.annotation(this._map.options.docBounds.getSouthEast(), changecomment).addTo(this._map)); } if (this._items.length > 0) { if (!ordered) { @@ -165,7 +164,6 @@ L.AnnotationManager = L.Class.extend({ Math.abs(a._data.anchorPos.min.x) - Math.abs(b._data.anchorPos.min.x); }); } - this._map._docLayer._updateMaxBounds(true); this.layout(); } }, @@ -250,8 +248,7 @@ L.AnnotationManager = L.Class.extend({ update: function () { if (this._selected) { var point; - var scale = this._map.getZoomScale(this._map.getZoom(), 10); - var docRight = this._map.project(this._map.options.maxBounds.getNorthEast()).subtract(this.options.extraSize.multiplyBy(scale)); + var docRight = this._map.project(this._map.options.docBounds.getNorthEast()); point = this._map._docLayer._twipsToPixels(this._selected._data.anchorPos.min); this._arrow.setLatLngs([this._map.unproject(point), map.unproject(L.point(docRight.x, point.y))]); this._map.addLayer(this._arrow); @@ -261,9 +258,9 @@ L.AnnotationManager = L.Class.extend({ this.layout(); }, - updateDocBounds: function (count, extraSize) { - if (this._items.length === count) { - this._map._docLayer._updateMaxBounds(true, extraSize); + updateDocBounds: function () { + if (this._items.length === 0) { + this._map.fire('updatemaxbounds', {sizeChanged: true}); } }, @@ -338,8 +335,7 @@ L.AnnotationManager = L.Class.extend({ }, layout: function (zoom) { - var scale = this._map.getZoomScale(this._map.getZoom(), 10); - var docRight = this._map.project(this._map.options.maxBounds.getNorthEast()).subtract(this.options.extraSize.multiplyBy(scale)); + var docRight = this._map.project(this._map.options.docBounds.getNorthEast()); var topRight = docRight.add(L.point(this.options.marginX, this.options.marginY)); var latlng, layoutBounds, point, idx; if (this._selected) { @@ -358,7 +354,6 @@ L.AnnotationManager = L.Class.extend({ if (zoom) { this._items[idx]._data.anchorPix = this._map._docLayer._twipsToPixels(this._items[idx]._data.anchorPos.min); } - latlng = this._map.layerPointToLatLng(layoutBounds.getBottomLeft()); (new L.PosAnimation()).run(this._items[idx]._container, layoutBounds.getBottomLeft()); this._items[idx].setLatLng(latlng); @@ -550,7 +545,6 @@ L.AnnotationManager = L.Class.extend({ if (this._selected && !this._selected.isEdit()) { this._map.focus(); } - this.updateDocBounds(1); this.layout(); } else if (action === 'Remove') { id = changetrack ? 'change-' + obj.redline.index : obj.comment.id; @@ -558,13 +552,13 @@ L.AnnotationManager = L.Class.extend({ if (removed) { this.adjustParentRemove(removed); this._map.removeLayer(this.removeItem(id)); - this.updateDocBounds(0); if (this._selected === removed) { this.unselect(); } else { this.layout(); } } + this.updateDocBounds(); } else if (action === 'Modify') { id = changetrack ? 'change-' + obj.redline.index : obj.comment.id; var modified = this.getItem(id); @@ -590,7 +584,7 @@ L.AnnotationManager = L.Class.extend({ _onAnnotationCancel: function (e) { if (e.annotation._data.id === 'new') { this._map.removeLayer(this.removeItem(e.annotation._data.id)); - this.updateDocBounds(0); + this.updateDocBounds(); } if (this._selected === e.annotation) { this.unselect(); @@ -665,6 +659,7 @@ L.AnnotationManager = L.Class.extend({ }, _onAnnotationZoom: function (e) { + this._map.fire('updatemaxbounds', {sizeChanged: true}); this.layout(true); } }); diff --git a/loleaflet/src/layer/marker/Annotation.js b/loleaflet/src/layer/marker/Annotation.js index a569dc33..9682034d 100644 --- a/loleaflet/src/layer/marker/Annotation.js +++ b/loleaflet/src/layer/marker/Annotation.js @@ -9,6 +9,7 @@ L.Annotation = L.Layer.extend({ minWidth: 160, maxHeight: 50, imgSize: L.point([32, 32]), + margin: L.point([40, 40]), noMenu: false }, @@ -57,8 +58,8 @@ L.Annotation = L.Layer.extend({ }, setLatLng: function (latlng) { - this._latlng = L.latLng(latlng); - if (this._map) { + if (this._latlng != latlng) { + this._latlng = latlng; this._updatePosition(); } return this; @@ -69,6 +70,7 @@ L.Annotation = L.Layer.extend({ return L.bounds(point, point.add(L.point(this._container.offsetWidth, this._container.offsetHeight))); }, + show: function () { this._container.style.visibility = ''; this._contentNode.style.display = ''; @@ -119,6 +121,28 @@ L.Annotation = L.Layer.extend({ return this._data.id === comment._data.parent; }, + _checkBounds: function () { + if (!this._map || this._map.animatingZoom || !this._container.style || this._container.style.visibility !== '') { + return; + } + var maxBounds = this._map.getLayerMaxBounds(); + var thisBounds = this.getBounds(); + if (!maxBounds.contains(thisBounds)) { + var docBounds = this._map.getLayerDocBounds(); + var delta = L.point(Math.max(thisBounds.max.x - docBounds.max.x, 0), Math.max(thisBounds.max.y - docBounds.max.y, 0)); + if (delta.x > 0) { + delta.x += this.options.margin.x; + } + if (delta.y > 0) { + delta.y += this.options.margin.y; + } + this._map.fire('updatemaxbounds', { + sizeChanged: true, + extraSize: delta + }); + } + }, + _createButton: function(container, value, handler) { var button = L.DomUtil.create('input', 'loleaflet-controls', container); button.type = 'button'; @@ -227,6 +251,7 @@ L.Annotation = L.Layer.extend({ this._data.text = this._nodeModifyText.value; this._updateContent(); this.show(); + this._checkBounds(); this._map.fire('AnnotationSave', {annotation: this}); }, @@ -279,6 +304,7 @@ L.Annotation = L.Layer.extend({ // Better to assign '' here instead of null to keep the behavior same for all this._nodeReplyText.value = ''; this.show(); + this._checkBounds(); this._map.fire('AnnotationReply', {annotation: this}); }, @@ -314,8 +340,11 @@ L.Annotation = L.Layer.extend({ }, _updatePosition: function () { - var pos = this._map.latLngToLayerPoint(this._latlng); - L.DomUtil.setPosition(this._container, pos); + if (this._map) { + var pos = this._map.latLngToLayerPoint(this._latlng); + L.DomUtil.setPosition(this._container, pos); + } + this._checkBounds(); } }); diff --git a/loleaflet/src/layer/tile/GridLayer.js b/loleaflet/src/layer/tile/GridLayer.js index f963e8ba..407f6612 100644 --- a/loleaflet/src/layer/tile/GridLayer.js +++ b/loleaflet/src/layer/tile/GridLayer.js @@ -372,23 +372,26 @@ L.GridLayer = L.Layer.extend({ } var docPixelLimits = new L.Point(this._docWidthTwips / this.options.tileWidthTwips, this._docHeightTwips / this.options.tileHeightTwips); - docPixelLimits = extraSize ? docPixelLimits.multiplyBy(this._tileSize).add(extraSize) : - docPixelLimits.multiplyBy(this._tileSize); - + docPixelLimits = docPixelLimits.multiplyBy(this._tileSize); var scale = this._map.getZoomScale(zoom, 10); var topLeft = new L.Point(0, 0); topLeft = this._map.unproject(topLeft.multiplyBy(scale)); var bottomRight = new L.Point(docPixelLimits.x, docPixelLimits.y); - bottomRight = this._map.unproject(bottomRight.multiplyBy(scale)); + bottomRight = bottomRight.multiplyBy(scale); + if (extraSize) { + bottomRight = bottomRight.add(extraSize); + } + bottomRight = this._map.unproject(bottomRight); if (this._documentInfo === '' || sizeChanged) { // we just got the first status so we need to center the document this._map.setMaxBounds(new L.LatLngBounds(topLeft, bottomRight), options); + this._map.setDocBounds(new L.LatLngBounds(topLeft, this._map.unproject(docPixelLimits.multiplyBy(scale)))); } var scrollPixelLimits = new L.Point(this._docWidthTwips / this._tileWidthTwips, this._docHeightTwips / this._tileHeightTwips); - scrollPixelLimits = extraSize ? scrollPixelLimits.multiplyBy(this._tileSize).add(extraSize.multiplyBy(scale)) : + scrollPixelLimits = extraSize ? scrollPixelLimits.multiplyBy(this._tileSize).add(extraSize) : scrollPixelLimits.multiplyBy(this._tileSize); this._docPixelSize = {x: scrollPixelLimits.x, y: scrollPixelLimits.y}; this._map.fire('docsize', {x: scrollPixelLimits.x, y: scrollPixelLimits.y}); diff --git a/loleaflet/src/layer/tile/ImpressTileLayer.js b/loleaflet/src/layer/tile/ImpressTileLayer.js index d2392d1c..e20ff78a 100644 --- a/loleaflet/src/layer/tile/ImpressTileLayer.js +++ b/loleaflet/src/layer/tile/ImpressTileLayer.js @@ -208,9 +208,7 @@ L.ImpressTileLayer = L.TileLayer.extend({ layoutAnnotations: function () { var annotations = this._annotations[this._partHashes[this._selectedPart]]; - var scale = this._map.getZoomScale(this._map.getZoom(), 10); - var topRight = this._map.latLngToLayerPoint(this._map.options.maxBounds.getNorthEast()) - .subtract(this.extraSize.multiplyBy(scale)) + var topRight = this._map.latLngToLayerPoint(this._map.options.docBounds.getNorthEast()) .add(L.point((this._selectedAnnotation ? 3 : 2) * this.options.marginX, this.options.marginY)); var topAnnotation = this._topAnnotation[this._selectedPart]; var bounds, annotation; diff --git a/loleaflet/src/layer/tile/WriterTileLayer.js b/loleaflet/src/layer/tile/WriterTileLayer.js index afa5049c..b88b60b8 100644 --- a/loleaflet/src/layer/tile/WriterTileLayer.js +++ b/loleaflet/src/layer/tile/WriterTileLayer.js @@ -12,14 +12,18 @@ L.WriterTileLayer = L.TileLayer.extend({ comment.anchorPix = this._twipsToPixels(comment.anchorPos.min); } if (comment.anchorPos) { - this._annotations.updateDocBounds(0, this._annotations.options.extraSize); this._annotations.modify(this._annotations.add(comment)); } }, + onRemove: function (map) { + map.off('updatemaxbounds', this._onUpdateMaxBounds, this); + }, + onAdd: function (map) { L.TileLayer.prototype.onAdd.call(this, map); this._annotations = L.annotationManager(map); + map.on('updatemaxbounds', this._onUpdateMaxBounds, this); }, onAnnotationModify: function (annotation) { @@ -230,11 +234,7 @@ L.WriterTileLayer = L.TileLayer.extend({ this._update(); }, - _updateMaxBounds: function (sizeChanged, extraSize, zoom) { - if (!extraSize) { - extraSize = this._annotations && this._annotations._items.length > 0 ? - this._annotations.options.extraSize : null; - } - L.GridLayer.prototype._updateMaxBounds.call(this, sizeChanged, extraSize, {panInside: false}, zoom); + _onUpdateMaxBounds: function (e) { + this._updateMaxBounds(e.sizeChanged, e.extraSize); } }); diff --git a/loleaflet/src/map/Map.js b/loleaflet/src/map/Map.js index bdd3e47a..f4696cb9 100644 --- a/loleaflet/src/map/Map.js +++ b/loleaflet/src/map/Map.js @@ -343,6 +343,11 @@ L.Map = L.Evented.extend({ return this.on('moveend', this._panInsideMaxBounds); }, + setDocBounds: function (bounds) { + bounds = L.latLngBounds(bounds); + this.options.docBounds = bounds; + }, + panInsideBounds: function (bounds, options) { var center = this.getCenter(), newCenter = this._limitCenter(center, this._zoom, bounds); @@ -500,6 +505,16 @@ L.Map = L.Evented.extend({ this.options.maxZoom; }, + getLayerMaxBounds: function () { + return L.bounds(this.latLngToLayerPoint(this.options.maxBounds.getNorthWest()), + this.latLngToLayerPoint(this.options.maxBounds.getSouthEast())); + }, + + getLayerDocBounds: function () { + return L.bounds(this.latLngToLayerPoint(this.options.docBounds.getNorthWest()), + this.latLngToLayerPoint(this.options.docBounds.getSouthEast())); + }, + getBoundsZoom: function (bounds, inside, padding) { // (LatLngBounds[, Boolean, Point]) -> Number bounds = L.latLngBounds(bounds); _______________________________________________ Libreoffice-commits mailing list libreoffice-comm...@lists.freedesktop.org https://lists.freedesktop.org/mailman/listinfo/libreoffice-commits