[IMP] website_slides,portal_rating: update UX
Minor updates to improve user useability of website_slides primarily with clearer wording and more intuitive displays/display interactions. Primary purpose is for onboarding wow. Related to: closes odoo/odoo#42030 Task: 2070662 Signed-off-by: Thibault Delavallee (tde) <tde@openerp.com>
This commit is contained in:
Tiffany Chang (tic)
@@ -11,9 +11,6 @@
|
||||
<t t-set="val" t-value="widget.rating_avg || 0"/>
|
||||
<t t-set="inline_mode" t-value="true"/>
|
||||
</t>
|
||||
<t t-if="widget.rating_total">
|
||||
<small>(<t t-esc="widget.rating_total"/> ratings)</small>
|
||||
</t>
|
||||
</div>
|
||||
<button t-if="widget.options['display_composer']" type="button" class="btn btn-sm btn-primary mx-3" data-toggle="modal" data-target="#ratingpopupcomposer">
|
||||
<t t-if="widget.options['display_composer']">
|
||||
|
||||
@@ -47,13 +47,15 @@
|
||||
</group>
|
||||
<notebook>
|
||||
<page name="options" string="Options">
|
||||
<group string="Order" name="group_order">
|
||||
<field name="default_order"/>
|
||||
<label for="relevancy_post_vote" string="Relevance Computation" groups="base.group_no_one" attrs="{'invisible':[('default_order','!=','relevancy desc')]}"/>
|
||||
<div groups="base.group_no_one" class="o_row" attrs="{'invisible':[('default_order','!=','relevancy desc')]}">
|
||||
(votes - 1) ** <field name="relevancy_post_vote"/> / (days + 2) ** <field name="relevancy_time_decay"/>
|
||||
</div>
|
||||
</group>
|
||||
<group>
|
||||
<group string="Order" name="group_order">
|
||||
<field name="default_order"/>
|
||||
<label for="relevancy_post_vote" string="Relevance Computation" groups="base.group_no_one" attrs="{'invisible':[('default_order','!=','relevancy desc')]}"/>
|
||||
<div groups="base.group_no_one" class="o_row" attrs="{'invisible':[('default_order','!=','relevancy desc')]}">
|
||||
(votes - 1) ** <field name="relevancy_post_vote"/> / (days + 2) ** <field name="relevancy_time_decay"/>
|
||||
</div>
|
||||
</group>
|
||||
</group>
|
||||
</page>
|
||||
<page name="karma_gains" string="Karma Gains">
|
||||
<group name="karma_gain_details">
|
||||
|
||||
@@ -56,9 +56,13 @@ $owprofile-color-bg: mix($body-bg, #efeff4);
|
||||
line-height: $line-height-base;
|
||||
@include o-hover-text-color(rgba(white, 0.8), white);
|
||||
|
||||
&, &:hover {
|
||||
border-color: #875A7B;
|
||||
background: transparent;
|
||||
& {
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
border-color: transparent;
|
||||
background: #3d2938;
|
||||
}
|
||||
|
||||
&.active {
|
||||
|
||||
@@ -74,7 +74,7 @@ class ChannelUsersRelation(models.Model):
|
||||
class Channel(models.Model):
|
||||
""" A channel is a container of slides. """
|
||||
_name = 'slide.channel'
|
||||
_description = 'Slide Channel'
|
||||
_description = 'Course'
|
||||
_inherit = [
|
||||
'mail.thread', 'rating.mixin',
|
||||
'image.mixin',
|
||||
|
||||
@@ -441,9 +441,7 @@ odoo.define('website_slides.fullscreen', function (require) {
|
||||
start: function (){
|
||||
var self = this;
|
||||
this.on('change:slide', this, this._onChangeSlide);
|
||||
if (config.device.size_class > config.device.SIZES.MD) {
|
||||
this._toggleSidebar();
|
||||
}
|
||||
this._toggleSidebar();
|
||||
return this._super.apply(this, arguments).then(function () {
|
||||
return self._onChangeSlide(); // trigger manually once DOM ready, since slide content is not rendered server side
|
||||
});
|
||||
@@ -605,10 +603,12 @@ odoo.define('website_slides.fullscreen', function (require) {
|
||||
// Handlers
|
||||
//--------------------------------------------------------------------------
|
||||
/**
|
||||
* Method called whenever the user changes slides.
|
||||
* When the current slide is changed, it will autoimatically update the widget
|
||||
* and allow it to fetch the content if needs be, render it, update the url and set the
|
||||
* slide as "completed" if its type makes it necessary
|
||||
* Triggered whenever the user changes slides.
|
||||
* When the current slide is changed, widget will be automatically updated
|
||||
* and allowed to: fetch the content if needed, render it, update the url,
|
||||
* and set slide as "completed" according to its type requirements. In
|
||||
* mobile case (i.e. limited screensize), sidebar will be toggled since
|
||||
* sidebar will block most or all of new slide visibility.
|
||||
*
|
||||
* @private
|
||||
*/
|
||||
@@ -619,6 +619,9 @@ odoo.define('website_slides.fullscreen', function (require) {
|
||||
return this._fetchSlideContent().then(function() { // render content
|
||||
var websiteName = document.title.split(" | ")[1]; // get the website name from title
|
||||
document.title = (websiteName) ? slide.name + ' | ' + websiteName : slide.name;
|
||||
if (config.device.size_class < config.device.SIZES.MD) {
|
||||
self._toggleSidebar(); // hide sidebar when small device screen
|
||||
}
|
||||
return self._renderSlide();
|
||||
}).then(function() {
|
||||
if (slide._autoSetDone && !session.is_website_user) { // no useless RPC call
|
||||
|
||||
@@ -210,7 +210,7 @@ $o-wslides-fs-side-width: 300px;
|
||||
}
|
||||
|
||||
@mixin o-wslides-tabs($tab-active-color: $o-wslides-color-bg) {
|
||||
margin-top: ($o-wslides-tabs-height * -1) + 0.05rem;
|
||||
margin-top: ($o-wslides-tabs-height * -1);
|
||||
border-bottom: 0;
|
||||
|
||||
.nav-link {
|
||||
@@ -219,9 +219,12 @@ $o-wslides-fs-side-width: 300px;
|
||||
line-height: $line-height-base;
|
||||
@include o-hover-text-color(rgba(white, 0.8), white);
|
||||
|
||||
&, &:hover {
|
||||
border-color: #875A7B;
|
||||
background: transparent;
|
||||
& {
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background: #3d2938;
|
||||
}
|
||||
|
||||
&.active {
|
||||
|
||||
@@ -68,6 +68,8 @@
|
||||
<field name="slide_type" attrs="{'invisible': [('slide_type', '=', 'category')]}"/>
|
||||
<field name="completion_time" attrs="{'invisible': [('slide_type', '=', 'category')]}" string="Duration" widget="float_time"/>
|
||||
<field name="total_views" attrs="{'invisible': [('slide_type', '=', 'category')]}"/>
|
||||
<field name="is_preview" string="Preview"/>
|
||||
<field name="is_published" string="Published"/>
|
||||
<field name="is_category" invisible="1"/>
|
||||
<control>
|
||||
<create name="add_slide_section" string="Add Section" context="{'default_is_category': True}"/>
|
||||
|
||||
@@ -175,18 +175,18 @@
|
||||
<!-- Training Content -->
|
||||
<div class="col-12 col-md-8 col-lg-9">
|
||||
<ul class="nav nav-tabs o_wslides_nav_tabs flex-nowrap" role="tablist" id="profile_extra_info_tablist">
|
||||
<li class="nav-item o_wslides_course_header_nav_home_training">
|
||||
<a t-att-class="'nav-link %s' % ('active' if active_tab == 'home' else '')"
|
||||
id="home-tab" data-toggle="pill" href="#home" role="tab" aria-controls="home"
|
||||
<li class="nav-item">
|
||||
<a t-att-class="'nav-link %s' % ('active' if active_tab == 'home' else '')"
|
||||
id="home-tab" data-toggle="pill" href="#home" role="tab" aria-controls="home"
|
||||
t-att-aria-selected="'true' if active_tab == 'home' else 'false'">
|
||||
<i class="fa fa-home"/> Course
|
||||
</a>
|
||||
</li>
|
||||
<li t-if="channel.allow_comment" class="nav-item">
|
||||
<a t-att-class="'nav-link %s' % ('active' if active_tab == 'review' else '')"
|
||||
id="review-tab" data-toggle="pill" href="#review" role="tab" aria-controls="review"
|
||||
<li t-if="channel.allow_comment" class="nav-item o_wslides_course_header_nav_review_training">
|
||||
<a t-att-class="'nav-link %s' % ('active' if active_tab == 'review' else '')"
|
||||
id="review-tab" data-toggle="pill" href="#review" role="tab" aria-controls="review"
|
||||
t-att-aria-selected="'true' if active_tab == 'review' else 'false'">
|
||||
Review
|
||||
Reviews<t t-if="rating_count"> (<t t-esc="rating_count"/>)</t>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
@@ -215,7 +215,7 @@
|
||||
<div class="row">
|
||||
<div class="col-12 col-md-8 offset-md-4 col-lg-9 offset-lg-3">
|
||||
<ul class="nav nav-tabs o_wslides_nav_tabs o_wslides_doc_nav_tabs flex-nowrap" role="tablist" id="profile_extra_info_tablist">
|
||||
<li class="nav-item o_wslides_course_header_nav_home_documentation">
|
||||
<li class="nav-item">
|
||||
<a t-att-class="'nav-link %s' % ('active' if active_tab == 'home' else '')"
|
||||
id="home-tab" data-toggle="pill" href="#home" role="tab" aria-controls="home"
|
||||
t-att-aria-selected="'true' if active_tab == 'home' else 'false'">
|
||||
@@ -223,11 +223,11 @@
|
||||
Course
|
||||
</a>
|
||||
</li>
|
||||
<li t-if="channel.allow_comment" class="nav-item">
|
||||
<li t-if="channel.allow_comment" class="nav-item o_wslides_course_header_nav_review_documentation">
|
||||
<a t-att-class="'nav-link %s' % ('active' if active_tab == 'review' else '')"
|
||||
id="review-tab" data-toggle="pill" href="#review" role="tab" aria-controls="review"
|
||||
t-att-aria-selected="'true' if active_tab == 'review' else 'false'">
|
||||
Review
|
||||
Reviews<t t-if="rating_count"> (<t t-esc="rating_count"/>)</t>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
@@ -420,6 +420,9 @@
|
||||
</div>
|
||||
|
||||
<div class="d-flex flex-row">
|
||||
<a name="o_wslides_list_slide_add_quizz" t-if="channel.can_upload and not slide.question_ids" t-attf-href="/slides/slide/#{slug(slide)}?quiz_quick_create">
|
||||
<span class="badge badge-light badge-hide border font-weight-normal px-2 py-1 m-1"><i class="fa fa-plus mr-1"/>Add Quiz</span>
|
||||
</a>
|
||||
<a t-if="channel.can_upload" href="#">
|
||||
<span t-att-data-slide-id="slide.id" t-attf-class="o_wslides_js_slide_toggle_is_preview badge #{'badge-success py-1' if slide.is_preview else 'badge-light badge-hide border'} font-weight-normal px-2 m-1">Free preview</span>
|
||||
</a>
|
||||
@@ -431,9 +434,6 @@
|
||||
<i t-attf-class="fa fa-fw #{'fa-check' if channel_progress[slide.id].get('completed') else 'fa-flag'}"/>
|
||||
<t t-esc="channel_progress[slide.id].get('quiz_karma_won', 0) if channel_progress[slide.id].get('completed') else channel_progress[slide.id].get('quiz_karma_gain', 0)"/> xp
|
||||
</span>
|
||||
<a name="o_wslides_list_slide_add_quizz" t-if="channel.can_upload and not slide.question_ids" t-attf-href="/slides/slide/#{slug(slide)}?quiz_quick_create">
|
||||
<span class="badge badge-light badge-hide border font-weight-normal px-2 py-1 m-1"><i class="fa fa-plus mr-1"/>Add Quiz</span>
|
||||
</a>
|
||||
<span class="badge badge-danger font-weight-normal px-2 py-1 m-1" t-if="not slide.website_published">Unpublished</span>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -121,7 +121,7 @@
|
||||
<div class="col-12 col-sm-6 col-lg-12 d-flex align-items-center">
|
||||
<t t-call="website_slides.slides_home_user_achievements_small"/>
|
||||
</div>
|
||||
<div class="col-12 col-md-7 col-lg-12 pl-md-5 pl-lg-0 mt-lg-4">
|
||||
<div class="col-12 col-md-7 col-lg-12 pl-md-5 pl-lg-0 mt-lg-4 mb-3">
|
||||
<t t-call="website_slides.slides_home_achievements_small"/>
|
||||
</div>
|
||||
<div class="col-12 col-sm-6 col-lg-12 pl-md-5 pl-lg-0 mt-lg-4">
|
||||
|
||||
@@ -26,10 +26,10 @@
|
||||
</div>
|
||||
<div class="d-flex ml-auto">
|
||||
<a class="d-flex align-items-center px-3 o_wslides_fs_exit_fullscreen" t-attf-href="/slides/slide/#{slug(slide)}">
|
||||
<i class="fa fa-sign-out d-md-none"/><span class="d-none d-md-inline-block ml-1">Exit Fullscreen</span>
|
||||
<i class="fa fa-sign-out"/><span class="d-none d-md-inline-block ml-1">Exit Fullscreen</span>
|
||||
</a>
|
||||
<a class="d-flex align-items-center px-3" t-attf-href="/slides/#{slug(slide.channel_id)}">
|
||||
<i class="fa fa-home d-md-none"/><span class="d-none d-md-inline-block ml-1">Back to course</span>
|
||||
<i class="fa fa-home"/><span class="d-none d-md-inline-block ml-1">Back to course</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -11,7 +11,7 @@ class Channel(models.Model):
|
||||
forum_total_posts = fields.Integer('Number of active forum posts', related="forum_id.total_posts")
|
||||
|
||||
_sql_constraints = [
|
||||
('forum_uniq', 'unique (forum_id)', "Only one forum per slide channel!"),
|
||||
('forum_uniq', 'unique (forum_id)', "Only one course per forum!"),
|
||||
]
|
||||
|
||||
def action_redirect_to_forum(self):
|
||||
|
||||
@@ -51,4 +51,4 @@
|
||||
<field name="view_id" ref="forum_post_view_graph_slides"/>
|
||||
<field name="domain">[('forum_id.slide_channel_ids', '!=', 'False')]</field>
|
||||
</record>
|
||||
</odoo>
|
||||
</odoo>
|
||||
|
||||
@@ -11,15 +11,15 @@
|
||||
t-att-class="'nav-link o_wprofile_navlink'" style="border-left: 0px">
|
||||
<i class="fa fa-home"/> Course</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a t-att-href="'/forum/%s' % (slug(forum))" t-att-class="'nav-link active o_wprofile_navlink'" style="border-left: 0px">Forum</a>
|
||||
</li>
|
||||
<li t-if="forum.slide_channel_id.allow_comment" class="nav-item">
|
||||
<a t-att-href="'/slides/%s?active_tab=review' % (slug(forum.slide_channel_id))"
|
||||
t-att-class="'nav-link o_wprofile_navlink'" style="border-left: 0px">
|
||||
Review
|
||||
Reviews<t t-if="forum.slide_channel_id.rating_count"> (<t t-esc="forum.slide_channel_id.rating_count"/>)</t>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a t-att-href="'/forum/%s' % (slug(forum))" t-att-class="'nav-link active o_wprofile_navlink'" style="border-left: 0px">Forum</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -2,14 +2,14 @@
|
||||
<odoo><data>
|
||||
<template id='course_main' inherit_id="website_slides.course_main">
|
||||
<!-- Channel (training) main template: add link to forum -->
|
||||
<xpath expr="//li[hasclass('o_wslides_course_header_nav_home_training')]" position="after">
|
||||
<xpath expr="//li[hasclass('o_wslides_course_header_nav_review_training')]" position="after">
|
||||
<li class="nav-item" t-if="channel.forum_id">
|
||||
<a t-att-href="'/forum/%s' % (slug(channel.forum_id))"
|
||||
t-att-class="'nav-link'" target="new">Forum</a>
|
||||
</li>
|
||||
</xpath>
|
||||
<!-- Channel (documentation) main template: add link to forum -->
|
||||
<xpath expr="//li[hasclass('o_wslides_course_header_nav_home_documentation')]" position="after">
|
||||
<xpath expr="//li[hasclass('o_wslides_course_header_nav_review_documentation')]" position="after">
|
||||
<li class="nav-item" t-if="channel.forum_id">
|
||||
<a t-att-href="'/forum/%s' % (slug(channel.forum_id))"
|
||||
t-att-class="'nav-link'" target="new">Forum</a>
|
||||
|
||||
Reference in New Issue
Block a user