[IMP] mail, sms: support keydown based change event in char fields using an option

PURPOSE

Avoid flickering and incorrect display of warning box in SMS when updating
the number to contact.

SPECIFICATIONS

Currently when an user uses composer to send an SMS, number is validated
at onchange. It leads to two issues

  * jump of content as a warning box appears;
  * visual warning displayed after user may have clicked on "Send"
    button, leading to warning not being useful;

We choose to validate number in real time in order to give directly
a feedback to the user. It also lessens flickering on composer screen.
This is done by allowing to trigger the 'change' event on key down. This
requires a specific onchange_on_keydown option to be used on char field.

LINKS

Task ID 2229050
PR #51159

closes odoo/odoo#52962

Signed-off-by: Thibault Delavallee (tde) <tde@openerp.com>

3 files changed, 58 insertions, 1 deletions

diff --git a/addons/mail/static/src/js/field_char.js b/addons/mail/static/src/js/field_char.js
new file mode 100644
index 00000000000..1a1b90ec875
--- /dev/null
+++ b/addons/mail/static/src/js/field_char.js
@@ -0,0 +1,56 @@
+odoo.define('sms.onchange_in_keyup', function (require) {
+"use strict";
+
+var FieldChar = require('web.basic_fields').FieldChar;
+FieldChar.include({
+
+    //--------------------------------------------------------------------------
+    // Public
+    //-------------------------------------------------------------------------
+
+    /**
+     * Support a key-based onchange in text field. In order to avoid too much
+     * rpc to the server _triggerOnchange is throttled (once every second max)
+     *
+     */
+    init: function () {
+        this._super.apply(this, arguments);
+        this._triggerOnchange = _.throttle(this._triggerOnchange, 1000, {leading: false});
+    },
+
+
+    //--------------------------------------------------------------------------
+    // Handlers
+    //--------------------------------------------------------------------------
+
+    /**
+     * Trigger the 'change' event at key down. It allows to trigger an onchange
+     * while typing which may be interesting in some cases. Otherwise onchange
+     * is triggered only on blur.
+     *
+     * @override
+     * @private
+     */
+    _onKeydown: function () {
+        this._super.apply(this, arguments);
+        if (this.nodeOptions.onchange_on_keydown) {
+            this._triggerOnchange();
+        }
+    },
+
+    //--------------------------------------------------------------------------
+    // Private
+    //--------------------------------------------------------------------------
+
+    /**
+     * Triggers the 'change' event to refresh the value. Throttled at init to
+     * avoid spaming server.
+     *
+     * @private
+     */
+    _triggerOnchange: function () {
+        this.$input.trigger('change');
+    },
+});
+
+});
diff --git a/addons/mail/views/assets.xml b/addons/mail/views/assets.xml
index 09aff4897af..f582e344010 100644
--- a/addons/mail/views/assets.xml
+++ b/addons/mail/views/assets.xml
@@ -11,6 +11,7 @@
             <xpath expr="." position="inside">
                 <script type="text/javascript" src="/mail/static/src/js/many2many_tags_email.js"></script>
                 <script type="text/javascript" src="/mail/static/src/js/many2one_avatar_user.js"></script>
+                <script type="text/javascript" src="/mail/static/src/js/field_char.js"></script>
 
                 <!-- Services -->
                 <script type="text/javascript" src="/mail/static/src/js/services/mail_manager.js"></script>
diff --git a/addons/sms/wizard/sms_composer_views.xml b/addons/sms/wizard/sms_composer_views.xml
index 543b731f360..b1be27ca32b 100644
--- a/addons/sms/wizard/sms_composer_views.xml
+++ b/addons/sms/wizard/sms_composer_views.xml
@@ -45,7 +45,7 @@
                             attrs="{'invisible': [('comment_single_recipient', '=', False)]}"/>
                         <div attrs="{'invisible': [('comment_single_recipient', '=', False)]}">
                             <field name="recipient_single_description" class="oe_inline"/>
-                            <field name="recipient_single_number_itf" class="oe_inline" nolabel="1"/>
+                            <field name="recipient_single_number_itf" class="oe_inline" nolabel="1" options="{'onchange_on_keydown': True}"/>
                         </div>
                                                 
                         <field name="body" widget="sms_widget"/>