loleaflet/src/layer/tile/ImpressTileLayer.js |  133 +++++++++++++++++++++------
 1 file changed, 105 insertions(+), 28 deletions(-)

New commits:
commit 2b8fc61dde36a9b7e4b9ff92a64ce4dbacfbd715
Author: Marco Cecchetti <marco.cecche...@collabora.com>
Date:   Sun May 14 15:16:24 2017 +0200

    loleaflet: impress: comments that are being modified are shown twice
    
    Reworked handling of annotation layout. Now it behaves more like
    writer annotations.
    
    Now scrolling up annotations leads to scrolling the current slide too
    when it is required in order to show not visible annotations.
    
    Moreover the top visible annotation is now remembered for each slide,
    and when the top annotation is not the first one, a bit of the bottom
    of the previous annotation is showed so that the user gets aware that
    there are more annotations above.
    
    Change-Id: I3d087a8db35143a5e3abcd3e95e5e612d7638891
    Reviewed-on: https://gerrit.libreoffice.org/37628
    Reviewed-by: Marco Cecchetti <mrcek...@gmail.com>
    Tested-by: Marco Cecchetti <mrcek...@gmail.com>

diff --git a/loleaflet/src/layer/tile/ImpressTileLayer.js 
b/loleaflet/src/layer/tile/ImpressTileLayer.js
index ee7f2ae5..209232d8 100644
--- a/loleaflet/src/layer/tile/ImpressTileLayer.js
+++ b/loleaflet/src/layer/tile/ImpressTileLayer.js
@@ -7,9 +7,18 @@ L.ImpressTileLayer = L.TileLayer.extend({
        extraSize: L.point(290, 0),
 
        newAnnotation: function (comment) {
-               var annotation = L.annotation(this._map.getCenter(), comment, 
{noMenu: true}).addTo(this._map);
-               annotation.edit();
-               annotation.focus();
+               if (this._draft) {
+                       return;
+               }
+               this.onAnnotationCancel();
+               this._draft = L.annotation(L.latLng(0, 0), comment, {noMenu: 
true}).addTo(this._map);
+               this._draft.edit();
+               var mapCenter = 
this._map.latLngToLayerPoint(this._map.getCenter());
+               var bounds = this._draft.getBounds();
+               var topLeft = mapCenter.subtract(L.point(bounds.max.x - 
bounds.min.x, (bounds.max.y - bounds.min.y)/2));
+               this._draft.setLatLng(this._map.layerPointToLatLng(topLeft));
+               this.layoutAnnotations();
+               this._draft.focus();
        },
 
        beforeAdd: function (map) {
@@ -33,6 +42,7 @@ L.ImpressTileLayer = L.TileLayer.extend({
        },
 
        hideAnnotations: function (part) {
+               this._selectedAnnotation = undefined;
                var annotations = this._annotations[this._partHashes[part]];
                for (var index in annotations) {
                        annotations[index].hide();
@@ -54,27 +64,40 @@ L.ImpressTileLayer = L.TileLayer.extend({
        onAdd: function (map) {
                L.TileLayer.prototype.onAdd.call(this, map);
                this._annotations = {};
-               this._topAnnotation = 0;
+               this._topAnnotation = [];
+               this._topAnnotation[this._selectedPart] = 0;
+               this._selectedAnnotation = undefined;
+               this._draft = null;
        },
 
        onAnnotationCancel: function (e) {
-               this._map.removeLayer(e.annotation);
+               if (this._draft) {
+                       this._map.removeLayer(this._draft);
+                       this._draft = null;
+               }
                this._map.focus();
+               this._selectedAnnotation = undefined;
+               this.layoutAnnotations();
        },
 
        onAnnotationModify: function (annotation) {
-               var draft = L.annotation(this._map.getCenter(), 
annotation._data).addTo(this._map);
-               draft.edit();
-               draft.focus();
+               this.onAnnotationCancel();
+               this._selectedAnnotation = annotation._data.id;
+               annotation.edit();
+               this.scrollUntilAnnotationIsVisible(annotation);
+               annotation.focus();
        },
 
        onAnnotationReply: function (annotation) {
-               var draft = L.annotation(this._map.getCenter(), 
annotation._data).addTo(this._map);
-               draft.reply();
-               draft.focus();
+               this.onAnnotationCancel();
+               this._selectedAnnotation = annotation._data.id;
+               annotation.reply();
+               this.scrollUntilAnnotationIsVisible(annotation);
+               annotation.focus();
        },
 
        onAnnotationRemove: function (id) {
+               this.onAnnotationCancel();
                var comment = {
                        Id: {
                                type: 'string',
@@ -87,14 +110,16 @@ L.ImpressTileLayer = L.TileLayer.extend({
 
        onAnnotationSave: function (e) {
                var comment;
-               if (e.annotation._data.id === 'new') {
+               if (this._draft) {
                        comment = {
                                Text: {
                                        type: 'string',
-                                       value: e.annotation._data.text
+                                       value: this._draft._data.text
                                }
                        };
                        this._map.sendUnoCommand('.uno:InsertAnnotation', 
comment);
+                       this._map.removeLayer(this._draft);
+                       this._draft = null;
                } else {
                        comment = {
                                Id: {
@@ -107,13 +132,13 @@ L.ImpressTileLayer = L.TileLayer.extend({
                                }
                        };
                        this._map.sendUnoCommand('.uno:EditAnnotation', 
comment);
+                       this._selectedAnnotation = undefined;
                }
-               this._map.removeLayer(e.annotation);
                this._map.focus();
        },
 
        _onAnnotationZoom: function (e) {
-               this.layoutAnnotations();
+               this.onAnnotationCancel();
        },
 
        onReplyClick: function (e) {
@@ -128,18 +153,21 @@ L.ImpressTileLayer = L.TileLayer.extend({
                        }
                };
                this._map.sendUnoCommand('.uno:ReplyToAnnotation', comment);
-               this._map.removeLayer(e.annotation);
+               this._selectedAnnotation = undefined;
                this._map.focus();
        },
 
        onAnnotationScrollDown: function (e) {
-               this._topAnnotation = Math.min(++this._topAnnotation, 
this._annotations[this._partHashes[this._selectedPart]].length - 1);
-               this.layoutAnnotations();
+               this._topAnnotation[this._selectedPart] = 
Math.min(++this._topAnnotation[this._selectedPart], 
this._annotations[this._partHashes[this._selectedPart]].length - 1);
+               this.onAnnotationCancel();
        },
 
        onAnnotationScrollUp: function (e) {
-               this._topAnnotation = Math.max(--this._topAnnotation, 0);
-               this.layoutAnnotations();
+               if (this._topAnnotation[this._selectedPart] === 0) {
+                       this._map.fire('scrollby', {x: 0, y: -100});
+               }
+               this._topAnnotation[this._selectedPart] = 
Math.max(--this._topAnnotation[this._selectedPart], 0);
+               this.onAnnotationCancel();
        },
 
        onUpdateParts: function (e) {
@@ -147,8 +175,11 @@ L.ImpressTileLayer = L.TileLayer.extend({
                        this.hideAnnotations(this._prevSelectedPart);
                        if (this.hasAnnotations(this._selectedPart)) {
                                this._map._docLayer._updateMaxBounds(true);
+                               if (this._topAnnotation[this._selectedPart] === 
undefined) {
+                                       this._topAnnotation[this._selectedPart] 
= 0;
+                               }
+                               this.onAnnotationCancel();
                        }
-                       this.layoutAnnotations();
                }
        },
 
@@ -163,20 +194,61 @@ L.ImpressTileLayer = L.TileLayer.extend({
                }
        },
 
+       scrollUntilAnnotationIsVisible: function(annotation) {
+               var bounds = annotation.getBounds();
+               var mapBounds = this._map.getBounds();
+               if (this._map.layerPointToLatLng(bounds.getTopRight()).lat > 
mapBounds.getNorth()) {
+                       this._topAnnotation[this._selectedPart] = 
Math.max(this._topAnnotation[this._selectedPart] - 2, 0);
+               }
+               else if 
(this._map.layerPointToLatLng(bounds.getBottomLeft()).lat < 
mapBounds.getSouth()) {
+                       this._topAnnotation[this._selectedPart] = 
Math.min(this._topAnnotation[this._selectedPart] + 2, 
this._annotations[this._partHashes[this._selectedPart]].length - 1);
+               }
+               this.layoutAnnotations();
+       },
+
        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))
-                       .add(L.point(this.options.marginX, 
this.options.marginY));
+                       .add(L.point((this._selectedAnnotation ? 3 : 2) * 
this.options.marginX, this.options.marginY));
+               var topAnnotation = this._topAnnotation[this._selectedPart];
                var bounds, annotation;
                for (var index in annotations) {
                        annotation = annotations[index];
-                       if (index >= this._topAnnotation) {
-                               annotation.setLatLng(bounds ? 
this._map.layerPointToLatLng(bounds.getBottomLeft()) : 
this._map.layerPointToLatLng(topRight));
+                       if (topAnnotation > 0 && parseInt(index) === 
topAnnotation - 1) {
+                               // if the top annotation is not the first one, 
show a bit of the bottom of the previous annotation
+                               // so that the user gets aware that there are 
more annotations above.
+
+                               // get annotation bounds
+                               
annotation.setLatLng(this._map.layerPointToLatLng(L.point(0, -100000))); // 
placed where it's not visible
+                               annotation.show(); // if it's hidden the bounds 
are wrong
                                bounds = annotation.getBounds();
-                               bounds.extend(L.point(bounds.max.x, 
bounds.max.y + this.options.marginY));
+                               annotation.hide();
+                               var topLeft = topRight.subtract(L.point(0, 
bounds.max.y-bounds.min.y));
+                               
annotation.setLatLng(this._map.layerPointToLatLng(topLeft));
                                annotation.show();
+                               bounds = annotation.getBounds();
+                               bounds.extend(L.point(bounds.max.x, 
bounds.max.y + this.options.marginY));
+
+                       } else if (index >= topAnnotation) { // visible 
annotations
+                               if (annotation._data.id === 
this._selectedAnnotation) {
+                                       if (bounds) {
+                                               
bounds.extend(L.point(bounds.max.x, bounds.max.y + 2 * this.options.marginY));
+                                       }
+                                       var offsetX = L.point(2 * 
this.options.marginX, 0);
+                                       var topLeft = (bounds ? 
bounds.getBottomLeft() : topRight).subtract(offsetX);
+                                       
annotation.setLatLng(this._map.layerPointToLatLng(topLeft));
+                                       bounds = annotation.getBounds();
+                                       bounds = 
L.bounds(bounds.getBottomLeft().add(offsetX), 
bounds.getTopRight().add(offsetX));
+                                       bounds.extend(L.point(bounds.max.x, 
bounds.max.y + 3 * this.options.marginY));
+                               } else {
+                                       var topLeft = bounds ? 
bounds.getBottomLeft() : topRight;
+                                       
annotation.setLatLng(this._map.layerPointToLatLng(topLeft));
+                                       annotation.show();
+                                       bounds = annotation.getBounds();
+                                       bounds.extend(L.point(bounds.max.x, 
bounds.max.y + this.options.marginY));
+                               }
                        } else {
                                annotation.hide();
                        }
@@ -213,7 +285,10 @@ L.ImpressTileLayer = L.TileLayer.extend({
                                }
                                
this._annotations[comment.parthash].push(L.annotation(this._map.options.maxBounds.getSouthEast(),
 comment).addTo(this._map));
                        }
-                       this._topAnnotation = 0;
+                       if (!this._topAnnotation) {
+                               this._topAnnotation = [];
+                       }
+                       this._topAnnotation[this._selectedPart] = 0;
                        if (this.hasAnnotations(this._selectedPart)) {
                                this._map._docLayer._updateMaxBounds(true);
                        }
@@ -231,12 +306,12 @@ L.ImpressTileLayer = L.TileLayer.extend({
                                        this._annotations[obj.comment.parthash] 
= [];
                                }
                                
this._annotations[obj.comment.parthash].push(L.annotation(this._map.options.maxBounds.getSouthEast(),
 obj.comment).addTo(this._map));
-                               this._topAnnotation = 
Math.min(this._topAnnotation, 
this._annotations[this._partHashes[this._selectedPart]].length - 1);
+                               this._topAnnotation[this._selectedPart] = 
Math.min(this._topAnnotation[this._selectedPart], 
this._annotations[this._partHashes[this._selectedPart]].length - 1);
                                this.updateDocBounds(1, this.extraSize);
                                this.layoutAnnotations();
                        } else if (obj.comment.action === 'Remove') {
                                this.removeAnnotation(obj.comment.id);
-                               this._topAnnotation = 
Math.min(this._topAnnotation, 
this._annotations[this._partHashes[this._selectedPart]].length - 1);
+                               this._topAnnotation[this._selectedPart] = 
Math.min(this._topAnnotation[this._selectedPart], 
this._annotations[this._partHashes[this._selectedPart]].length - 1);
                                this.updateDocBounds(0);
                                this.layoutAnnotations();
                        } else if (obj.comment.action === 'Modify') {
@@ -244,6 +319,8 @@ L.ImpressTileLayer = L.TileLayer.extend({
                                if (modified) {
                                        modified._data = obj.comment;
                                        modified.update();
+                                       this._selectedAnnotation = undefined;
+                                       this.layoutAnnotations();
                                }
                        }
                } else {
_______________________________________________
Libreoffice-commits mailing list
libreoffice-comm...@lists.freedesktop.org
https://lists.freedesktop.org/mailman/listinfo/libreoffice-commits

Reply via email to