writer: fix annotation size regression

Hidden contentNodes (in annotation) may become visible during resize.
Looks like setting style.max-height also change style.display.

Now i set it only if style.display is not none.

Signed-off-by: Attila Szűcs <attila.szucs@collabora.com>
Change-Id: I30f2eb75cb3ccb5b43044cef856314b0e35b9300

1 files changed, 55 insertions, 49 deletions

diff --git a/browser/src/layer/tile/CommentListSection.ts b/browser/src/layer/tile/CommentListSection.ts
index 445e46f327..609377fbb1 100644
--- a/browser/src/layer/tile/CommentListSection.ts
+++ b/browser/src/layer/tile/CommentListSection.ts
@@ -1869,11 +1869,14 @@ export class CommentSection extends CanvasSectionObject {
 		if (this.sectionProperties.docLayer._docType === 'text') {
 			const minMaxHeight = Number(getComputedStyle(document.documentElement).getPropertyValue('--annotation-min-size'));
 			for (var i = 0; i < this.sectionProperties.commentList.length;i++) {
-				this.sectionProperties.commentList[i].sectionProperties.contentNode.setAttribute('style', 'max-height: '+minMaxHeight+'px');
+				if (this.sectionProperties.commentList[i].sectionProperties.contentNode.style.display !== 'none')
+					this.sectionProperties.commentList[i].sectionProperties.contentNode.setAttribute('style', 'max-height: '+minMaxHeight+'px');
 			}
 			if (this.sectionProperties.selectedComment) {
-				const maxMaxHeight = Number(getComputedStyle(document.documentElement).getPropertyValue('--annotation-max-size'));
-				this.sectionProperties.selectedComment.sectionProperties.contentNode.setAttribute('style', 'max-height: '+maxMaxHeight+'px');
+				if (this.sectionProperties.selectedComment.sectionProperties.contentNode.style.display !== 'none') {
+					const maxMaxHeight = Number(getComputedStyle(document.documentElement).getPropertyValue('--annotation-max-size'));
+					this.sectionProperties.selectedComment.sectionProperties.contentNode.setAttribute('style', 'max-height: '+maxMaxHeight+'px');
+				}
 			}
 		}
 	}
@@ -1887,57 +1890,60 @@ export class CommentSection extends CanvasSectionObject {
 			const minMaxHeight = Number(getComputedStyle(document.documentElement).getPropertyValue('--annotation-min-size'));
 			const maxMaxHeight = Number(getComputedStyle(document.documentElement).getPropertyValue('--annotation-max-size'));
 			for (var i = 0; i < this.sectionProperties.commentList.length;i++) {
-				// act commentText height
-				var actHeight = this.sectionProperties.commentList[i].sectionProperties.contentText.getBoundingClientRect().height;
-				// if the comment is taller then minimal, we may want to make it taller
-				if (actHeight > minMaxHeight) {
-					// but we don't want to make it taller then the maximum
-					if (actHeight > maxMaxHeight) {
-						actHeight = maxMaxHeight;
-					}
-					// check if there is more space after this commit
-					var maxSize = maxMaxHeight;
-					if (i+1 < this.sectionProperties.commentList.length)
-						// max size of text should be the space between comments - size of non text parts 
-						maxSize = this.sectionProperties.commentList[i+1].sectionProperties.container._leaflet_pos.y
-							- this.sectionProperties.commentList[i].sectionProperties.container._leaflet_pos.y
-							- this.sectionProperties.commentList[i].sectionProperties.author.getBoundingClientRect().height
-							- 3 * this.sectionProperties.marginY //top/bottom of comment window + space between comments
-							- 2; // not sure why
-
-					if (maxSize > maxMaxHeight) {
-						maxSize = maxMaxHeight;
-					} else if (growUp && actHeight > maxSize) {
-						// if more space needed as we have after the comment
-						// check it there is any space before the comment
-						var spaceBefore = this.sectionProperties.commentList[i].sectionProperties.container._leaflet_pos.y;
-						if (i > 0) {
-							spaceBefore -= this.sectionProperties.commentList[i-1].sectionProperties.container._leaflet_pos.y
-								+ this.sectionProperties.commentList[i-1].sectionProperties.container.getBoundingClientRect().height
-								+ this.sectionProperties.marginY;
-						} else {
-							spaceBefore += this.documentTopLeft[1];
+				// Only if ContentNode is displayed.
+				if (this.sectionProperties.commentList[i].sectionProperties.contentNode.style.display !== 'none') {
+					// act commentText height
+					var actHeight = this.sectionProperties.commentList[i].sectionProperties.contentText.getBoundingClientRect().height;
+					// if the comment is taller then minimal, we may want to make it taller
+					if (actHeight > minMaxHeight) {
+						// but we don't want to make it taller then the maximum
+						if (actHeight > maxMaxHeight) {
+							actHeight = maxMaxHeight;
 						}
-						// if there is more space
-						if (spaceBefore > 0) {
-							var moveUp = 0;
-							if (actHeight - maxSize < spaceBefore) {
-								// there is enought space, move up as much as we can;
-								moveUp = actHeight - maxSize;
+						// check if there is more space after this commit
+						var maxSize = maxMaxHeight;
+						if (i+1 < this.sectionProperties.commentList.length)
+							// max size of text should be the space between comments - size of non text parts
+							maxSize = this.sectionProperties.commentList[i+1].sectionProperties.container._leaflet_pos.y
+								- this.sectionProperties.commentList[i].sectionProperties.container._leaflet_pos.y
+								- this.sectionProperties.commentList[i].sectionProperties.author.getBoundingClientRect().height
+								- 3 * this.sectionProperties.marginY //top/bottom of comment window + space between comments
+								- 2; // not sure why
+
+						if (maxSize > maxMaxHeight) {
+							maxSize = maxMaxHeight;
+						} else if (growUp && actHeight > maxSize) {
+							// if more space needed as we have after the comment
+							// check it there is any space before the comment
+							var spaceBefore = this.sectionProperties.commentList[i].sectionProperties.container._leaflet_pos.y;
+							if (i > 0) {
+								spaceBefore -= this.sectionProperties.commentList[i-1].sectionProperties.container._leaflet_pos.y
+									+ this.sectionProperties.commentList[i-1].sectionProperties.container.getBoundingClientRect().height
+									+ this.sectionProperties.marginY;
 							} else {
-								// there is not enought space
-								moveUp = spaceBefore;
+								spaceBefore += this.documentTopLeft[1];
+							}
+							// if there is more space
+							if (spaceBefore > 0) {
+								var moveUp = 0;
+								if (actHeight - maxSize < spaceBefore) {
+									// there is enought space, move up as much as we can;
+									moveUp = actHeight - maxSize;
+								} else {
+									// there is not enought space
+									moveUp = spaceBefore;
+								}
+								// move up
+								var posX = this.sectionProperties.commentList[i].sectionProperties.container._leaflet_pos.x;
+								var posY = this.sectionProperties.commentList[i].sectionProperties.container._leaflet_pos.y-moveUp;
+								(new L.PosAnimation()).run(this.sectionProperties.commentList[i].sectionProperties.container, {x: Math.round(posX), y: Math.round(posY)});
+								// increase comment height
+								maxSize += moveUp;
 							}
-							// move up
-							var posX = this.sectionProperties.commentList[i].sectionProperties.container._leaflet_pos.x;
-							var posY = this.sectionProperties.commentList[i].sectionProperties.container._leaflet_pos.y-moveUp;
-							(new L.PosAnimation()).run(this.sectionProperties.commentList[i].sectionProperties.container, {x: Math.round(posX), y: Math.round(posY)});
-							// increase comment height
-							maxSize += moveUp;
 						}
+						if (maxSize > minMaxHeight)
+							this.sectionProperties.commentList[i].sectionProperties.contentNode.setAttribute('style', 'max-height: '+Math.round(maxSize)+'px');
 					}
-					if (maxSize > minMaxHeight)
-						this.sectionProperties.commentList[i].sectionProperties.contentNode.setAttribute('style', 'max-height: '+Math.round(maxSize)+'px');
 				}
 			}
 		}