[MERGE] forward port branch saas-12.2 up to 465909f0fde

5 files changed, 87 insertions, 30 deletions

diff --git a/addons/website_slides/static/src/js/slides_course_fullscreen_player.js b/addons/website_slides/static/src/js/slides_course_fullscreen_player.js
index 8a648a3cb3b..42fce775674 100644
--- a/addons/website_slides/static/src/js/slides_course_fullscreen_player.js
+++ b/addons/website_slides/static/src/js/slides_course_fullscreen_player.js
@@ -299,14 +299,15 @@ odoo.define('website_slides.fullscreen', function (require) {
         * @param {Object} slides Contains the list of all slides of the course
         * @param {integer} defaultSlideId Contains the ID of the slide requested by the user
         */
-        init: function (el, slides, defaultSlideId){
+        init: function (parent, slides, defaultSlideId, channelData){
             var result = this._super.apply(this,arguments);
             this.initialSlideID = defaultSlideId;
             this.slides = this._preprocessSlideData(slides);
-
+            this.channel = channelData;
             var slide;
+            var urlParams = $.deparam.querystring();
             if (defaultSlideId) {
-                slide = findSlide(this.slides, {id: defaultSlideId});
+                slide = findSlide(this.slides, {id: defaultSlideId, isQuiz: urlParams.quiz === "1" });
             } else {
                 slide = this.slides[0];
             }
@@ -417,7 +418,11 @@ odoo.define('website_slides.fullscreen', function (require) {
             urlParts[urlParts.length-1] = this.get('slide').slug;
             var url =  urlParts.join('/');
             this.$('.o_wslides_fs_exit_fullscreen').attr('href', url);
-            var fullscreenUrl = _.str.sprintf('%s?fullscreen=1', url);
+            var params = {'fullscreen': 1 };
+            if (this.get('slide').isQuiz){
+                params.quiz = 1;
+            }
+            var fullscreenUrl = _.str.sprintf('%s?%s', url, $.param(params));
             history.pushState(null, '', fullscreenUrl);
         },
         /**
@@ -437,7 +442,7 @@ odoo.define('website_slides.fullscreen', function (require) {
             // display quiz slide, or quiz attached to a slide
             if (slide.type === 'quiz' || slide.isQuiz) {
                 $content.addClass('bg-white');
-                var QuizWidget = new Quiz(this, slide);
+                var QuizWidget = new Quiz(this, slide, this.channel);
                 return QuizWidget.appendTo($content);
             }
 
@@ -490,13 +495,13 @@ odoo.define('website_slides.fullscreen', function (require) {
         _onChangeSlide: function () {
             var self = this;
             var slide = this.get('slide');
+            self._pushUrlState();
             return this._fetchSlideContent().then(function() { // render content
                 return self._renderSlide();
             }).then(function() {
                 if (slide._autoSetDone && !session.is_website_user) {  // no useless RPC call
                     self._setCompleted(slide.id);
                 }
-                self._pushUrlState();
             });
         },
         /**
@@ -568,10 +573,13 @@ odoo.define('website_slides.fullscreen', function (require) {
         xmlDependencies: ['/website_slides/static/src/xml/website_slides_fullscreen.xml'],
         start: function (){
             var proms = [this._super.apply(this, arguments)];
-            var fullscreen = new Fullscreen(this, this._getSlides(), this._getCurrentSlideID());
+            var fullscreen = new Fullscreen(this, this._getSlides(), this._getCurrentSlideID(), this._extractChannelData());
             proms.push(fullscreen.attachTo(".o_wslides_fs_main"));
             return Promise.all(proms);
         },
+        _extractChannelData: function (){
+            return this.$el.data();
+        },
         _getCurrentSlideID: function (){
             return parseInt(this.$('.o_wslides_fs_sidebar_list_item.active').data('id'));
         },
diff --git a/addons/website_slides/static/src/js/slides_course_join.js b/addons/website_slides/static/src/js/slides_course_join.js
index 002ea049e5f..1e753b967f6 100644
--- a/addons/website_slides/static/src/js/slides_course_join.js
+++ b/addons/website_slides/static/src/js/slides_course_join.js
@@ -8,10 +8,17 @@ require('website_slides.slides');
 var _t = core._t;
 
 var CourseJoinWidget = publicWidget.Widget.extend({
+    template: 'slide.course.join',
+    xmlDependencies: ['/website_slides/static/src/xml/channel_management.xml'],
     events: {
         'click .o_wslides_js_course_join_link': '_onClickJoin',
     },
 
+    init: function (parent, channelId){
+        this.channelId = channelId;
+        return this._super.apply(this, arguments);
+    },
+
     //--------------------------------------------------------------------------
     // Private
     //--------------------------------------------------------------------------
@@ -41,7 +48,7 @@ var CourseJoinWidget = publicWidget.Widget.extend({
      * @private
      */
     _onClickJoin: function (event) {
-        var channelId = $(event.currentTarget).data('channel-id');
+        var channelId = this.channelId || $(event.currentTarget).data('channel-id');
         var self = this;
         this._rpc({
             route: '/slides/channel/join',
diff --git a/addons/website_slides/static/src/js/slides_course_quiz.js b/addons/website_slides/static/src/js/slides_course_quiz.js
index 8b02ee4beae..8ca2108c368 100644
--- a/addons/website_slides/static/src/js/slides_course_quiz.js
+++ b/addons/website_slides/static/src/js/slides_course_quiz.js
@@ -3,6 +3,9 @@ odoo.define('website_slides.quiz', function (require) {
 
     var publicWidget = require('web.public.widget');
     var core = require('web.core');
+    var session = require('web.session');
+
+    var CourseJoinWidget = require('website_slides.course.join.widget').courseJoinWidget;
 
     var QWeb = core.qweb;
     var _t = core._t;
@@ -34,7 +37,7 @@ odoo.define('website_slides.quiz', function (require) {
         * @param {Object} slide_data holding all the classic slide informations
         * @param {Object} quiz_data : optional quiz data to display. If not given, will be fetched. (questions and answers).
         */
-        init: function (parent, slide_data, quiz_data) {
+        init: function (parent, slide_data, channel_data, quiz_data) {
             this.slide = _.defaults(slide_data, {
                 id: 0,
                 name: '',
@@ -44,6 +47,9 @@ odoo.define('website_slides.quiz', function (require) {
             });
             this.quiz = quiz_data || false;
             this.readonly = slide_data.readonly || false;
+            this.publicUser = session.is_website_user;
+            this.redirectURL = encodeURIComponent(document.URL);
+            this.channel = channel_data;
             return this._super.apply(this, arguments);
         },
 
@@ -69,6 +75,7 @@ odoo.define('website_slides.quiz', function (require) {
                 self._renderAnswers();
                 self._renderAnswersHighlighting();
                 self._renderValidationInfo();
+                new CourseJoinWidget(self, self.channel.channelId).appendTo(self.$('.o_wslides_course_join_widget'));
             });
         },
 
@@ -285,6 +292,7 @@ odoo.define('website_slides.quiz', function (require) {
             var defs = [this._super.apply(this, arguments)];
             this.$('.o_wslides_js_lesson_quiz').each(function () {
                 var slideData = $(this).data();
+                var channelData = self._extractChannelData(slideData);
                 slideData.quizData = {
                     questions: self._extractQuestionsAndAnswers(),
                     quizKarmaMax: slideData.quizKarmaMax,
@@ -292,7 +300,7 @@ odoo.define('website_slides.quiz', function (require) {
                     quizKarmaGain: slideData.quizKarmaGain,
                     quizAttemptsCount: slideData.quizAttemptsCount,
                 };
-                defs.push(new Quiz(self, slideData, slideData.quizData).attachTo($(this)));
+                defs.push(new Quiz(self, slideData, channelData, slideData.quizData).attachTo($(this)));
             });
             return Promise.all(defs);
         },
@@ -318,6 +326,14 @@ odoo.define('website_slides.quiz', function (require) {
         // Private
         //---------------------------------------------------------------------
 
+        _extractChannelData: function (slideData){
+            return {
+                id: slideData.channelId,
+                channelEnroll: slideData.enroll,
+                signupAllowed: slideData.signupAllowed
+            };
+        },
+
         /**
          * Extract data from exiting DOM rendered server-side, to have the list of questions with their
          * relative answers.
diff --git a/addons/website_slides/static/src/xml/channel_management.xml b/addons/website_slides/static/src/xml/channel_management.xml
new file mode 100644
index 00000000000..a616cc1baa1
--- /dev/null
+++ b/addons/website_slides/static/src/xml/channel_management.xml
@@ -0,0 +1,12 @@
+<templates>
+    <t t-name="slide.course.join">
+        <div class="p-0 col-md-2">
+            <a role="button"
+                class="btn btn-primary btn-block o_wslides_js_course_join_link text-uppercase font-weight-bold"
+                title="Start Course" aria-label="Start Course Channel"
+                href="#">
+                <span class="cta-title text_small_caps">Join Course</span>
+            </a>
+        </div>
+    </t>
+</templates>
diff --git a/addons/website_slides/static/src/xml/slide_quiz.xml b/addons/website_slides/static/src/xml/slide_quiz.xml
index 645ecae94cd..f8f84d20d8e 100644
--- a/addons/website_slides/static/src/xml/slide_quiz.xml
+++ b/addons/website_slides/static/src/xml/slide_quiz.xml
@@ -45,28 +45,42 @@
     </t>
 
     <t t-name="slide.slide.quiz.validation">
-        <div t-if="widget.readonly" class="alert alert-info">
-            <b>Join course to take quiz</b>
-            <span class="my-0 h4" style="line-height: 1">
-                <span title="Succeed and gain karma" aria-label="Succeed and gain karma" class="badge badge-pill badge-warning text-white font-weight-bold ml-3 px-2 py-1">
-                    + <t t-esc="widget.quiz.quizKarmaGain"/> XP
-                </span>
-            </span>
-        </div>
-        <div t-else="" class="d-flex align-items-center justify-content-between">
-            <div t-att-class="'d-flex align-items-center' + (widget.slide.completed ? ' alert alert-success my-0 py-1 px-3' : '')">
-                <button t-if="! widget.slide.completed" role="button" title="Check answers" aria-label="Check answers"
-                    class="btn btn-primary text-uppercase font-weight-bold o_wslides_js_lesson_quiz_submit">Check your answers</button>
-                <b t-else="" class="my-0 h5">Done !</b>
-                <span class="my-0 h5" style="line-height: 1">
-                    <span role="button" title="Succeed and gain karma" aria-label="Succeed and gain karma" class="badge badge-pill badge-warning text-white font-weight-bold ml-3 px-2">
-                        + <t t-if="! widget.slide.completed" t-esc="widget.quiz.quizKarmaGain"/><t t-else="" t-esc="widget.quiz.quizKarmaWon"/> XP
+        <div id="validation">
+            <div t-if="widget.readonly &amp;&amp; !widget.publicUser &amp;&amp; widget.channel.channelEnroll == 'public'" class="o_wslides_course_join_widget">
+                <!-- Here comes the Join button rendered by the widget -->
+            </div>
+            <div t-if="widget.readonly &amp;&amp; widget.publicUser &amp;&amp; widget.channel.channelEnroll == 'public'" class="alert alert-info d-flex align-items-center justify-content-between">
+                <div>
+                    <b class="h5 mb-0">Sign in and join the course to take the quiz!</b>
+                    <span class="my-0 h4" style="line-height: 1">
+                        <span title="Succeed and gain karma" aria-label="Succeed and gain karma" class="badge badge-pill badge-warning text-white font-weight-bold ml-3 px-2 py-1">
+                            + <t t-esc="widget.quiz.quizKarmaGain"/> XP
+                        </span>
+                    </span>
+                </div>
+                <div>
+                    <a t-att-href="'/web/login?redirect=' + widget.redirectURL" class="btn btn-primary font-weight-bold text-uppercase">Sign in</a>
+                    <span t-if="widget.channel.signupAllowed" class="d-block mt-2">Don't have an account ? <a class="font-weight-bold" t-att-href="'/web/signup?redirect=' + widget.url">Sign Up !</a></span>
+                </div>
+            </div>
+            <div t-if="widget.readonly &amp;&amp; widget.channel.channelEnroll == 'invite'" class="alert alert-info">
+                <b>This course is private. <a href="/contactus" class="font-weight-bold">Contact the website administrator</a>  to enroll.</b>
+            </div>
+            <div t-if="!widget.readonly" class="d-flex align-items-center justify-content-between">
+                <div t-att-class="'d-flex align-items-center' + (widget.slide.completed ? ' alert alert-success my-0 py-1 px-3' : '')">
+                    <button t-if="! widget.slide.completed" role="button" title="Check answers" aria-label="Check answers"
+                        class="btn btn-primary text-uppercase font-weight-bold o_wslides_js_lesson_quiz_submit">Check your answers</button>
+                    <b t-else="" class="my-0 h5">Done !</b>
+                    <span class="my-0 h5" style="line-height: 1">
+                        <span role="button" title="Succeed and gain karma" aria-label="Succeed and gain karma" class="badge badge-pill badge-warning text-white font-weight-bold ml-3 px-2">
+                            + <t t-if="!widget.slide.completed" t-esc="widget.quiz.quizKarmaGain"/><t t-else="" t-esc="widget.quiz.quizKarmaWon"/> XP
+                        </span>
                     </span>
-                </span>
+                </div>
+                <button t-if="widget.slide.completed &amp;&amp; widget.slide.hasNext" class="btn btn-primary o_wslides_quiz_continue">
+                    Continue <i class="fa fa-chevron-right ml-1"/>
+                </button>
             </div>
-            <button t-if="widget.slide.completed &amp;&amp; widget.slide.hasNext" class="btn btn-primary o_wslides_quiz_continue">
-                Continue <i class="fa fa-chevron-right ml-1"/>
-            </button>
         </div>
     </t>