[Libreoffice-commits] online.git: Branch 'distro/collabora/collabora-online-2-1' - 5 commits - loleaflet/dist loleaflet/src

Henry Castro hcastro at collabora.com
Wed Apr 19 13:38:50 UTC 2017


 loleaflet/dist/loleaflet.css                |    6 
 loleaflet/src/layer/AnnotationManager.js    |  229 ++++++++++++++++++++++------
 loleaflet/src/layer/marker/Annotation.js    |    9 -
 loleaflet/src/layer/tile/WriterTileLayer.js |    3 
 4 files changed, 196 insertions(+), 51 deletions(-)

New commits:
commit 1883bd6a0935846e02f3243d8a0983db9dc335b5
Author: Henry Castro <hcastro at collabora.com>
Date:   Tue Apr 11 20:37:53 2017 -0400

    loleaflet: fix position when adding new annotation
    
    Change-Id: I267df778715cb9f60c1b62c52ed405fd78ade8f9

diff --git a/loleaflet/src/layer/AnnotationManager.js b/loleaflet/src/layer/AnnotationManager.js
index 1d367f53..d29b2d46 100644
--- a/loleaflet/src/layer/AnnotationManager.js
+++ b/loleaflet/src/layer/AnnotationManager.js
@@ -358,6 +358,7 @@ L.AnnotationManager = L.Class.extend({
 			return Math.abs(a._data.anchorPos.min.y) - Math.abs(b._data.anchorPos.min.y) ||
 				Math.abs(a._data.anchorPos.min.x) - Math.abs(b._data.anchorPos.min.x);
 		});
+		return annotation;
 	},
 
 	edit: function (comment) {
@@ -487,7 +488,10 @@ L.AnnotationManager = L.Class.extend({
 
 	_onAnnotationCancel: function (e) {
 		if (e.annotation._data.id === 'new') {
-			this._map.removeLayer(e.annotation);
+			this._map.removeLayer(this.removeItem(e.annotation._data.id));
+		}
+		if (this._selected === e.annotation) {
+			this.unselect();
 		} else {
 			this.layout();
 		}
@@ -528,9 +532,8 @@ L.AnnotationManager = L.Class.extend({
 				}
 			};
 			this._map.sendUnoCommand('.uno:InsertAnnotation', comment);
-			this._map.removeLayer(e.annotation);
-		}
-		else if (e.annotation._data.trackchange) {
+			this._map.removeLayer(this.removeItem(e.annotation._data.id));
+		} else if (e.annotation._data.trackchange) {
 			comment = {
 				ChangeTrackingId: {
 					type: 'long',
diff --git a/loleaflet/src/layer/tile/WriterTileLayer.js b/loleaflet/src/layer/tile/WriterTileLayer.js
index b13c6df1..8e5edcb3 100644
--- a/loleaflet/src/layer/tile/WriterTileLayer.js
+++ b/loleaflet/src/layer/tile/WriterTileLayer.js
@@ -9,9 +9,10 @@ L.WriterTileLayer = L.TileLayer.extend({
 		if (!comment.anchorPos && this._isCursorVisible) {
 			comment.anchorPos = L.bounds(this._latLngToTwips(this._visibleCursor.getSouthWest()),
 				this._latLngToTwips(this._visibleCursor.getNorthEast()));
+			comment.anchorPix = this._twipsToPixels(comment.anchorPos.min);
 		}
 		if (comment.anchorPos) {
-			this._annotations.edit(comment);
+			this._annotations.modify(this._annotations.add(comment));
 		}
 	},
 
commit bd8248c1b782165f27f0eaf6bda62e1d6f71c8a7
Author: Pranav Kant <pranavk at collabora.co.uk>
Date:   Wed Apr 19 18:06:24 2017 +0530

    loleaflet: Animate child elements together with their parent
    
    Create the new L.PosAnimation object everytime you want to animate, not
    just use the same everytime which has the limitation that animation
    doesn't happen simultaneously.
    
    Change-Id: If5f63702afe0fee7f44c8cf4605179d68de289e8

diff --git a/loleaflet/src/layer/AnnotationManager.js b/loleaflet/src/layer/AnnotationManager.js
index 03ecae31..1d367f53 100644
--- a/loleaflet/src/layer/AnnotationManager.js
+++ b/loleaflet/src/layer/AnnotationManager.js
@@ -270,7 +270,7 @@ L.AnnotationManager = L.Class.extend({
 				this._items[selectIndexFirst]._data.anchorPix = this._map._docLayer._twipsToPixels(this._items[selectIndexFirst]._data.anchorPos.min);
 			}
 			latlng = this._map.unproject(L.point(docRight.x, this._items[selectIndexFirst]._data.anchorPix.y));
-			this._animation.run(this._items[selectIndexFirst]._container, this._map.latLngToLayerPoint(latlng));
+			(new L.PosAnimation()).run(this._items[selectIndexFirst]._container, this._map.latLngToLayerPoint(latlng));
 			this._items[selectIndexFirst].setLatLng(latlng);
 			layoutBounds = this._items[selectIndexFirst].getBounds();
 
@@ -281,8 +281,7 @@ L.AnnotationManager = L.Class.extend({
 				}
 
 				latlng = this._map.layerPointToLatLng(layoutBounds.getBottomLeft());
-				// FIXME: Enabling animation of these children misbehaves
-				//this._animation.run(this._items[idx]._container, layoutBounds.getBottomLeft());
+				(new L.PosAnimation()).run(this._items[idx]._container, layoutBounds.getBottomLeft());
 				this._items[idx].setLatLng(latlng);
 
 				var commentBounds = this._items[idx].getBounds();
commit 59ef0896cc3b660f1ce5bb0d64f8e3c9951584e8
Author: Pranav Kant <pranavk at collabora.co.uk>
Date:   Fri Apr 14 13:45:16 2017 +0530

    loleaflet: Adjust parent,children when comment is added/removed
    
    ... in between comments.
    
    Change-Id: I7b707d04adb045df43c66a29ccc9d2c3e702fca5

diff --git a/loleaflet/src/layer/AnnotationManager.js b/loleaflet/src/layer/AnnotationManager.js
index d01d50c8..03ecae31 100644
--- a/loleaflet/src/layer/AnnotationManager.js
+++ b/loleaflet/src/layer/AnnotationManager.js
@@ -349,10 +349,15 @@ L.AnnotationManager = L.Class.extend({
 
 	add: function (comment) {
 		var annotation = L.annotation(this._map.options.maxBounds.getSouthEast(), comment).addTo(this._map);
-		this._items.push(annotation);
+		if (comment.parent && comment.parent > '0') {
+			var parentIdx = this.getIndexOf(comment.parent);
+			this._items.splice(parentIdx + 1, 0, annotation);
+		} else {
+			this._items.push(annotation);
+		}
 		this._items.sort(function(a, b) {
 			return Math.abs(a._data.anchorPos.min.y) - Math.abs(b._data.anchorPos.min.y) ||
-			       Math.abs(a._data.anchorPos.min.x) - Math.abs(b._data.anchorPos.min.x);
+				Math.abs(a._data.anchorPos.min.x) - Math.abs(b._data.anchorPos.min.x);
 		});
 	},
 
@@ -410,6 +415,29 @@ L.AnnotationManager = L.Class.extend({
 		this._map.focus();
 	},
 
+	// Adjust parent-child relationship, if required, after `comment` is added
+	adjustParentAdd: function(comment) {
+		if (comment.parent && comment.parent > '0') {
+			var parentIdx = this.getIndexOf(comment.parent);
+			if (this._items[parentIdx + 1] && this._items[parentIdx + 1]._data.parent === this._items[parentIdx]._data.id) {
+				this._items[parentIdx + 1]._data.parent = comment.id;
+			}
+		}
+	},
+
+	// Adjust parent-child relationship, if required, after `comment` is removed
+	adjustParentRemove: function(comment) {
+		var newId = '0';
+		var parentIdx = this.getIndexOf(comment._data.parent);
+		if (parentIdx >= 0) {
+			newId = this._items[parentIdx]._data.id;
+		}
+		var currentIdx = this.getIndexOf(comment._data.id);
+		if (this._items[currentIdx + 1]) {
+			this._items[currentIdx + 1]._data.parent = newId;
+		}
+	},
+
 	onACKComment: function (obj) {
 		var id;
 		var changetrack = obj.redline ? true : false;
@@ -420,6 +448,7 @@ L.AnnotationManager = L.Class.extend({
 				this.add(obj.redline);
 			} else {
 				this.adjustComment(obj.comment);
+				this.adjustParentAdd(obj.comment);
 				this.add(obj.comment);
 			}
 			if (this._selected && !this._selected.isEdit()) {
@@ -430,6 +459,7 @@ L.AnnotationManager = L.Class.extend({
 			id = changetrack ? 'change-' + obj.redline.index : obj.comment.id;
 			var removed = this.getItem(id);
 			if (removed) {
+				this.adjustParentRemove(removed);
 				this._map.removeLayer(this.removeItem(id));
 				if (this._selected === removed) {
 					this.unselect();
commit f7f5eb18228e6793a6a5000aa92e506b1306cba6
Author: Pranav Kant <pranavk at collabora.co.uk>
Date:   Fri Apr 14 11:46:12 2017 +0530

    loleaflet: Same width for all comments, different from redline comments
    
    Separate css classes for these different types of annotations.
    
    Change-Id: I2013a05a2f7095956765661169670e0bb87bb372

diff --git a/loleaflet/dist/loleaflet.css b/loleaflet/dist/loleaflet.css
index d7522f87..cd7ae6a0 100644
--- a/loleaflet/dist/loleaflet.css
+++ b/loleaflet/dist/loleaflet.css
@@ -138,7 +138,7 @@ body {
 	text-align: center;
 }
 
-.loleaflet-annotation-content-wrapper {
+.loleaflet-annotation-content-wrapper, .loleaflet-annotation-redline-content-wrapper {
 	padding: 8px;
 	font-family: "Segoe UI", Tahoma, Arial, Helvetica, sans-serif !important;
 	font-size: 13px;
@@ -151,6 +151,10 @@ body {
 	border-radius: 2px;
 }
 
+.loleaflet-annotation-content-wrapper {
+        width: 180px;
+}
+
 .loleaflet-annotation-content {
 	margin: 3px 3px;
 	line-height: 1.4;
diff --git a/loleaflet/src/layer/marker/Annotation.js b/loleaflet/src/layer/marker/Annotation.js
index 2c881c9a..97b2d8e9 100644
--- a/loleaflet/src/layer/marker/Annotation.js
+++ b/loleaflet/src/layer/marker/Annotation.js
@@ -131,9 +131,12 @@ L.Annotation = L.Layer.extend({
 		    classTextArea = 'loleaflet-annotation-textarea',
 		    classEdit = 'loleaflet-annotation-edit';
 		var container = this._container =
-			L.DomUtil.create(tagDiv, 'loleaflet-annotation');
-		var wrapper = this._wrapper =
-			L.DomUtil.create(tagDiv, 'loleaflet-annotation-content-wrapper', container);
+		    L.DomUtil.create(tagDiv, 'loleaflet-annotation');
+		if (this._data.trackchange) {
+			var wrapper = this._wrapper = L.DomUtil.create(tagDiv, 'loleaflet-annotation-redline-content-wrapper', container);
+		} else {
+			wrapper = this._wrapper = L.DomUtil.create(tagDiv, 'loleaflet-annotation-content-wrapper', container);
+		}
 		this._author = L.DomUtil.create('table', 'loleaflet-annotation-table', wrapper);
 		var tbody = L.DomUtil.create('tbody', empty, this._author);
 		var tr = L.DomUtil.create('tr', empty, tbody);
commit 8fee08d616471079ea633638346b56dab92830a0
Author: Pranav Kant <pranavk at collabora.co.uk>
Date:   Thu Apr 13 16:50:28 2017 +0530

    Combine root comments with their children comments
    
    Change the layouting algorithm to check for comment relationship and set
    the layout bounds accordingly.
    
    Change-Id: I67cc32092d8cf2c1bbc0d677258387739bfc638e

diff --git a/loleaflet/src/layer/AnnotationManager.js b/loleaflet/src/layer/AnnotationManager.js
index 58c59a63..d01d50c8 100644
--- a/loleaflet/src/layer/AnnotationManager.js
+++ b/loleaflet/src/layer/AnnotationManager.js
@@ -127,6 +127,32 @@ L.AnnotationManager = L.Class.extend({
 		return -1;
 	},
 
+	// Returns the root comment id of given id
+	getRootIndexOf: function(id) {
+		var index = this.getIndexOf(id);
+		for (var idx = index - 1;
+			     idx >=0 && this._items[idx]._data.id === this._items[idx + 1]._data.parent;
+			     idx--)
+		{
+			index = idx;
+		}
+
+		return index;
+	},
+
+	// Returns the last comment id of comment thread containing the given id
+	getLastChildIndexOf: function(id) {
+		var index = this.getIndexOf(id);
+		for (var idx = index + 1;
+		     idx < this._items.length && this._items[idx]._data.parent === this._items[idx - 1]._data.id;
+		     idx++)
+		{
+			index = idx;
+		}
+
+		return index;
+	},
+
 	removeItem: function (id) {
 		var annotation;
 		for (var iterator in this._items) {
@@ -145,7 +171,9 @@ L.AnnotationManager = L.Class.extend({
 
 	select: function (annotation) {
 		if (annotation) {
-			this._selected = annotation;
+			// Select the root comment
+			var idx = this.getRootIndexOf(annotation._data.id);
+			this._selected = this._items[idx];
 			this.update();
 		}
 	},
@@ -165,66 +193,136 @@ L.AnnotationManager = L.Class.extend({
 		this.layout();
 	},
 
-	layoutUp: function (annotation, latLng, layoutBounds) {
-		annotation.setLatLng(latLng);
-		var bounds = annotation.getBounds();
+	layoutUp: function (commentThread, latLng, layoutBounds) {
+		if (commentThread.length <= 0)
+			return;
+
+		commentThread[0].setLatLng(latLng);
+		var bounds = commentThread[0].getBounds();
+		var idx = 1;
+		while (idx < commentThread.length) {
+			bounds.extend(bounds.max.add([0, commentThread[idx].getBounds().getSize().y]));
+			idx++;
+		}
+
+		var pt;
 		if (layoutBounds.intersects(bounds)) {
 			layoutBounds.extend(layoutBounds.min.subtract([0, bounds.getSize().y]));
-			latLng = this._map.layerPointToLatLng(layoutBounds.min);
+			pt = layoutBounds.min;
 		} else {
-			latLng = this._map.layerPointToLatLng(bounds.min);
+			pt = bounds.min;
 			layoutBounds.extend(bounds.min);
 		}
 		layoutBounds.extend(layoutBounds.min.subtract([0, this.options.marginY]));
-		annotation.setLatLng(latLng);
-		annotation.show();
+
+		idx = 0;
+		for (idx = 0; idx < commentThread.length; ++idx) {
+			latLng = this._map.layerPointToLatLng(pt);
+			commentThread[idx].setLatLng(latLng);
+			commentThread[idx].show();
+
+			var commentBounds = commentThread[idx].getBounds();
+			pt = pt.add([0, commentBounds.getSize().y]);
+		}
 	},
 
-	layoutDown: function (annotation, latLng, layoutBounds) {
-		annotation.setLatLng(latLng);
-		var bounds = annotation.getBounds();
+	layoutDown: function (commentThread, latLng, layoutBounds) {
+		if (commentThread.length <= 0)
+			return;
+
+		commentThread[0].setLatLng(latLng);
+		var bounds = commentThread[0].getBounds();
+		var idx = 1;
+		while (idx < commentThread.length) {
+			bounds.extend(bounds.max.add([0, commentThread[idx].getBounds().getSize().y]));
+			idx++;
+		}
+
+		var pt;
 		if (layoutBounds.intersects(bounds)) {
-			latLng = this._map.layerPointToLatLng(layoutBounds.getBottomLeft());
+			pt = layoutBounds.getBottomLeft();
 			layoutBounds.extend(layoutBounds.max.add([0, bounds.getSize().y]));
 		} else {
-			latLng = this._map.layerPointToLatLng(bounds.min);
+			pt = bounds.min;
 			layoutBounds.extend(bounds.max);
 		}
 		layoutBounds.extend(layoutBounds.max.add([0, this.options.marginY]));
-		annotation.setLatLng(latLng);
-		annotation.show();
+
+		idx = 0;
+		for (idx = 0; idx < commentThread.length; ++idx) {
+			latLng = this._map.layerPointToLatLng(pt);
+			commentThread[idx].setLatLng(latLng);
+			commentThread[idx].show();
+
+			var commentBounds = commentThread[idx].getBounds();
+			pt = pt.add([0, commentBounds.getSize().y]);
+		}
 	},
 
 	layout: function (zoom) {
 		var docRight = this._map.project(this._map.options.maxBounds.getNorthEast());
 		var topRight = docRight.add(L.point(this.options.marginX, this.options.marginY));
-		var latlng, annotation, selectIndex, layoutBounds, point, index;
+		var latlng, layoutBounds, point, index;
 		if (this._selected) {
-			selectIndex = this.getIndexOf(this._selected._data.id);
+			var selectIndexFirst = this.getRootIndexOf(this._selected._data.id);
+			var selectIndexLast = this.getLastChildIndexOf(this._selected._data.id);
 			if (zoom) {
-				this._selected._data.anchorPix = this._map._docLayer._twipsToPixels(this._selected._data.anchorPos.min);
+				this._items[selectIndexFirst]._data.anchorPix = this._map._docLayer._twipsToPixels(this._items[selectIndexFirst]._data.anchorPos.min);
+			}
+			latlng = this._map.unproject(L.point(docRight.x, this._items[selectIndexFirst]._data.anchorPix.y));
+			this._animation.run(this._items[selectIndexFirst]._container, this._map.latLngToLayerPoint(latlng));
+			this._items[selectIndexFirst].setLatLng(latlng);
+			layoutBounds = this._items[selectIndexFirst].getBounds();
+
+			// Adjust child comments too, if any
+			for (var idx = selectIndexFirst + 1; idx <= selectIndexLast; idx++) {
+				if (zoom) {
+					this._items[idx]._data.anchorPix = this._map._docLayer._twipsToPixels(this._items[idx]._data.anchorPos.min);
+				}
+
+				latlng = this._map.layerPointToLatLng(layoutBounds.getBottomLeft());
+				// FIXME: Enabling animation of these children misbehaves
+				//this._animation.run(this._items[idx]._container, layoutBounds.getBottomLeft());
+				this._items[idx].setLatLng(latlng);
+
+				var commentBounds = this._items[idx].getBounds();
+				layoutBounds.extend(layoutBounds.max.add([0, commentBounds.getSize().y]));
 			}
-			latlng = this._map.unproject(L.point(docRight.x, this._selected._data.anchorPix.y));
-			this._animation.run(this._selected._container, this._map.latLngToLayerPoint(latlng));
-			this._selected.setLatLng(latlng);
-			layoutBounds = this._selected.getBounds();
+
 			layoutBounds.min = layoutBounds.min.add([this.options.marginX, 0]);
 			layoutBounds.max = layoutBounds.max.add([this.options.marginX, 0]);
 			layoutBounds.extend(layoutBounds.min.subtract([0, this.options.marginY]));
 			layoutBounds.extend(layoutBounds.max.add([0, this.options.marginY]));
-			for (index = selectIndex - 1; index >= 0; index--) {
-				annotation = this._items[index];
-				if (zoom) {
-					annotation._data.anchorPix = this._map._docLayer._twipsToPixels(annotation._data.anchorPos.min);
-				}
-				this.layoutUp(annotation, this._map.unproject(L.point(topRight.x, annotation._data.anchorPix.y)), layoutBounds);
+			for (index = selectIndexFirst - 1; index >= 0;) {
+				var commentThread = [];
+				var tmpIdx = index;
+				do {
+					if (zoom) {
+						this._items[idx]._data.anchorPix = this._map._docLayer._twipsToPixels(this._items[idx]._data.anchorPos.min);
+					}
+					commentThread.push(this._items[tmpIdx]);
+					tmpIdx = tmpIdx - 1;
+				} while (tmpIdx >= 0 && this._items[tmpIdx]._data.id === this._items[tmpIdx + 1]._data.parent);
+
+				commentThread.reverse();
+				// All will have some anchor position
+				this.layoutUp(commentThread, this._map.unproject(L.point(topRight.x, commentThread[0]._data.anchorPix.y)), layoutBounds);
+				index = index - commentThread.length;
 			}
-			for (index = selectIndex + 1; index < this._items.length; index++) {
-				annotation = this._items[index];
-				if (zoom) {
-					annotation._data.anchorPix = this._map._docLayer._twipsToPixels(annotation._data.anchorPos.min);
-				}
-				this.layoutDown(annotation, this._map.unproject(L.point(topRight.x, annotation._data.anchorPix.y)), layoutBounds);
+			for (index = selectIndexLast + 1; index < this._items.length;) {
+				commentThread = [];
+				tmpIdx = index;
+				do {
+					if (zoom) {
+						this._items[idx]._data.anchorPix = this._map._docLayer._twipsToPixels(this._items[idx]._data.anchorPos.min);
+					}
+					commentThread.push(this._items[tmpIdx]);
+					tmpIdx = tmpIdx + 1;
+				} while (tmpIdx < this._items.length && this._items[tmpIdx]._data.parent === this._items[tmpIdx - 1]._data.id);
+
+				// All will have some anchor position
+				this.layoutDown(commentThread, this._map.unproject(L.point(topRight.x, commentThread[0]._data.anchorPix.y)), layoutBounds);
+				index = index + commentThread.length;
 			}
 			if (!this._selected.isEdit()) {
 				this._selected.show();
@@ -232,12 +330,19 @@ L.AnnotationManager = L.Class.extend({
 		} else {
 			point = this._map.latLngToLayerPoint(this._map.unproject(topRight));
 			layoutBounds = L.bounds(point, point);
-			for (index in this._items) {
-				annotation = this._items[index];
-				if (zoom) {
-					annotation._data.anchorPix = this._map._docLayer._twipsToPixels(annotation._data.anchorPos.min);
-				}
-				this.layoutDown(annotation, this._map.unproject(L.point(topRight.x, annotation._data.anchorPix.y)), layoutBounds);
+			for (index = 0; index < this._items.length;) {
+				commentThread = [];
+				tmpIdx = index;
+				do {
+					if (zoom) {
+						this._items[tmpIdx]._data.anchorPix = this._map._docLayer._twipsToPixels(this._items[tmpIdx]._data.anchorPos.min);
+					}
+					commentThread.push(this._items[tmpIdx]);
+					tmpIdx = tmpIdx + 1;
+				} while (tmpIdx < this._items.length && this._items[tmpIdx]._data.parent === this._items[tmpIdx - 1]._data.id);
+
+				this.layoutDown(commentThread, this._map.unproject(L.point(topRight.x, commentThread[0]._data.anchorPix.y)), layoutBounds);
+				index = index + commentThread.length;
 			}
 		}
 	},


More information about the Libreoffice-commits mailing list