From 95b3e9d4fa42fcd65625fefc16cb5d7b2a2a010a Mon Sep 17 00:00:00 2001
From: Francis Lachapelle <flachapelle@inverse.ca>
Date: Wed, 12 Feb 2020 10:57:43 -0500
Subject: [PATCH] fix(mail(js)): skrink autogrow md-input when content is
 removed

---
 .../js/Common/sgAutogrow.directive.js         | 33 +++++++++++++------
 .../scss/views/MessageEditorUI.scss           |  1 +
 2 files changed, 24 insertions(+), 10 deletions(-)

diff --git a/UI/WebServerResources/js/Common/sgAutogrow.directive.js b/UI/WebServerResources/js/Common/sgAutogrow.directive.js
index 5e8e1e63c..4199eb011 100644
--- a/UI/WebServerResources/js/Common/sgAutogrow.directive.js
+++ b/UI/WebServerResources/js/Common/sgAutogrow.directive.js
@@ -19,26 +19,39 @@
 
      <textarea rows="9" md-no-autogrow sg-autogrow />
   */
-  sgAutogrow.$inject = ['$timeout'];
-  function sgAutogrow($timeout) {
+  sgAutogrow.$inject = ['$document', '$timeout'];
+  function sgAutogrow($document, $timeout) {
     return {
       restrict: 'A',
       link: function(scope, elem, attr) {
         var textarea = elem[0];
+        var hiddenDiv = $document[0].createElement('div');
+        var content = null;
+
+        hiddenDiv.classList.add('md-input');
+        hiddenDiv.classList.add('plain-text');
+        hiddenDiv.style.display = 'none';
+        hiddenDiv.style.whiteSpace = 'pre-wrap';
+        hiddenDiv.style.wordWrap = 'break-word';
+        textarea.parentNode.appendChild(hiddenDiv);
+
+        textarea.style.resize = 'none';
+        textarea.style.overflow = 'hidden';
 
         function AutoGrowTextArea() {
           $timeout(function() {
-            if (textarea.clientHeight < textarea.scrollHeight) {
-              textarea.style.height = textarea.scrollHeight + 'px';
-              if (textarea.clientHeight < textarea.scrollHeight) {
-                textarea.style.height = (textarea.scrollHeight * 2 - textarea.clientHeight) + 'px';
-              }
-            }
+            content = textarea.value;
+            content = content.replace(/\n/g, '<br>');
+            hiddenDiv.innerHTML = content + '<br style="line-height: 3px;">';
+            hiddenDiv.style.visibility = 'hidden';
+            hiddenDiv.style.display = 'block';
+            textarea.style.height = hiddenDiv.offsetHeight + 'px';
+            console.debug('resize to ' + hiddenDiv.offsetHeight + 'px');
+            hiddenDiv.style.visibility = 'visible';
+            hiddenDiv.style.display = 'none';
           });
         }
 
-        textarea.style.overflow = 'hidden';
-
         elem.on('keyup', AutoGrowTextArea);
         elem.on('paste', AutoGrowTextArea);
 
diff --git a/UI/WebServerResources/scss/views/MessageEditorUI.scss b/UI/WebServerResources/scss/views/MessageEditorUI.scss
index 56ec475de..219e98ce2 100644
--- a/UI/WebServerResources/scss/views/MessageEditorUI.scss
+++ b/UI/WebServerResources/scss/views/MessageEditorUI.scss
@@ -2,6 +2,7 @@
 
 // Plain text editor
 md-input-container .md-input.plain-text {
+  height: auto;
   padding-left: $mg;
   padding-right: $mg;
 }