Conversation UI Visual Refresh: border fixes.

Borders now expand and collapsed based upon the state
of the messages above and below them. Also fixed a bug
where replying to a message added an additional border.

Change-Id: Ia90caf4ea595767a90213fe33b29e1bd75c0aca0

1 files changed, 23 insertions, 1 deletions

diff --git a/assets/script.js b/assets/script.js
index be22529dd..b30305a48 100644
--- a/assets/script.js
+++ b/assets/script.js
@@ -638,7 +638,8 @@ function setMessageHeaderSpacerHeight(messageDomId, spacerHeight) {
     measurePositions();
 }
 
-function setMessageBodyVisible(messageDomId, isVisible, spacerHeight) {
+function setMessageBodyVisible(messageDomId, isVisible, spacerHeight,
+        topBorderHeight, bottomBorderHeight) {
     var i, len;
     var visibility = isVisible ? "block" : "none";
     var messageDiv = document.querySelector("#" + messageDomId);
@@ -647,6 +648,27 @@ function setMessageBodyVisible(messageDomId, isVisible, spacerHeight) {
         console.log("can't set body visibility for message with id: " + messageDomId);
         return;
     }
+
+    // if the top border has changed, update the height of its spacer
+    if (topBorderHeight > 0) {
+        var border = messageDiv.previousElementSibling;
+        if (!border) {
+            console.log("can't set spacer for top border");
+            return;
+        }
+        border.style.height = topBorderHeight + "px";
+    }
+
+    // if the bottom border has changed, update the height of its spacer
+    if (bottomBorderHeight > 0) {
+        var border = messageDiv.nextElementSibling;
+        if (!border) {
+            console.log("can't set spacer for bottom border");
+            return;
+        }
+        border.style.height = bottomBorderHeight + "px";
+    }
+
     messageDiv.classList.toggle("expanded");
     for (i = 0, len = collapsibleDivs.length; i < len; i++) {
         collapsibleDivs[i].style.display = visibility;