diff options
Diffstat (limited to 'addons/website_forum/static/src')
3 files changed, 225 insertions, 213 deletions
diff --git a/addons/website_forum/static/src/js/tours/website_forum.js b/addons/website_forum/static/src/js/tours/website_forum.js index f93bfa48631..51a777abfdc 100644 --- a/addons/website_forum/static/src/js/tours/website_forum.js +++ b/addons/website_forum/static/src/js/tours/website_forum.js @@ -22,7 +22,7 @@ odoo.define("website_forum.tour_forum", function (require) { content: _t("Click <em>Continue</em> to create the forum."), position: "right", }, { - trigger: ".btn-lg.btn-block", + trigger: ".o_forum_ask_btn", position: "left", content: _t("Ask the question in this forum by clicking on the button."), }, { @@ -67,7 +67,7 @@ odoo.define("website_forum.tour_forum", function (require) { trigger: ".modal-header button.close", auto: true, }, { - trigger: "a[data-karma=\"20\"]:first", + trigger: ".o_wforum_validate_toggler[data-karma=\"20\"]:first", content: _t("Click here to accept this answer."), position: "right", }]); diff --git a/addons/website_forum/static/src/js/website_forum.js b/addons/website_forum/static/src/js/website_forum.js index d4e65371a58..5b22fa03c01 100644 --- a/addons/website_forum/static/src/js/website_forum.js +++ b/addons/website_forum/static/src/js/website_forum.js @@ -2,6 +2,7 @@ odoo.define('website_forum.website_forum', function (require) { 'use strict'; var core = require('web.core'); +var weDefaultOptions = require('web_editor.wysiwyg.default_options'); var wysiwygLoader = require('web_editor.loader'); var publicWidget = require('web.public.widget'); var session = require('web.session'); @@ -22,11 +23,8 @@ publicWidget.registry.websiteForum = publicWidget.Widget.extend({ 'click .flag:not(.karma_required)': '_onFlagAlertClick', 'click .vote_up:not(.karma_required), .vote_down:not(.karma_required)': '_onVotePostClick', 'click .o_js_validation_queue a[href*="/validate"]': '_onValidationQueueClick', - 'click .accept_answer:not(.karma_required)': '_onAcceptAnswerClick', - 'click .validate_answer [data-href]': '_onAcceptAnswerClick', - 'mouseenter .validate_answer [data-href]': '_onRemoveValidAnswerMouse', - 'mouseleave .validate_answer [data-href]': '_onRemoveValidAnswerMouse', - 'click .favourite_question': '_onFavoriteQuestionClick', + 'click .o_wforum_validate_toggler:not(.karma_required)': '_onAcceptAnswerClick', + 'click .o_wforum_favourite_toggle': '_onFavoriteQuestionClick', 'click .comment_delete': '_onDeleteCommentClick', 'click .js_close_intro': '_onCloseIntroClick', }, @@ -49,6 +47,10 @@ publicWidget.registry.websiteForum = publicWidget.Widget.extend({ ); $('.forum_register_url').attr('href', forumLogin); + // Initialize forum's tooltips + this.$('[data-toggle="tooltip"]').tooltip({delay: 0}); + this.$('[data-toggle="popover"]').popover({offset: 8}); + $('input.js_select2').select2({ tags: true, tokenSeparators: [',', ' ', '_'], @@ -127,9 +129,11 @@ publicWidget.registry.websiteForum = publicWidget.Widget.extend({ toolbar.push(['history', ['undo', 'redo']]); var options = { - height: 150, + height: 200, + minHeight: 80, toolbar: toolbar, styleWithSpan: false, + styleTags: _.without(weDefaultOptions.styleTags, 'h1', 'h2', 'h3'), recordInfo: { context: self._getContext(), res_model: 'forum.post', @@ -151,12 +155,13 @@ publicWidget.registry.websiteForum = publicWidget.Widget.extend({ }); }); - // Check all answer status to add text-success on answer if needed - _.each($('.accept_answer'), function (el) { - var $el = $(el); - if ($el.hasClass('oe_answer_true')) { - $el.addClass('text-success'); - } + _.each(this.$('.o_wforum_bio_popover'), authorBox => { + $(authorBox).popover({ + trigger: 'hover', + offset: 10, + animation: false, + html: true, + }); }); return this._super.apply(this, arguments); @@ -278,9 +283,9 @@ publicWidget.registry.websiteForum = publicWidget.Widget.extend({ _onVotePostClick: function (ev) { var self = this; ev.preventDefault(); - var $link = $(ev.currentTarget); + var $btn = $(ev.currentTarget); this._rpc({ - route: $link.data('href'), + route: $btn.data('href'), }).then(function (data) { if (data.error) { var message; @@ -296,17 +301,28 @@ publicWidget.registry.websiteForum = publicWidget.Widget.extend({ sticky: false, }); } else { - $link.parent().find('.vote_count').html(data.vote_count); - if (data.user_vote === 0) { - $link.parent().find('.text-success').removeClass('text-success'); - $link.parent().find('.text-warning').removeClass('text-warning'); - } else { - if (data.user_vote === 1) { - $link.addClass('text-success'); - } else { - $link.addClass('text-warning'); - } + var $container = $btn.closest('.vote'); + var $items = $container.children(); + var $voteUp = $items.filter('.vote_up'); + var $voteDown = $items.filter('.vote_down'); + var $voteCount = $items.filter('.vote_count'); + var userVote = parseInt(data['user_vote']); + + $voteUp.prop('disabled', userVote === 1); + $voteDown.prop('disabled', userVote === -1); + + $items.removeClass('text-success text-danger text-muted o_forum_vote_animate'); + void $container[0].offsetWidth; // Force a refresh + + if (userVote === 1) { + $voteUp.addClass('text-success'); + $voteCount.addClass('text-success'); + } + if (userVote === -1) { + $voteDown.addClass('text-danger'); + $voteCount.addClass('text-danger'); } + $voteCount.html(data['vote_count']).addClass('o_forum_vote_animate'); } }); }, @@ -318,11 +334,14 @@ publicWidget.registry.websiteForum = publicWidget.Widget.extend({ ev.preventDefault(); var $link = $(ev.currentTarget); $link.parents('.post_to_validate').hide(); - $.get($link.attr('href')).then(function () { + $.get($link.attr('href')).then(() => { var left = $('.o_js_validation_queue:visible').length; var type = $('h2.o_page_header a.active').data('type'); $('#count_post').text(left); $('#moderation_tools a[href*="/' + type + '_"]').find('strong').text(left); + if (!left) { + this.$('.o_caught_up_alert').removeClass('d-none'); + } }, function () { $link.parents('.o_js_validation_queue > div').addClass('bg-danger text-white').css('background-color', '#FAA'); $link.parents('.post_to_validate').show(); @@ -333,38 +352,35 @@ publicWidget.registry.websiteForum = publicWidget.Widget.extend({ * @param {Event} ev */ _onAcceptAnswerClick: function (ev) { - var self = this; ev.preventDefault(); - var self = this; - var $acceptAnswerLinks = this.$('.accept_answer'); var $link = $(ev.currentTarget); + var target = $link.data('target'); + this._rpc({ route: $link.data('href'), - }).then(function (data) { + }).then(data => { if (data.error) { if (data.error === 'anonymous_user') { var message = _t("Sorry, anonymous users cannot choose correct answer."); } - self.call('crash_manager', 'show_warning', { + this.call('crash_manager', 'show_warning', { message: message, title: _t("Access Denied"), }, { sticky: false, }); } else { - $acceptAnswerLinks.removeClass('oe_answer_true') - .addClass('oe_answer_false'); - $link.toggleClass('oe_answer_true', !!data) - .toggleClass('oe_answer_false', !data); - - // TODO in master, review the utility of this function... - self._onCheckAnswerStatus(ev); + _.each(this.$('.forum_answer'), answer => { + var $answer = $(answer); + var isCorrect = $answer.is(target) ? data : false; + var $toggler = $answer.find('.o_wforum_validate_toggler'); + var newHelper = isCorrect ? $toggler.data('helper-decline') : $toggler.data('helper-accept'); - // If we are removing an accepted answer, reload the page as the - // design is quite different with or without an accepted answer. - if ($link.closest('.validate_answer').length) { - window.location.reload(); - } + $answer.toggleClass('o_wforum_answer_correct', isCorrect); + $toggler.tooltip('dispose') + .attr('data-original-title', newHelper) + .tooltip({delay: 0}); + }); } }); }, @@ -372,33 +388,14 @@ publicWidget.registry.websiteForum = publicWidget.Widget.extend({ * @private * @param {Event} ev */ - _onRemoveValidAnswerMouse: function (ev) { - var hover = (ev.type === 'mouseenter'); - $(ev.currentTarget).find('.fa') - .toggleClass('fa-times-circle text-danger', hover) - .toggleClass('fa-check-circle text-success', !hover); - }, - /** - * @private - * @param {Event} ev - */ - _onCheckAnswerStatus: function (ev) { - _.each(this.$('.accept_answer'), function (link) { - var $link = $(link); - $link.toggleClass('text-success', $link.hasClass('oe_answer_true')); - }); - }, - /** - * @private - * @param {Event} ev - */ _onFavoriteQuestionClick: function (ev) { ev.preventDefault(); var $link = $(ev.currentTarget); this._rpc({ route: $link.data('href'), }).then(function (data) { - $link.toggleClass('forum_favourite_question', !!data); + $link.toggleClass('o_wforum_gold fa-star', data) + .toggleClass('fa-star-o text-muted', !data); }); }, /** @@ -408,10 +405,19 @@ publicWidget.registry.websiteForum = publicWidget.Widget.extend({ _onDeleteCommentClick: function (ev) { ev.preventDefault(); var $link = $(ev.currentTarget); + var $container = $link.closest('.o_wforum_post_comments_container'); + this._rpc({ route: $link.closest('form').attr('action'), }).then(function () { - $link.parents('.comment').first().remove(); + $link.closest('.o_wforum_post_comment').remove(); + + var count = $container.find('.o_wforum_post_comment').length; + if (count) { + $container.find('.o_wforum_comments_count').text(count); + } else { + $container.find('.o_wforum_comments_count_header').remove(); + } }); }, /** diff --git a/addons/website_forum/static/src/scss/website_forum.scss b/addons/website_forum/static/src/scss/website_forum.scss index 8694ecc77ab..c9ff7de71c1 100644 --- a/addons/website_forum/static/src/scss/website_forum.scss +++ b/addons/website_forum/static/src/scss/website_forum.scss @@ -1,178 +1,195 @@ -$gold: #ffcc00; +$gold: #eca801; $silver: #cccccc; $bronze: #eea91e; .website_forum { + .o_forum_ask_btn { + @include media-breakpoint-up(md) { + box-shadow: $box-shadow; + width: 200px; + } + } + + .o_wforum_nav .nav-link { + @include o-hover-text-color($body-color, $link-color); + line-height: 1; + + .fa { + opacity: 0.5; + } + + &:hover, &.active { + .fa { + opacity: 1; + } + } - .question-block .question-name { - max-width: 80%; + &.active { + background-color: rgba(theme-color('info'), 0.1); + color: darken(theme-color('info'), 15%)!important; + } } - .o_post_content { + // Single Post + .o_wforum_post, .note-editable.panel-body { + word-wrap: break-word; + pre { - padding: 1.5rem; - border-radius: 5px; - color: $white; - background-color: $gray-700; + color: color-yiq(gray('100')); + border-radius: $border-radius; + padding: 1rem; + background-color: gray('100'); + white-space: pre-wrap; } + blockquote { position: relative; - padding-left: 3rem; - border-left: 2px solid $gray-500; - font-style: italic; - font-weight: lighter; + padding-left: 1em; + border-left: .25em solid gray('500'); + color: gray('600'); } - word-wrap: break-word; } - .vote { - min-width: 38px; - margin-right: 12px; - .vote_count { - font-weight: bold; - line-height: 12px; - font-size: 160%; - } - .vote_down, - .vote_up { - font-size: 130%; + .o_wforum_readable { + max-width: 700px; + + p { + margin-bottom: 0.5rem; } } - .post_to_validate { - overflow: hidden; - .validate_answer { - display: none; + textarea.o_wysiwyg_loader + .note-editor { + border: 0; + + .note-toolbar { + @include border-top-radius($border-radius); + height: 32px; } - } - .validate_answer { - @include o-position-absolute(0, auto, 0, 0); - width: 4px; - height: 100%; - z-index: 1; // On top of card content if an alert is displayed inside + .note-editable, .note-statusbar { + border: 1px solid $border-color; + border-width: 0 1px; + } - > .bg-success { - @include o-position-absolute(0, 0, 0, 0); + .note-statusbar { + display: block; + border-bottom-width: 1px; } - > span { - @include o-position-absolute(10px, 50%); - transform: translateX(50%); - font-size: 20px; + } - &[data-href] { - cursor: pointer; + .o_wforum_author_box { + &.o_show_info { + line-height: 1.2; + img { + @include size(2em); } + } + + &.o_compact { + line-height: 1; - i { - padding: 2px 3px; - border-radius: 100%; + img { + @include size(1.4em); } } - } - .user_name_people { - font-weight: bold; - max-width: 60%; } - .oe_answer_true { - color: theme-color('success'); - &:hover { - color: lighten(theme-color('success'), 20%); + .forum_answer { + .o_wforum_answer_correct_badge { + display: none; } - } - .oe_answer_false { - color: $gray-400; - &:hover { - color: $gray-600; + .o_wforum_author_box_check { + @include size(1em); + display: none; + top: 0; + right: -3px; + box-shadow: 0 0 0 2px white; + line-height: .8; } - } - .favourite_question { - color: $gray-400 !important; + .o_wforum_validate_toggler { + @include o-hover-text-color(gray('400'), lighten(theme-color('success'), 20%)); + } - &.forum_favourite_question { - color: $gold !important; + &.o_wforum_answer_correct { + .o_wforum_answer_correct_badge, .o_wforum_author_box .o_wforum_author_box_check { + display: inline; + } + + .o_wforum_validate_toggler { + @include o-hover-text-color(theme-color('success'), theme-color('warning')); + + &:hover .fa.fa-check:before { + content: '\f00d'; + } + } + + .o_wforum_answer_header .o_wforum_author_pic { + border: 2px solid $success; + padding: 3px; + } } } - .oe_grey { - background-color: #eeeeee; + .o_wforum_gold { + color: $gold; } - a.no-decoration { cursor: pointer; text-decoration: none !important; } - .close.comment_delete { - font-size: 0.875rem; - float: none; - opacity: 1; - font-weight: 300; - line-height: 1.5; - } - .country_flag { - display: inline-block; - margin-left: 2px; - max-height: 13px; - width: auto !important; - } - .forum_answer img, .question-block img { max-width: 100% } +} - img.country_flag_people { - @include o-position-absolute(0,0); - max-height: 25px; - width: auto; - } +.website_forum, .o_wforum_profile_tab { + .vote { + .vote_count { + line-height: 1; + animation-play-state: paused; - .tag_text .text-core .text-wrap { - .text-dropdown, - .text-prompt, - input, - textarea { - font: 1.2em "Helvetica Neue", Helvetica, Arial, sans-serif !important; + &.o_forum_vote_animate { + animation: bounceIn 0.3s ease running; + } } - .text-tags .text-tag .text-button { - font: 1.2em "Helvetica Neue", Helvetica, Arial, sans-serif !important; - height: 1.2em !important; + .vote_down, .vote_up { + line-height: 0.5; + font-size: 1.1em; + @include o-hover-text-color(rgba($text-muted, 0.5), theme-color('success')); } - } - .oe_forum_email_required { - position: absolute; - margin-top: 155px; - margin-left: 500px; - margin-right: 100px; - z-index: 5; - } + .vote_down { + @include o-hover-text-color(rgba($text-muted, 0.5), theme-color('danger')); + } - button.btn-link.text-muted { - color: $gray-600; + &.o_wforum_vote_vertical { + @include media-breakpoint-up(sm) { + font-size: 1.2em; + } + } } } -.o_forum_tag_follow_box { - position: absolute; - display: none; - z-index: 1; - text-align: center; - opacity: 0.9; -} +.o_js_forum_tag_follow { + .badge { + font-size: 100%; + } -.forum_answer { - position: relative; -} + .o_forum_tag_follow_box { + @include o-position-absolute(100%, auto, auto, 0); + display: none; + z-index: 1; -.o_wforum_post_count_answer_count { - border-left: 3px solid; + .card { + padding: ($grid-gutter-width*0.5) - 1px; + } + } } .o_profile_main { @@ -180,44 +197,33 @@ $bronze: #eea91e; } img.o_forum_avatar { - max-height: 40px; - margin-right: 10px; - width: auto; + @include size(40px); + object-fit: cover; } img.o_forum_avatar_big { - max-width: 75px; - margin-right: 10px; - width: auto; + @include size(75px); + object-fit: cover; } -.o_forum_user_bio_expand { - position: absolute; - display: none; - z-index: 200; -} +.o_wforum_bio_popover_wrap { + .o_wforum_bio_popover_name { + address > div, span[data-oe-model="res.country"] { + display: flex; + align-items: center; + } + span[data-oe-model="res.country"] { + margin-left: 10px; + } + } -.o_forum_tooltip_heading { - padding: 0; - margin: 0; - font-size: 18px; -} + .o_wforum_bio_popover_info .css_editable_mode_hidden > div:last-child > .o_forum_tooltip_line { + margin-top: -0.5rem; // compensate parent 'mt-2' class + } -.o_forum_user_bio { - color: $black; - width: 318px; - min-height: 100px; - cursor: auto; - border: 1px solid darkgray; - background-color: whitesmoke; - line-height: 13px; - font-size: 11px; - word-wrap: break-word; - .o_forum_tooltip_line { - min-height: 13px; - } - .o_forum_tooltip_header { - min-height: 75px; + .o_wforum_bio_popover_bio p { + margin-top: 8px; + margin-bottom: 0; } } |