[Libreoffice-commits] online.git: loleaflet/src

[Henry Castro (via logerrit)]

 loleaflet/src/control/Control.PartsPreview.js |   32 +++++++++++++++++++++++---
 1 file changed, 29 insertions(+), 3 deletions(-)

New commits:
commit 67bd6649015646fe505371bee9b0755ff75fb0c6
Author:     Henry Castro <hcastro at collabora.com>
AuthorDate: Thu Jul 2 10:59:56 2020 -0400
Commit:     Henry Castro <hcastro at collabora.com>
CommitDate: Tue Jul 7 15:03:10 2020 +0200

    loleaflet: update preview images when the doc size changes
    
    The unit test checks the aspect ratio of the preview thumbnails,
    this happens when the document size changes (i.e changing paper format)
    
    Change-Id: I0267e797327b73d714947258e004fe64cce9d1dd
    Reviewed-on: https://gerrit.libreoffice.org/c/online/+/97775
    Tested-by: Jenkins
    Tested-by: Jenkins CollaboraOffice <jenkinscollaboraoffice at gmail.com>
    Reviewed-by: Henry Castro <hcastro at collabora.com>

diff --git a/loleaflet/src/control/Control.PartsPreview.js b/loleaflet/src/control/Control.PartsPreview.js
index c7250de7f..3b0acb149 100644
--- a/loleaflet/src/control/Control.PartsPreview.js
+++ b/loleaflet/src/control/Control.PartsPreview.js
@@ -39,6 +39,7 @@ L.Control.PartsPreview = L.Control.extend({
 		map.on('tilepreview', this._updatePreview, this);
 		map.on('insertpage', this._insertPreview, this);
 		map.on('deletepage', this._deletePreview, this);
+		map.on('docsize', this._updateAllPreview, this);
 	},
 
 	createScrollbar: function (axis) {
@@ -174,6 +175,27 @@ L.Control.PartsPreview = L.Control.extend({
 		}
 	},
 
+	_updateAllPreview: function () {
+		if (this._previewTiles.length === 0) {
+			return;
+		}
+
+		var previewContBB = this._partsPreviewCont.getBoundingClientRect();
+		var bottomBound;
+
+		if (this._direction === 'x') {
+			this._previewContTop = previewContBB.left;
+			bottomBound = previewContBB.right + previewContBB.width / 2;
+		} else {
+			this._previewContTop = previewContBB.top;
+			bottomBound = previewContBB.bottom + previewContBB.height / 2;
+		}
+
+		for (var prev = 0; prev < this._previewTiles.length; prev++) {
+			this._layoutPreview(prev, this._previewTiles[prev], bottomBound);
+		}
+	},
+
 	_createPreview: function (i, hashCode, bottomBound) {
 		var frame = L.DomUtil.create('div', 'preview-frame', this._scrollContainer);
 		this._addDnDHandlers(frame);
@@ -203,6 +225,12 @@ L.Control.PartsPreview = L.Control.extend({
 			document.activeElement.blur();
 		}, this);
 
+		this._layoutPreview(i, img, bottomBound);
+
+		return img;
+	},
+
+	_layoutPreview: function (i, img, bottomBound) {
 		var topBound = this._previewContTop;
 		var previewFrameTop = 0;
 		var previewFrameBottom = 0;
@@ -248,7 +276,7 @@ L.Control.PartsPreview = L.Control.extend({
 			var imgWidth = imgSize.width;
 			if (imgSize.width < previewImgMinWidth)
 				imgHeight = Math.round(imgHeight * previewImgMinWidth / imgSize.width);
-			var previewFrameBB = frame.getBoundingClientRect();
+			var previewFrameBB = img.parentElement.getBoundingClientRect();
 			if (this._direction === 'x') {
 				this._previewFrameMargin = previewFrameBB.left - this._previewContTop;
 				this._previewImgHeight = imgWidth;
@@ -259,8 +287,6 @@ L.Control.PartsPreview = L.Control.extend({
 				this._previewFrameHeight = imgHeight + 2 * previewImgBorder;
 			}
 		}
-
-		return img;
 	},
 
 	_setPart: function (e) {