From c1b7944a67dd9a4f072ff9cd0d35f6dd53369101 Mon Sep 17 00:00:00 2001
From: Julien Banken <jbn@odoo.com>
Date: Tue, 24 Aug 2021 07:47:10 +0000
Subject: [PATCH] [IMP] website_event_exhibitor: add a popover on the exhibitor
 cards

On the website, the exhibitor cards only shows a logo. If the visitors
clicks on a logo, the visitors will be redirected to the website of the
corresponding exhibitor. If no website has been set and the logo of the
exhibitor is rather abstract, the visitors may not be able to recognize
and identify the exhibitor.

To provide more information about the exhibitor, we will add a small
popover that will be opened when the visitor clicks on the logo. The
popover will contain the following information:

- The name of the exhibitor
- The website of the exhibitor

Other information are considered as private and can be added through
customization if this fits specific use cases.

task-2504216

COM PR: odoo/odoo#69585
UPG PR: odoo/upgrade#2408
---
 .../src/scss/event_templates_sponsor.scss     |  1 +
 .../views/event_templates_sponsor.xml         | 19 ++++++++++---------
 .../static/src/js/website_event_track.js      |  9 +++++++++
 3 files changed, 20 insertions(+), 9 deletions(-)

diff --git a/addons/website_event_exhibitor/static/src/scss/event_templates_sponsor.scss b/addons/website_event_exhibitor/static/src/scss/event_templates_sponsor.scss
index 9a6866b3cbd..16a23a17848 100644
--- a/addons/website_event_exhibitor/static/src/scss/event_templates_sponsor.scss
+++ b/addons/website_event_exhibitor/static/src/scss/event_templates_sponsor.scss
@@ -55,6 +55,7 @@
     border: 1px solid $gray-200;
     background-color: $white;
     margin: 0 -1px -1px 0;
+    cursor: pointer;
 
     .ribbon-wrapper {
         width: 50px;
diff --git a/addons/website_event_exhibitor/views/event_templates_sponsor.xml b/addons/website_event_exhibitor/views/event_templates_sponsor.xml
index 7307bbf97aa..3115038b2ca 100644
--- a/addons/website_event_exhibitor/views/event_templates_sponsor.xml
+++ b/addons/website_event_exhibitor/views/event_templates_sponsor.xml
@@ -6,17 +6,18 @@
         <div class="container mt32 mb16 d-none d-md-block d-print-none" t-if="event.sponsor_ids">
             <div t-attf-class="d-flex flex-wrap mb-5 #{'' if (len(event.sponsor_ids) > 10) else 'justify-content-md-center'}">
                 <t t-foreach="event.sponsor_ids.sorted(lambda sponsor: not sponsor.website_published)" t-as="sponsor">
-                    <t t-if="sponsor.url">
-                        <a class="o_wevent_sponsor o_wevent_sponsor_card h-100 text-decoration-none" target="_blank" t-att-href="sponsor.url"
-                            t-att-data-publish="'on' if sponsor.website_published else 'off'">
-                            <t t-call="website_event_exhibitor.event_sponsor_thumb_details"/>
-                        </a>
-                    </t>
-                    <t t-if="not sponsor.url">
-                        <div class="o_wevent_sponsor o_wevent_sponsor_card h-100" t-att-data-publish="'on' if sponsor.website_published else 'off'">
-                            <t t-call="website_event_exhibitor.event_sponsor_thumb_details"/>
+                    <t t-set="popover_content">
+                        <div t-field="sponsor.name" class="h5"/>
+                        <div t-if="sponsor.url" class="d-flex align-items-baseline">
+                            <i class="fa fa-home mr-2"/><a t-att-href="sponsor.url" t-field="sponsor.url" class="text-truncate"/>
                         </div>
                     </t>
+                    <a class="o_wevent_sponsor o_wevent_sponsor_card h-100" tabindex="0" role="button"
+                        t-att-data-publish="'on' if sponsor.website_published else 'off'"
+                        t-att-data-content="popover_content"
+                        data-html="true" data-trigger="focus" data-toggle="popover" data-placement="bottom">
+                        <t t-call="website_event_exhibitor.event_sponsor_thumb_details"/>
+                    </a>
                 </t>
             </div>
         </div>
diff --git a/addons/website_event_track/static/src/js/website_event_track.js b/addons/website_event_track/static/src/js/website_event_track.js
index aa6611f5bed..98f51e8755d 100644
--- a/addons/website_event_track/static/src/js/website_event_track.js
+++ b/addons/website_event_track/static/src/js/website_event_track.js
@@ -13,6 +13,15 @@ publicWidget.registry.websiteEventTrack = publicWidget.Widget.extend({
     // Handlers
     //--------------------------------------------------------------------------
 
+    /**
+     * @override
+     */
+    start: function () {
+        this._super.apply(this, arguments).then(() => {
+            this.$el.find('[data-toggle="popover"]').popover()
+        })
+    },
+
     /**
      * @private
      * @param {Event} ev