diff --git a/addons/website_slides/controllers/main.py b/addons/website_slides/controllers/main.py
index 7ab6b6052d7497e1c4970c91ee6962e77cb21cab..01f52fb536adbb42acf91b75730d85b7225fc054 100644
--- a/addons/website_slides/controllers/main.py
+++ b/addons/website_slides/controllers/main.py
@@ -65,20 +65,20 @@ class WebsiteSlides(WebsiteProfile):
'user_progress': {}
}
if slide.channel_id.channel_type == "training":
- channel_slides = slide.channel_id.slide_ids.ids
- slide_index = channel_slides.index(slide.id)
- previous_slide = None
- next_slide = None
- if slide_index > 0:
- previous_slide = slide.channel_id.slide_ids[slide_index-1]
- if slide_index < len(channel_slides) - 1:
- next_slide = slide.channel_id.slide_ids[slide_index+1]
+ channel_slides_ids = slide.channel_id.slide_ids.ids
+ slide_index = channel_slides_ids.index(slide.id)
+ previous_slide = slide.channel_id.slide_ids[slide_index-1] if slide_index > 0 else None
+ next_slide = slide.channel_id.slide_ids[slide_index+1] if slide_index < len(channel_slides_ids) - 1 else None
values.update({
'previous_slide': slug(previous_slide) if previous_slide else "",
'next_slide': slug(next_slide) if next_slide else ""
})
return values
+ def _get_quiz_points(self, slide, attempt_count):
+ possible_points = [slide.quiz_first_attempt_reward,slide.quiz_second_attempt_reward,slide.quiz_third_attempt_reward, slide.quiz_fourth_attempt_reward]
+ return possible_points[attempt_count] if attempt_count < len(possible_points) else possible_points[-1]
+
def _get_user_progress(self, channel):
user_progress = { slide_partner.slide_id.id: slide_partner for slide_partner in request.env['slide.slide.partner'].sudo().search([('channel_id', '=', channel.id),('partner_id', '=', request.env.user.partner_id.id)])}
return {
@@ -489,32 +489,35 @@ class WebsiteSlides(WebsiteProfile):
good_answers = request.env['slide.answer'].search([('id', 'in', answer_ids), ('is_correct', '=', True)])
bad_answers = request.env['slide.answer'].browse(answer_ids) - good_answers
slide_partner = request.env['slide.slide.partner'].search([('slide_id', '=', slide_id), ('partner_id', '=', request.env.user.partner_id.id)])
- possible_points = [slide.quiz_first_attempt_reward, slide.quiz_second_attempt_reward, slide.quiz_third_attempt_reward, slide.quiz_fourth_attempt_reward]
points = 0
if not slide_partner:
- slide_partner = request.env['slide.slide.partner'].sudo().create({
- "slide_id": slide.id,
- "partner_id": request.env.user.partner_id.id,
- "channel_id": slide.channel_id.id,
- "completed": False
- })
+ slide.action_set_viewed()
if not slide_partner.completed:
- if slide_partner.quiz_attempts_count < len(possible_points):
- points = possible_points[slide_partner.quiz_attempts_count]
- else:
- points = possible_points[-1]
+ points = self._get_quiz_points(slide, slide_partner.quiz_attempts_count)
slide_partner.sudo().write({
'quiz_attempts_count': slide_partner.quiz_attempts_count if not bad_answers else slide_partner.quiz_attempts_count + 1,
'points_won': points if not bad_answers else 0,
'completed': not bad_answers
})
+ user = {}
+ if not bad_answers:
+ request.env.user.sudo().add_karma(points)
+ lower_bound = request.env.user.rank_id.karma_min
+ upper_bound = request.env.user.next_rank_id.karma_min
+ user= {
+ 'lower_bound': lower_bound,
+ 'upper_bound': upper_bound,
+ 'karma': request.env.user.karma,
+ 'progress_bar_percentage': 100 * ((request.env.user.karma - lower_bound) / (upper_bound - lower_bound))
+ }
return {
'goodAnswers': [good_answer.id for good_answer in good_answers],
'badAnswers': [bad_answer.id for bad_answer in bad_answers],
'passed': not bad_answers,
'points': points if not bad_answers else 0,
'attempts_count': slide_partner.quiz_attempts_count if slide_partner else 0,
- 'channel_completion': slide.channel_id.completion
+ 'channel_completion': slide.channel_id.completion,
+ 'user': user
}
return {
'error': "You already passed this quiz"
@@ -568,6 +571,7 @@ class WebsiteSlides(WebsiteProfile):
@http.route(['/slides/channel/enroll'], type='http', auth='public', website=True)
def slide_channel_join_http(self, channel_id):
+ # TDE FIXME: why 2 routes ?
if not request.website.is_public_user():
channel = request.env['slide.channel'].browse(int(channel_id))
channel.action_add_member()
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 5114c091c64f65027c40101249fc837087eae729..4141c5dc6e8a33eceea6b866e9b88909451f9ff0 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
@@ -1,4 +1,4 @@
-var onYouTubeIframeAPIReady;
+var onYouTubeIframeAPIReady = undefined;
odoo.define('website_slides.fullscreen', function (require) {
'use strict';
@@ -22,8 +22,7 @@ odoo.define('website_slides.fullscreen', function (require) {
* @param {Object} el
* @param {Object} data holding channelId and optionally upload and publish control parameters
*/
- init: function(el, course_id,slide_id, user_id){
- this._super.apply(this,arguments);
+ init: function (el, course_id,slide_id, user_id){
this.courseID = parseInt(course_id, 10);
this.slideID = parseInt(slide_id, 10);
this.userID = parseInt(user_id, 10);
@@ -39,15 +38,14 @@ odoo.define('website_slides.fullscreen', function (require) {
this.goToQuiz = false;
this.answeredQuestions = [];
this.slideTitle = undefined;
+ return this._super.apply(this,arguments);
},
- start: function(){
- var self = this;
+ start: function (){
this.url = window.location.pathname;
this.urlToSmallScreen = this.url.replace('/fullscreen','');
this._getSlides();
this._renderPlayer();
this._bindListEvents();
-
$(document).keydown(this._onKeyDown.bind(this));
return this._super.apply(this, arguments);
},
@@ -58,18 +56,18 @@ odoo.define('website_slides.fullscreen', function (require) {
* @private
* Renders the player accordingly to the current slide
*/
- _renderPlayer: function(){
+ _renderPlayer: function (){
var self = this;
var embed_url;
- if(self.slide.slide_type !== 'webpage' || self.slide.htmlContent){
- if((self.slide.slide_type == "quiz" || self.slide.hasQuiz) && !self.slide.quiz){
+ if (self.slide.slide_type !== 'webpage' || self.slide.htmlContent){
+ if ((self.slide.slide_type === "quiz" || self.slide.has_quiz) && !self.slide.quiz){
self._fetchQuiz();
} else {
embed_url = $(this.slide.embed_code).attr('src');
if (self.slide.slide_type === "video"){
embed_url = "https://" + embed_url + "&rel=0&autoplay=1&enablejsapi=1&origin=" + window.location.origin;
}
- $('.o_wslides_fullscreen_player').html(QWeb.render('website.slides.fullscreen', {
+ $('.o_wslides_fs_player').html(QWeb.render('website.slides.fullscreen', {
slide: self.slide,
nextSlide: self.nextSlide,
questions: self.slide.quiz ? self.slide.quiz.questions: '',
@@ -79,13 +77,13 @@ odoo.define('website_slides.fullscreen', function (require) {
letters: self.slide.quiz ? self.letters : '',
showMiniQuiz: self.goToQuiz
}));
- if(self.slide.slide_type === "video"){
+ if (self.slide.slide_type === "video"){
self._renderYoutubeIframe();
}
- if(self.slide.slide_type == 'webpage'){
+ if (self.slide.slide_type === 'webpage'){
self._renderWebpage();
}
- if((self.slide.slide_type == "presentation" || self.slide.slide_type == "document" || self.slide.slide_type == "infographic" || self.slide.slide_type == "webpage") && !self.slide.quiz){
+ if ((self.slide.slide_type === "presentation" || self.slide.slide_type === "document" || self.slide.slide_type === "infographic" || self.slide.slide_type === "webpage") && !self.slide.quiz){
self._setSlideStateAsDone();
}
if ((self.slide.quiz && self.slide.slide_type === "quiz") || self.goToQuiz){
@@ -97,40 +95,40 @@ odoo.define('website_slides.fullscreen', function (require) {
}
self._renderTitle();
},
- _renderYoutubeIframe: function(){
+ _renderYoutubeIframe: function (){
var self = this;
/**
* Due to issues of synchronization between the youtube api script and the widget's instanciation.
*/
- try{
+ try {
self._setupYoutubePlayer();
}
- catch {
- onYouTubeIframeAPIReady = function(){
+ catch (error) {
+ onYouTubeIframeAPIReady = function (){
var self = this;
self._setupYoutubePlayer();
- }.bind(this)
+ }.bind(this);
}
},
- _renderWebpage: function(){
+ _renderWebpage: function (){
var self = this;
- $(self.slide.htmlContent).appendTo('.o_wslides_fullscreen_webpage_content');
+ $(self.slide.htmlContent).appendTo('.o_wslides_fs_webpage_content');
},
- _renderQuiz: function(){
+ _renderQuiz: function (){
var self = this;
- var Quiz = new QuizWidget(this, self.slide);
- Quiz.appendTo('.o_wslides_fullscreen_player');
- $('.next-slide').click(function(){
+ var Quiz = new QuizWidget(this, self.slide, self.nextSlide);
+ Quiz.appendTo('.o_wslides_fs_player');
+ $('.next-slide').click(function (){
self._goToNextSlide();
- })
- $('.back-to-video').click(function(){
+ });
+ $('.back-to-video').click(function (){
self.goToQuiz = false;
self._renderPlayer();
});
},
- _renderTitle: function(){
+ _renderTitle: function (){
var self = this;
- $('.o_wslides_fullscreen_slide_title').empty().html(QWeb.render('website.course.fullscreen.title', {
+ $('.o_wslides_fs_slide_title').empty().html(QWeb.render('website.course.fullscreen.title', {
slide: self.slide,
miniQuiz: self.goToQuiz
}));
@@ -139,7 +137,7 @@ odoo.define('website_slides.fullscreen', function (require) {
* @private
* Links the youtube api to the iframe present in the template
*/
- _setupYoutubePlayer: function(){
+ _setupYoutubePlayer: function (){
var self = this;
self.player = new YT.Player('youtube-player', {
host: 'https://www.youtube.com',
@@ -159,18 +157,18 @@ odoo.define('website_slides.fullscreen', function (require) {
* Once the user reaches a particular time in the video, the slide will be considered as completed if the video doesn't have a mini-quiz.
* This method also allows to automatically go to the next slide (or the quiz associated to the current video) once the video is over
*/
- _onPlayerStateChange: function(event){
+ _onPlayerStateChange: function (event){
var self = this;
var tid;
clearInterval(self.tid);
- if (event.data == YT.PlayerState.PLAYING && !self.slide.done) {
- self.tid = setInterval(function(){
- if(event.target.getCurrentTime){
+ if (event.data === YT.PlayerState.PLAYING && !self.slide.done) {
+ self.tid = setInterval(function (){
+ if (event.target.getCurrentTime){
var currentTime = event.target.getCurrentTime();
var totalTime = event.target.getDuration();
- if(totalTime && currentTime > totalTime - 30){
+ if (totalTime && currentTime > totalTime - 30){
clearInterval(self.tid);
- if(!self.slide.hasQuiz && !self.slide.done){
+ if (!self.slide.has_quiz && !self.slide.done){
self.slide.done = true;
self._setSlideStateAsDone();
}
@@ -178,7 +176,7 @@ odoo.define('website_slides.fullscreen', function (require) {
}
}, 1000);
}
- if(event.data == YT.PlayerState.ENDED){
+ if (event.data === YT.PlayerState.ENDED){
self.player = undefined;
self._goToNextSlide();
}
@@ -187,21 +185,12 @@ odoo.define('website_slides.fullscreen', function (require) {
* @private
* Creates slides objects from every slide-list-cells attributes
*/
- _getSlides: function(){
+ _getSlides: function (){
var self = this;
- var slides = $('.o_wslides_fullscreen_sidebar_slide_tab');
- for(var i = 0; i < slides.length;i++){
+ var slides = $('.o_wslides_fs_sidebar_slide_tab');
+ for (var i = 0; i < slides.length;i++){
var slide = $(slides[i]);
- self.slides.push({
- id: parseInt(slide.attr('slide_id'), 10),
- name: slide.attr('slide_name'),
- embed_code: slide.attr('slide_embed_code'),
- slide_type: slide.attr('slide_type'),
- done: slide.attr('done'),
- hasQuiz: slide.attr('quiz'),
- slug: slide.attr('slide_slug'),
- htmlContent: undefined
- });
+ self.slides.push(slide.data());
this._getActiveSlide();
}
},
@@ -210,77 +199,77 @@ odoo.define('website_slides.fullscreen', function (require) {
* @param {object} slide
* Fetch the quiz for a particular slide
*/
- _fetchQuiz: function(){
+ _fetchQuiz: function (){
var self = this;
self._rpc({
route:"/slide/quiz/get",
params: {
'slide_id': self.slide.id
}
- }).then(function(data){
- if(data){
+ }).then(function (data){
+ if (data){
self.slide.quiz = data;
self._renderPlayer();
}
- })
+ });
},
- _fetchHtmlContent: function(){
+ _fetchHtmlContent: function (){
var self = this;
self._rpc({
route:"/slide/html_content/get",
params: {
'slide_id': self.slide.id
}
- }).then(function(data){
+ }).then(function (data){
if (data.html_content) {
self.slide.htmlContent = data.html_content;
self._renderPlayer();
}
- })
+ });
},
/**
* @private
* Once the completion conditions are filled,
* sends a json request to the backend to set the relation between the slide and the user as being completed
*/
- _setSlideStateAsDone: function(){
+ _setSlideStateAsDone: function (){
var self = this;
self._rpc({
route: '/slides/set_completed',
params: {
slide_id: self.slide.id,
}
- }).then(function(data){
- $('#check-'+self.slide.id).replaceWith($('<i class="check-done o_wslides_slide_completed fa fa-check-circle"></i>'))
+ }).then(function (data){
+ $('#check-'+self.slide.id).replaceWith($('<i class="check-done o_wslides_slide_completed fa fa-check-circle"></i>'));
self.slide.done = true;
clearInterval(self.tid);
self.channelCompletion = data.channel_completion;
self._updateProgressbar();
});
},
- _updateProgressbar: function(){
+ _updateProgressbar: function (){
var self = this;
var completion = self.channelCompletion <= 100 ? self.channelCompletion : 100;
- $('.o_wslides_fullscreen_sidebar_progress_gauge').css('width', completion + "%" );
+ $('.o_wslides_fs_sidebar_progress_gauge').css('width', completion + "%" );
$('.o_wslides_progress_percentage').text(completion);
},
/**
* @private
* Creates an array of letters to be used in the quiz with a foreach
*/
- _generateQuizLetters: function(){
+ _generateQuizLetters: function (){
var letters = [];
- for(var i = 65; i < 91; i++){
+ for (var i = 65; i < 91; i++){
letters.push(String.fromCharCode(i));
}
return letters;
},
- _goToNextSlide: function(){
+ _goToNextSlide: function (){
var self = this;
clearInterval(self.tid);
self.player = undefined;
- self.goToQuiz = self.slide.hasQuiz && !self.goToQuiz;
- if(self.nextSlide && !self.goToQuiz){
+ self.goToQuiz = self.slide.has_quiz && !self.goToQuiz && self.slide.slide_type !== 'quiz';
+ if (self.nextSlide && !self.goToQuiz){
self.slide = self.nextSlide;
self.index++;
self._setActiveTab();
@@ -289,16 +278,16 @@ odoo.define('website_slides.fullscreen', function (require) {
self._updateUrl();
history.pushState(null,'',self.url);
}
- else if(self.nextSlide){
+ else if (self.nextSlide){
self._renderPlayer();
}
},
- _goToPreviousSlide: function(){
+ _goToPreviousSlide: function (){
var self = this;
clearInterval(self.tid);
self.goToQuiz = false;
self.player = undefined;
- if(self.previousSlide){
+ if (self.previousSlide){
self.slide = self.previousSlide;
self.index--;
self._setActiveTab();
@@ -308,7 +297,7 @@ odoo.define('website_slides.fullscreen', function (require) {
history.pushState(null,'',self.url);
}
},
- _setPreviousAndNextSlides: function(){
+ _setPreviousAndNextSlides: function (){
var self = this;
self.previousSlide = self.index > 0 ? self.slides[self.index-1] : undefined;
self.nextSlide = self.index < (self.slides.length - 1) ? self.slides[self.index+1] : undefined;
@@ -317,7 +306,7 @@ odoo.define('website_slides.fullscreen', function (require) {
* Changes the url whenever the user changes slides.
* This allows the user to refresh the page and stay at the right video
*/
- _updateUrl: function(){
+ _updateUrl: function (){
var self = this;
var url = window.location.pathname.split('/');
url[url.length-1] = self.slide.slug;
@@ -330,21 +319,21 @@ odoo.define('website_slides.fullscreen', function (require) {
/**
* Whenever the user changes slide, change the active tab
*/
- _setActiveTab: function(){
+ _setActiveTab: function (){
var self = this;
self.activeTab.removeClass('active');
$('li.active').removeClass('active');
$('li[slide_id='+self.slide.id+']').addClass('active');
- self.activeTab = $('.o_wslides_fullscreen_sidebar_slide_tab[index="'+self.index+'"]')
+ self.activeTab = $('.o_wslides_fs_sidebar_slide_tab[index="'+self.index+'"]');
self.activeTab.addClass('active');
},
/**
* The first time the user gets on the player,
* get the slide that is represented by the active tab in the sidebar
*/
- _getActiveSlide: function(){
+ _getActiveSlide: function (){
var self = this;
- self.activeTab = $('.o_wslides_fullscreen_sidebar_slide_tab.active');
+ self.activeTab = $('.o_wslides_fs_sidebar_slide_tab.active');
self.index = parseInt(self.activeTab.attr('index'), 10);
self.slide = self.slides[self.index];
self._setPreviousAndNextSlides();
@@ -352,13 +341,13 @@ odoo.define('website_slides.fullscreen', function (require) {
//--------------------------------------------------------------------------
// Handlers
//--------------------------------------------------------------------------
- _onListCellClick: function(ev){
+ _onListCellClick: function (ev){
var self = this;
clearInterval(self.tid);
self.player = undefined;
var target = $(ev.currentTarget);
self.goToQuiz = false;
- if(target[0] !== self.activeTab[0]){
+ if (target[0] !== self.activeTab[0]){
self.activeTab.removeClass('active');
target.addClass('active');
self.index = parseInt(target.attr('index'));
@@ -371,7 +360,13 @@ odoo.define('website_slides.fullscreen', function (require) {
history.pushState(null,'',self.url);
}
},
- _onMiniQuizClick: function(ev){
+ _sidebarToggle: function (ev){
+ ev.preventDefault();
+ $(ev.currentTarget).toggleClass('active');
+ $('.o_wslides_fs_sidebar').toggleClass('o_wslides_fs_sidebar_hidden');
+ $('.o_wslides_fs_player').toggleClass('o_wslides_fs_player_no_sidebar');
+ },
+ _onMiniQuizClick: function (ev){
var self = this;
self.index = parseInt($(ev.currentTarget).attr('index'));
self.slide = self.slides[self.index];
@@ -386,19 +381,21 @@ odoo.define('website_slides.fullscreen', function (require) {
* @private
* Binds events related to the list
*/
- _bindListEvents: function(){
+ _bindListEvents: function (){
var self = this;
- $('.o_wslides_fullscreen_sidebar_slide_tab').each(function () {
+ $('.o_wslides_fs_sidebar_slide_tab').each(function () {
$(this).click(self._onListCellClick.bind(self));
});
-
- $('.o_wslides_slide_quiz ').each(function(){
+ $('.o_wslides_fs_slide_quiz ').each(function (){
$(this).click(self._onMiniQuizClick.bind(self));
- })
+ });
+ $('.o_wslides_fs_toggle_sidebar').click(function (ev){
+ self._sidebarToggle(ev);
+ });
},
- _onKeyDown: function(ev){
+ _onKeyDown: function (ev){
var self = this;
- switch(ev.key){
+ switch (ev.key){
case "ArrowRight":
self._goToNextSlide();
break;
@@ -407,21 +404,22 @@ odoo.define('website_slides.fullscreen', function (require) {
break;
}
},
- })
+ });
sAnimations.registry.websiteSlidesFullscreenPlayer = Widget.extend({
- selector: '.oe_js_course_slide',
+ selector: '.o_wslides_fs_main',
xmlDependencies: ['/website_slides/static/src/xml/website_slides_fullscreen.xml'],
- init: function(el){
+ init: function (el){
this._super.apply(this, arguments);
},
- start: function(){
- this._super.apply(this, arguments);
+ start: function (){
+ var defs = [this._super.apply(this, arguments)];
var user_id = this.$el.attr('user_id');
var course_id = this.$el.attr('course_id');
var slide_id = this.$el.attr('slide_id');
var fullscreen = new Fullscreen(this, course_id, slide_id, user_id);
- fullscreen.appendTo(".oe_js_course_slide");
+ defs.push(fullscreen.attachTo(this.$el));
+ return $.when.apply($, defs);
}
});
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 f98d5b3ed8abda5853d99c3e69b8fe1520d1038a..dd921d5a17f9066e7674d6d0c142cf7873838a97 100644
--- a/addons/website_slides/static/src/js/slides_course_quiz.js
+++ b/addons/website_slides/static/src/js/slides_course_quiz.js
@@ -13,39 +13,41 @@ odoo.define('website_slides.quiz', function (require) {
* @param {Object} data holding all the slide elements needed for the quiz
* It will either come from the fullscreen widget or the sAnimation at the end of this file
*/
- init: function(el, data){
+ init: function (el, data, nextSlide){
this.slide = data;
+ this.nextSlide = nextSlide;
this.answeredQuestions = [];
this.fullscreen = el;
return this._super.apply(this,arguments);
},
- start: function(){
+ start: function (){
var self = this;
self._bindQuizEvents();
/**
* If the quiz is rendered by the server instead of the fullscreen widget,
* questions and their answers will have to be created manually from attributes
*/
- if(self.slide.quiz.questions.length === 0){
+ if (self.slide.quiz.questions.length === 0){
this._setQuestions();
}
return this._super.apply(this, arguments);
},
- _renderSuccessModal: function(){
+ _renderSuccessModal: function (data){
var self =this;
- $('.o_wslides_fullscreen_quiz').append(QWeb.render('website.course.quiz.success', {
- data: data
+ $('.o_wslides_fs_quiz').append(QWeb.render('website.course.quiz.success', {
+ data: data,
+ nextSlide: self.nextSlide
}));
$('.submit-quiz').remove();
$('.next-slide').css('display', 'inline-block');
- $('.next-slide').click(function(){
+ $('.next-slide').click(function (){
self.fullscreen._goToNextSlide();
});
- $('.o_wslides_quiz_success_modal_close').click(function(){
+ $('.o_wslides_quiz_success_modal_close').click(function (){
$('.o_wslides_quiz_success_modal').remove();
$('.o_wslides_quiz_modal_background').remove();
});
- $(".o_wslides_quiz_modal_background").click(function(ev){
+ $(".o_wslides_quiz_modal_background").click(function (ev){
$(ev.currentTarget).remove();
$('.o_wslides_quiz_success_modal').remove();
});
@@ -58,21 +60,20 @@ odoo.define('website_slides.quiz', function (require) {
* In case the quiz is rendered by the server and the data don't come from the fullscreen widget,
* questions and their answers will have to be set here by using attributes
*/
- _setQuestions: function(){
+ _setQuestions: function (){
var self = this;
- $('.o_wslides_quiz_question').each(function(){
+ $('.o_wslides_quiz_question').each(function (){
self.slide.quiz.questions.push({
id: parseInt($(this).attr('id')),
title: $(this).attr('title'),
answers: []
});
- })
- for(var i = 0; i < self.slide.quiz.questions.length; i++){
+ });
+ for (var i = 0; i < self.slide.quiz.questions.length; i++){
self._setAnswersForQuestion(self.slide.quiz.questions[i]);
}
},
_setAnswersForQuestion: function (question){
- var self = this;
$('.o_wslides_quiz_answer[question_id='+question.id+']').each(function (){
question.answers.push({
id: parseInt($(this).attr('id')),
@@ -84,13 +85,13 @@ odoo.define('website_slides.quiz', function (require) {
_updateProgressbar: function (){
var self = this;
var completion = self.channelCompletion <= 100 ? self.channelCompletion : 100;
- $('.o_wslides_fullscreen_sidebar_progress_gauge').css('width', completion + "%" );
+ $('.o_wslides_fs_sidebar_progress_gauge').css('width', completion + "%" );
$('.o_wslides_progress_percentage').text(completion);
},
_bindQuizEvents: function (){
var self = this;
if (!self.slide.done){
- $('.o_wslides_quiz_answer').each(function(){
+ $('.o_wslides_quiz_answer').each(function (){
$(this).click(self._onAnswerClick.bind(self));
});
}
@@ -105,10 +106,10 @@ odoo.define('website_slides.quiz', function (require) {
var questionID =$('#answer'+ answers.goodAnswers[i] +' .o_wslides_quiz_radio_box input').attr('question_id');
self.answeredQuestions.push(questionID);
$('.o_wslides_quiz_answer[question_id='+questionID+']:not(.o_wslides_quiz_good_answer)').addClass('o_wslides_quiz_ignored_answer');
- $('.o_wslides_quiz_answer[question_id='+questionID+']').each(function(){
- $(this).unbind('click')
+ $('.o_wslides_quiz_answer[question_id='+questionID+']').each(function (){
+ $(this).unbind('click');
});
- $('input[question_id='+questionID+']').each(function(){
+ $('input[question_id='+questionID+']').each(function (){
$(this).prop('disabled',true);
});
}
@@ -149,7 +150,7 @@ odoo.define('website_slides.quiz', function (require) {
answer_ids: values,
quiz_id: self.slide.quiz_id
}
- }).then(function(data){
+ }).then(function (data){
self._highlightAnswers(data);
self.slide.quiz.nb_attempts = data.attempts_count;
if (data.passed){
@@ -157,14 +158,15 @@ odoo.define('website_slides.quiz', function (require) {
self._updateProgressbar();
$('#check-'+self.slide.id).replaceWith($('<i class="check-done o_wslides_slide_completed fa fa-check-circle"></i>'));
self.slide.done = true;
- self._renderSuccessModal();
+ self._renderSuccessModal(data);
}
else {
- $('#quiz-points').text(self.slide.quiz.nb_attempts < 3 ? self.slide.quiz.possible_rewards[self.slide.quiz.nb_attempts] : self.slide.quiz.possible_rewards[self.slide.quiz.possible_rewards.length-1]);
+ var points = self.slide.quiz.nb_attempts < self.slide.quiz.possible_rewards.length ? self.slide.quiz.possible_rewards[self.slide.quiz.nb_attempts] : self.slide.quiz.possible_rewards[self.slide.quiz.possible_rewards.length-1];
+ $('#quiz-points').text(points);
}
});
} else {
- $('.o_wslides_fullscreen_player').append($('<p class="quiz-danger text-danger mt-1">All questions must be answered !</p>'));
+ $('#quiz_buttons').append($('<p class="quiz-danger text-danger mt-1">All questions must be answered !</p>'));
}
},
});
@@ -184,7 +186,7 @@ odoo.define('website_slides.quiz', function (require) {
var secondAttemptReward = this.$el.attr('second_reward');
var thirdAttemptReward = this.$el.attr('third_reward');
var fourthAttemptReward = this.$el.attr('fourth_reward');
- var possibleRewards = [firstAttemptReward,secondAttemptReward,thirdAttemptReward,fourthAttemptReward]
+ var possibleRewards = [firstAttemptReward,secondAttemptReward,thirdAttemptReward,fourthAttemptReward];
var data = {
id: slideID,
done: slideDone,
@@ -194,8 +196,8 @@ odoo.define('website_slides.quiz', function (require) {
possible_rewards: possibleRewards,
reward: nbAttempts < possibleRewards.length ? possibleRewards[nbAttempts] : possibleRewards[possibleRewards.length-1]
}
- }
- if(!slideDone){
+ };
+ if (!slideDone){
var NewQuiz = new Quiz(this, data);
NewQuiz.appendTo(".o_w_slides_quiz_no_fullscreen");
}
diff --git a/addons/website_slides/static/src/js/slides_course_sidebar_list.js b/addons/website_slides/static/src/js/slides_course_sidebar_list.js
deleted file mode 100644
index 11b61d4e5ec6ea0855d34c6c712b5adf2ec698f0..0000000000000000000000000000000000000000
--- a/addons/website_slides/static/src/js/slides_course_sidebar_list.js
+++ /dev/null
@@ -1,34 +0,0 @@
-odoo.define('website_slides.sidebar', function (require) {
- 'use strict';
- var sAnimations = require('website.content.snippets.animation');
- var core = require('web.core');
- var Widget = require('web.Widget');
-
- var SideBar = Widget.extend({
- init: function (el){
- this._super.apply(this,arguments);
- },
- start: function (){
- $('.o_wslides_fullscreen_toggle_sidebar').click(function (ev){
- ev.preventDefault();
- $(ev.currentTarget).toggleClass('active');
- $('.o_wslides_fullscreen_sidebar').toggleClass('o_wslides_fullscreen_sidebar_hidden');
- $('.o_wslides_fullscreen_player').toggleClass('o_wslides_fullscreen_player_no_sidebar')
- })
- return this._super.apply(this, arguments);
- },
- });
-
- sAnimations.registry.websiteSlidesSidebarList = Widget.extend({
- selector: '.o_wslides_fullscreen_toggle_sidebar',
- // xmlDependencies: ['/website_slides/static/src/xml/website_slides.xml'],
- init: function (el){
- this._super.apply(this, arguments);
- },
- start: function (){
- this._super.apply(this, arguments);
- var sideBar = new SideBar(this);
- sideBar.appendTo(".oe_js_side_bar_list");
- }
- });
-});
\ No newline at end of file
diff --git a/addons/website_slides/static/src/js/slides_course_slides_list.js b/addons/website_slides/static/src/js/slides_course_slides_list.js
index bf634f542e3bd3cbffd58a935de3425d2cf0b727..c71eed1cb0401e173a5d9e28a070b35c48b74749 100644
--- a/addons/website_slides/static/src/js/slides_course_slides_list.js
+++ b/addons/website_slides/static/src/js/slides_course_slides_list.js
@@ -48,8 +48,8 @@ odoo.define('website_slides.slideslist', function (require) {
},
_getSlides: function (){
var self = this;
- var slides = $('li.content-slide');
- for(var i = 0; i < slides.length;i++){
+ var slides = $('li.o_wsldies_content_slide');
+ for (var i = 0; i < slides.length;i++){
var slide = $(slides[i]);
self.slides.push({
id: parseInt(slide.attr('slide_id')),
@@ -75,12 +75,12 @@ odoo.define('website_slides.slideslist', function (require) {
}
self.dropTarget = $(ev.currentTarget);
self.draggedElement[0].parentNode.removeChild(self.draggedElement[0]);
- $('ul[category_id='+target.attr('category_id')+']').append(self.draggedElement)
+ $('ul[category_id='+target.attr('category_id')+']').append(self.draggedElement);
self._addSlideDragAndDropHandlers(self.draggedElement);
self._reorderSlides();
});
target.on('dragover', function (ev){
- if(ev.preventDefault){
+ if (ev.preventDefault){
ev.preventDefault();
}
});
@@ -88,7 +88,7 @@ odoo.define('website_slides.slideslist', function (require) {
_addSlideDragAndDropHandlers: function (target){
var self = this;
target.on('dragstart', function (ev){
- $('.section-draggable').removeClass('hold')
+ $('.section-draggable').removeClass('hold');
self._unbind('section-draggable');
ev.originalEvent.dataTransfer.effectAllowed = 'move';
ev.originalEvent.dataTransfer.setData('text/html', this.outerHTML);
@@ -136,7 +136,7 @@ odoo.define('website_slides.slideslist', function (require) {
target.removeClass('hold');
});
},
- _addSectionDragAndDropHandlers: function(target){
+ _addSectionDragAndDropHandlers: function (target){
var self = this;
target.on('dragstart', function (ev){
self._unbind('slide-draggable');
@@ -161,14 +161,14 @@ odoo.define('website_slides.slideslist', function (require) {
target.removeClass('slide-hovered');
});
target.on('drop', function (ev){
- if(ev.preventDefault){
+ if (ev.preventDefault){
ev.preventDefault();
}
- if(self.draggedElement.hasClass('section-draggable') && target.hasClass('section-draggable')){
+ if (self.draggedElement.hasClass('section-draggable') && target.hasClass('section-draggable')){
target.removeClass('slide-hovered');
target.removeClass('hold');
self.dropTarget = $(ev.currentTarget);
- if(target !== self.draggedElement && $(ev.currentTarget).hasClass('section-draggable')){
+ if (target !== self.draggedElement && $(ev.currentTarget).hasClass('section-draggable')){
self.draggedElement[0].parentNode.removeChild(self.draggedElement[0]);
var dropHTML = ev.originalEvent.dataTransfer.getData('text/html');
target[0].insertAdjacentHTML('beforebegin',dropHTML);
@@ -203,16 +203,16 @@ odoo.define('website_slides.slideslist', function (require) {
});
},
_resetCategoriesIndex: function (){
- var categoriesIndexes = $('.section-index')
+ var categoriesIndexes = $('.section-index');
for (var i = 0; i < categoriesIndexes.length; i++){
- $(categoriesIndexes[i]).text(i+1)
+ $(categoriesIndexes[i]).text(i+1);
}
},
- _reorderSlides: function(){
+ _reorderSlides: function (){
var self = this;
// In case the slide was transfered to another section
if (self.draggedElement.hasClass('slide-draggable')){
- self.draggedElement.attr('category_id', parseInt(self.dropTarget.attr('category_id')))
+ self.draggedElement.attr('category_id', parseInt(self.dropTarget.attr('category_id')));
}
self.slides = [];
self._getSlides();
@@ -221,20 +221,20 @@ odoo.define('website_slides.slideslist', function (require) {
params: {
slides_data: self.slides
}
- }).then(function(){
+ }).then(function (){
});
},
- _rebindUploadButton: function(categoryID){
+ _rebindUploadButton: function (categoryID){
var self = this;
- this.$('.oe_slide_js_upload[data-category-id='+categoryID+']').click(function(ev){
+ this.$('.oe_slide_js_upload[data-category-id='+categoryID+']').click(function (ev){
ev.preventDefault();
var data = $(ev.currentTarget).data();
var dialog = new SlideUpload.SlideUploadDialog(self, data);
dialog.appendTo(document.body);
dialog.open();
- })
+ });
}
- })
+ });
sAnimations.registry.websiteSlidesCourseSlidesList = Widget.extend({
selector: '.oe_js_course_slides_list',
diff --git a/addons/website_slides/static/src/js/slides_upload.js b/addons/website_slides/static/src/js/slides_upload.js
index 7b0a2964bf8ad7ec8caacba61e941ff598c27fc2..aa6cc6131c53fcd54bb92fc113599d202ef9677f 100644
--- a/addons/website_slides/static/src/js/slides_upload.js
+++ b/addons/website_slides/static/src/js/slides_upload.js
@@ -30,7 +30,7 @@ var SlideUploadDialog = Dialog.extend({
this._setup();
this.channelID = parseInt(options.channelId, 10);
- this.defaultCategoryID = parseInt(options.categoryId,10)
+ this.defaultCategoryID = parseInt(options.categoryId,10);
this.canUpload = options.canUpload === 'True';
this.canPublish = options.canPublish === 'True';
@@ -213,7 +213,7 @@ var SlideUploadDialog = Dialog.extend({
result['tag_ids'] = tagValues;
}
// category
- if(!self.defaultCategoryID){
+ if (!self.defaultCategoryID){
var categoryValue = this.$('#category_id').select2('data');
if (categoryValue && categoryValue.create) {
result['category_id'] = [0, {'name': categoryValue.text}];
@@ -311,24 +311,24 @@ var SlideUploadDialog = Dialog.extend({
return values;
},
- _reorderSlidesSequence: function(){
+ _reorderSlidesSequence: function (){
var self = this;
- var slidesElement = $('li.content-slide');
+ var slidesElement = $('li.o_wslides_content_slide');
var slides = [];
- for(var i = 0; i < slidesElement.length;i++){
+ for (var i = 0; i < slidesElement.length;i++){
slides.push({
id: parseInt($(slidesElement[i]).attr('slide_id')),
category_id: parseInt($(slidesElement[i]).attr('category_id')),
sequence: i
- })
+ });
}
self._rpc({
route: '/slides/resequence_slides',
params: {
slides_data: slides
}
- }).then(function(){
- })
+ }).then(function (){
+ });
},
/**
* Init the data relative to the support slide type to upload
@@ -540,9 +540,9 @@ var SlideUploadDialog = Dialog.extend({
self._alertDisplay(data.error);
} else {
//Quick and really dirty fix for reordering issues
- if(data.channel_type == 'training' && self.categoryID){
+ if (data.channel_type === 'training' && self.categoryID){
var categoryElement = $('ul[category_id='+self.categoryID+']');
- $('<li hidden class="content-slide" slide_id="'+data.slide_id+'" category_id="'+self.categoryID+'">temp</li>').appendTo(categoryElement)
+ $('<li hidden class="content-slide" slide_id="'+data.slide_id+'" category_id="'+self.categoryID+'">temp</li>').appendTo(categoryElement);
self._reorderSlidesSequence();
}
window.location = data.url;
@@ -584,7 +584,7 @@ sAnimations.registry.websiteSlidesUpload = sAnimations.Class.extend({
_openDialog: function ($element) {
var data = $element.data();
- var dialog = new SlideUploadDialog(this, data)
+ var dialog = new SlideUploadDialog(this, data);
dialog.appendTo(document.body);
return dialog.open();
},
diff --git a/addons/website_slides/static/src/scss/slide_course.scss b/addons/website_slides/static/src/scss/slide_course.scss
deleted file mode 100644
index 38179498415a662fc984a55a58c188436509c0b3..0000000000000000000000000000000000000000
--- a/addons/website_slides/static/src/scss/slide_course.scss
+++ /dev/null
@@ -1,536 +0,0 @@
-
-.banner{
- position: absolute;
- top: 0;
- left: 0;
- height: 20%;
- background-color: $primary;
- width: 256px;
- opacity: 0;
- color: #fff;
- transition: all .3s ease-out;
- z-index: 2;
- visibility: hidden;
- display: flex;
- justify-content: space-around;
- align-items: center;
- margin-left: 15px;
-}
-
-.banner a {
- font-size: 1.5rem;
- text-align: center;
- padding: 20px;
-}
-
-.banner a:hover{
- cursor: pointer;
-}
-
-.fill {
- display: flex;
- justify-content: center;
- align-items: center;
- overflow: hidden
-}
-.fill img {
- flex-shrink: 0;
- min-width: 100%;
- min-height: 100%
-}
-
-.main_image{
- position: relative
-}
-.main_image:hover{
- .banner{
- opacity: 1;
- visibility: visible;
- }
-
-}
-
-.course-content {
- padding: 0;
-
- ul {
- list-style: none;
- padding: 0
- }
-}
-
-.course-section {
- margin: 0;
- background-color: #ddd;
- display: flex;
- list-style: none;
- font-size: 1.05rem;
- border-bottom: 1px solid #ccc
-}
-
-.content-type {
- width: 30%;
-}
-
-.content-type:hover{
- cursor: pointer;
-}
-
-.course-progress-bar{
- height: 10px;
- width: 80%;
- box-sizing: border-box;
- border-radius: 5px;
- background-color: rgba(0,0,0,.2);
- overflow: hidden;
-
- .progress-gauge{
- height: 100%;
- width: 0;
- background-color: $primary;
-
- transition: all .8s ease-out;
- }
-}
-
-.course-rating{
- color:$primary;
-}
-.course-banner{
- border-bottom: 1px solid $primary;
-}
-
-.content-tab{
- .active {
-
- border: none;
- border-bottom: 1px solid $secondary;
- }
-}
-
-.content-tab a:hover{
- border:none;
- border-bottom: 1px solid $secondary;
-}
-
-.content-container{
- border:none;
-}
-
-.content-slide:nth-child(odd){
- background-color: #f6f6f6;
-}
-
-.content-slide:nth-child(even){
- background-color: #f9f9f9;
-}
-
-.content-slide-controls {
- i:hover{
- color: $primary !important;
- cursor: pointer;
- }
-}
-
-.viewer-container {
- display: flex;
- align-items: stretch;
- height: 500px;
- width: 100%;
- background-color: #ccc;
- justify-content: flex-start;
-}
-
-
-
-.slide-infos {
- margin-top: 1rem;
- display: flex;
- justify-content: space-between;
- align-items: start;
-}
-
-.oe_js_player {
-
-}
-
-.slide-deactivated {
- pointer-events: none;
-}
-
-.slide-draggable {
- user-select: none;
- -khtml-user-drag: element;
- -webkit-user-drag: element;
-}
-
-.slide-hovered{
- margin-top: 10px;
-}
-
-.section-draggable {
- user-select: none;
- -khtml-user-drag: element;
- -webkit-user-drag: element;
-}
-
-.hold{
- border: solid #ccc 4px;
-}
-
-
-.fullscreen {
- position: absolute;
- top: 0;
- right: 0;
- width: 100%;
- z-index: 1000;
- height: 100%;
- margin: 0;
- padding: 0;
-}
-
-
-.sidebar-list{
- position: fixed;
- top: 46px;
- bottom: 0;
- left: 0;
- width: 300px;
- z-index: 2000;
-}
-
-
-
-.sidebar-list-visible {
- left: 50px;
-}
-
-.show-list {
- position: absolute;
- top: 15%;
- left: 50px;
- font-size: 2rem;
- z-index: 10000;
- color: #a0a0a0;
- border: 2px solid #ccc;
- border-radius: 10px;
- padding: 5px 10px;
-}
-
-.hover-background {
- opacity: 0;
- position: absolute;
- top: 0;
- left: 0;
- width: 100%;
- height: 100%;
- z-index: 3000;
-}
-
-.hover-background:hover {
- opacity: 1;
-}
-
-
-.show-list:hover {
- cursor: pointer;
-}
-
-.change-small-screen {
- font-size: 1.5rem;
- z-index: 10000;
- color: #a0a0a0;
-}
-
-.change-small-screen:hover {
- cursor: pointer;
- border-color: $primary;
- color: $primary;
-}
-
-.sidebar-header {
- padding: 10px 15px;
- display: flex;
- justify-content: space-between;
- align-items: center;
- font-size: 1.5rem;
- border-bottom: 1px solid #ccc;
- height: 80px;
-
- a {
- color: black;
- }
-
- a:hover {
- color: $primary;
- }
-
- i:hover{
- color: $primary;
- }
-}
-
-.close-list:hover {
- cursor: pointer;
-}
-
-.fullscreen-btn{
- font-size: 2rem;
- display: inline-block;
- a {
- text-decoration: none;
- color: $text-muted;
- }
-}
-
-.fullscreen-btn:hover{
- cursor: pointer;
-
- a {
- color: $primary;
- }
-}
-
-.sidebar-fullscreen {
- position: relative;
- top: 0;
- left: 0;
- bottom: 0;
- height: auto;
- transform: translateX(-100%);
- width: 0;
-}
-
-.fullscreen-question-container{
- background-color: #fff;
- width: 100%;
- padding-top: 20px;
- overflow: auto;
-}
-
-.fullscreen-question{
- border-radius: 10px;
- padding: 10px 20px;
- box-shadow: 0px 1px 4px rgba(0,0,0,.5);
- margin-top: 50px;
-}
-
-.question-title {
- font-size: 1.5rem;
-}
-
-.buttons-container{
- width: 80%;
- display: flex;
- justify-content: space-between;
- flex-direction: row-reverse;
- margin-top: 40px;
-}
-
-// .slide-resources {
-// border-bottom: 1px solid #ccc;
-// }
-
-.slide-resource {
- padding: 5px 50px;
- width: 100%;
- i{
- margin-right: 10px;
- }
-}
-
-.list-cell {
-}
-
-
-.quiz-header{
- border-bottom: 2px solid #CBCBCB;
- margin-bottom: 50px;
-}
-
-.quiz-header-container{
- display: flex;
- justify-content: space-between;
- align-items: center;
-
- h1 {
- width: 80%;
- white-space: nowrap;
- overflow: hidden;
- text-overflow: ellipsis;
- }
-}
-
-.quiz-good-answer{
- background-color: #C7EAE9;
-}
-
-.quiz-bad-answer{
- background-color: #FEBEBE;
-}
-
-.quiz-bad-answer label.radio-box,
-.quiz-good-answer label.radio-box{
- border: none;
-}
-
-.quiz-bad-answer label.radio-box i{
- background-color: #FD0606;
- color: white;
- height: 100%;
- width: 100%;
- font-size: 1.5rem;
- display: flex;
- justify-content: center;
- align-items: center;
- padding: 50px;
-}
-
-.quiz-ignored-answer {
- color: $text-muted;
-}
-
-
-.quiz-good-answer label.radio-box input:checked + i{
- height: 100%;
- width: 100%;
- background-color: #fff;
- display: flex;
- justify-content: center;
- align-items: center;
- font-size: 2.4rem;
- border: 10px solid $primary;
- border-radius: 50px;
-}
-
-.quiz-answer {
- border-radius: 10px;
- padding: 5px 10px;
- transition: all .2s ease-in-out;
- display: flex;
- align-items: center;
- margin-bottom: 5px;
-}
-
-.quiz-answer:not(.quiz-good-answer,.quiz-bad-answer,.quiz-ignored-answer):hover{
- background-color: #E5E5E5;
- cursor: pointer;
-}
-
-label.radio-box{
- border: 2px solid #CBCBCB;
- background-color: #fff;
- width: 50px;
- height: 50px;
- display: inline-flex;
- border-radius: 50%;
- overflow: hidden;
- justify-content: center;
- align-items: center;
- margin: 0;
- margin-right: 20px;
- font-size: 1.2rem;
- outline: none;
-}
-
-.quiz-answer:not(.quiz-good-answer,.quiz-bad-answer,.quiz-ignored-answer) label.radio-box:hover{
- cursor: pointer;
-}
-
-label.radio-box input{
- display:none;
- outline: none;
- border: none;
-}
-
-
-label.radio-box span{
- color: inherit;
- padding: 20px;
-}
-
-label.radio-box input:checked + span{
- background-color: $primary;
- color: #fff;
-}
-
-label.radio-box input:checked{
- background-color: #C7EAE9;
-}
-
-.quiz-question {
- border-bottom: 2px solid #CBCBCB;
- padding-bottom: 20px;
- margin-bottom: 20px;
-}
-
-.quiz-question-answers {
- list-style: none;
- margin: 0;
- margin-top: 20px;
- padding: 0;
- font-size: 1rem;
-}
-
-.submit-quiz {
- margin-top: 20px;
-}
-
-
-.quiz-modal-background{
- position: absolute;
- top: 0;
- left: 0;
- background-color: rgba(0,0,0,.5);
- width: 100%;
- height: 100%;
-}
-
-.quiz-modal-container{
- display: flex;
- flex-direction: column;
- justify-content: center;
- align-items: center;
-}
-
-.quiz-modal{
- position: absolute;
- width: 30%;
- height: 500px;
- background-color: #fff;
- top: 50%;
- left: 50%;
- transform: translateX(-50%) translateY(-50%);
- border-radius: 10px;
- z-index: 2000;
-}
-.quiz-points-container{
- font-size: 1.2rem;
-}
-
-.quiz-points {
- background-color: #C4C4C4;
- padding: 0 4px ;
- border-radius: 10px;
- color: #fff;
-}
-
-
-.quiz-points-won{
- background-color: $primary;
-}
-
-.webpage-container{
- background-color: #fff;
- width: 100%;
-}
-
-.webpage-content {
- background-color: #fff;
- height: 100%;
-}
-
-
-
-
diff --git a/addons/website_slides/static/src/scss/slide_slide.scss b/addons/website_slides/static/src/scss/slide_slide.scss
index d99aaea101aaf87e33882afa465c0bcf5e64dc05..2aeac35b889684cb7c7ed9e2f2707d841ac02afc 100644
--- a/addons/website_slides/static/src/scss/slide_slide.scss
+++ b/addons/website_slides/static/src/scss/slide_slide.scss
@@ -1,15 +1,15 @@
-.slide-header {
+.o_wslides_slide_header {
background-color: #62495B;
height: 200px;
}
-.slide-header-container {
+.o_wslides_slide_header_container {
width: 1000px;
margin: 0 auto;
height: 100%;
}
-.slide-header-box{
+.o_wslides_slide_header_box{
display: flex;
height: 100%;
width: 50%;
@@ -25,7 +25,7 @@
}
-.slide-content-list {
+.o_wslides_slide_content_list {
position: absolute;
top: 140px;
left: 80px;
@@ -34,7 +34,7 @@
z-index: 200;
}
-.slide-list{
+.o_wslides_slide_list{
background-color: #fff;
list-style: none;
height: 100%;
@@ -55,19 +55,19 @@
}
}
-.slide-content-list-section{
+.o_wslides_slide_content_list_section{
border-bottom: 1px solid #fff;
color: #9B9B9B;
text-transform: uppercase;
padding: 10px 15px;
}
-.slide-content-list-slide{
+.o_wslides_slide_content_list_slide{
color: #666666;
padding: 10px 15px;
}
-.slide-list-cell{
+.o_wslides_slide_list_cell{
word-wrap: none;
padding: 0.5rem 1rem;;
height: 40px;
@@ -77,25 +77,25 @@
text-decoration: none !important;
}
-.slide-list-cell:hover{
+.o_wslides_slide_list_cell:hover{
background-color: #eee;
cursor: pointer;
}
-.slide-list-cell:active{
+.o_wslides_slide_list_cell:active{
background-color: #eee;
cursor: pointer;
}
-.slide-content-list-header {
+.o_wslides_slide_content_list_header {
padding: 10px 15px;
font-size: 1.2rem;
background-color: #F7F7F7;
color: #6F6F6F;
}
-.slide-button {
+.o_wslides_slide_button {
color: #666;
text-decoration: none;
border:1px solid #B9B9B9;
@@ -107,7 +107,7 @@
border-radius: 3px;
}
-.slide-button-fullscreen {
+.o_wslides_slide_button_fullscreen {
color: #666;
text-decoration: none;
border:1px solid #B9B9B9;
@@ -118,7 +118,7 @@
border-radius: 3px;
}
-.slide-button-done {
+.o_wslides_slide_button_done {
color: #fff;
text-transform: uppercase;
background-color: $primary;
@@ -130,7 +130,7 @@
margin: 0;
}
-.slide-title {
+.o_wslides_slide_title {
width: 60%;
display: flex;
align-items: center;
@@ -139,7 +139,7 @@
font-size: 1.5rem;
}
- .slide-points {
+ .o_wslides_slide_points {
margin-left: 20px;
padding: 5px 10px;
background-color: #DC9D45;
@@ -149,7 +149,7 @@
}
}
-.slide-documentation-sidebar {
+.o_wslides_slide_documentation_sidebar {
position: absolute;
top: 300px;
left: 30px;
diff --git a/addons/website_slides/static/src/scss/slides_slide_fullscreen.scss b/addons/website_slides/static/src/scss/slides_slide_fullscreen.scss
index d73681607331fdf55a3a1b47abebbe3fb6a67ed2..3310b570c8e256d1f33a19585a5fd638957359aa 100644
--- a/addons/website_slides/static/src/scss/slides_slide_fullscreen.scss
+++ b/addons/website_slides/static/src/scss/slides_slide_fullscreen.scss
@@ -1,12 +1,11 @@
-.o_wslides {
+.o_wslides_fs_main {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 2000;
-
- .o_wslides_slide_fullscreen_header {
+ .o_wslides_slide_fs_header {
align-items: center;
background-color: #313A44;
color: #AEB0B2;
@@ -15,7 +14,7 @@
justify-content: space-between;
width: 100%;
- .o_wslides_fullscreen_slide_title {
+ .o_wslides_fs_slide_title {
height: 100%;
display: flex;
align-items: center;
@@ -63,7 +62,7 @@
}
}
- .o_wslides_fullscreen_container {
+ .o_wslides_fs_container {
display: flex;
align-items: stretch;
height: calc(100% - 50px);
@@ -71,11 +70,11 @@
background-color: #313A44;
}
- .o_wslides_fullscreen_sidebar_hidden{
+ .o_wslides_fs_sidebar_hidden{
transform: translateX(-100%);
}
- .o_wslides_fullscreen_sidebar{
+ .o_wslides_fs_sidebar{
width: 400px;
min-width: 400px;
background-color: #313A44;
@@ -98,78 +97,94 @@
padding-left: 20px;
}
- .o_wslides_fullscreen_sidebar_header{
+ .o_wslides_fs_sidebar_header{
height: 100px;
padding: 20px 0;
display: flex;
flex-direction: column;
- .o_wslides_slide_fullscreen_progress_box{
+ .o_wslides_slide_fs_progress_box{
display: flex;
align-items: center;
font-size: .9rem;
- .o_wslides_fullscreen_sidebar_progressbar{
+ .o_wslides_fs_sidebar_progressbar{
height: 5px;
border-radius: 10px;
width: 70%;
background-color: rgba(0,0,0,.3);
margin-right: 40px;
overflow: hidden;
-
}
-
- .o_wslides_fullscreen_sidebar_progress_gauge {
+ .o_wslides_fs_sidebar_progress_gauge {
background-color: $primary;
height: 100%;
width: 0;
transition: all 1.5s ease-in;
}
-
span {
color: #BABDC0;
}
-
}
-
a {
font-size: 1.5rem;
font-weight: bold;
}
-
}
-
- .o_wslides_fullscreen_sidebar_section {
+ .o_wslides_fs_sidebar_section {
margin-bottom: 20px;
background-color: #283038;
padding: 10px 0;
-
- }
-
- .o_wslides_fullscreen_sidebar_section_tab {
- color: #656B72;
- font-size: .8rem;
- text-transform: uppercase;
- font-weight: bold;
- padding: 5px 0 5px 15px;
+ > a > li {
+ color: #656B72;
+ font-size: .8rem;
+ text-transform: uppercase;
+ font-weight: bold;
+ padding: 5px 0 5px 15px;
+ }
}
-
- .o_wslides_fullscreen_sidebar_section_slides{
+ .o_wslides_fs_sidebar_section_slides{
padding: 0;
margin-bottom: 15px;
-
-
-
li {
margin: 0;
padding: 0;
border-left: 2px solid transparent;
display: flex;
-
a {
flex: 1;
}
+ > span{
+ width: 15px;
+ padding: 0;
+ margin: 0;
+ margin-left: 10px;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ i {
+ z-index: 100;
+ padding: 0;
+ margin: 0;
+ }
+ i.o_wslides_slide_completed{
+ color: #00A04A;
+ border-radius: 50%;
+ overflow: hidden;
+ background-color: #fff;
+ height: 12px;
+ width: 12px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ border: 1px solid #00A04A;
+ }
+ .o_wslides_fs_full_line{
+ width: 1px;
+ height: 100%;
+ background-color: #787D82;
+ }
+ }
}
-
.o_wslides_top_line,
.o_wslides_bottom_line{
width: 1px;
@@ -177,82 +192,38 @@
flex-grow: 1;
background-color: #787D82;
}
-
li:first-child .o_wslides_top_line{
background-color: transparent;
}
-
li:last-child .o_wslides_bottom_line{
background-color: transparent;
}
-
li:hover,
li.active {
border-left: 2px solid $primary;
cursor: pointer;
background-color: #1D2228;
}
-
- .o_wslides_fullscreen_sidebar_slide_tab {
+ .o_wslides_fs_sidebar_slide_tab {
padding:5px 0 5px 15px;
font-size: .8rem;
color: #8A8F93;
font-weight: bold;
flex: 1;
-
}
-
- .o_wslides_fullscreen_sidebar_slide_tab.active{
+ .o_wslides_fs_sidebar_slide_tab.active{
color: #fff;
}
-
- .o_wslides_fullscreen_slide_tab_line{
- width: 15px;
- padding: 0;
- margin: 0;
- margin-left: 10px;
- display: flex;
- flex-direction: column;
- align-items: center;
-
- i {
- z-index: 100;
- padding: 0;
- margin: 0;
- }
-
- i.o_wslides_slide_completed{
- color: #00A04A;
- border-radius: 50%;
- overflow: hidden;
- background-color: #fff;
- height: 12px;
- width: 12px;
- display: flex;
- justify-content: center;
- align-items: center;
- border: 1px solid #00A04A;
- }
-
- .o_wslides_full_line{
- width: 1px;
- height: 100%;
- background-color: #787D82;
- }
- }
-
- .o_wslides_slide_link {
+ .o_wslides_fs_slide_link {
color: #098586;
font-size: .8rem;
margin-left: 15px;
flex: 1;
-
i {
margin-right: 10px;
}
}
-
- .o_wslides_slide_quiz {
+ .o_wslides_fs_slide_quiz {
font-size: .8rem;
margin-left: 15px;
color: #8A8F93;
@@ -267,7 +238,7 @@
}
- .o_wslides_fullscreen_player {
+ .o_wslides_fs_player {
display: flex;
align-items: stretch;
max-width: calc(100% - 400px);
@@ -286,7 +257,7 @@
}
}
- .o_wslides_fullscreen_webpage {
+ .o_wslides_fs_webpage {
background-color: #fff;
width: 100%;
height: 100%;
@@ -294,10 +265,8 @@
padding: 20px 0;
}
- .o_wslides_fullscreen_player_no_sidebar {
+ .o_wslides_fs_player_no_sidebar {
max-width: 100%;
width: 100%;
- }
-
-
-}
\ No newline at end of file
+ }
+}
diff --git a/addons/website_slides/static/src/scss/website_slides.scss b/addons/website_slides/static/src/scss/website_slides.scss
index b884a0df64f51d55d36b9d61b5cf46ada6de6fc0..2324835a4015336333b36880163725101c937523 100644
--- a/addons/website_slides/static/src/scss/website_slides.scss
+++ b/addons/website_slides/static/src/scss/website_slides.scss
@@ -4,11 +4,6 @@ $body-bg: #FFFFFF !default;
$link-color: theme-color('primary') !default;
$MAX-Z-INDEX : 2147483647 !default;
-@mixin top-covered-image {
- object-fit: cover;
- object-position: top;
-}
-
// Common to new slides pages
// **************************************************
@@ -20,39 +15,28 @@ $MAX-Z-INDEX : 2147483647 !default;
padding: 0px 32px 0px 32px;
}
-div .o_wslides_home_nav {
- top: -40px;
-
- @include media-breakpoint-up(md) {
- font-size: 1rem;
-
- .o_wslides_nav_navbar_right {
- margin-left: auto;
- padding-left: $spacer;
- border-left: 1px solid $border-color;
- }
- }
-}
-
.o_wslides_wrap {
background-color: desaturate(map-get($grays, "200"), 80%);
- .o_wslides_course_card {
- border-width: 0 0 3px 0;
+ .o_wslides_home_nav {
+ top: -40px;
+
+ @include media-breakpoint-up(md) {
+ font-size: 1rem;
+
+ .o_wslides_nav_navbar_right {
+ padding-left: $spacer;
+ margin-left: auto;
+ border-left: 1px solid $border-color;
+ }
+ }
}
+ .o_wslides_course_card,
.o_wslides_lesson_card {
border-width: 0 0 3px 0;
}
- // responsive card-deck like
- // .row.o_wslides_row > div[class*='col-'] {
- // display: flex;
- // flex:1 0 auto;
- // .card {
- // width:100%;
- // }
- // }
// tools
// ****************************************
@@ -64,10 +48,6 @@ div .o_wslides_home_nav {
.o_wslides_entry_muted {
opacity: 0.5;
}
- img.o_wslides_img_center_crop {
- object-fit: cover;
- object-position: center;
- }
.o_wslides_home_circled {
border-radius: 50%;
@@ -83,10 +63,12 @@ div .o_wslides_home_nav {
overflow: visible;
margin-bottom: 0em;
height: 4px;
+
.progress-bar {
background-color: #00A09D;
position: relative;
border-radius: 4px;
+
span {
background-color: #00A09D;
position: absolute;
@@ -97,6 +79,7 @@ div .o_wslides_home_nav {
right: -1.4em;
border-radius: 2px;
}
+
span:after {
bottom: 100%;
left: 50%;
@@ -119,27 +102,14 @@ div .o_wslides_home_nav {
// New home page
// **************************************************
-div .o_wslides_home_nav {
- top: -40px;
-
- @include media-breakpoint-up(md) {
- font-size: 1rem;
-
- .o_wslides_nav_navbar_right {
- margin-left: auto;
- padding-left: $spacer;
- border-left: 1px solid $border-color;
- }
- }
-}
-
-div .o_wslides_home_main {
+.o_wslides_home_main {
.o_wslides_home_aside {
.fa-check {
color: #00A09D;
font-size: 1.2em;
}
}
+
.o_wprofile_next_rank_card {
background-color: transparent !important;
}
@@ -244,13 +214,6 @@ div .o_wslides_home_main {
background-color: #f2f2f2;
.o_wslides_course_content_main {
- h3 {
- font-size: 1.4em;
- }
-
- h4 {
- font-size: 1.3em;
- }
.o_wslides_course_content_aside {
max-width: 286px;
@@ -263,13 +226,15 @@ div .o_wslides_home_main {
padding-right: 15px;
}
}
-
- .o_wslides_course_aside_line {
- }
}
}
}
+
+// New lesson page
+// **************************************************
+
+
// Old brol to clean someday
// **************************************************
@@ -292,9 +257,10 @@ div .o_wslides_home_main {
}
.oe_slides_apart_small {
- @include top-covered-image;
height: 60px;
width: 90px;
+ object-fit: cover;
+ object-position: top;
}
.oe_slides_statistics_title {
diff --git a/addons/website_slides/static/src/scss/website_slides_drag_and_drop_list.scss b/addons/website_slides/static/src/scss/website_slides_drag_and_drop_list.scss
new file mode 100644
index 0000000000000000000000000000000000000000..e0bf31c284fd67a8edc85bdedeb11ef998ae96cb
--- /dev/null
+++ b/addons/website_slides/static/src/scss/website_slides_drag_and_drop_list.scss
@@ -0,0 +1,49 @@
+.o_wslides_course_content {
+ padding: 0;
+
+ ul {
+ list-style: none;
+ padding: 0
+ }
+}
+
+.o_wslides_course_section {
+ margin: 0;
+ background-color: #ddd;
+ display: flex;
+ list-style: none;
+ font-size: 1.05rem;
+ border-bottom: 1px solid #ccc
+}
+
+.o_wslides_content_tab{
+ .active {
+
+ border: none;
+ border-bottom: 1px solid $secondary;
+ }
+}
+
+.o_wslides_content_tab a:hover{
+ border:none;
+ border-bottom: 1px solid $secondary;
+}
+
+.o_wslides_content_container{
+ border:none;
+}
+
+.o_wslides_content_slide:nth-child(odd){
+ background-color: #f6f6f6;
+}
+
+.o_wslides_content_slide:nth-child(even){
+ background-color: #f9f9f9;
+}
+
+.o_wslides_content_slide_controls {
+ i:hover{
+ color: $primary !important;
+ cursor: pointer;
+ }
+}
\ No newline at end of file
diff --git a/addons/website_slides/static/src/scss/website_slides_quiz.scss b/addons/website_slides/static/src/scss/website_slides_quiz.scss
index 9fe4438ee57673d2a6a18a7f96a82f9e731aaf6d..cca013c0be9ba9121edabf9774b0c33a9f680414 100644
--- a/addons/website_slides/static/src/scss/website_slides_quiz.scss
+++ b/addons/website_slides/static/src/scss/website_slides_quiz.scss
@@ -1,5 +1,5 @@
- .o_wslides_fullscreen_quiz {
+ .o_wslides_fs_quiz {
background-color: #F6F6F6;
width: 100%;
height: 100%;
diff --git a/addons/website_slides/static/src/xml/website_slides_fullscreen.xml b/addons/website_slides/static/src/xml/website_slides_fullscreen.xml
index c1161a024883469b2b831e483dacf536d2b47ee5..1817d085f71de4f7bcd92bdfb54a12c9d4a937b2 100644
--- a/addons/website_slides/static/src/xml/website_slides_fullscreen.xml
+++ b/addons/website_slides/static/src/xml/website_slides_fullscreen.xml
@@ -9,20 +9,20 @@
<div style="width:100%;height:100%;text-align:center;" t-if="slide.slide_type == 'infographic' && !showMiniQuiz">
<img t-attf-src="/web/image/slide.slide/#{slide.id}/image" class="img-fluid" style="height: 100%" alt="Slide image"/>
</div>
- <div t-if="(slide.slide_type == 'quiz' || showMiniQuiz) && questions " class="o_wslides_fullscreen_quiz">
+ <div t-if="(slide.slide_type == 'quiz' || showMiniQuiz) && questions " class="o_wslides_fs_quiz">
<div>
<t t-call="website.slide.quiz"/>
- <div class="container">
+ <div id="quiz_buttons" class="container">
<button t-if="!slide.done" class="btn btn-primary submit-quiz" >Check your answers</button>
<button t-if="embed_url" class="btn btn-primary back-to-video" >Watch again</button>
<button t-if="slide.done && nextSlide" class="btn btn-primary next-slide" >Continue</button>
</div>
</div>
</div>
- <div t-if="slide.slide_type == 'webpage'" class="o_wslides_fullscreen_webpage">
- <div class="o_wslides_fullscreen_webpage_content container"/>
+ <div t-if="slide.slide_type == 'webpage'" class="o_wslides_fs_webpage">
+ <div class="o_wslides_fs_webpage_content container"/>
</div>
- <div class="o_wslides_fullscreen_content"/>
+ <div class="o_wslides_fs_content"/>
</t>
<t t-name="website.slide.quiz">
@@ -76,17 +76,17 @@
<div class="o_wslides_quiz_success_modal_close"><i class="fa fa-times"></i></div>
<h1>Amazing!</h1>
<div class="o_wslides_quiz_success_xp">
- <p>You gained <span t-esc="data.points"/> !</p>
+ <p>You gained <span t-esc="data.points"/> points!</p>
<div class="o_wslides_quiz_success_progress_bar">
- <div class="o_wslides_quiz_success_progress_gauge"/>
+ <div class="o_wslides_quiz_success_progress_gauge" t-att-style="'width:'+data.user.progress_bar_percentage+'%'"/>
</div>
<div class="o_wslides_quiz_success_progress_bounds">
- <span>600</span>
- <span>1000</span>
+ <span t-esc="data.user.lower_bound"/>
+ <span t-esc="data.user.upper_bound"/>
</div>
</div>
<div class="o_wslides_quiz_success_reward"></div>
- <div class="o_wslides_quiz_success_button">
+ <div t-if="nextSlide" class="o_wslides_quiz_success_button">
<a class="next-slide">Next ></a>
</div>
</div>
@@ -101,7 +101,7 @@
<i t-if="slide.slide_type == 'link'" class="fa fa-file-code-o mr-2"></i>
<i t-if="slide.slide_type == 'webpage'" class="fa fa-file-text mr-2"></i>
<i t-if="slide.slide_type == 'quiz'" class="fa fa-question-circle mr-2 text"></i>
- <span class="o_wslides_fullscreen_slide_title_span" t-esc="slide.name"/>
+ <span class="o_wslides_fs_slide_title_span" t-esc="slide.name"/>
</t>
<t t-else="">
<span><i class="fa fa-flag-checkered"></i>Quiz: <span t-esc="slide.name"/></span>
diff --git a/addons/website_slides/views/assets.xml b/addons/website_slides/views/assets.xml
index a43729f527dbae69fbed0e228225a12aaf452e74..97a0f13ccf841372b4e7f54715eafd3bfd52d98c 100644
--- a/addons/website_slides/views/assets.xml
+++ b/addons/website_slides/views/assets.xml
@@ -6,7 +6,7 @@
<xpath expr="//link[last()]" position="after">
<link rel="stylesheet" type="text/scss" href="/website_slides/static/src/scss/website_slides.scss" t-ignore="true"/>
<link rel="stylesheet" type="text/scss" href="/website_slides/static/src/scss/website_slides_profile.scss"/>
- <link rel="stylesheet" type="text/scss" href="/website_slides/static/src/scss/slide_course.scss" t-ignore="true"/>
+ <link rel="stylesheet" type="text/scss" href="/website_slides/static/src/scss/website_slides_drag_and_drop_list.scss" t-ignore="true"/>
<link rel="stylesheet" type="text/scss" href="/website_slides/static/src/scss/slide_slide.scss" t-ignore="true"/>
<link rel="stylesheet" type="text/scss" href="/website_slides/static/src/scss/slides_slide_fullscreen.scss" t-ignore="true"/>
<link rel="stylesheet" type="text/scss" href="/website_slides/static/src/scss/website_slides_quiz.scss"/>
@@ -21,7 +21,6 @@
<script type="text/javascript" src="/website_slides/static/src/js/slides_delete_slide.js"/>
<script type="text/javascript" src="/website_slides/static/src/js/slides_course_slides_list.js"/>
<script type="text/javascript" src="/website_slides/static/src/js/slides_course_progress_bar.js"/>
- <script type="text/javascript" src="/website_slides/static/src/js/slides_course_sidebar_list.js"/>
<script type="text/javascript" src="/website_slides/static/src/js/slides_course_fullscreen_player.js"/>
<script type="text/javascript" src="/website_slides/static/src/js/slides_course_quiz.js"/>
</xpath>
diff --git a/addons/website_slides/views/website_slides_templates_course.xml b/addons/website_slides/views/website_slides_templates_course.xml
index 3459fba05a556f1c1455f190e3f6c1a488c0b945..b481dd4be4decec4b998e5d9ad42341dafdaa81a 100644
--- a/addons/website_slides/views/website_slides_templates_course.xml
+++ b/addons/website_slides/views/website_slides_templates_course.xml
@@ -245,13 +245,13 @@
<template id="course_content_training" name="Content of a training channel">
<div class="col-8 d-flex flex-column ml-4">
- <div class="course-content oe_js_course_slides_list w-100 mt8">
+ <div class="o_wslides_course_content oe_js_course_slides_list w-100 mt8">
<ul>
<t t-set="i" t-value="1"/>
<t t-set="j" t-value="0"/>
<t t-foreach="channel.category_ids" t-as="category">
<li t-attf-class="#{'section-draggable' if user == user_id else ''}" t-attf-category_id="#{category.id}">
- <div t-attf-category_id="#{category.id}" class="course-section text-muted font-weight-bold pt-0 pb-0 pl-2 pr-2 d-flex justify-content-between align-items-center">
+ <div t-attf-category_id="#{category.id}" class="o_wslides_course_section text-muted font-weight-bold pt-0 pb-0 pl-2 pr-2 d-flex justify-content-between align-items-center">
<div style="width:50%;" class="d-flex align-items-center">
<i t-if="channel.user_id == user" class="fa fa-arrows mr-3 text-muted"></i>
<div class="mr-2">Section <span class="section-index" t-esc="i"/>:</div>
@@ -270,8 +270,8 @@
</div>
<ul t-attf-category_id="#{category.id}" >
<t t-foreach="category.slide_ids" t-as="slide">
- <li t-att-index="j" t-attf-slide_id="#{slide.id}" t-attf-category_id="#{category.id}" t-attf-class="#{'content-slide slide-draggable d-flex justify-content-between align-items-center p-2' if channel.user_id == user else 'content-slide d-flex justify-content-between align-items-center p-2'}">
- <div class="content-slide-infos ml-2">
+ <li t-att-index="j" t-attf-slide_id="#{slide.id}" t-attf-category_id="#{category.id}" t-attf-class="#{'o_wslides_content_slide slide-draggable d-flex justify-content-between align-items-center p-2' if channel.user_id == user else 'content-slide d-flex justify-content-between align-items-center p-2'}">
+ <div class="ml-2">
<i t-if="channel.user_id == user" class="fa fa-arrows mr-2 text-muted"></i>
<i t-if="slide.slide_type == 'document'" class="fa fa-file-pdf-o mr-2 text-muted"></i>
<i t-if="slide.slide_type == 'infographic'" class="fa fa-file-picture-o mr-2 text-muted"></i>
@@ -282,7 +282,7 @@
<i t-if="slide.slide_type == 'certification'" class="fa fa-trophy mr-2 text-muted"></i>
<a class="link-to-slide" t-attf-href="/slides/slide/#{slug(slide)}"><span t-field="slide.name"/></a>
</div>
- <div class="content-slide-controls mr-2">
+ <div class="o_wslides_content_slide_controls mr-2">
<i t-if="not slide.id in user_progress or not user_progress[slide.id].completed" class="check-done fa fa-check-circle text-muted mr-1"></i>
<i t-if="slide.id in user_progress and user_progress[slide.id].completed" class="check-done text-primary fa fa-check-circle mr-1"></i>
<a t-if="channel.user_id == user and not slide.slide_type == 'webpage'" t-attf-href="/web#id=#{slide.id}&action=#{slide_action}&model=slide.slide&view_type=form"><i class="fa fa-pencil text-muted mr-1"></i></a>
@@ -296,7 +296,7 @@
</li>
</t>
</ul>
- <div t-if="channel.can_upload" class="content-actions">
+ <div t-if="channel.can_upload" class="o_wslides_content_actions">
<a class="mr-2 oe_slide_js_upload"
role="button"
aria-label="Upload Presentation"
@@ -376,7 +376,7 @@
<!-- Embedded template: display a list of slides in a grid view -->
<template id='course_lessons_grid' name="Course: Lessons Grid View">
- <div class="row o_wslides_row mx-n2 mt8">
+ <div class="row mx-n2 mt8">
<t t-foreach="slides" t-as="slide">
<div class="col-md-3 col-sm-6 px-2 col-xs-12 d-flex flex-grow-1" t-call="website_slides.lesson_card"/>
</t>
diff --git a/addons/website_slides/views/website_slides_templates_homepage.xml b/addons/website_slides/views/website_slides_templates_homepage.xml
index cad54cf323d220942e0e77d91d637ac0f71698f2..145120c2b5d6c8a2a2a4f3b7836e70135335343c 100644
--- a/addons/website_slides/views/website_slides_templates_homepage.xml
+++ b/addons/website_slides/views/website_slides_templates_homepage.xml
@@ -55,7 +55,7 @@
<hr class="mt-2"/>
</div>
</div>
- <div class="row o_wslides_row mx-n2 mt8">
+ <div class="row mx-n2 mt8">
<t t-foreach="channels_my[:3]" t-as="channel">
<div class="col-md-4 col-sm-6 px-2 col-xs-12 d-flex flex-grow-1" t-call="website_slides.course_card"/>
</t>
@@ -70,7 +70,7 @@
<hr class="mt-2"/>
</div>
</div>
- <div class="row o_wslides_row mx-n2 mt8">
+ <div class="row mx-n2 mt8">
<t t-foreach="channels_popular[:3]" t-as="channel">
<div class="col-md-4 col-sm-6 px-2 col-xs-12 d-flex flex-grow-1" t-call="website_slides.course_card"/>
</t>
@@ -84,7 +84,7 @@
<hr class="mt-2"/>
</div>
</div>
- <div class="row o_wslides_row mx-n2 mt8">
+ <div class="row mx-n2 mt8">
<t t-foreach="channels_newest[:3]" t-as="channel">
<div class="col-md-4 col-sm-6 px-2 col-xs-12 d-flex flex-grow-1" t-call="website_slides.course_card"/>
</t>
diff --git a/addons/website_slides/views/website_slides_templates_lesson.xml b/addons/website_slides/views/website_slides_templates_lesson.xml
index 6c3c9c9f54bbff26afd88594c6cbf23c10995d31..b765d2f58e25429fa52fa6837e512a4a75b987a2 100644
--- a/addons/website_slides/views/website_slides_templates_lesson.xml
+++ b/addons/website_slides/views/website_slides_templates_lesson.xml
@@ -8,36 +8,36 @@
<t t-call="website_slides.course_nav">
<t t-set="channel" t-value="slide.channel_id"/>
</t>
- <div class="slide-header">
- <div class="slide-header-container">
- <div class="slide-header-box">
+ <div class="o_wslides_slide_header">
+ <div class="o_wslides_slide_header_container">
+ <div class="o_wslides_slide_header_box">
<a t-attf-href="/slides/#{slug(slide.channel_id)}" t-field="slide.channel_id.name"/>
<div t-if="slide.channel_id.channel_type == 'training'" class="d-flex align-items-end">
- <div class="course-progress-bar">
- <div class="progress-gauge m-0 oe_slide_js_progress_bar" t-attf-channel_completion="#{slide.channel_id.completion}"/>
+ <div class="o_wslides_slide_progress_bar">
+ <div class="o_wslides_progress_gauge m-0 oe_slide_js_progress_bar" t-attf-channel_completion="#{slide.channel_id.completion}"/>
</div>
<i class="fa fa-trophy ml-2 mb-0 p-0" style="font-size:1.8rem; color: #cdcdcd;"></i>
</div>
</div>
</div>
</div>
- <div t-if="slide.channel_id.channel_type == 'training'" class="sidebar-list oe_js_side_bar_list slide-content-list">
- <ul class="slide-list">
+ <div t-if="slide.channel_id.channel_type == 'training'" class="o_wslides_slide_content_list">
+ <ul class="o_wslides_slide_list">
<li>
- <div class="slide-content-list-header">
+ <div class="o_wslides_slide_content_list_header">
Course content
</div>
</li>
<t t-set="i" t-value="0"/>
<t t-foreach="slide.channel_id.category_ids" t-as="category">
<a data-toggle="collapse" t-attf-href="#collapse-#{category.id}" role="button" aria-expanded="false" t-attf-aria-controls="collapse-#{category.id}">
- <li class="slide-content-list-section">
+ <li class="o_wslides_slide_content_list_section">
<span t-field="category.name"/>
</li>
</a>
<ul class="collapse p-0 m-0" t-attf-id="collapse-#{category.id}" >
<t t-foreach="category.slide_ids" t-as="course_slide">
- <li class="slide-content-list-slide">
+ <li class="o_wslides_slide_content_list_slide">
<a t-attf-href="/slides/slide/#{slug(course_slide)}" t-att-index="i" t-att-slide_id="course_slide.id">
<div t-attf-index="#{i}" t-attf-slide_id="#{course_slide.id}" t-attf-class="#{'active' if slide.id == course_slide.id else ''} d-flex justify-content-between">
<div>
@@ -49,16 +49,16 @@
<i t-if="course_slide.slide_type == 'quiz'" class="fa fa-question-circle mr-2 text-muted"></i>
<t t-esc="course_slide.name"/>
</div>
- <div class="content-slide-controls mr-2">
+ <div class="o_wslides_content_slide_controls mr-2">
<i t-attf-id="check-#{course_slide.id}" t-if="course_slide.id in user_progress and not user_progress[course_slide.id].completed" class="check-done fa fa-check-circle text-muted mr-1"></i>
<i t-attf-id="check-#{course_slide.id}" t-if="course_slide.id in user_progress and user_progress[course_slide.id].completed" class="check-done text-primary fa fa-check-circle mr-1"></i>
</div>
</div>
</a>
- <ul t-if="course_slide.link_ids" class="list-group slide-resources">
+ <ul t-if="course_slide.link_ids" class="list-group o_wslides_slide_resources">
<t t-foreach="course_slide.link_ids" t-as="resource">
<a t-attf-href="#{resource.link}" target="new">
- <li><div class="slide-resource"><i class="fa fa-link"></i><span t-field="resource.link"/></div></li>
+ <li><div class="o_wslides_slide_resource"><i class="fa fa-link"></i><span t-field="resource.link"/></div></li>
</a>
</t>
</ul>
@@ -69,10 +69,10 @@
</t>
</ul>
</div>
- <div class="slide-header-container d-flex justify-content-between mt-4 mb-3">
- <div class="slide-title">
+ <div class="o_wslides_slide_header_container d-flex justify-content-between mt-4 mb-3">
+ <div class="o_wslides_slide_title">
<h1 t-field="slide.name"/>
- <span t-if="slide.question_ids" t-attf-class="slide-points ml-2 #{'quiz-points-won' if slide.id in user_progress and user_progress[slide.id].completed else ''}">
+ <span t-if="slide.question_ids" t-attf-class="o_wslides_slide_points ml-2 #{'quiz-points-won' if slide.id in user_progress and user_progress[slide.id].completed else ''}">
<span t-if="slide.id in user_progress and user_progress[slide.id].quiz_attempts_count == 0" id="quiz-points" t-esc="slide.quiz_first_attempt_reward"/>
<span t-if="slide.id in user_progress and user_progress[slide.id].quiz_attempts_count == 1" id="quiz-points" t-esc="slide.quiz_second_attempt_reward"/>
<span t-if="slide.id in user_progress and user_progress[slide.id].quiz_attempts_count == 2" id="quiz-points" t-esc="slide.quiz_third_attempt_reward"/>
@@ -80,18 +80,20 @@
points
</span>
</div>
- <div class="course-nav-links">
+ <div>
<t t-if="previous_slide">
- <a class="slide-button" t-attf-href="/slides/slide/#{previous_slide}">Prev</a>
+ <a class="o_wslides_slide_button" t-attf-href="/slides/slide/#{previous_slide}">Prev</a>
</t>
- <a t-if="slide.slide_type in ('webpage', 'video', 'document', 'iconographic') and not slide.question_ids and (slide.id in user_progress and not user_progress[slide.id].completed)" t-attf-href="/slide/completed/#{slide.id}?next_slide=#{next_slide}&course=#{slug(slide.channel_id)}" class="slide-button-done">Set Done</a>
+ <a t-if="slide.slide_type in ('webpage', 'video', 'document', 'iconographic') and not slide.question_ids and (slide.id in user_progress and not user_progress[slide.id].completed)"
+ t-att-href="'/slides/slide/%s/set_completed?next_slide=%s' % (slide.id, next_slide.id)"
+ class="o_wslides_slide_button_done">Set Done</a>
<t t-if="next_slide">
- <a class="slide-button" t-attf-href="/slides/slide/#{next_slide}">Next</a>
+ <a class="o_wslides_slide_button" t-attf-href="/slides/slide/#{next_slide}">Next</a>
</t>
- <a t-if="slide.channel_id.channel_type == 'training'" t-attf-href="/slides/slide/#{slug(slide)}?fullscreen=1" class="slide-button-fullscreen ml-2"><i class="fa fa-desktop mr-2"></i>fullscreen</a>
+ <a t-if="slide.channel_id.channel_type == 'training'" t-attf-href="/slides/slide/#{slug(slide)}?fullscreen=1" class="o_wslides_slide_button_fullscreen ml-2"><i class="fa fa-desktop mr-2"></i>fullscreen</a>
</div>
</div>
- <div class="slide-header-container mt16">
+ <div class="o_wslides_slide_header_container mt16">
<div class="row">
<div style="width:100%;">
<div class="o_w_slides_slide_detail_container" style="width: 100%;">
@@ -108,7 +110,7 @@
<div t-field="slide.html_content"/>
</div>
<div t-if="slide.question_ids">
- <div class=".o_wslides_fullscreen_quiz o_w_slides_quiz_no_fullscreen mt-2"
+ <div class=".o_wslides_fs_quiz o_w_slides_quiz_no_fullscreen mt-2"
t-attf-slide_id="#{slide.id}"
t-attf-slide_done="#{slide.id in user_progress and user_progress[slide.id].completed}"
t-attf-nb_attempts="#{user_progress[slide.id].quiz_attempts_count if slide.id in user_progress else ''}"
@@ -447,28 +449,28 @@
<!-- Slide template for the fullscreen mode -->
<template id="slide_fullscreen" name="Fullscreen">
<t t-call="website.layout">
- <div class="o_wslides">
- <div class="o_wslides_slide_fullscreen_header">
+ <div class="o_wslides_fs_main">
+ <div class="o_wslides_slide_fs_header">
<div>
- <a id="fullscreen_sidebar_button" href="#" class="active o_wslides_fullscreen_toggle_sidebar"><i class="fa fa-bars"></i>Lessons</a>
+ <a id="fullscreen_sidebar_button" href="#" class="active o_wslides_fs_toggle_sidebar"><i class="fa fa-bars"></i>Lessons</a>
<a class="o_wslides_small_screen" t-attf-href="/slides/slide/#{slug(slide)}" target="new"><i class="fa fa-pencil"></i>write a review</a>
- <div class="o_wslides_fullscreen_slide_title"/>
+ <div class="o_wslides_fs_slide_title"/>
</div>
<div>
<a t-attf-href="/slides/">back to courses</a>
</div>
</div>
- <div class="o_wslides_fullscreen_container">
- <div class="oe_js_side_bar_list o_wslides_fullscreen_sidebar">
+ <div class="o_wslides_fs_container">
+ <div class="o_wslides_fs_sidebar">
<ul>
<li>
- <div class="o_wslides_fullscreen_sidebar_header">
+ <div class="o_wslides_fs_sidebar_header">
<a t-attf-href="/slides/#{slug(slide.channel_id)}">
<span t-field="slide.channel_id.name"/>
</a>
- <div class="o_wslides_slide_fullscreen_progress_box">
- <div class="o_wslides_fullscreen_sidebar_progressbar">
- <div class="o_wslides_fullscreen_sidebar_progress_gauge oe_slide_js_progress_bar" t-attf-channel_completion="#{slide.channel_id.completion}"/>
+ <div class="o_wslides_slide_fs_progress_box">
+ <div class="o_wslides_fs_sidebar_progressbar">
+ <div class="o_wslides_fs_sidebar_progress_gauge oe_slide_js_progress_bar" t-attf-channel_completion="#{slide.channel_id.completion}"/>
</div>
<span><span class="o_wslides_progress_percentage" t-esc="slide.channel_id.completion"/>%</span>
</div>
@@ -476,16 +478,16 @@
</li>
<t t-set="i" t-value="0"/>
<t t-foreach="slide.channel_id.category_ids" t-as="category">
- <div class="o_wslides_fullscreen_sidebar_section">
+ <div class="o_wslides_fs_sidebar_section">
<a data-toggle="collapse" t-attf-href="#collapse-#{category.id}" role="button" aria-expanded="true" t-attf-aria-controls="collapse-#{category.id}">
- <li class="o_wslides_fullscreen_sidebar_section_tab">
+ <li>
<span t-field="category.name"/>
</li>
</a>
- <ul class="o_wslides_fullscreen_sidebar_section_slides collapsed p-0 m-0" t-attf-id="collapse-#{category.id}" >
+ <ul class="o_wslides_fs_sidebar_section_slides collapsed p-0 m-0" t-attf-id="collapse-#{category.id}" >
<t t-foreach="category.slide_ids" t-as="course_slide">
- <li t-att-index="i" t-att-slide_id="course_slide.id" t-attf-class="#{'active' if slide.id == course_slide.id else ''}">
- <span class="o_wslides_fullscreen_slide_tab_line">
+ <li t-attf-index="#{i}" t-att-slide_id="course_slide.id" t-attf-class="#{'active' if slide.id == course_slide.id else ''}">
+ <span>
<span class="o_wslides_top_line"></span>
<i t-attf-id="check-#{course_slide.id}" t-if="not course_slide.id in user_progress or not user_progress[course_slide.id].completed" class="check-done fa fa-circle-thin"></i>
<i t-attf-id="check-#{course_slide.id}" t-if="course_slide.id in user_progress and user_progress[course_slide.id].completed" class="check-done o_wslides_slide_completed fa fa-check-circle"></i>
@@ -493,14 +495,14 @@
</span>
<a t-att-index="i" t-att-slide_id="course_slide.id">
<div t-attf-index="#{i}"
- t-attf-slide_slug="#{slug(course_slide)}"
- t-attf-done="#{course_slide.id in user_progress and user_progress[course_slide.id].completed}"
- t-attf-slide_id="#{course_slide.id}"
- t-attf-slide_name="#{course_slide.name}"
- t-attf-quiz="#{True if course_slide.question_ids else False}"
- t-attf-slide_type="#{course_slide.slide_type}"
- t-attf-slide_embed_code="#{course_slide.embed_code}"
- t-attf-class="o_wslides_fullscreen_sidebar_slide_tab #{'active' if slide.id == course_slide.id else ''} d-flex justify-content-between">
+ t-att-data-slug="slug(course_slide)"
+ t-att-data-done="course_slide.id in user_progress and user_progress[course_slide.id].completed"
+ t-att-data-id="course_slide.id"
+ t-att-data-name="course_slide.name"
+ t-attf-data-has_quiz="#{True if course_slide.question_ids else False}"
+ t-att-data-slide_type="course_slide.slide_type"
+ t-att-data-embed_code="course_slide.embed_code"
+ t-attf-class="o_wslides_fs_sidebar_slide_tab #{'active' if slide.id == course_slide.id else ''} d-flex justify-content-between">
<div>
<i t-if="course_slide.slide_type == 'document'" class="fa fa-file-pdf-o mr-2 text-muted"></i>
<i t-if="course_slide.slide_type == 'infographic'" class="fa fa-file-picture-o mr-2 text-muted"></i>
@@ -516,17 +518,17 @@
</li>
<t t-if="course_slide.link_ids" t-foreach="course_slide.link_ids" t-as="link">
<li>
- <span class="o_wslides_fullscreen_slide_tab_line">
- <span class="o_wslides_full_line"/>
+ <span>
+ <span class="o_wslides_fs_full_line"/>
</span>
- <a class="o_wslides_slide_link" t-att-href="link.link" target="new"><i class="fa fa-link"></i><span t-esc="link.name"/></a>
+ <a class="o_wslides_fs_slide_link" t-att-href="link.link" target="new"><i class="fa fa-link"></i><span t-esc="link.name"/></a>
</li>
</t>
- <li t-att-index="i" t-if="course_slide.question_ids and not course_slide.slide_type =='quiz'">
- <span class="o_wslides_fullscreen_slide_tab_line">
- <span class="o_wslides_full_line"/>
+ <li t-attf-index="#{i}" t-if="course_slide.question_ids and not course_slide.slide_type =='quiz'">
+ <span>
+ <span class="o_wslides_fs_full_line"/>
</span>
- <span class="o_wslides_slide_quiz" t-att-index="i"><i class="fa fa-flag-checkered"></i>Quiz: <span t-esc="course_slide.name"/></span>
+ <span class="o_wslides_fs_slide_quiz" t-attf-index="#{i}"><i class="fa fa-flag-checkered"></i>Quiz: <span t-esc="course_slide.name"/></span>
</li>
<t t-set="i" t-value="i+1"/>
</t>
@@ -536,7 +538,7 @@
</ul>
</div>
<div class="oe_js_course_slide" t-attf-user_id="#{user.id}" t-attf-course_name="#{slide.channel_id.name}" t-attf-course_id="#{slide.channel_id.id}" t-attf-course_slug="#{slug(slide.channel_id)}" t-attf-slide_id="#{slide.id}"/>
- <div class="o_wslides_fullscreen_player"/>
+ <div class="o_wslides_fs_player"/>
</div>
</div>
</t>
diff --git a/addons/website_slides_survey/static/src/scss/website_slides.scss b/addons/website_slides_survey/static/src/scss/website_slides.scss
index 3cef87764d8babdf38be62945a355dbf05230541..84a24ede56fa30639e72d235c2f0185d88e33b09 100644
--- a/addons/website_slides_survey/static/src/scss/website_slides.scss
+++ b/addons/website_slides_survey/static/src/scss/website_slides.scss
@@ -1,4 +1,4 @@
-.o_wslides_fullscreen_certification {
+.o_wslides_fs_certification {
display: flex;
justify-content: center;
align-items: center;
diff --git a/addons/website_slides_survey/static/src/xml/website_slides_fullscreen.xml b/addons/website_slides_survey/static/src/xml/website_slides_fullscreen.xml
index c56cf727dfc0b8af1eb95b64f029c39167f3acc1..97f35fc3a32ea934ee2ea8cd85609bbf270f4a80 100644
--- a/addons/website_slides_survey/static/src/xml/website_slides_fullscreen.xml
+++ b/addons/website_slides_survey/static/src/xml/website_slides_fullscreen.xml
@@ -1,15 +1,15 @@
<?xml version="1.0" encoding="UTF-8"?>
<templates>
<t t-extend="website.slides.fullscreen">
- <t t-jquery=".o_wslides_fullscreen_content" t-operation="append">
- <div class="o_wslides_fullscreen_certification" t-if="slide.slide_type == 'certification'">
+ <t t-jquery=".o_wslides_fs_content" t-operation="append">
+ <div class="o_wslides_fs_certification" t-if="slide.slide_type == 'certification'">
<a class="btn btn-primary" t-att-href="'/slides/slide/' + slide.slug" target="new"><i class="fa fa-trophy"/> Pass Certification</a>
</div>
</t>
</t>
<t t-extend="website.course.fullscreen.title">
- <t t-jquery=".o_wslides_fullscreen_slide_title_span" t-operation="before">
+ <t t-jquery=".o_wslides_fs_slide_title_span" t-operation="before">
<i t-if="slide.slide_type == 'certification'" class="fa fa-trophy mr-2 text"></i>
</t>
</t>