From 417bb032a939ff96d6a7e8111d4b78aad2323e8d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Alexandre=20D=2E=20D=C3=ADaz?=
 <alexandre.diaz@tecnativa.com>
Date: Fri, 23 Apr 2021 20:21:49 +0200
Subject: [PATCH] [IMP] web_widget_one2many_product_picker: Maximize button and
 content auto-select

---
 .../__init__.py                               |  1 -
 .../models/__init__.py                        |  2 --
 .../models/product_product.py                 | 21 ----------------
 .../widgets/field_one2many_product_picker.js  | 25 ++++++-------------
 .../src/xml/one2many_product_picker.xml       | 24 +++++++++---------
 5 files changed, 19 insertions(+), 54 deletions(-)
 delete mode 100644 web_widget_one2many_product_picker/models/__init__.py
 delete mode 100644 web_widget_one2many_product_picker/models/product_product.py

diff --git a/web_widget_one2many_product_picker/__init__.py b/web_widget_one2many_product_picker/__init__.py
index 28345b82a..f0e48908c 100644
--- a/web_widget_one2many_product_picker/__init__.py
+++ b/web_widget_one2many_product_picker/__init__.py
@@ -1,3 +1,2 @@
 # Copyright 2020 Tecnativa - Alexandre Díaz
 # License AGPL-3.0 or later (http://www.gnu.org/licenses/agpl).
-from . import models
diff --git a/web_widget_one2many_product_picker/models/__init__.py b/web_widget_one2many_product_picker/models/__init__.py
deleted file mode 100644
index 3d1f7c9ef..000000000
--- a/web_widget_one2many_product_picker/models/__init__.py
+++ /dev/null
@@ -1,2 +0,0 @@
-# License LGPL-3.0 or later (https://www.gnu.org/licenses/lgpl).
-from . import product_product
diff --git a/web_widget_one2many_product_picker/models/product_product.py b/web_widget_one2many_product_picker/models/product_product.py
deleted file mode 100644
index 2e477a44e..000000000
--- a/web_widget_one2many_product_picker/models/product_product.py
+++ /dev/null
@@ -1,21 +0,0 @@
-# Copyright 2020 Tecnativa - Alexandre D. Díaz
-# License LGPL-3.0 or later (https://www.gnu.org/licenses/lgpl).
-from odoo import fields, models
-
-
-class ProductProduct(models.Model):
-    _inherit = "product.product"
-
-    image_variant_medium = fields.Binary(
-        "Variant Image Medium (Related)",
-        related="image_512",
-        help="This field holds the image used as image for the product variant"
-        "or product image medium, limited to 512x512px.",
-    )
-
-    image_variant_big = fields.Binary(
-        "Variant Image Big (Related)",
-        related="image_1024",
-        help="This field holds the image used as image for the product variant"
-        "or product image, limited to 1024x1024px.",
-    )
diff --git a/web_widget_one2many_product_picker/static/src/js/widgets/field_one2many_product_picker.js b/web_widget_one2many_product_picker/static/src/js/widgets/field_one2many_product_picker.js
index 6e0d3ae29..1e8a85f29 100644
--- a/web_widget_one2many_product_picker/static/src/js/widgets/field_one2many_product_picker.js
+++ b/web_widget_one2many_product_picker/static/src/js/widgets/field_one2many_product_picker.js
@@ -29,6 +29,7 @@ odoo.define("web_widget_one2many_product_picker.FieldOne2ManyProductPicker", fun
             "search .oe_search_input": "_onSearch",
             "focusin .oe_search_input": "_onFocusInSearch",
             "show.bs.dropdown .o_cp_buttons": "_onShowSearchDropdown",
+            "click #product_picker_maximize": "_onClickMaximize",
         }),
         custom_events: _.extend({}, FieldOne2Many.prototype.custom_events, {
             create_quick_record: "_onCreateQuickRecord",
@@ -261,7 +262,6 @@ odoo.define("web_widget_one2many_product_picker.FieldOne2ManyProductPicker", fun
                     ) {
                         this.$el.addClass("position-relative d-flex flex-column");
                     }
-                    this._addMaximizeButton();
                     if (this.options.show_subtotal) {
                         this._addTotalsZone();
                     }
@@ -281,19 +281,6 @@ odoo.define("web_widget_one2many_product_picker.FieldOne2ManyProductPicker", fun
             });
         },
 
-        /**
-         * Inject the 'maximize' button
-         *
-         * @private
-         */
-        _addMaximizeButton: function() {
-            this.$("#product_picker_maximize").remove();
-            this.$btnMaximize = $(qweb.render("One2ManyProductPicker.ButtonMaximize"));
-            this.$btnMaximize
-                .appendTo(this.$el)
-                .on("click", this._onClickMaximize.bind(this));
-        },
-
         /**
          * Inject the 'maximize' button
          *
@@ -678,9 +665,7 @@ odoo.define("web_widget_one2many_product_picker.FieldOne2ManyProductPicker", fun
 
         _onSearch: function(evt) {
             this._searchContext.text = evt.target.value;
-            this.doRenderSearchRecords().then(() => {
-                this.$searchInput.focus();
-            });
+            this.doRenderSearchRecords();
         },
 
         /**
@@ -690,7 +675,11 @@ odoo.define("web_widget_one2many_product_picker.FieldOne2ManyProductPicker", fun
          * @private
          */
         _onFocusInSearch: function() {
-            this.$searchInput.select();
+            // Workaround: In some cases the focus it's not properly
+            // assigned due an "event collision".
+            // Use deferred call to ensure dispatch our event in
+            // a new frame.
+            _.defer(() => this.$searchInput.select());
         },
 
         /**
diff --git a/web_widget_one2many_product_picker/static/src/xml/one2many_product_picker.xml b/web_widget_one2many_product_picker/static/src/xml/one2many_product_picker.xml
index 470057172..e20d8d4e6 100644
--- a/web_widget_one2many_product_picker/static/src/xml/one2many_product_picker.xml
+++ b/web_widget_one2many_product_picker/static/src/xml/one2many_product_picker.xml
@@ -39,6 +39,14 @@
                     aria-label="Search..."
                     aria-describedby="btnGroupAddon2"
                 />
+                <div class="input-group-append">
+                    <button
+                        id="product_picker_maximize"
+                        class='o_fullscreen btn btn-primary'
+                    >
+                        <i class='fa fa-expand' />
+                    </button>
+                </div>
             </div>
         </div>
     </t>
@@ -62,14 +70,6 @@
             </button>
         </div>
     </t>
-    <t t-name="One2ManyProductPicker.ButtonMaximize">
-        <button
-            if="product_picker_maximize"
-            class='o_fullscreen btn btn-primary position-absolute border border-dark py-1 px-2'
-        >
-            <i class='fa fa-expand' />
-        </button>
-    </t>
     <t t-name="One2ManyProductPicker.Total">
         <div id="product_picker_total" class="text-right">
             <h2>
@@ -167,8 +167,8 @@
                             <img
                                 alt=""
                                 class="img img-fluid"
-                                t-att-src="image(state.data[field_map.product].data.id,'image_variant_medium')"
-                                t-att-data-src-alt="image(state.data[field_map.product].data.id,'image_variant_big')"
+                                t-att-src="image(state.data[field_map.product].data.id,'image_512')"
+                                t-att-data-src-alt="image(state.data[field_map.product].data.id,'image_1024')"
                             />
                         </t>
                         <t t-else="">
@@ -179,8 +179,8 @@
                             <img
                                 alt=""
                                 class="img img-fluid"
-                                t-att-src="image(record_search.id,'image_variant_medium')"
-                                t-att-data-src-alt="image(record_search.id,'image_variant_big')"
+                                t-att-src="image(record_search.id,'image_512')"
+                                t-att-data-src-alt="image(record_search.id,'image_1024')"
                             />
                         </t>
                     </div>