[IMP] mail: add a Read More on out of office message

Task: 1856205

addons/mail/static/src/js/thread_windows/thread_window.js

@@ -21,6 +21,7 @@ var ThreadWindow = AbstractThreadWindow.extend({
         'click .o_mail_thread': '_onThreadWindowFocus',
         'click .o_thread_composer': '_onThreadWindowFocus',
         'click .o_thread_window_expand': '_onClickExpand',
+        'click .o_out_of_office_read_more_less_button': '_onClickOutOfOfficeReadMoreLess',
     }),
     /**
      * Version of thread window that supports {mail.model.Thread}
@@ -80,6 +81,7 @@ var ThreadWindow = AbstractThreadWindow.extend({
                 self.$input = self.$('.o_composer_text_field');
             });
         }
+        this._updateOutOfOfficeReadMoreLessButton();
 
         return $.when(superDef, composerDef);
     },
@@ -250,6 +252,19 @@ var ThreadWindow = AbstractThreadWindow.extend({
             })
             .focus();
     },
+    /**
+     * @private
+     */
+    _updateOutOfOfficeReadMoreLessButton: function () {
+        var $readMore = this.$('.o_out_of_office_text');
+        var isOverflowing = $readMore.prop('scrollWidth') > $readMore.width();
+        var isOverflowShown = !$readMore.hasClass('o_text_wrap');
+        if (isOverflowing || isOverflowShown) {
+            var $button = this.$('.o_out_of_office_read_more_less_button');
+            $button.show();
+            $button.text(isOverflowing ? _t('Read more') : _t('Read less'));
+        }
+    },
 
     //--------------------------------------------------------------------------
     // Handlers
@@ -288,6 +303,15 @@ var ThreadWindow = AbstractThreadWindow.extend({
             });
         }
     }, 1000, true),
+    /**
+     * @private
+     * @param {MouseEvent} ev
+     */
+    _onClickOutOfOfficeReadMoreLess: function (ev) {
+        ev.preventDefault();
+        this.$('.o_out_of_office_text').toggleClass('o_text_wrap');
+        this._updateOutOfOfficeReadMoreLessButton();
+    },
     /**
      * @override
      * @private

addons/mail/static/src/scss/abstract_thread_window.scss

@@ -86,6 +86,17 @@ $o-mail-thread-window-zindex: $zindex-modal + 1 !default;
         .o_out_of_office_info {
             font-weight: bold;
         }
+        .o_out_of_office_text {
+            word-wrap: break-word;
+            overflow: hidden;
+            text-overflow: ellipsis;
+        }
+        .o_text_wrap {
+            white-space: nowrap;
+        }
+        .o_out_of_office_read_more_less_button {
+            display: none;
+        }
     }
 
     .o_mail_thread {

addons/mail/static/src/xml/thread_window.xml

@@ -8,7 +8,10 @@
         <t t-jquery=".o_thread_window_header" t-operation="after">
             <div class="o_out_of_office" t-if="widget.getOutOfOfficeInfo() or widget.getOutOfOfficeMessage()">
                 <div class="o_out_of_office_info" t-if="widget.getOutOfOfficeInfo()" t-esc="widget.getOutOfOfficeInfo()"/>
-                <div class="o_out_of_office_text" t-if="widget.getOutOfOfficeMessage()" t-esc="widget.getOutOfOfficeMessage()"/>
+                <div class="o_out_of_office_text o_text_wrap" t-if="widget.getOutOfOfficeMessage()">
+                    <t t-esc="widget.getOutOfOfficeMessage()"/>
+                    <a href="#" class="o_out_of_office_read_more_less_button">Read more</a>
+                </div>
             </div>
             <div t-if="!widget.hasThread()" class="o_thread_search_input">
                 <span> To: </span>