[MODIFY] website_search_header: Fixed issues in desktopSearch JavaScript function

Author: ElmerGForgeFlow

website_search_header/README.rst

@@ -7,7 +7,7 @@ Website Search in Header
    !! This file is generated by oca-gen-addon-readme !!
    !! changes will be overwritten.                   !!
    !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
-   !! source digest: sha256:d16cfb3e2bf08f7b6803f08d17d302e2ee86b04c1e4296db2ea051d1cb3dec43
+   !! source digest: sha256:0190640b3113a806206eba0406254bfdb594eb50e99f4f870b3815401ff7621f
    !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
 
 .. |badge1| image:: https://img.shields.io/badge/maturity-Beta-yellow.png
@@ -28,7 +28,7 @@ Website Search in Header
 
 |badge1| |badge2| |badge3| |badge4| |badge5|
 
-This module adds a search bar in the header of your website.
+This module adds a search bar in the header of your website
 
 **Table of contents**
 
@@ -40,18 +40,28 @@ Usage
 
 On desktop, the user will be able to show and hide the search input in the website header. While on mobile our searchbox will behave by default.
 
+Bug Tracker
+===========
+
+Bugs are tracked on `GitHub Issues <https://github.com/OCA/website/issues>`_.
+In case of trouble, please check there if your issue has already been reported.
+If you spotted it first, help us to smash it by providing a detailed and welcomed
+`feedback <https://github.com/OCA/website/issues/new?body=module:%20website_search_header%0Aversion:%2016.0%0A%0A**Steps%20to%20reproduce**%0A-%20...%0A%0A**Current%20behavior**%0A%0A**Expected%20behavior**>`_.
+
+Do not contact contributors directly about support or help with technical issues.
+
 Credits
 =======
 
 Authors
 ~~~~~~~
 
 * ForgeFlow
-* Ooops
 
 Contributors
 ~~~~~~~~~~~~
 
+
 * Jordi Ballester <jordi.ballester@forgeflow.com>
 * Elmer García <elmer.garcia@forgeflow.com>
 

website_search_header/static/description/index.html

@@ -367,10 +367,10 @@ <h1 class="title">Website Search in Header</h1>
 !! This file is generated by oca-gen-addon-readme !!
 !! changes will be overwritten.                   !!
 !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
-!! source digest: sha256:d16cfb3e2bf08f7b6803f08d17d302e2ee86b04c1e4296db2ea051d1cb3dec43
+!! source digest: sha256:0190640b3113a806206eba0406254bfdb594eb50e99f4f870b3815401ff7621f
 !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! -->
 <p><a class="reference external image-reference" href="https://odoo-community.org/page/development-status"><img alt="Beta" src="https://img.shields.io/badge/maturity-Beta-yellow.png" /></a> <a class="reference external image-reference" href="http://www.gnu.org/licenses/lgpl-3.0-standalone.html"><img alt="License: LGPL-3" src="https://img.shields.io/badge/licence-LGPL--3-blue.png" /></a> <a class="reference external image-reference" href="https://github.com/OCA/website/tree/16.0/website_search_header"><img alt="OCA/website" src="https://img.shields.io/badge/github-OCA%2Fwebsite-lightgray.png?logo=github" /></a> <a class="reference external image-reference" href="https://translation.odoo-community.org/projects/website-16-0/website-16-0-website_search_header"><img alt="Translate me on Weblate" src="https://img.shields.io/badge/weblate-Translate%20me-F47D42.png" /></a> <a class="reference external image-reference" href="https://runboat.odoo-community.org/builds?repo=OCA/website&amp;target_branch=16.0"><img alt="Try me on Runboat" src="https://img.shields.io/badge/runboat-Try%20me-875A7B.png" /></a></p>
-<p>This module allows to restrict access to specific website pages to logged users.</p>
+<p>This module adds a search bar in the header of your website</p>
 <p><strong>Table of contents</strong></p>
 <div class="contents local topic" id="contents">
 <ul class="simple">
@@ -386,8 +386,7 @@ <h1 class="title">Website Search in Header</h1>
 </div>
 <div class="section" id="usage">
 <h1><a class="toc-backref" href="#toc-entry-1">Usage</a></h1>
-<p>Website &gt; Configuration &gt;&nbsp;Authorization required URLs: select a website and enter a relative path, eg: /shop</p>
-<p>When public user will try to access mywebsite.com/shop or any of its child pages, they will be requested to login.</p>
+<p>On desktop, the user will be able to show and hide the search input in the website header. While on mobile our searchbox will behave by default.</p>
 </div>
 <div class="section" id="bug-tracker">
 <h1><a class="toc-backref" href="#toc-entry-2">Bug Tracker</a></h1>
@@ -409,7 +408,7 @@ <h2><a class="toc-backref" href="#toc-entry-4">Authors</a></h2>
 <div class="section" id="contributors">
 <h2><a class="toc-backref" href="#toc-entry-5">Contributors</a></h2>
 <ul class="simple">
-<li>Ooops404 &lt;<a class="reference external" href="https://ooops404.com">https://ooops404.com</a>&gt;</li>
+<li>ForgeFlow &lt;<a class="reference external" href="https://www.forgeflow.com">https://www.forgeflow.com</a>&gt;</li>
 </ul>
 </div>
 <div class="section" id="maintainers">

website_search_header/static/src/js/website.js

@@ -27,18 +27,19 @@ odoo.define("website_search_header.search_header", function (require) {
         },
 
         desktopSearch: function () {
-            if ($(".o_search_header").hasClass("d-lg-none")) {
-                $(".o_search_header").removeClass("d-lg-none");
-                $("#search_btn_toggle_search i").removeClass("oi-search");
-                $("#search_btn_toggle_search i").addClass("oi-close");
-                $("#div_search_header").removeClass("ms-lg-0");
-                $("#div_search_button").removeClass("ms-lg-2");
-            } else {
+            if (!$(".o_search_header").hasClass("d-lg-none")) {
                 $(".o_search_header").addClass("d-lg-none");
                 $("#search_btn_toggle_search i").removeClass("oi-close");
                 $("#search_btn_toggle_search i").addClass("oi-search");
                 $("#div_search_header").addClass("ms-lg-0");
                 $("#div_search_button").addClass("ms-lg-2");
+            } else {
+                $(".o_search_header").removeClass("d-lg-none");
+                $("#search_btn_toggle_search i").removeClass("oi-search");
+                $("#search_btn_toggle_search i").addClass("oi-close");
+                $("#div_search_header").removeClass("ms-lg-0");
+                $("#div_search_button").removeClass("ms-lg-2");
+                $("input.oe_search_box").focus();
             }
         },
 

website_search_header/views/templates.xml

@@ -12,22 +12,19 @@
 
     <template id="global_product_search_box_input" name="Global Products search box">
         <t t-call="website_search_header.global_product_search_box">
-            <t
-                t-set="_form_classes"
-                t-valuef="float-end d-block d-lg-none o_search_header"
-            />
+            <t t-set="_form_classes" t-valuef="float-end d-block o_search_header" />
             <t t-set="search_type" t-valuef="all" />
             <t t-set="action" t-valuef="/website/search" />
         </t>
     </template>
 
     <template id="header_search_link" name="Header Search Link">
-        <div id="div_search_header" t-attf-class="#{_item_class} ms-md-2 ms-lg-0">
+        <div id="div_search_header" t-attf-class="#{_item_class} ms-md-2">
             <a t-attf-class="d-none #{_link_class}">
             </a>
             <t t-call="website_search_header.global_product_search_box_input" />
         </div>
-        <div id="div_search_button" t-attf-class="#{_item_class} ms-lg-2">
+        <div id="div_search_button" t-attf-class="#{_item_class}">
             <a t-attf-class="d-none #{_link_class}">
             </a>
             <button
@@ -36,7 +33,7 @@
                 t-attf-class="btn oe_search_button btn-primary"
                 title="Search"
             >
-                <i class="oi oi-search" />
+                <i class="oi oi-close" />
             </button>
         </div>
     </template>