From a48c11bd6eeb8bc43dece217465cb3bab9a5f6bb Mon Sep 17 00:00:00 2001
From: Akim Juillerat <akim.juillerat@camptocamp.com>
Date: Wed, 14 Aug 2019 15:33:56 +0200
Subject: [PATCH] Fix sizing of textarea

Resize textarea either to the max height of its content if it stays
in the modal or to the max height available in the modal
---
 .../static/src/js/web_translate_dialog.js     | 24 +++++++++++++------
 web_translate_dialog/static/src/xml/base.xml  |  2 +-
 2 files changed, 18 insertions(+), 8 deletions(-)

diff --git a/web_translate_dialog/static/src/js/web_translate_dialog.js b/web_translate_dialog/static/src/js/web_translate_dialog.js
index 1bb321c33..2f7f5918d 100644
--- a/web_translate_dialog/static/src/js/web_translate_dialog.js
+++ b/web_translate_dialog/static/src/js/web_translate_dialog.js
@@ -15,7 +15,6 @@ var FormView = require('web.FormView');
 var View = require('web.AbstractView');
 var session  = require('web.session');
 var rpc = require('web.rpc');
-var dom = require('web.dom');
 
 var _t = core._t;
 var QWeb = core.qweb;
@@ -71,6 +70,22 @@ var translateDialog = Dialog.extend({
 
         this.do_load_fields_values();
     },
+    resize_textareas: function(){
+        var textareas = this.$('textarea.oe_translation_field');
+        var max_height = 100
+        // Resize textarea either to the max height of its content if it stays
+        // in the modal or to the max height available in the modal
+        if (textareas.length) {
+            _.each(textareas, function(textarea) {
+                if (textarea.scrollHeight > max_height) {
+                    max_height = textarea.scrollHeight
+                }
+            });
+            var max_client_height = $(window).height() - $('.modal-content').height()
+            var new_height = Math.min(max_height, max_client_height)
+            textareas.css({'minHeight': new_height});
+        }
+    },
     initialize_html_fields: function(lang) {
         // Initialize summernote if HTML field
         this.$('.oe_form_field_html .oe_translation_field[name="' + lang + '-' + this.translatable_field + '"]').each(function() {
@@ -109,12 +124,6 @@ var translateDialog = Dialog.extend({
                 '-' + this.translatable_field + '"]').val(tr_value || '').attr(
                 'data-value', tr_value || '');
 
-        var textarea = this.$('textarea.oe_translation_field');
-        if (textarea !== undefined && textarea[0] !== undefined) {
-            textarea.css({minHeight:'100px',});
-            dom.autoresize(textarea, {parent: this.$el});
-        }
-        $(window).resize();
         this.initialize_html_fields(lang);
     },
     do_load_fields_values: function() {
@@ -140,6 +149,7 @@ var translateDialog = Dialog.extend({
                     _.each(res[self.res_id], function(translation, lang) {
                         self.set_fields_values(lang, translation[1]);
                     });
+                    self.resize_textareas()
                     deff.resolve();
                 }
             });
diff --git a/web_translate_dialog/static/src/xml/base.xml b/web_translate_dialog/static/src/xml/base.xml
index 3ddce3d41..b8d8f54d9 100644
--- a/web_translate_dialog/static/src/xml/base.xml
+++ b/web_translate_dialog/static/src/xml/base.xml
@@ -29,7 +29,7 @@
                              value="" data-value="" class="oe_translation_field"/>
                       <textarea t-elif="field.type == 'text'"
                                 t-attf-name="#{lg.code}-#{field_name}" data-value=""
-                                class="oe_translation_field" ></textarea>
+                                class="oe_translation_field" />
                       <div t-elif="field.type == 'html'" class="oe_form_field_html">
                           <textarea class="oe_translation_field oe_form_field"
                                     t-attf-name="#{lg.code}-#{field_name}" data-value=""/>