diff --git a/addons/website_event_track/static/src/scss/event_track_templates_online.scss b/addons/website_event_track/static/src/scss/event_track_templates_online.scss index f6d2aec008c..170bc4c8028 100644 --- a/addons/website_event_track/static/src/scss/event_track_templates_online.scss +++ b/addons/website_event_track/static/src/scss/event_track_templates_online.scss @@ -44,11 +44,11 @@ .o_wesession_track_main { // Force side panel min-width to account for potential Youtube chat // And adapt main panel max-width accordingly. - @include media-breakpoint-up(xl) { + @include media-breakpoint-up(md) { max-width: calc(100% - 22rem); } - @media screen and (min-width: 1400px) { + @media screen and (min-width: 1900px) { // return to bootstrap value for col-lg-9 / 10 breakpoint if screen is big enough &.col-lg-9 { max-width: 75%; @@ -63,11 +63,11 @@ // Left panel: other tracks .o_wesession_track_aside { // Force side panel min-width to account for potential Youtube chat - @include media-breakpoint-up(xl) { + @include media-breakpoint-up(md) { min-width: 22rem; } - @media screen and (min-width: 1400px) { + @media screen and (min-width: 1900px) { min-width: auto; } diff --git a/addons/website_event_track_live/static/src/js/website_event_track_live.js b/addons/website_event_track_live/static/src/js/website_event_track_live.js index a330308de63..f44d70768c7 100644 --- a/addons/website_event_track_live/static/src/js/website_event_track_live.js +++ b/addons/website_event_track_live/static/src/js/website_event_track_live.js @@ -44,6 +44,15 @@ publicWidget.registry.websiteEventTrackLive = publicWidget.Widget.extend({ }, _onVideoEnded: function () { + if (this.$el.data('hasNextSuggestion')) { + // if we have an upcoming suggestion, add a covering block to avoid + // showing Youtube suggestions while we fetch the appropriate suggestion + // using a rpc. This allows avoiding a 'flicker' effect. + this.$el.append($('
', { + class:'owevent_track_suggestion_loading position-absolute w-100' + })); + } + var self = this; this._rpc({ route: '/event_track/get_track_suggestion', @@ -59,6 +68,7 @@ publicWidget.registry.websiteEventTrackLive = publicWidget.Widget.extend({ _onReplay: function () { this.youtubePlayer.seekTo(0); this.youtubePlayer.playVideo(); + this.$('.owevent_track_suggestion_loading').remove(); if (this.trackSuggestion) { delete this.trackSuggestion; } diff --git a/addons/website_event_track_live/static/src/scss/website_event_track_live.scss b/addons/website_event_track_live/static/src/scss/website_event_track_live.scss index 28571e01ffa..d9e4623ab00 100644 --- a/addons/website_event_track_live/static/src/scss/website_event_track_live.scss +++ b/addons/website_event_track_live/static/src/scss/website_event_track_live.scss @@ -14,7 +14,16 @@ } } +.owevent_track_suggestion_loading { + z-index: 1; + background-color: #434343; + height: 85vh; + top: 0px; + left: 0px; +} + .owevent_track_suggestion { + z-index: 2; background-color: #888888; background-repeat: no-repeat; background-size: 100% 100%; diff --git a/addons/website_event_track_live/views/event_track_templates_page.xml b/addons/website_event_track_live/views/event_track_templates_page.xml index 1ac7dfd2748..37dd813c003 100644 --- a/addons/website_event_track_live/views/event_track_templates_page.xml +++ b/addons/website_event_track_live/views/event_track_templates_page.xml @@ -20,7 +20,8 @@