From 40d2f95a8d0dc643865dcc180a248208499f0dda Mon Sep 17 00:00:00 2001
From: Patrick Hoste <pko@odoo.com>
Date: Fri, 22 Nov 2019 09:43:17 +0000
Subject: [PATCH] [IMP] website_sale_slides: add buy button to documentation
 courses

Currently if slides officers or managers define documentation courses as
on payment there is no easy way for customers to buy it.

In this commit we add a button on the frontend to allow the end user to buy
a documentation course like a training course. This button is displayed
only for on payment documentation courses, leaving other documentation courses
displayed untouched.

Task ID : 2125086
PR : odoo/odoo#40679

Signed-off-by: Thibault Delavallee (tde) <tde@openerp.com>
---
 .../views/website_slides_templates.xml        |  26 +++
 .../views/website_slides_templates_course.xml | 158 +++++++++---------
 2 files changed, 107 insertions(+), 77 deletions(-)

diff --git a/addons/website_sale_slides/views/website_slides_templates.xml b/addons/website_sale_slides/views/website_slides_templates.xml
index 7f83671dec1..dd265ffee73 100644
--- a/addons/website_sale_slides/views/website_slides_templates.xml
+++ b/addons/website_sale_slides/views/website_slides_templates.xml
@@ -54,6 +54,32 @@
 </template>
 
 <!-- COURSE -->
+<template name="Documentation Course Content: add Buy Button in nav" id="course_slides_cards_buy_course" inherit_id="website_slides.course_slides_cards">
+    <xpath expr="//nav[hasclass('navbar')]" position="before">
+        <div class="col-12 col-md-4 col-lg-3"
+            t-if="(not channel.is_member or channel.can_upload) and channel.enroll == 'payment'">
+            <div class="bg-white px-3 py-2 border-left border-right">
+                <div class="o_wslides_sidebar_top d-flex justify-content-between">
+                    <div class="o_wslides_js_course_join flex-grow-1">
+                        <t t-call="website_sale_slides.course_buy_course_button" />
+                    </div>
+                    <button t-attf-class="btn d-md-none bg-white ml-1 border #{'align-self-end' if channel.is_member else 'align-self-start alert'}" type="button" data-toggle="collapse" data-target="#o_wslides_sidebar_collapse" aria-expanded="false" aria-controls="o_wslides_sidebar_collapse">More info</button>
+                </div>
+                <div id="o_wslides_sidebar_collapse" class="collapse d-md-block">
+                    <table class="table table-sm mt-3">
+                        <tbody>
+                            <tr>
+                                <th class="border-top-0">Last Update</th>
+                                <td class="border-top-0"><t t-esc="channel.slide_last_update" t-options="{'widget': 'date'}"/></td>
+                            </tr>
+                        </tbody>
+                    </table>
+                </div>
+            </div>
+        </div>
+    </xpath>
+</template>
+
 <template name="Course Sidebar (infos, CTA)" id='course_sidebar' inherit_id="website_slides.course_sidebar">
     <!-- Channel main template: override button to join channel -->
     <xpath expr="//div[hasclass('o_wslides_js_course_join')]" position="inside">
diff --git a/addons/website_slides/views/website_slides_templates_course.xml b/addons/website_slides/views/website_slides_templates_course.xml
index 5f973da2c79..32a439fef0e 100644
--- a/addons/website_slides/views/website_slides_templates_course.xml
+++ b/addons/website_slides/views/website_slides_templates_course.xml
@@ -309,7 +309,7 @@
                     </div>
                 </t>
             </div>
-            <button class="btn btn-sm d-md-none bg-white ml-1 border" type="button" data-toggle="collapse" data-target="#o_wslides_sidebar_collapse" aria-expanded="false" aria-controls="o_wslides_sidebar_collapse">More info</button>
+            <button t-attf-class="btn d-md-none bg-white ml-1 border #{'alert' if channel.is_member else ''} #{'align-self-start' if channel.is_member or channel.enroll == 'invite' else 'align-self-end'}" type="button" data-toggle="collapse" data-target="#o_wslides_sidebar_collapse" aria-expanded="false" aria-controls="o_wslides_sidebar_collapse">More info</button>
         </div>
 
         <div id="o_wslides_sidebar_collapse" class="collapse d-md-block">
@@ -453,88 +453,92 @@
 
 <!-- ======= Documentation Course content: cards / categories=======  -->
 <template id="course_slides_cards" name="Documentation Course content: cards / categories">
-    <nav class="navbar navbar-expand-lg navbar-light mb-4 border-bottom">
+    <div class="o_wslides_lesson_nav mb-4 border-bottom">
         <div class="container">
-            <a class="navbar-brand d-lg-none" href="#">Filter &amp; order</a>
+            <div class="row">
+                <nav class="navbar navbar-expand-lg navbar-light col d-flex align-items-start">
+                    <a class="navbar-brand d-lg-none" href="#">Filter &amp; order</a>
 
-            <div class="form-inline ml-auto d-lg-none" t-if="search_slide_type or search">
-                <a t-att-href="'/slides/%s' % (slug(channel))" class="btn btn-info mr-3">
-                    <i class="fa fa-eraser mr-1"/>Clear filters
-                </a>
-            </div>
-
-            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
-                <span class="navbar-toggler-icon"></span>
-            </button>
-
-            <div class="collapse navbar-collapse" id="navbarSupportedContent">
-                <ul class="navbar-nav mr-lg-auto align-items-lg-center">
-
-                    <t t-set="slide_type_keys" t-value="slide_types.keys()"/>
-                    <t t-foreach="slide_type_keys" t-as="slide_type_key">
-                        <t t-if="search_category">
-                            <li t-if="search_category['nbr_%s' % slide_type_key] > 0" class="nav-item">
-                                <a t-att-href="'/slides/%s/category/%s?%s' % (slug(channel), slug(search_category), keep_query(slide_type=slide_type_key))"
-                                   t-att-class="'nav-link d-flex align-items-center justify-content-between pl-0 mr-1 %s' % ('active' if search_slide_type == slide_type_key else '')">
-                                   <t t-esc="slide_types[slide_type_key]"/>
-                                   <span t-attf-class="badge badge-pill ml-1 #{'badge-info' if search_slide_type == slide_type_key else 'bg-400'}" t-esc="search_category['nbr_%s' % slide_type_key]"/>
-                                </a>
-                            </li>
-                        </t>
-                        <t t-else="">
-                            <li t-if="channel['nbr_%s' % slide_type_key] > 0" class="nav-item">
-                                <a t-att-href="'/slides/%s?%s' % (slug(channel), keep_query(slide_type=slide_type_key))"
-                                   t-att-class="'nav-link d-flex align-items-center justify-content-between pl-0 mr-1 %s' % ('active' if search_slide_type == slide_type_key else '')">
-                                   <t t-esc="slide_types[slide_type_key]"/>
-                                   <span t-attf-class="badge badge-pill ml-1 #{'badge-info' if search_slide_type == slide_type_key else 'bg-400'}" t-esc="channel['nbr_%s' % slide_type_key]"/>
-                                </a>
-                            </li>
-                        </t>
-                    </t>
-                </ul>
-
-                <ul class="navbar-nav mr-auto">
-                    <li class="nav-item dropdown ml-lg-auto">
-                        <a class="nav-link dropdown-toggle dropdown-toggle align-items-center d-flex" type="button" id="slidesChannelDropdownSort"
-                           data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" href="#">
-                            <b>Order by</b>
-                            <span class="d-none d-xl-inline">:
-                                <t t-if="sorting == 'most_voted'">Most Voted</t>
-                                <t t-elif="sorting == 'most_viewed'">Most Viewed</t>
-                                <t t-else="">Newest</t>
-                            </span>
+                    <div class="form-inline ml-auto d-lg-none" t-if="search_slide_type or search">
+                        <a t-att-href="'/slides/%s' % (slug(channel))" class="btn btn-info mr-3">
+                            <i class="fa fa-eraser mr-1"/>Clear filters
                         </a>
-                        <div class="dropdown-menu" aria-labelledby="slidesChannelDropdownSort" role="menu">
-                            <h6 class="dropdown-header">Sort by</h6>
-                            <a role="menuitem" t-att-href="'/slides/%s?%s' % (slug(channel), keep_query('slide_type', sorting='latest'))"
-                               t-att-class="'dropdown-item %s' % ('active' if sorting and sorting == 'latest' else '')">Newest</a>
-                            <a role="menuitem" t-att-href="'/slides/%s?%s' % (slug(channel), keep_query('slide_type', sorting='most_voted'))"
-                               t-att-class="'dropdown-item %s' % ('active' if sorting and sorting == 'most_voted' else '')">Most Voted</a>
-                            <a role="menuitem" t-att-href="'/slides/%s?%s' % (slug(channel), keep_query('slide_type', sorting='most_viewed'))"
-                               t-att-class="'dropdown-item %s' % ('active' if sorting and sorting == 'most_viewed' else '')">Most Viewed</a>
-                        </div>
-                    </li>
-                </ul>
-
-                <div class="form-inline mr-3">
-                    <a t-if="search_slide_type or search" t-att-href="'/slides/%s' % (slug(channel))" class="btn btn-sm btn-info ml-1">
-                        <i class="fa fa-eraser mr-1"/>Clear filters
-                    </a>
-                </div>
-
-                <form t-attf-action="/slides/#{slug(channel)}" role="search" method="get" class="form-inline my-2 my-lg-0">
-                    <div class="input-group position-relative">
-                        <input type="text" class="form-control border" name="search" placeholder="Search in content" t-att-value="search"/>
-                        <div class="input-group-append">
-                            <button class="btn border" type="submit" aria-label="Search" title="Search">
-                                <i class="fa fa-search"/>
-                            </button>
-                        </div>
                     </div>
-                </form>
+
+                    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
+                        <span class="navbar-toggler-icon"></span>
+                    </button>
+
+                    <div class="collapse navbar-collapse" id="navbarSupportedContent">
+                        <ul class="navbar-nav mr-lg-auto align-items-lg-center">
+
+                            <t t-set="slide_type_keys" t-value="slide_types.keys()"/>
+                            <t t-foreach="slide_type_keys" t-as="slide_type_key">
+                                <t t-if="search_category">
+                                    <li t-if="search_category['nbr_%s' % slide_type_key] > 0" class="nav-item">
+                                        <a t-att-href="'/slides/%s/category/%s?%s' % (slug(channel), slug(search_category), keep_query(slide_type=slide_type_key))"
+                                           t-att-class="'nav-link d-flex align-items-center justify-content-between pl-0 mr-1 %s' % ('active' if search_slide_type == slide_type_key else '')">
+                                           <t t-esc="slide_types[slide_type_key]"/>
+                                           <span t-attf-class="badge badge-pill ml-1 #{'badge-info' if search_slide_type == slide_type_key else 'bg-400'}" t-esc="search_category['nbr_%s' % slide_type_key]"/>
+                                        </a>
+                                    </li>
+                                </t>
+                                <t t-else="">
+                                    <li t-if="channel['nbr_%s' % slide_type_key] > 0" class="nav-item">
+                                        <a t-att-href="'/slides/%s?%s' % (slug(channel), keep_query(slide_type=slide_type_key))"
+                                           t-att-class="'nav-link d-flex align-items-center justify-content-between pl-0 mr-1 %s' % ('active' if search_slide_type == slide_type_key else '')">
+                                           <t t-esc="slide_types[slide_type_key]"/>
+                                           <span t-attf-class="badge badge-pill ml-1 #{'badge-info' if search_slide_type == slide_type_key else 'bg-400'}" t-esc="channel['nbr_%s' % slide_type_key]"/>
+                                        </a>
+                                    </li>
+                                </t>
+                            </t>
+                        </ul>
+
+                        <ul class="navbar-nav mr-auto">
+                            <li class="nav-item dropdown ml-lg-auto">
+                                <a class="nav-link dropdown-toggle dropdown-toggle align-items-center d-flex" type="button" id="slidesChannelDropdownSort"
+                                   data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" href="#">
+                                    <b>Order by</b>
+                                    <span class="d-none d-xl-inline">:
+                                        <t t-if="sorting == 'most_voted'">Most Voted</t>
+                                        <t t-elif="sorting == 'most_viewed'">Most Viewed</t>
+                                        <t t-else="">Newest</t>
+                                    </span>
+                                </a>
+                                <div class="dropdown-menu" aria-labelledby="slidesChannelDropdownSort" role="menu">
+                                    <h6 class="dropdown-header">Sort by</h6>
+                                    <a role="menuitem" t-att-href="'/slides/%s?%s' % (slug(channel), keep_query('slide_type', sorting='latest'))"
+                                       t-att-class="'dropdown-item %s' % ('active' if sorting and sorting == 'latest' else '')">Newest</a>
+                                    <a role="menuitem" t-att-href="'/slides/%s?%s' % (slug(channel), keep_query('slide_type', sorting='most_voted'))"
+                                       t-att-class="'dropdown-item %s' % ('active' if sorting and sorting == 'most_voted' else '')">Most Voted</a>
+                                    <a role="menuitem" t-att-href="'/slides/%s?%s' % (slug(channel), keep_query('slide_type', sorting='most_viewed'))"
+                                       t-att-class="'dropdown-item %s' % ('active' if sorting and sorting == 'most_viewed' else '')">Most Viewed</a>
+                                </div>
+                            </li>
+                        </ul>
+
+                        <div class="form-inline mr-3 d-none d-lg-inline-block">
+                            <a t-if="search_slide_type or search" t-att-href="'/slides/%s' % (slug(channel))" class="btn btn-sm btn-info ml-1">
+                                <i class="fa fa-eraser mr-1"/>Clear filters
+                            </a>
+                        </div>
+
+                        <form t-attf-action="/slides/#{slug(channel)}" role="search" method="get" class="form-inline my-2 my-lg-0">
+                            <div class="input-group position-relative">
+                                <input type="text" class="form-control border" name="search" placeholder="Search in content" t-att-value="search"/>
+                                <div class="input-group-append">
+                                    <button class="btn border" type="submit" aria-label="Search" title="Search">
+                                        <i class="fa fa-search"/>
+                                    </button>
+                                </div>
+                            </div>
+                        </form>
+                    </div>
+                </nav>
             </div>
         </div>
-    </nav>
+    </div>
 
     <div t-if="channel.can_upload" class="text-right container pb-2">
         <a class="btn btn-primary py-1 o_wslides_js_slide_upload"