[Libreoffice-commits] online.git: Branch 'distro/collabora/collabora-online-3-0' - loleaflet/src
Henry Castro
hcastro at collabora.com
Wed Dec 6 10:38:41 UTC 2017
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 d4afb68b765489611c8a7090948b3f7a808d1838
Author: Henry Castro <hcastro at 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
Reviewed-on: https://gerrit.libreoffice.org/45874
Reviewed-by: Andras Timar <andras.timar at collabora.com>
Tested-by: Andras Timar <andras.timar at collabora.com>
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);
More information about the Libreoffice-commits
mailing list