[IMP] website: events redesign

This PR improves the overall design of all the views in the Frontend
side of the module Event.
The design was outdated and was not consistent between the different
pages.

List of changes:
- events: cleaning of scss, filters consistency and responsive
(with off-canvas).
- submenu: design and responsive behavior (dropdown)
- registration page : overall design and the ticket list is inside a
modal, to help with cases like having a lot of tickets. To be improved,
on a separate page instead of a modal.
- talks and agenda: design, cleaning of scss, filters consistency and
responsive (with off-canvas).
- sponsor template: minor design modification
- exhibitors: design, cleaning of scss, filters consistency and responsive
(with off-canvas).
- location: minor design modification to be consistent with others pages,
but need improvement in the near future.
- meet: design, cleaning of scss
- booth selection: overall design

task-3083658

closes odoo/odoo#137729

Signed-off-by: Xavier Dollé (xdo) <xdo@odoo.com>
This commit is contained in:
Odoo's Mergebot
2023-10-31 13:26:38 +00:00
committed by Odoo Online
53 changed files with 1251 additions and 1253 deletions
@@ -6,28 +6,23 @@
<field name="sequence">1</field> <field name="sequence">1</field>
<field name="image_1920" type="base64" file="event_booth/static/src/img/standard-booth.jpeg"/> <field name="image_1920" type="base64" file="event_booth/static/src/img/standard-booth.jpeg"/>
<field name="description" type="html"> <field name="description" type="html">
<div class="card text-center shadow-sm mt32"> <ul class="list-group list-group-flush">
<div class="o_wevent_theme_bg_dark card-header p-4"> <li class="list-group-item">
<h4 class="text-white m-0">Standard</h4> <span>1 Branded Booth</span>
</div> </li>
<ul class="list-group list-group-flush"> <li class="list-group-item">
<li class="list-group-item"> <span>4m²</span>
<span>1 Branded Booth</span> </li>
</li> <li class="list-group-item">
<li class="o_wevent_theme_bg_dark list-group-item"> <span>46" display screen</span>
<span class="text-white">4m²</span> </li>
</li> <li class="list-group-item">
<li class="list-group-item"> <span>1 desk</span>
<span>46" display screen</span> </li>
</li> <li class="list-group-item">
<li class="list-group-item"> <span>Logo &amp; link on website</span>
<span>1 desk</span> </li>
</li> </ul>
<li class="list-group-item">
<span>Logo &amp; link on website</span>
</li>
</ul>
</div>
</field> </field>
</record> </record>
@@ -36,16 +31,12 @@
<field name="sequence">2</field> <field name="sequence">2</field>
<field name="image_1920" type="base64" file="event_booth/static/src/img/premium-booth.jpeg"/> <field name="image_1920" type="base64" file="event_booth/static/src/img/premium-booth.jpeg"/>
<field name="description" type="html"> <field name="description" type="html">
<div class="card text-center shadow-sm mt32">
<div class="card-header p-4 bg-secondary">
<h4 class="text-white m-0">Premium</h4>
</div>
<ul class="list-group list-group-flush"> <ul class="list-group list-group-flush">
<li class="list-group-item"> <li class="list-group-item">
<span>1 Branded Booth</span> <span>1 Branded Booth</span>
</li> </li>
<li class="list-group-item bg-secondary"> <li class="list-group-item">
<span class="text-white">4m²</span> <span>4m²</span>
</li> </li>
<li class="list-group-item"> <li class="list-group-item">
<span>46" display screen</span> <span>46" display screen</span>
@@ -63,7 +54,6 @@
<span>10 + 1 passes</span> <span>10 + 1 passes</span>
</li> </li>
</ul> </ul>
</div>
</field> </field>
</record> </record>
@@ -72,16 +62,12 @@
<field name="sequence">3</field> <field name="sequence">3</field>
<field name="image_1920" type="base64" file="event_booth/static/src/img/vip-booth.jpeg"/> <field name="image_1920" type="base64" file="event_booth/static/src/img/vip-booth.jpeg"/>
<field name="description" type="html"> <field name="description" type="html">
<div class="card text-center shadow-sm mt32">
<div class="card-header p-4 bg-primary">
<h4 class="text-white m-0">VIP</h4>
</div>
<ul class="list-group list-group-flush"> <ul class="list-group list-group-flush">
<li class="list-group-item"> <li class="list-group-item">
<span>2 Branded Booth</span> <span>2 Branded Booth</span>
</li> </li>
<li class="list-group-item bg-primary"> <li class="list-group-item">
<span class="text-white">8m²</span> <span>8m²</span>
</li> </li>
<li class="list-group-item"> <li class="list-group-item">
<span>2 x 46" display screens</span> <span>2 x 46" display screens</span>
@@ -99,7 +85,6 @@
<span>10 + 1 passes</span> <span>10 + 1 passes</span>
</li> </li>
</ul> </ul>
</div>
</field> </field>
</record> </record>
@@ -4,6 +4,9 @@ import { registry } from "@web/core/registry";
import wsTourUtils from '@website_sale/js/tours/tour_utils'; import wsTourUtils from '@website_sale/js/tours/tour_utils';
var registerSteps = [{ var registerSteps = [{
content: "Open ticket modal",
trigger: 'button.btn-primary:contains("Register")',
}, {
content: "Select 2 units of 'Ticket1' ticket type", content: "Select 2 units of 'Ticket1' ticket type",
trigger: '#o_wevent_tickets_collapse .row.o_wevent_ticket_selector[name="Ticket1"] select', trigger: '#o_wevent_tickets_collapse .row.o_wevent_ticket_selector[name="Ticket1"] select',
run: 'text 2', run: 'text 2',
@@ -31,25 +31,23 @@ var discoverTalkSteps = function (talkName, fromList, reminderOn, toggleReminder
steps = steps.concat([{ steps = steps.concat([{
content: `Check Favorite for ${talkName} was already on`, content: `Check Favorite for ${talkName} was already on`,
trigger: 'div.o_wetrack_js_reminder i.fa-bell', trigger: 'div.o_wetrack_js_reminder i.fa-bell',
extra_trigger: 'span.o_wetrack_js_reminder_text:contains("Favorite On")',
run: function () {}, // it's a check run: function () {}, // it's a check
}]); }]);
} }
else { else {
steps = steps.concat([{ steps = steps.concat([{
content: `Check Favorite for ${talkName} was off`, content: `Check Favorite for ${talkName} was off`,
trigger: 'span.o_wetrack_js_reminder_text:contains("Set Favorite")', trigger: 'div.o_wetrack_js_reminder i.fa-bell-o',
run: function () {}, // it's a check run: function () {}, // it's a check
}]); }]);
if (toggleReminder) { if (toggleReminder) {
steps = steps.concat([{ steps = steps.concat([{
content: "Set Favorite", content: "Set Favorite",
trigger: 'span.o_wetrack_js_reminder_text', trigger: 'div.o_wetrack_js_reminder',
run: 'click', run: 'click',
}, { }, {
content: `Check Favorite for ${talkName} is now on`, content: `Check Favorite for ${talkName} is now on`,
trigger: 'div.o_wetrack_js_reminder i.fa-bell', trigger: 'div.o_wetrack_js_reminder i.fa-bell',
extra_trigger: 'span.o_wetrack_js_reminder_text:contains("Favorite On")',
run: function () {}, // it's a check run: function () {}, // it's a check
}]); }]);
} }
@@ -81,9 +79,12 @@ var discoverRoomSteps = function (roomName) {
var registerSteps = [{ var registerSteps = [{
content: 'Go on Register', content: 'Go on Register',
trigger: 'a.btn-primary:contains("Register")', trigger: 'a.btn-primary:contains("Register")',
}, {
content: 'Open ticket modal',
trigger: 'button.btn-primary:contains("Register")',
}, { }, {
content: "Select 2 units of 'Standard' ticket type", content: "Select 2 units of 'Standard' ticket type",
trigger: '#o_wevent_tickets_collapse .row:has(.o_wevent_registration_multi_select:contains("Free")) select', trigger: '.o_wevent_ticket_selector select',
run: 'text 2', run: 'text 2',
}, { }, {
content: "Click on 'Register' button", content: "Click on 'Register' button",
@@ -119,7 +120,7 @@ var registerSteps = [{
trigger: 'a:contains("register to your favorites talks now")', trigger: 'a:contains("register to your favorites talks now")',
run: 'click', run: 'click',
}, { }, {
trigger: 'h1:contains("Book your talks")', trigger: 'h4:contains("Book your talks")',
run: function() {}, run: function() {},
}]; }];
@@ -139,7 +140,7 @@ var browseTalksSteps = [{
trigger: 'a:contains("Talks")', trigger: 'a:contains("Talks")',
}, { }, {
content: 'Check we are on the talk list page', content: 'Check we are on the talk list page',
trigger: 'h1:contains("Book your talks")', trigger: 'h4:contains("Book your talks")',
run: function () {} // check run: function () {} // check
}]; }];
@@ -148,7 +149,7 @@ var browseMeetSteps = [{
trigger: 'a:contains("Community")', trigger: 'a:contains("Community")',
}, { }, {
content: 'Check we are on the community page', content: 'Check we are on the community page',
trigger: 'span:contains("Join a room")', trigger: 'h3:contains("Join a room")',
run: function () {} // check run: function () {} // check
}]; }];
+2 -2
View File
@@ -2585,8 +2585,8 @@ Sitemap: <t t-esc="url_root"/>sitemap.xml
<template id="website_search_box" name="Website Searchbox"> <template id="website_search_box" name="Website Searchbox">
<div t-attf-class="input-group #{_classes}" role="search"> <div t-attf-class="input-group #{_classes}" role="search">
<t t-set="search_placeholder">Search...</t> <t t-set="search_placeholder">Search...</t>
<input type="search" name="search" t-att-class="'search-query form-control oe_search_box %s' % _input_classes" t-att-placeholder="placeholder if placeholder else search_placeholder" t-att-value="search"/> <input type="search" name="search" t-att-class="'search-query form-control oe_search_box border-0 bg-light %s' % _input_classes" t-att-placeholder="placeholder if placeholder else search_placeholder" t-att-value="search"/>
<button type="submit" t-att-class="'btn oe_search_button %s' % (_submit_classes or 'btn-primary')" aria-label="Search" title="Search"> <button type="submit" t-att-class="'btn oe_search_button %s' % (_submit_classes or 'btn-light')" aria-label="Search" title="Search">
<i class="oi oi-search"/> <i class="oi oi-search"/>
<span t-if="search" class="oe_search_found"> <span t-if="search" class="oe_search_found">
<small>(<t t-out="search_count or 0"/> found)</small> <small>(<t t-out="search_count or 0"/> found)</small>
+8 -8
View File
@@ -34,7 +34,7 @@
<p class="lead mb-3">Every year we invite our community, partners and end-users to come and meet us! It's the ideal event to get together and present new features, roadmap of future versions, achievements of the software, workshops, training sessions, etc....</p> <p class="lead mb-3">Every year we invite our community, partners and end-users to come and meet us! It's the ideal event to get together and present new features, roadmap of future versions, achievements of the software, workshops, training sessions, etc....</p>
<p class="mb-3">This event is also an opportunity to showcase our partners' case studies, methodology or developments. Be there and see directly from the source the features of the version 12! <p class="mb-3">This event is also an opportunity to showcase our partners' case studies, methodology or developments. Be there and see directly from the source the features of the version 12!
</p> </p>
<div class="o_wevent_theme_bg_light rounded-end border-start border-secondary p-3 mb-5" style="border-start-width: 3px !important;"> <div class="text-bg-light border-start border-2 border-secondary p-3">
<p class="mb-0"><i class="fa fa-info-circle me-2"/>This event and all the conferences are in <b>English</b>!</p> <p class="mb-0"><i class="fa fa-info-circle me-2"/>This event and all the conferences are in <b>English</b>!</p>
</div> </div>
<h5 class="mb-2">What's new?</h5> <h5 class="mb-2">What's new?</h5>
@@ -51,11 +51,11 @@
<li><b>Business Room</b> - To discuss implementation methodologies, best sales practices, etc.</li> <li><b>Business Room</b> - To discuss implementation methodologies, best sales practices, etc.</li>
<li><b>Workshop Room</b> - Mainly for developers.</li> <li><b>Workshop Room</b> - Mainly for developers.</li>
</ul> </ul>
<div class="o_wevent_theme_bg_light rounded-end border-start border-secondary p-3 mb-3" style="border-start-width: 3px !important;"> <div class="rounded-end border-start border-secondary p-3 mb-3" style="border-start-width: 3px !important;">
<p class="mb-0"><em>If you wish to make a presentation, please send your topic proposal as soon as possible for approval to Mr. Famke Jenssens at ngh (a) yourcompany (dot) com. The presentations should be, for example, a presentation of a community module, a case study, methodology feedback, technical, etc. Each presentation must be in English.</em></p> <p class="mb-0"><em>If you wish to make a presentation, please send your topic proposal as soon as possible for approval to Mr. Famke Jenssens at ngh (a) yourcompany (dot) com. The presentations should be, for example, a presentation of a community module, a case study, methodology feedback, technical, etc. Each presentation must be in English.</em></p>
</div> </div>
<p class="mb-3">For any additional information, please contact us at <a href="mailto:events@yourcompany.com">events@yourcompany.com</a>.</p> <p class="mb-3">For any additional information, please contact us at <a href="mailto:events@yourcompany.com">events@yourcompany.com</a>.</p>
<div class="o_wevent_theme_bg_light rounded-end border-start border-secondary p-3 mb-5" style="border-start-width: 3px !important;"> <div class="text-bg-light border-start border-2 border-secondary p-3">
<p class="mb-0">OpenElec Applications reserves the right to cancel, re-name or re-locate the event or change the dates on which it is held.</p> <p class="mb-0">OpenElec Applications reserves the right to cancel, re-name or re-locate the event or change the dates on which it is held.</p>
</div> </div>
</div> </div>
@@ -79,7 +79,7 @@
<p class="lead mb-3">Around one hundred ballons will simultaneously take flight and turn the sky into a beautiful canvas of colours.</p> <p class="lead mb-3">Around one hundred ballons will simultaneously take flight and turn the sky into a beautiful canvas of colours.</p>
<p class="lead mb-3">This is the perfect place for spending a nice day with your family, we guarantee you will be leaving with beautiful everlasting memories!</p> <p class="lead mb-3">This is the perfect place for spending a nice day with your family, we guarantee you will be leaving with beautiful everlasting memories!</p>
<p class="mb-3">For any additional information, please contact us at <a href="mailto:events@yourcompany.com">events@yourcompany.com</a>.</p> <p class="mb-3">For any additional information, please contact us at <a href="mailto:events@yourcompany.com">events@yourcompany.com</a>.</p>
<div class="o_wevent_theme_bg_light rounded-end border-start border-secondary p-3 mb-5" style="border-start-width: 3px !important;"> <div class="text-bg-light border-start border-2 border-secondary p-3">
<p class="mb-1">We reserve the right to cancel, re-name or re-locate the event or change the dates on which it is held in case the weather fails us.</p> <p class="mb-1">We reserve the right to cancel, re-name or re-locate the event or change the dates on which it is held in case the weather fails us.</p>
<p class="mb0">The safety of our attendees and our aeronauts comes first!</p> <p class="mb0">The safety of our attendees and our aeronauts comes first!</p>
</div> </div>
@@ -116,7 +116,7 @@
<p>For any additional information, please contact us at <a href="mailto:events@odoo.com">events@odoo.com</a></p> <p>For any additional information, please contact us at <a href="mailto:events@odoo.com">events@odoo.com</a></p>
<section class="s_we_speaker o_wevent_theme_bg_light p-3 mb-4" itemscope="itemscope" itemtype="http://schema.org/Person" itemprop="performer"> <section class="s_we_speaker p-3 mb-4" itemscope="itemscope" itemtype="http://schema.org/Person" itemprop="performer">
<span class="badge text-bg-secondary o_wevent_badge float-end">SPEAKER</span> <span class="badge text-bg-secondary o_wevent_badge float-end">SPEAKER</span>
<img src="/mail/static/src/img/odoobot.png" width="70" class="img-fluid rounded-circle float-start me-3" alt=""/> <img src="/mail/static/src/img/odoobot.png" width="70" class="img-fluid rounded-circle float-start me-3" alt=""/>
<div class="overflow-hidden"> <div class="overflow-hidden">
@@ -148,7 +148,7 @@
<p class="lead mb-3">Bands like Bar Fighters, Led Slippers and Link Floyd will offer you the show of the century during our three day event.</p> <p class="lead mb-3">Bands like Bar Fighters, Led Slippers and Link Floyd will offer you the show of the century during our three day event.</p>
<p class="lead mb-3">This is the perfect place for spending a nice time with your friends while listening to some of the most iconic rock songs of all times!</p> <p class="lead mb-3">This is the perfect place for spending a nice time with your friends while listening to some of the most iconic rock songs of all times!</p>
<p class="mb-3">For any additional information, please contact us at <a href="mailto:events@yourcompany.com">events@yourcompany.com</a>.</p> <p class="mb-3">For any additional information, please contact us at <a href="mailto:events@yourcompany.com">events@yourcompany.com</a>.</p>
<div class="o_wevent_theme_bg_light rounded-end border-start border-secondary p-3 mb-5" style="border-start-width: 3px !important;"> <div class="text-bg-light border-start border-2 border-secondary p-3">
<p class="mb-1">We reserve the right to cancel, re-name or re-locate the event or change the dates on which it is held in case the weather fails us.</p> <p class="mb-1">We reserve the right to cancel, re-name or re-locate the event or change the dates on which it is held in case the weather fails us.</p>
</div> </div>
</div> </div>
@@ -181,7 +181,7 @@
to chat with experienced players and trainers once the tournament is over! to chat with experienced players and trainers once the tournament is over!
</p> </p>
<p class="mb-3">For any additional information, please contact us at <a href="mailto:events@yourcompany.com">events@yourcompany.com</a>.</p> <p class="mb-3">For any additional information, please contact us at <a href="mailto:events@yourcompany.com">events@yourcompany.com</a>.</p>
<div class="o_wevent_theme_bg_light rounded-end border-start border-secondary p-3 mb-5" style="border-start-width: 3px !important;"> <div class="text-bg-light border-start border-2 border-secondary p-3">
<p class="mb-1">We reserve the right to cancel, re-name or re-locate the event or change the dates on which it is held in case the weather fails us.</p> <p class="mb-1">We reserve the right to cancel, re-name or re-locate the event or change the dates on which it is held in case the weather fails us.</p>
</div> </div>
</div> </div>
@@ -215,7 +215,7 @@
Special discount codes will be handed out during the various streams, make sure to be there on time. Special discount codes will be handed out during the various streams, make sure to be there on time.
</p> </p>
<p class="mb-3">For any additional information, please contact us at <a href="mailto:events@openwood.example.com">events@penwood.example.com</a>.</p> <p class="mb-3">For any additional information, please contact us at <a href="mailto:events@openwood.example.com">events@penwood.example.com</a>.</p>
<div class="o_wevent_theme_bg_light rounded-end border-start border-secondary p-3 mb-5" style="border-start-width: 3px !important;"> <div class="text-bg-light border-start border-2 border-secondary p-3">
<p class="mb-1">This event is fully online and FREE, if you have paid for tickets, you should get a refund.<br/> <p class="mb-1">This event is fully online and FREE, if you have paid for tickets, you should get a refund.<br/>
It will require a good Internet connection to get the best video quality.</p> It will require a good Internet connection to get the best video quality.</p>
</div> </div>
@@ -4,7 +4,6 @@
publicWidget.registry.ticketDetailsWidget = publicWidget.Widget.extend({ publicWidget.registry.ticketDetailsWidget = publicWidget.Widget.extend({
selector: '.o_wevent_js_ticket_details', selector: '.o_wevent_js_ticket_details',
events: { events: {
'click .o_wevent_registration_btn': '_onTicketDetailsClick',
'change .form-select': '_onTicketQuantityChange' 'change .form-select': '_onTicketQuantityChange'
}, },
start: function (){ start: function (){
@@ -30,24 +29,6 @@
//-------------------------------------------------------------------------- //--------------------------------------------------------------------------
// Handlers // Handlers
//-------------------------------------------------------------------------- //--------------------------------------------------------------------------
/**
* When the "Fold Tickets Details" option is active, this will be called each
* time the user expand or fold the tickets (o_wevent_registration_btn). This
* allows to show/hide elements depending on the folding state.
*
* @private
* @param {*} ev
*/
_onTicketDetailsClick: function (ev){
ev.preventDefault();
if (this.foldedByDefault){
let $target = $(ev.currentTarget);
$target.toggleClass('btn-primary');
$target.children().toggleClass('d-none');
$target.siblings('.o_wevent_registration_title, .o_wevent_price_range').toggleClass('d-none');
}
},
/** /**
* @private * @private
*/ */
@@ -4,21 +4,6 @@ $o-wevent-bg-color-light: mix($o-wevent-bg-color-base, #E9ECEF);
$o-wevent-bg-color-dark: mix($o-wevent-bg-color-base, #24363a); $o-wevent-bg-color-dark: mix($o-wevent-bg-color-base, #24363a);
$o-wevent-color: $body-color; $o-wevent-color: $body-color;
.o_wevent_theme_bg_base {
background-color: $o-wevent-bg-color-base !important;
color: $o-wevent-color;
}
.o_wevent_theme_bg_light {
background-color: $o-wevent-bg-color-light !important;
color: $o-wevent-color;
}
.o_wevent_theme_bg_dark {
background-color: $o-wevent-bg-color-dark !important;
color: $o-wevent-color;
}
.o_wevent_index, .o_wevent_event { .o_wevent_index, .o_wevent_event {
// Simple colored tags according to assigned background color // Simple colored tags according to assigned background color
@@ -73,36 +58,12 @@ $o-wevent-color: $body-color;
*/ */
.o_wevent_index_topbar_filters { .o_wevent_index_topbar_filters {
.dropdown-toggle {
border: $border-width solid mix(map-get($theme-colors, 'primary'), map-get($grays, '400'));
@extend .o_wevent_theme_bg_light;
@include border-radius($dropdown-border-radius);
&:hover, &:focus {
border-color: map-get($theme-colors, 'primary');
color: map-get($theme-colors, 'primary');
text-decoration: none;
}
&:after {
margin-left: 1.2em;
}
.fa {
margin-right: .4em;
color: $o-wevent-color;
}
}
.dropdown-menu { .dropdown-menu {
margin-top: $navbar-padding-y;
min-width: 12rem;
max-height: 250px; max-height: 250px;
overflow-y: auto; overflow-y: auto;
@extend .o_wevent_theme_bg_light;
} }
} }
.o_wevent_event_searchbar_form > input {
@extend .o_wevent_theme_bg_light;
}
/* /*
* COMMON TO ALL ONLINE-* PAGES * COMMON TO ALL ONLINE-* PAGES
*/ */
@@ -112,39 +73,35 @@ $o-wevent-color: $body-color;
.o_wevent_online_badge_unpublished{ .o_wevent_online_badge_unpublished{
opacity: 0.4; opacity: 0.4;
} }
.o_wesession_list_item{
margin: 1rem 0;
border: 1px solid;
border-left: 10px solid;
}
// background color-based for new styling // background color-based for new styling
.event_color_1 { @for $size from 2 through length($o-colors) {
background-color: rgba(240, 96, 80, 0.2); .event_color_#{$size - 1} {
&.event_track{
$-bg: adjust-color(nth($o-colors, $size), $lightness: 40%, $saturation: 15%);
@include o-print-color($-bg, background-color, bg-opacity);
> div{
border-top: 3px solid adjust-color(nth($o-colors, $size), $lightness: 10%, $saturation: 15%);
}
}
&.o_wesession_list_item{
border-color: adjust-color(nth($o-colors, $size), $lightness: 30%, $saturation: 15%);
background-color: unset;
}
}
} }
.event_color_2 { .event_color_0 {
background-color: rgba(244, 164, 96, 0.2); background-color: unset;
} &.event_track{
.event_color_3 { border-top: 1px solid lighten($o-wevent-bg-color-base-contrast, 50%);
background-color: rgba(247, 205, 31, 0.2); }
} &.o_wesession_list_item{
.event_color_4 { border-color: $o-wevent-bg-color-light;
background-color: rgba(108,193,237,0.2); }
}
.event_color_5 {
background-color: rgba(129,73,104,0.2);
}
.event_color_6 {
background-color: rgba(235,126,127,0.2);
}
.event_color_7 {
background-color: rgba(44,131,151,0.2);
}
.event_color_8 {
background-color: rgba(71,85,119,0.2);
}
.event_color_9 {
background-color: rgba(214,20,95,0.2);
}
.event_color_10 {
background-color: rgba(48,195,129,0.2);
}
.event_color_11 {
background-color: rgba(147,101,184,0.2);
} }
.o_wevent_online_page_container { .o_wevent_online_page_container {
@@ -156,27 +113,6 @@ $o-wevent-color: $body-color;
max-width: 96px; max-width: 96px;
} }
} }
// Left panel
.o_wevent_online_page_aside {
@extend .o_wevent_theme_bg_base;
// Left panel: content display
.o_wevent_online_page_aside_content {
li:not(.nav-item) {
border-bottom: 1px solid $border-color;
&:first-child {
border-top: 1px solid $border-color;
}
&:last-child {
border-bottom: 0px;
}
}
.o_wevent_online_page_aside_collapse:not(.collapsed) {
transform: rotate(180deg);
}
}
}
} }
} }
@@ -20,34 +20,19 @@
.o_wevent_index { .o_wevent_index {
// Events List // Events List
.o_wevent_events_list { .o_wevent_events_list {
header {
a {
transition: all .25s ease-in-out;
&:hover, &:focus {
transform: scale(1.05);
}
}
}
@include media-breakpoint-up(sm) {
#o_wevent_index_main_col article div.col {
min-width: 0;
}
}
.opt_events_list_columns { .opt_events_list_columns {
header { .card-header {
height: 200px; height: 200px;
} }
} }
.opt_events_list_rows { .opt_events_list_rows {
@include media-breakpoint-down(md) { .card-header {
header { min-height: 130px;
height: 200px;
}
} }
} }
.o_wevent_badge_event { .o_wevent_badge_event {
@include o-position-absolute($top: 0, $left: 0); @include o-position-absolute($top: 0, $right: 0);
@include border-start-radius(0); @include border-end-radius(0);
padding: ($spacer * .5) $card-spacer-x; padding: ($spacer * .5) $card-spacer-x;
transform: translateY(-50%); transform: translateY(-50%);
} }
@@ -74,18 +59,11 @@
font-weight: $font-weight-bold; font-weight: $font-weight-bold;
text-transform: uppercase; text-transform: uppercase;
} }
&.left{
left: $card-spacer-x;
}
} }
.o_wevent_participating, a {
.o_wevent_unpublished {
position: absolute;
bottom: 0;
width: 100%;
padding: $card-spacer-y $card-spacer-x;
text-align: right;
}
article {
background-color: $o-wevent-bg-color-base;
color: $o-wevent-color;
.card-body { .card-body {
background-color: $o-wevent-bg-color-base !important; background-color: $o-wevent-bg-color-base !important;
color: $o-wevent-color; color: $o-wevent-color;
@@ -1,5 +1,5 @@
.o_wevent_event { .o_wevent_event {
min-height: calc(98vh - 70px); min-height: calc(95vh - 70px);
// Multi-line event title, even in mobile mode // Multi-line event title, even in mobile mode
nav > div > a.navbar-brand { nav > div > a.navbar-brand {
@@ -13,11 +13,15 @@
#o_wevent_event_submenu { #o_wevent_event_submenu {
li.nav-item { li.nav-item {
white-space: nowrap; white-space: nowrap;
a{
padding: 0;
padding-right: 1rem;
}
} }
} }
.o_wevent_event_title { .o_wevent_event_title {
margin: 3rem 0;
.o_wevent_event_name { .o_wevent_event_name {
font-weight: $display-font-weight; font-weight: $display-font-weight;
@@ -52,45 +56,17 @@
flex: 0 0 33%; flex: 0 0 33%;
} }
} }
.o_wevent_sidebar_title {
margin-bottom: $spacer;
opacity: .5;
text-transform: uppercase;
}
.o_wevent_sidebar_block {
padding: $spacer * 3;
border-bottom: $border-width solid $border-color;
&:last-child {
border-bottom: 0;
}
}
} }
.o_wevent_event { .o_wevent_event {
.o_record_cover_container { .o_record_cover_container {
overflow: hidden; overflow: hidden;
z-index: 0; z-index: 0;
color: white;
.o_record_cover_component { .o_record_cover_component {
z-index: -1; z-index: -1;
} }
&.o_record_has_cover {
.o_record_cover_image {
background-attachment: fixed;
&::after {
content: "";
display: block;
@include o-position-absolute(0,0,50%,0);
}
}
.o_wevent_event_title {
color: white;
}
}
} }
} }
@@ -7,17 +7,21 @@ registry.category("web_tour.tours").add('test_tickets_questions', {
steps: () => [{ steps: () => [{
content: "Click on the Design Fair event", content: "Click on the Design Fair event",
trigger: 'article:contains("Design Fair New York")', trigger: 'article:contains("Design Fair New York")',
}, {
content: "Click on Register modal tickets button",
trigger: 'button:contains("Register")',
run: 'click'
}, { }, {
content: "Check Register button is disabled when no ticket selected", content: "Check Register button is disabled when no ticket selected",
trigger: 'button:disabled:contains("Register")', trigger: 'button:disabled:contains("Register")',
isCheck: true, isCheck: true,
}, { }, {
content: "Select 2 'Free' tickets to buy", content: "Select 2 'Free' tickets to buy",
trigger: 'div.row:contains("Free") select.form-select', trigger: 'div.o_wevent_ticket_selector:contains("Free") select.form-select',
run: 'text 2' run: 'text 2'
}, { }, {
content: "Click on Register tickets button", content: "Click on Register (to fill tickets data) button",
trigger: 'button:contains("Register")', trigger: 'div.modal-footer button:contains("Register")',
run: 'click' run: 'click'
}, { }, {
trigger: 'div:contains("Ticket #1").modal-body input[name*="name"]', trigger: 'div:contains("Ticket #1").modal-body input[name*="name"]',
@@ -21,12 +21,10 @@
<!-- Content --> <!-- Content -->
<div class="o_wevent_events_list"> <div class="o_wevent_events_list">
<div class="container"> <div class="container">
<div class="d-flex mx-n3"> <t t-call="website_event.searched_tags"/>
<t t-call="website_event.searched_tags"/>
</div>
<div class="row"> <div class="row">
<div id="o_wevent_index_main_col" t-attf-class="col-md my-5 #{opt_events_list_columns and 'opt_events_list_columns' or 'opt_events_list_rows'}"> <div id="o_wevent_index_main_col" t-attf-class="col-md mb-3 #{opt_events_list_columns and 'opt_events_list_columns' or 'opt_events_list_rows'}">
<div class="row"> <div class="row g-4 g-lg-3 g-xxl-4">
<!-- Events List --> <!-- Events List -->
<t t-call="website_event.events_list"/> <t t-call="website_event.events_list"/>
</div> </div>
@@ -49,15 +47,12 @@
<!-- Index Topbar --> <!-- Index Topbar -->
<template id="index_topbar" name="Topbar"> <template id="index_topbar" name="Topbar">
<nav class="navbar navbar-light border-top shadow-sm d-print-none"> <div class="container my-3">
<div class="container"> <div class="o_wevent_index_topbar_filters d-flex d-print-none align-items-center justify-content-end flex-wrap gap-2 w-100">
<div class="d-flex flex-column flex-sm-row justify-content-between w-100"> <h2 class="my-0 me-auto pe-sm-4">Events</h2>
<span class="navbar-brand h4 my-0 me-auto pe-sm-4">Events</span>
<ul class="o_wevent_index_topbar_filters nav">
<t t-foreach="categories" t-as="category"> <t t-foreach="categories" t-as="category">
<li t-if="category.is_published and category.tag_ids and any(tag.color for tag in category.tag_ids)" class="nav-item dropdown me-2 my-1"> <div t-if="category.is_published and category.tag_ids and any(tag.color for tag in category.tag_ids)" class="dropdown d-none d-lg-block">
<a href="#" role="button" class="btn dropdown-toggle" data-bs-toggle="dropdown"> <a href="#" role="button" class="btn btn-light dropdown-toggle" data-bs-toggle="dropdown">
<i class="fa fa-folder-open"/>
<t t-out="category.name"/> <t t-out="category.name"/>
</a> </a>
<div class="dropdown-menu"> <div class="dropdown-menu">
@@ -69,24 +64,94 @@
</a> </a>
</t> </t>
</div> </div>
</li> </div>
</t> </t>
</ul> <div class="o_wevent_search d-flex w-100 w-lg-auto">
<div class="d-flex align-items-center flex-wrap ps-sm-3 pe-0"> <div class="w-100 flex-grow-1">
<t t-call="website_event.events_search_box_input"/> <t t-call="website_event.events_search_box_input"/>
</div>
<button class="btn btn-light position-relative ms-2 d-lg-none"
data-bs-toggle="offcanvas"
data-bs-target="#o_wevent_index_offcanvas">
<i class="fa fa-sliders"/>
</button>
</div>
</div>
<!-- Off canvas filters on mobile-->
<div id="o_wevent_index_offcanvas" class="o_website_offcanvas offcanvas offcanvas-end d-lg-none p-0 overflow-visible">
<div class="offcanvas-header">
<h5 class="offcanvas-title">Filters</h5>
<button type="button" class="btn-close" data-bs-dismiss="offcanvas" aria-label="Close"/>
</div>
<div class="offcanvas-body p-0">
<div class="accordion accordion-flush">
<t t-foreach="categories" t-as="category">
<div class="accordion-item">
<h2 class="accordion-header">
<button class="accordion-button border-top collapsed"
type="button"
data-bs-toggle="collapse"
t-att-data-bs-target="'.o_wevent_offcanvas_cat_%s' % category.name"
aria-expanded="false">
<t t-out="category.name"/>
</button>
</h2>
<div t-attf-class="o_wevent_offcanvas_cat_#{category.name} accordion-collapse collapse">
<div class="accordion-body pt-0">
<ul class="list-group list-group-flush">
<li t-if="category.is_published and category.tag_ids and any(tag.color for tag in category.tag_ids)" class="list-group-item">
<t t-foreach="category.tag_ids" t-as="tag">
<a t-if="tag.color"
t-att-href="'/event?%s' % keep_query('*', tags=str((search_tags - tag).ids if tag in search_tags else (tag | search_tags).ids))"
t-attf-class="dropdown-item d-flex align-items-center justify-content-between #{'active' if tag in search_tags else ''}">
<t t-out="tag.name"/>
</a>
</t>
</li>
</ul>
</div>
</div>
</div>
</t>
<div class="accordion-item">
<h2 class="accordion-header">
<button class="accordion-button border-top collapsed"
type="button"
data-bs-toggle="collapse"
data-bs-target=".o_wevent_offcanvas_date"
aria-expanded="false">
Date
</button>
</h2>
<div class="o_wevent_offcanvas_date accordion-collapse collapse">
<div class="accordion-body pt-0">
<ul class="list-group list-group-flush">
<li class="list-group-item">
<t t-foreach="dates" t-as="date">
<t t-if="date[3] or (date[0] in ('old','upcoming','all'))">
<a t-att-href="keep('/event', date=date[0])" t-attf-class="dropdown-item d-flex align-items-center justify-content-between #{searches.get('date') == date[0] and 'active'}">
<t t-out="date[1]"/>
<span t-if="date[3]" t-out="date[3]" t-attf-class="badge rounded-pill #{searches.get('date') == date[0] and 'bg-light text-primary' or 'bg-primary'} ms-3"/>
</a>
</t>
</t>
</li>
</ul>
</div>
</div>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
</nav>
</template> </template>
<template id="searched_tags" name="Searched tags"> <template id="searched_tags" name="Searched tags">
<div class="d-flex align-items-center mt16"> <div class="d-flex align-items-center">
<t t-foreach="search_tags" t-as="tag"> <t t-foreach="search_tags" t-as="tag">
<span t-attf-class="align-items-baseline border d-inline-flex ps-2 rounded ml16 mb-2 #{'o_tag_color_%s' % tag.color if tag.color else ''}"> <span t-attf-class="d-inline-flex align-items-baseline rounded border ps-2 me-2 mb-2 #{'o_tag_color_%s' % tag.color if tag.color else ''}">
<i class="fa fa-tag me-2 text-muted"/>
<t t-out="tag.display_name"/> <t t-out="tag.display_name"/>
<a t-att-href="'/event?%s' % keep_query('*', tags=str((search_tags - tag).ids))" class="btn border-0 py-1">&#215;</a> <a t-att-href="'/event?%s' % keep_query('*', tags=str((search_tags - tag).ids))" class="btn border-0 py-1 text-white">&#215;</a>
</span> </span>
</t> </t>
</div> </div>
@@ -94,10 +159,9 @@
<!-- Filter - Date --> <!-- Filter - Date -->
<template id="event_time" inherit_id="website_event.index_topbar" name="Filter by Date"> <template id="event_time" inherit_id="website_event.index_topbar" name="Filter by Date">
<xpath expr="//ul[hasclass('o_wevent_index_topbar_filters')]" position="inside"> <xpath expr="//div[hasclass('o_wevent_search')]" position="before">
<li class="nav-item dropdown me-2 my-1"> <div class="dropdown d-none d-lg-block me-2 my-1">
<a href="#" role="button" class="btn dropdown-toggle" data-bs-toggle="dropdown"> <a href="#" role="button" class="btn btn-light dropdown-toggle" data-bs-toggle="dropdown">
<i class="fa fa-calendar"/>
<t t-if="current_date" t-out="current_date"/> <t t-if="current_date" t-out="current_date"/>
<t t-else="">Upcoming Events</t> <t t-else="">Upcoming Events</t>
</a> </a>
@@ -111,15 +175,15 @@
</t> </t>
</t> </t>
</div> </div>
</li> </div>
</xpath> </xpath>
</template> </template>
<!-- Filter - Location --> <!-- Filter - Location -->
<template id="event_location" inherit_id="website_event.index_topbar" active="False" name="Filter by Country"> <template id="event_location" inherit_id="website_event.index_topbar" active="False" name="Filter by Country">
<xpath expr="//ul[hasclass('o_wevent_index_topbar_filters')]" position="inside"> <xpath expr="//div[hasclass('o_wevent_index_topbar_filters')]" position="inside">
<li class="nav-item dropdown me-2 my-1"> <li class="nav-item dropdown me-2 my-1">
<a href="#" role="button" class="btn dropdown-toggle" data-bs-toggle="dropdown"> <a href="#" role="button" class="btn btn-light dropdown-toggle" data-bs-toggle="dropdown">
<i class="fa fa-map-marker"/> <i class="fa fa-map-marker"/>
<t t-if="current_country" t-out="current_country.name"/> <t t-if="current_country" t-out="current_country.name"/>
<t t-else="">All countries</t> <t t-else="">All countries</t>
@@ -148,8 +212,8 @@
<template id="events_list" name="Events list"> <template id="events_list" name="Events list">
<!-- Options --> <!-- Options -->
<t t-set="opt_index_sidebar" t-value="is_view_active('website_event.opt_index_sidebar')"/> <t t-set="opt_index_sidebar" t-value="is_view_active('website_event.opt_index_sidebar')"/>
<t t-if="opt_events_list_columns" t-set="opt_event_size" t-value="opt_index_sidebar and 'col-md-6' or 'col-md-6 col-lg-4'"/> <t t-if="opt_events_list_columns" t-set="opt_event_size" t-value="opt_index_sidebar and 'col-md-6' or 'col-md-6 col-lg-4 col-xl-3'"/>
<t t-else="" t-set="opt_event_size" t-value="opt_index_sidebar and 'col-12' or 'col-xl-10 offset-xl-1'"/> <t t-else="" t-set="opt_event_size" t-value="opt_index_sidebar and 'col-12' or 'col-xl-12'"/>
<!-- No events --> <!-- No events -->
<div t-if="not event_ids" class="col-12 text-center"> <div t-if="not event_ids" class="col-12 text-center">
<div t-call="website_event.event_empty_events_svg" class="my-4"/> <div t-call="website_event.event_empty_events_svg" class="my-4"/>
@@ -168,67 +232,73 @@
No results found for '<span t-out="original_search"/>'. Showing results for '<span t-out="searches['search']"/>'. No results found for '<span t-out="original_search"/>'. Showing results for '<span t-out="searches['search']"/>'.
</div> </div>
<!-- List --> <!-- List -->
<div t-foreach="event_ids" t-as="event" t-attf-class=" #{opt_event_size} mb-4"> <div t-foreach="event_ids" t-as="event" t-attf-class=" #{opt_event_size}">
<a t-cache="event if not editable and event.website_published else None" t-attf-href="/event/#{ slug(event) }/#{(not event.menu_id) and 'register'}" class="text-decoration-none" t-att-data-publish="event.website_published and 'on' or 'off'"> <a t-cache="event if not editable and event.website_published else None" t-attf-href="/event/#{ slug(event) }/#{(not event.menu_id) and 'register'}" class="text-decoration-none text-dark " t-att-data-publish="event.website_published and 'on' or 'off'">
<article t-attf-class="h-100 #{opt_events_list_cards and 'card border-0 shadow-sm'}" itemscope="itemscope" itemtype="http://schema.org/Event"> <article t-attf-class="h-100 #{opt_events_list_cards and 'card'}" itemscope="itemscope" itemtype="http://schema.org/Event">
<div class="h-100 row g-0"> <div t-attf-class="h-100 #{opt_events_list_columns and 'd-flex flex-wrap flex-column' or 'row mx-0'}">
<!-- Header --> <!-- Header -->
<header t-attf-class="overflow-hidden bg-secondary #{opt_events_list_columns and 'col-12' or 'col-sm-4 col-lg-3'} #{(not opt_events_list_cards) and 'shadow'}"> <header t-attf-class="card-header overflow-hidden bg-secondary p-0 border-0 rounded-0 #{opt_events_list_columns and 'col-12' or 'col-4 col-lg-3'} #{(not opt_events_list_cards) and 'shadow-sm'}">
<!-- Image + Link --> <!-- Image + Link -->
<div class="d-block h-100 w-100"> <div class="d-block h-100 w-100">
<t t-call="website.record_cover"> <t t-call="website.record_cover">
<t t-set="_record" t-value="event"/> <t t-set="_record" t-value="event"/>
<!-- Short Date --> <!-- Short Date -->
<div class="o_wevent_event_date position-absolute shadow-sm o_not_editable"> <div t-attf-class="o_wevent_event_date position-absolute shadow-sm o_not_editable #{(not opt_events_list_columns) and 'left'} ">
<span t-out="event.date_begin" t-options="{'widget': 'datetime', 'tz_name': event.date_tz, 'format': 'LLL'}" class="o_wevent_event_month"/> <span t-out="event.date_begin" t-options="{'widget': 'datetime', 'tz_name': event.date_tz, 'format': 'LLL'}" class="o_wevent_event_month"/>
<span t-out="event.date_begin" t-options="{'widget': 'datetime', 'tz_name': event.date_tz, 'format': 'dd'}" class="o_wevent_event_day oe_hide_on_date_edit"/> <span t-out="event.date_begin" t-options="{'widget': 'datetime', 'tz_name': event.date_tz, 'format': 'dd'}" class="o_wevent_event_day oe_hide_on_date_edit"/>
</div> </div>
<!-- Not open -->
<span t-if="not event.event_registrations_open and (not opt_events_list_cards or not opt_events_list_columns)" class="position-absolute bottom-0 px-3 py-2 w-100 text-bg-light">
<t t-if="not event.event_registrations_started">
Registrations not yet open
</t>
<t t-elif="event.event_registrations_sold_out">
Sold Out
</t>
<t t-else="">
Registrations Closed
</t>
</span>
<!-- Participating --> <!-- Participating -->
<small t-if="event.is_participating" class="o_wevent_participating text-bg-success"> <small t-if="event.is_participating" class="o_wevent_participating position-absolute bottom-0 px-3 py-2 w-100 text-bg-success">
<i class="fa fa-check me-2"/>Registered <i class="fa fa-check me-2"/>Registered
</small> </small>
<!-- Unpublished --> <!-- Unpublished -->
<small t-if="not event.website_published" class="o_wevent_unpublished text-bg-danger"> <small t-if="not event.website_published" class="o_wevent_unpublished position-absolute bottom-0 px-3 py-2 w-100 text-bg-danger">
<i class="fa fa-ban me-2"/>Unpublished <i class="fa fa-ban me-2"/>Unpublished
</small> </small>
</t> </t>
</div> </div>
</header> </header>
<div t-att-class="'%s %s position-relative' % (
opt_events_list_columns and 'col-12' or 'col', <!-- Body -->
opt_events_list_columns and event.event_registrations_open and not event.event_registrations_sold_out and 'h-100' or '')"> <main t-attf-class="card-body position-relative d-flex flex-column justify-content-between gap-2 #{opt_events_list_columns and 'col-12 py-3' or 'col-8 col-lg-9 px-4'} #{not opt_events_list_cards and opt_events_list_columns and 'px-0'} #{not opt_events_list_cards and not opt_events_list_columns and 'py-0'}">
<!-- Body --> <div>
<main t-attf-class="#{opt_events_list_cards and 'card-body' or (opt_events_list_columns and 'py-3' or 'px-4')}"> <div class="d-flex flex-wrap gap-2">
<t t-foreach="event.tag_ids.filtered(lambda tag: tag.category_id.website_id == website or not tag.category_id.website_id)" t-as="tag">
<span t-if="tag.color"
t-attf-class="badge mt-3 mt-sm-0 rounded-pill px-2 p-1 #{'o_tag_color_%s' % tag.color if tag.color else 'text-bg-light'}">
<t t-out="tag.name"/>
</span>
</t>
</div>
<!-- Title --> <!-- Title -->
<h5 t-attf-class="card-title mt-2 mb-0 text-truncate #{(not event.website_published) and 'text-danger'}"> <h5 t-attf-class="card-title mt-2 mb-0 text-truncate #{(not event.website_published) and 'text-danger'}">
<span t-field="event.name" itemprop="name"/> <span t-field="event.name" itemprop="name"/>
</h5> </h5>
<!-- Start Date & Time --> <!-- Start Date & Time -->
<time class="o_not_editable" itemprop="startDate" t-att-datetime="event.date_begin"> <small class="o_not_editable text-muted" itemprop="description" t-out="event.subtitle">
<span t-out="event.date_begin" </small>
t-options="{'widget': 'datetime', 'tz_name': event.date_tz, 'date_only': 'true', 'format': 'long', 'tz_name': event.date_tz}"/> - </div>
<span t-out="event.date_begin" <!-- Location -->
t-options="{'widget': 'datetime', 'tz_name': event.date_tz, 'time_only': 'true', 'format': 'short', 'tz_name': event.date_tz}"/> <small class="o_not_editable fw-bold" itemprop="location" t-out="event.address_id" t-options="{'widget': 'contact', 'fields': ['city'], 'no_marker': 'true'}"/>
(<span t-out="event.date_tz"/>) </main>
</time>
<!-- Location -->
<div class="o_not_editable" itemprop="location" t-out="event.address_id" t-options="{'widget': 'contact', 'fields': ['city'], 'no_marker': 'true'}"/>
<div class="mt8">
<t t-foreach="event.tag_ids.filtered(lambda tag: tag.category_id.website_id == website or not tag.category_id.website_id)" t-as="tag">
<span t-if="tag.color"
t-attf-class="badge mr4 #{'bg-primary' if tag in search_tags else ''} #{'o_tag_color_%s' % tag.color if tag.color else ''}">
<span t-out="tag.name"/>
</span>
</t>
</div>
</main>
</div>
<!-- Footer --> <!-- Footer -->
<footer t-if="not event.event_registrations_open or event.event_registrations_sold_out" <footer t-if="not event.event_registrations_open and opt_events_list_columns and opt_events_list_cards"
t-att-class="'alert-secondary small align-self-end w-100 %s %s' % ( t-att-class="'small align-self-end w-100 %s %s' % (
opt_events_list_cards and 'card-footer' or (not opt_events_list_columns and 'mx-4 mt-auto pt-2') or 'py-2', opt_events_list_cards and 'card-footer' or (not opt_events_list_columns and 'py-2 mt-2') or 'py-2',
opt_events_list_cards and 'border-top' or '', opt_events_list_cards and 'border-top' or 'px-2',
)"> )">
<span t-if="not event.event_registrations_open"> <span t-if="not event.event_registrations_open">
<t t-if="not event.event_registrations_started"> <t t-if="not event.event_registrations_started">
@@ -258,7 +328,7 @@
<template id="opt_events_list_categories" inherit_id="website_event.events_list" active="False" name="Show Templates"> <template id="opt_events_list_categories" inherit_id="website_event.events_list" active="False" name="Show Templates">
<xpath expr="//main/*" position="before"> <xpath expr="//main/*" position="before">
<span t-if="event.event_type_id" t-attf-href="/event?type=#{event.event_type_id.id}" t-attf-class="badge bg-secondary o_wevent_badge #{opt_events_list_columns and 'o_wevent_badge_event' or 'float-end'}" t-field="event.event_type_id"/> <span t-if="event.event_type_id" t-attf-href="/event?type=#{event.event_type_id.id}" t-attf-class="badge text-bg-secondary o_wevent_badge #{opt_events_list_columns and 'o_wevent_badge_event' or 'position-absolute bottom-0 end-0'} #{not opt_events_list_columns and opt_events_list_cards and 'me-3 mb-3'}" t-field="event.event_type_id"/>
</xpath> </xpath>
</template> </template>
@@ -6,60 +6,8 @@
<t t-call="website.layout"> <t t-call="website.layout">
<!-- Options --> <!-- Options -->
<t t-set="opt_events_list_categories" t-value="is_view_active('website_event.opt_events_list_categories')"/> <t t-set="opt_events_list_categories" t-value="is_view_active('website_event.opt_events_list_categories')"/>
<div id="wrap" t-attf-class="o_wevent_event js_event d-flex flex-column #{'o_wevent_hide_sponsors' if hide_sponsors else ''}"> <div id="wrap" t-attf-class="o_wevent_event js_event d-flex flex-column h-100 #{'o_wevent_hide_sponsors' if hide_sponsors else ''}">
<t t-if="not event.menu_id"> <t t-if="not hide_submenu" t-call="website_event.navbar"/>
<nav class="navbar navbar-light border-top shadow-sm d-print-none">
<div class="container align-items-baseline justify-content-start">
<a href="/event" class="navbar-brand h4 my-0 me-0 me-md-4">
<i class="fa fa-long-arrow-left me-2"/>
<span>All Events</span>
</a>
<ul class="navbar-nav flex-row ms-md-auto ms-0">
<li t-if="opt_events_list_categories" class="nav-item me-3">
<a t-attf-href="/event?type=#{event.event_type_id.id}" t-if="event.event_type_id" class="nav-link">
<i class="fa fa-folder-open me-2"/><span t-field="event.event_type_id"/>
</a>
</li>
<li t-if="event.country_id" class="nav-item me-3">
<a t-attf-href="/event?country=#{event.country_id.id}" class="nav-link">
<i class="fa fa-map-marker me-2"/><span t-field="event.country_id"/>
</a>
</li>
</ul>
<div class="d-flex align-items-centerflex-wrap ps-sm-3 pe-0">
<t t-call="website_event.events_search_box_input">
<t t-set="_classes" t-valuef="ms-auto"/>
</t>
</div>
</div>
</nav>
</t>
<t t-else="">
<nav class="navbar navbar-light border-top shadow-sm navbar-expand-md">
<div class="container align-items-baseline">
<a t-att-href="event.website_url" t-field="event.name" class="navbar-brand h4 my-0 me-0"/>
<button class="navbar-toggler ms-auto" type="button" data-bs-toggle="collapse" data-bs-target="#o_wevent_event_submenu" aria-controls="o_wevent_event_submenu" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div id="o_wevent_event_submenu" class="collapse navbar-collapse">
<ul class="navbar-nav w-100 flex-md-wrap" t-att-data-menu_name="editable and 'Event Menu'" t-att-data-content_menu_id="editable and event.menu_id.id">
<t t-foreach="event.menu_id.child_id" t-as="submenu">
<t t-call="website.submenu">
<t t-set="item_class" t-value="'nav-item'"/>
<t t-set="link_class" t-value="'nav-link'"/>
</t>
</t>
</ul>
<!-- Add Register additional CTA button, in addition to menus -->
<a t-if="event.menu_register_cta and not event.is_participating"
t-att-href="'/event/%s/register' % (slug(event))"
class="btn btn-primary ms-auto">
Register
</a>
</div>
</div>
</nav>
</t>
<t t-out="0"/> <t t-out="0"/>
<t t-set="editor_sub_message">Following content will appear on all events.</t> <t t-set="editor_sub_message">Following content will appear on all events.</t>
<div class="oe_structure oe_empty" id="oe_structure_website_event_layout_1" t-att-data-editor-sub-message="editor_sub_message"/> <div class="oe_structure oe_empty" id="oe_structure_website_event_layout_1" t-att-data-editor-sub-message="editor_sub_message"/>
@@ -67,4 +15,61 @@
</t> </t>
</template> </template>
<template id="navbar" name="Event Navbar">
<div class="container my-3">
<a href="/event">
<i class="fa fa-chevron-left me-2"/>
<span>Back to events</span>
</a>
</div>
<div class="mb-3">
<div class="container d-flex flex-wrap flex-lg-nowrap justify-content-between align-items-center">
<t t-set="active_submenu" t-value="event.menu_id.child_id.filtered(lambda sm: sm._is_active())"></t>
<h6 t-field="event.name" t-attf-class="flex-grow-1 #{'my-3' if active_submenu else 'mb-0'}"/>
<div class="d-flex flex-grow-1 align-items-center justify-content-end gap-2">
<nav t-if="active_submenu" class="navbar navbar-light navbar-expand-md p-0 d-md-none">
<div class="container align-items-baseline">
<div id="o_wevent_event_submenu" class="dropdown nav-item">
<button class="dropdown-toggle btn btn-light" data-bs-toggle="dropdown">
<t t-out="active_submenu.name if len(active_submenu) == 1 else ''"/>
</button>
<ul class="dropdown-menu flex-md-wrap w-100" t-att-data-menu_name="editable and 'Event Menu'" t-att-data-content_menu_id="editable and event.menu_id.id">
<t t-foreach="event.menu_id.child_id" t-as="submenu">
<t t-call="website.submenu">
<t t-set="link_class" t-value="'dropdown-item'"/>
</t>
</t>
</ul>
</div>
</div>
</nav>
<!-- Add Register additional CTA button, in addition to menus -->
<a t-if="event.menu_register_cta and not event.is_participating"
t-att-href="'/event/%s/register' % (slug(event))"
t-attf-class="btn btn-primary #{'d-none' if hide_register_cta else ''}">
Register
</a>
</div>
</div>
<nav class="navbar navbar-light navbar-expand-md d-none d-md-block p-0">
<div class="container align-items-baseline">
<button class="navbar-toggler ms-auto" type="button" data-bs-toggle="collapse" data-bs-target="#o_wevent_event_submenu" aria-controls="o_wevent_event_submenu" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div id="o_wevent_event_submenu" class="collapse navbar-collapse">
<ul class="navbar-nav flex-md-wrap w-100" t-att-data-menu_name="editable and 'Event Menu'" t-att-data-content_menu_id="editable and event.menu_id.id">
<t t-foreach="event.menu_id.child_id" t-as="submenu">
<t t-call="website.submenu">
<t t-set="item_class" t-value="'nav-item'"/>
<t t-set="link_class" t-value="'nav-link'"/>
</t>
</t>
</ul>
</div>
</div>
</nav>
</div>
</template>
</odoo> </odoo>
@@ -25,11 +25,11 @@
<template id="template_location"> <template id="template_location">
<t t-call="website_event.layout"> <t t-call="website_event.layout">
<div class="oe_structure" id="oe_structure_website_event_location_1"/> <div class="oe_structure" id="oe_structure_website_event_location_1"/>
<section class="pt32 pb32"> <section>
<div class="container"> <div class="container">
<div class="row"> <div class="row">
<div class="col-12"> <div class="col-12">
<h1 class="o_page_header mb-3">Event Location</h1> <h3>Event Location</h3>
<h4 class="mb-3" t-field="event.address_id" t-options='{ <h4 class="mb-3" t-field="event.address_id" t-options='{
"widget": "contact", "widget": "contact",
"fields": ["name"], "fields": ["name"],
@@ -4,24 +4,7 @@
<template id="event_details" name="Event Header"> <template id="event_details" name="Event Header">
<t t-call="website_event.layout"> <t t-call="website_event.layout">
<div name="event" itemscope="itemscope" itemtype="http://schema.org/Event"> <div class="h-100" name="event" itemscope="itemscope" itemtype="http://schema.org/Event">
<t t-call="website.record_cover">
<t t-set="_record" t-value="event"/>
<t t-set="use_filters" t-value="True"/>
<t t-set="use_size" t-value="True"/>
<t t-set="use_text_align" t-value="True"/>
<div class="container d-flex flex-column flex-grow-1 justify-content-around">
<div class="o_wevent_event_title">
<span t-if="event.is_participating" class="badge text-bg-success o_wevent_badge"><i class="fa fa-check me-2"/>Registered</span>
<h1 t-field="event.name" class="o_wevent_event_name" itemprop="name" placeholder="Event Title"/>
<h2 t-field="event.subtitle" class="o_wevent_event_subtitle" placeholder="Event Subtitle"/>
</div>
</div>
<div class="container">
<t t-call="website_event.registration_template"/>
</div>
</t>
<t t-out="0"/> <t t-out="0"/>
</div> </div>
</t> </t>
@@ -29,253 +12,160 @@
<!-- Event - Description --> <!-- Event - Description -->
<template id="event_description_full" name="Event Description" track="1"> <template id="event_description_full" name="Event Description" track="1">
<t t-set="hide_submenu" t-value="True"/>
<t t-set="hide_register_cta" t-value="True"/>
<t t-call="website_event.event_details"> <t t-call="website_event.event_details">
<section class="mt-n5" t-cache="event if not editable and event.website_published else None"> <section class="h-100" t-cache="event if not editable and event.website_published else None">
<div class="container overflow-hidden"> <div class="container overflow-hidden h-100 pb-5">
<div class="row g-0 mt-n4 mb-3"> <div class="row h-100">
<!-- Description --> <div class="col">
<div id="o_wevent_event_main_col" class="o_wevent_theme_bg_base col-lg-8 px-3 pt-5 pb-0 shadow-sm"> <t t-call="website_event.navbar"/>
<span t-field="event.description" itemprop="description"/> <!-- Show the button tickets only on mobile -->
<div class="container d-lg-none py-3">
<t t-call="website_event.registration_template"/>
</div> </div>
<div class="o_wevent_theme_bg_light col-lg-4 shadow-sm d-print-none"> <!-- Description -->
<!-- Date & Time --> <div id="o_wevent_event_main_col">
<div class="o_wevent_sidebar_block"> <t t-call="website.record_cover">
<h6 class="o_wevent_sidebar_title">Date &amp; Time</h6> <t t-set="_record" t-value="event"/>
<div class="d-flex"> <t t-set="use_filters" t-value="True"/>
<h5 t-field="event.date_begin" class="my-1" t-options="{'tz_name': event.date_tz, 'format': 'EEEE MMMM dd, YYYY'}" t-att-datetime="event.date_begin"/> <t t-set="use_size" t-value="False"/>
</div> <t t-set="use_text_align" t-value="True"/>
<t t-if="not event.is_one_day">Start -</t> <div class="container d-flex flex-column flex-grow-1 justify-content-around">
<span t-out="event.date_begin" t-options="{'widget': 'datetime', 'tz_name': event.date_tz, 'time_only': 'true', 'format': 'short'}"/> <div class="o_wevent_event_title p-3 my-5">
<t t-if="event.is_one_day"> <span t-if="event.is_participating" class="badge text-bg-success o_wevent_badge"><i class="fa fa-check me-2"/>Registered</span>
<i class="fa fa-long-arrow-right mx-1"/> <h1 t-field="event.name" class="o_wevent_event_name" itemprop="name" placeholder="Event Title"/>
</t> <h2 t-field="event.subtitle" class="o_wevent_event_subtitle" placeholder="Event Subtitle"/>
<t t-else="">
(<span t-out="event.date_tz"/>)
<i class="fa fa-long-arrow-down d-block text-muted mx-3 my-2" style="font-size: 1.5rem"/>
<div class="d-flex">
<h5 t-field="event.date_end" class="my-1" t-options="{'tz_name': event.date_tz, 'format': 'EEEE MMMM dd, YYYY'}"/>
</div> </div>
<t t-if="not event.is_one_day">End -</t> </div>
</t> </t>
<span t-if="not event.is_one_day" t-out="event.date_end" t-options="{'widget': 'datetime', 'tz_name': event.date_tz, 'time_only': 'true', 'format': 'short'}"/> <div class="mt-4" t-field="event.description" itemprop="description"/>
<span t-else="" t-field="event.date_end" t-options="{'tz_name': event.date_tz, 'time_only': 'true', 'format': 'short'}" t-att-datetime="event.date_end"/> </div>
(<span t-out="event.date_tz"/>) </div>
<!-- Sidebar -->
<div class="d-lg-flex justify-content-end col-lg-4 col-xl-3 mb-3 mb-lg-0 d-print-none">
<div class="mt-3">
<!-- Tickets Desktop -->
<div class="container d-none d-lg-block">
<t t-call="website_event.registration_template"/>
</div>
<!-- Date & Time -->
<div class="o_wevent_sidebar_block border-bottom pb-3 my-3">
<h6 class="o_wevent_sidebar_title text-muted text-uppercase">Date &amp; Time</h6>
<div class="d-flex">
<h6 t-field="event.date_begin" class="my-1" t-options="{'tz_name': event.date_tz, 'format': 'EEEE MMMM dd, YYYY'}" t-att-datetime="event.date_begin"/>
</div>
<t t-if="not event.is_one_day">Start -</t>
<span t-out="event.date_begin" t-options="{'widget': 'datetime', 'tz_name': event.date_tz, 'time_only': 'true', 'format': 'short'}"/>
<t t-if="event.is_one_day">
<i class="fa fa-long-arrow-right mx-1"/>
</t>
<t t-else="">
(<span t-out="event.date_tz"/>)
<i class="fa fa-long-arrow-down d-block text-muted mx-3 my-2" style="font-size: 1.5rem"/>
<div class="d-flex">
<h6 t-field="event.date_end" class="my-1" t-options="{'tz_name': event.date_tz, 'format': 'EEEE MMMM dd, YYYY'}"/>
</div>
<t t-if="not event.is_one_day">End -</t>
</t>
<span t-if="not event.is_one_day" t-out="event.date_end" t-options="{'widget': 'datetime', 'tz_name': event.date_tz, 'time_only': 'true', 'format': 'short'}"/>
<span t-else="" t-field="event.date_end" t-options="{'tz_name': event.date_tz, 'time_only': 'true', 'format': 'short'}" t-att-datetime="event.date_end"/>
(<span t-out="event.date_tz"/>)
<div class="dropdown"> <a href="#" role="button" data-bs-toggle="dropdown" class="btn btn-secondary text-bg-secondary dropdown w-100 mt-3">
<i class="fa fa-calendar me-1"/> <p class="mb-0"><i class="fa fa-calendar me-2"/>Add to Calendar</p>
<a href="#" role="button" data-bs-toggle="dropdown">Add to Calendar</a> </a>
<div class="dropdown-menu"> <div class="dropdown-menu">
<a t-att-href="iCal_url" class="dropdown-item">iCal/Outlook</a> <a t-att-href="iCal_url" class="dropdown-item">iCal/Outlook</a>
<a t-att-href="google_url" class="dropdown-item" target="_blank">Google</a> <a t-att-href="google_url" class="dropdown-item" target="_blank">Google</a>
</div> </div>
</div> </div>
</div> <!-- Location -->
<!-- Location --> <div t-if="event.address_id" class="o_wevent_sidebar_block border-bottom pb-3 mb-3">
<div t-if="event.address_id" class="o_wevent_sidebar_block"> <h6 class="o_wevent_sidebar_title text-muted text-uppercase">Location</h6>
<h6 class="o_wevent_sidebar_title">Location</h6> <h4 t-field="event.address_id" class="" t-options='{
<h4 t-field="event.address_id" class="" t-options='{ "widget": "contact",
"widget": "contact", "fields": ["name"]
"fields": ["name"] }'/>
}'/> <div itemprop="location" class="mb-2" t-field="event.address_id" t-options='{
<div itemprop="location" class="mb-2" t-field="event.address_id" t-options='{ "widget": "contact",
"widget": "contact", "fields": ["address"],
"fields": ["address"], "no_marker": True
"no_marker": True }'/>
}'/> <div class="mb-3" t-field="event.address_id" t-options='{
<div class="mb-3" t-field="event.address_id" t-options='{ "widget": "contact",
"widget": "contact", "fields": ["phone", "mobile", "email"]
"fields": ["phone", "mobile", "email"] }'/>
}'/> <a t-att-href="event._google_map_link()" target="_blank" class="btn btn-secondary text-bg-secondary w-100">
<i class="fa fa-map-marker fa-fw" role="img"/> <p class="mb-0"><i class="fa fa-map-marker fa-fw" role="img"/>Get the direction</p>
<a t-att-href="event._google_map_link()" target="_blank">Get the direction</a> </a>
</div> </div>
<!-- Organizer --> <!-- Organizer -->
<div t-if="event.organizer_id" class="o_wevent_sidebar_block"> <div t-if="event.organizer_id" class="o_wevent_sidebar_block border-bottom pb-3 mb-3">
<h6 class="o_wevent_sidebar_title">Organizer</h6> <h6 class="o_wevent_sidebar_title text-muted text-uppercase">Organizer</h6>
<h4 t-field="event.organizer_id"/> <h4 t-field="event.organizer_id"/>
<div itemprop="location" t-field="event.organizer_id" t-options="{'widget': 'contact', 'fields': ['phone', 'mobile', 'email']}"/> <div itemprop="location" t-field="event.organizer_id" t-options="{'widget': 'contact', 'fields': ['phone', 'mobile', 'email']}"/>
</div> </div>
<!-- Social --> <!-- Social -->
<div class="o_wevent_sidebar_block"> <div class="o_wevent_sidebar_block">
<h6 class="o_wevent_sidebar_title">SHARE</h6> <h6 class="o_wevent_sidebar_title text-muted text-uppercase">SHARE</h6>
<p class="mb-2">Find out what people see and say about this event, and join the conversation.</p> <p class="mb-2">Find out what people see and say about this event, and join the conversation.</p>
<t t-snippet-call="website.s_share"> <t t-snippet-call="website.s_share">
<t t-set="_no_title" t-value="True"/> <t t-set="_no_title" t-value="True"/>
<t t-set="_classes" t-valuef="o_wevent_sidebar_social mx-n1"/> <t t-set="_classes" t-valuef="o_wevent_sidebar_social mx-n1"/>
<t t-set="_link_classes" t-valuef="o_wevent_social_link"/> <t t-set="_link_classes" t-valuef="o_wevent_social_link"/>
</t> </t>
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</section> </section>
<t t-call="website_event.modal_ticket_registration"/>
</t> </t>
</template> </template>
<!-- Event - Registration --> <!-- Event - Registration -->
<template id="registration_template" name="Registration"> <template id="registration_template" name="Registration">
<!-- Show the tickets button only on desktop -->
<div t-attf-class="d-flex d-lg-block flex-wrap justify-content-between align-items-center {{event.event_registrations_open and 'pb-3 border-bottom' or ''}}">
<div class="d-flex flex-wrap justify-content-between align-items-center w-100 mb-3">
<h4 class="mb-0">Tickets</h4>
<t t-call="website_event.registration_configure_tickets_button" t-if="request.env.user.has_group('event.group_event_manager')">
<t t-set="linkClasses">ms-2</t>
</t>
</div>
<button t-if="event.event_registrations_open" type="button" data-bs-toggle="modal" data-bs-target="#modal_ticket_registration" class="btn btn-primary w-100">Register</button>
</div>
<div t-if="toast_message" class="o_wevent_register_toaster d-none" t-att-data-message="toast_message"/> <div t-if="toast_message" class="o_wevent_register_toaster d-none" t-att-data-message="toast_message"/>
<div t-if="not event.event_registrations_open" class="o_wevent_theme_bg_base mb-5"> <div t-if="not event.event_registrations_open" class="mb-3">
<div class="alert alert-info mb-0 row g-0 justify-content-between align-items-center" role="status"> <div class="alert alert-info mb-0 d-flex flex-wrap gap-2 justify-content-between align-items-center" role="status">
<t t-if="not event.event_registrations_started and not event.event_registrations_sold_out"> <t t-if="not event.event_registrations_started and not event.event_registrations_sold_out">
<div class="col col-md-8 d-flex"> <div class="d-flex flex-column">
<em class="me-2">Ticket Sales starting on <em class="me-2">Ticket Sales starting on
<span class="" t-out="event.start_sale_datetime" <span class="" t-out="event.start_sale_datetime"
t-options="{'widget': 'datetime', 'tz_name': event.date_tz, 'format': 'short'}"/> t-options="{'widget': 'datetime', 'tz_name': event.date_tz, 'format': 'short'}"/>
<span t-out="event.date_tz"/> <span t-out="event.date_tz"/>
</em> </em>
<t t-call="website_event.registration_configure_tickets_button" <t t-call="website_event.registration_configure_tickets_button"
t-if="request.env.user.has_group('event.group_event_manager')"/> t-if="request.env.user.has_group('event.group_event_manager')">
<t t-set="linkClasses">alert-link my-3</t>
</t>
</div> </div>
<button class="btn btn-danger col col-md-4" disabled="1">Registrations not yet open</button> <button class="btn btn-danger" disabled="1">Registrations not yet open</button>
</t> </t>
<t t-else=""> <t t-else="">
<div class="col col-md-8"> <div>
<em t-if="event.event_registrations_sold_out">Tickets for this Event are <b>Sold Out</b></em> <em t-if="event.event_registrations_sold_out">Tickets for this Event are <b>Sold Out</b></em>
<em t-else="">Registrations are <b>closed</b></em> <em t-else="">Registrations are <b>closed</b></em>
</div> </div>
<button class="btn btn-danger col col-md-4 py-2" disabled="1"> <button class="btn btn-danger py-2 w-100" disabled="1">
<span t-if="event.event_registrations_sold_out">Sold Out</span> <span t-if="event.event_registrations_sold_out">Sold Out</span>
<span t-else="">Registrations Closed</span> <span t-else="">Registrations Closed</span>
</button> </button>
</t> </t>
</div> </div>
</div> </div>
<form t-if="event.event_registrations_open and (not event.event_ticket_ids or any(not ticket.is_expired for ticket in event.event_ticket_ids))"
id="registration_form"
class="mb-5"
t-attf-action="/event/#{slug(event)}/registration/new" method="post"
itemscope="itemscope" itemprop="offers" itemtype="http://schema.org/AggregateOffer">
<input type="hidden" name="csrf_token" t-att-value="request.csrf_token()"/>
<div id="o_wevent_tickets" class="o_wevent_theme_bg_base shadow-sm o_wevent_js_ticket_details" data-folded-by-default="0">
<div t-if="registration_error_code == 'insufficient_seats'" class="alert alert-danger" role="alert">
<p class="mb-0">
Registration failed! These tickets are not available anymore.
</p>
</div>
<t t-set="tickets" t-value="event.event_ticket_ids.filtered(lambda ticket: not ticket.is_expired)"/>
<!-- If some tickets expired and there is only one type left, we keep the same layout -->
<t t-if="len(event.event_ticket_ids) &gt; 1">
<div class="d-flex align-items-center py-2 ps-3 pe-2 border-bottom">
<span class="o_wevent_registration_title text-start">Tickets</span>
<div class="o_wevent_price_range d-none"/>
<t t-call="website_event.registration_configure_tickets_button"
t-if="request.env.user.has_group('event.group_event_manager')"/>
<span t-if="not event.event_registrations_open" class="text-danger">
<i class="fa fa-ban me-2"/>Sold Out
</span>
<a href="#" role="button" class="o_wevent_registration_btn d-none" data-bs-target="#o_wevent_tickets_collapse">
<span>Tickets</span>
<span class="btn p-0 close d-none">×</span>
</a>
</div>
<div id="o_wevent_tickets_collapse" class="collapse show">
<div t-foreach="tickets" t-as="ticket"
class="o_wevent_theme_bg_light row px-3 py-2 mx-0 border-bottom o_wevent_ticket_selector"
t-att-name="ticket.name">
<div class="col-md-8 col-xs-12 p-0" itemscope="itemscope" itemtype="http://schema.org/Offer">
<h5 itemprop="name" t-field="ticket.name" class="my-0"/>
<t t-if="ticket.description">
<small t-field="ticket.description" class="text-muted py-2"/>
<br/>
</t>
<small t-if="ticket.end_sale_datetime and ticket.sale_available and not ticket.is_expired"
class="text-muted me-3" itemprop="availabilityEnds">Sales end on
<span itemprop="priceValidUntil" t-out="ticket.end_sale_datetime"
t-options="{'widget': 'datetime', 'tz_name': event.date_tz, 'format': 'short'}"/>
(<span t-out="ticket.event_id.date_tz"/>)
</small>
<small t-if="ticket.start_sale_datetime and not ticket.sale_available and not ticket.is_expired"
class="text-muted me-3" itemprop="availabilityEnds">
Sales start on <span itemprop="priceValidUntil" t-out="ticket.start_sale_datetime"
t-options="{'widget': 'datetime', 'tz_name': event.date_tz, 'format': 'short'}"/>
(<span t-out="ticket.event_id.date_tz"/>)
</small>
</div>
<div class="col-md-4 col-xs-12 p-0 d-flex align-items-center justify-content-between">
<div class="o_wevent_registration_multi_select"/>
<div class="w-auto ms-auto">
<select t-if="not ticket.is_expired and ticket.sale_available"
t-attf-name="nb_register-#{ticket.id}"
class="form-select">
<t t-set="seats_max_ticket" t-value="(not ticket.seats_limited or ticket.seats_available &gt; 9) and 10 or ticket.seats_available + 1"/>
<t t-set="seats_max_event" t-value="(not event.seats_limited or event.seats_available &gt; 9) and 10 or event.seats_available + 1"/>
<t t-set="seats_max" t-value="min(seats_max_ticket, seats_max_event)"/>
<t t-foreach="range(0, seats_max)" t-as="nb">
<option t-out="nb" t-att-selected="len(ticket) == 0 and nb == 0 and 'selected'"/>
</t>
</select>
<div t-else="" class="text-danger">
<span t-if="not ticket.sale_available and not ticket.is_expired and ticket.is_launched" >Sold Out</span>
<span t-if="ticket.is_expired">Expired</span>
</div>
</div>
</div>
</div>
<div class="row g-0">
<div class="d-grid col-md-4 offset-md-8 py-2 ps-md-0 pe-md-2">
<button type="submit" class="btn btn-primary o_wait_lazy_js a-submit" disabled="" t-attf-id="#{event.id}">
Register
<t t-if="event.seats_limited and event.seats_max and event.seats_available &lt;= (event.seats_max * 0.2)">
(only <t t-out="event.seats_available"/> available)
</t>
</button>
</div>
</div>
</div>
</t>
<div t-else="" class="o_wevent_registration_single">
<div class="row p-2 ps-3">
<div class="col-lg-8 d-flex flex-columns align-items-center" itemscope="itemscope" itemtype="http://schema.org/Offer">
<h6 itemprop="name" class="my-0 pe-3 border-end text-dark o_wevent_single_ticket_name">
<span t-if="tickets" t-field="tickets.name"/>
<span t-else="">Registration</span>
</h6>
<t t-if="tickets.description">
<small t-field="tickets.description" class="text-muted py-2"/>
<br/>
</t>
<small t-if="tickets.end_sale_datetime and tickets.sale_available and not tickets.is_expired"
class="text-muted ms-1 me-3" itemprop="availabilityEnds">
Sales end on
<span itemprop="priceValidUntil" t-out="tickets.end_sale_datetime"
t-options="{'widget': 'datetime', 'tz_name': event.date_tz, 'format': 'short'}"/>
(<span t-out="tickets.event_id.date_tz"/>)
</small>
<t t-call="website_event.registration_configure_tickets_button"
t-if="request.env.user.has_group('event.group_event_manager')"/>
<div class="ms-auto o_wevent_nowrap">
<t t-if="event.event_registrations_open">
<span class="text-dark fw-bold align-middle px-2">Qty</span>
<link itemprop="availability" content="http://schema.org/InStock"/>
<select t-att-name="'nb_register-%s' % (tickets.id if tickets else 0)" class="d-inline w-auto form-select">
<t t-set="seats_max_ticket" t-value="(not tickets or not tickets.seats_limited or tickets.seats_available &gt; 9) and 10 or tickets.seats_available + 1"/>
<t t-set="seats_max_event" t-value="(not event.seats_limited or event.seats_available &gt; 9) and 10 or event.seats_available + 1"/>
<t t-set="seats_max" t-value="min(seats_max_ticket, seats_max_event) if tickets else seats_max_event"/>
<t t-foreach="range(0, seats_max)" t-as="nb">
<option t-out="nb" t-att-selected="nb == 1 and 'selected'"/>
</t>
</select>
</t>
<t t-else="">
<span itemprop="availability" content="http://schema.org/SoldOut" class="text-danger">
<i class="fa fa-ban me-2"/>Sold Out
</span>
</t>
</div>
</div>
<div class="d-grid col-lg-4 pt-3 pt-lg-0 ps-2 ps-lg-0">
<button type="submit" class="btn btn-primary o_wait_lazy_js a-submit" t-attf-id="#{event.id}" disabled="disabled">
Register
<t t-if="event.seats_limited and event.seats_max and event.seats_available &lt;= (event.seats_max * 0.2)">
(only <t t-out="event.seats_available"/> available)
</t>
</button>
</div>
</div>
</div>
</div>
</form>
</template> </template>
<template id="registration_attendee_details" name="Registration Attendee Details"> <template id="registration_attendee_details" name="Registration Attendee Details">
@@ -449,32 +339,148 @@
<!-- Button to configure Tickets --> <!-- Button to configure Tickets -->
<template id="registration_configure_tickets_button" name="Registration Configure Ticket Button"> <template id="registration_configure_tickets_button" name="Registration Configure Ticket Button">
<div class="o_not_editable mx-2" role="link"> <a t-attf-class="o_not_editable text-nowrap {{linkClasses or '' }}" t-attf-href="/web#id=#{event.id}&amp;menu_id=#{backend_menu_id}&amp;view_type=form&amp;model=event.event" role="link" title="Configure event tickets">
<a class="text-nowrap" t-attf-href="/web#id=#{event.id}&amp;menu_id=#{backend_menu_id}&amp;view_type=form&amp;model=event.event"> <i class="fa fa-gear me-1" role="img" aria-label="Configure" title="Configure event tickets"/><em>Configure Tickets</em>
<i class="fa fa-gear me-1" role="img" aria-label="Configure" title="Configure event tickets"/><em>Configure Tickets</em> </a>
</a> </template>
<template id="modal_ticket_registration" name="Modal for tickets registration">
<!-- Modal -->
<div class="modal fade" id="modal_ticket_registration" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="staticBackdropLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<div class="o_wevent_registration_title modal-title fs-5" id="staticBackdropLabel">Tickets</div>
<div t-if="len(event.event_ticket_ids) &gt; 1" class="o_wevent_price_range ms-2"/>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<form t-if="event.event_registrations_open and (not event.event_ticket_ids or any(not ticket.is_expired for ticket in event.event_ticket_ids))"
id="registration_form"
t-attf-action="/event/#{slug(event)}/registration/new" method="post"
itemscope="itemscope" itemprop="offers" itemtype="http://schema.org/AggregateOffer">
<input type="hidden" name="csrf_token" t-att-value="request.csrf_token()"/>
<div id="o_wevent_tickets" class="shadow-sm o_wevent_js_ticket_details">
<div t-if="registration_error_code == 'insufficient_seats'" class="alert alert-danger" role="alert">
<p class="mb-0">
Registration failed! These tickets are not available anymore.
</p>
</div>
<t t-set="tickets" t-value="event.event_ticket_ids.filtered(lambda ticket: not ticket.is_expired)"/>
<!-- If some tickets expired and there is only one type left, we keep the same layout -->
<t t-if="len(event.event_ticket_ids) &gt; 1">
<span t-if="not event.event_registrations_open" class="text-danger">
<i class="fa fa-ban me-2"/>Sold Out
</span>
<div id="o_wevent_tickets_collapse" class="modal-body collapse show">
<div t-foreach="tickets" t-as="ticket"
class="d-flex justify-content-between o_wevent_ticket_selector"
t-att-name="ticket.name">
<div itemscope="itemscope" itemtype="http://schema.org/Offer">
<h5 itemprop="name" t-field="ticket.name" class="my-0"/>
<t t-if="ticket.description">
<small t-field="ticket.description" class="text-muted py-2"/>
<br/>
</t>
<small t-if="ticket.end_sale_datetime and ticket.sale_available and not ticket.is_expired"
class="text-muted me-3" itemprop="availabilityEnds">Sales end on
<span itemprop="priceValidUntil" t-out="ticket.end_sale_datetime"
t-options="{'widget': 'datetime', 'tz_name': event.date_tz, 'format': 'short'}"/>
(<span t-out="ticket.event_id.date_tz"/>)
</small>
<small t-if="ticket.start_sale_datetime and not ticket.sale_available and not ticket.is_expired"
class="text-muted me-3" itemprop="availabilityEnds">
Sales start on <span itemprop="priceValidUntil" t-out="ticket.start_sale_datetime"
t-options="{'widget': 'datetime', 'tz_name': event.date_tz, 'format': 'short'}"/>
(<span t-out="ticket.event_id.date_tz"/>)
</small>
</div>
<div class="d-flex align-items-center justify-content-between p-0">
<div class="o_wevent_registration_multi_select flex-md-grow-1 me-2 text-end"/>
<div class="w-auto ms-auto">
<select t-if="not ticket.is_expired and ticket.sale_available"
t-attf-name="nb_register-#{ticket.id}"
class="form-select">
<t t-set="seats_max_ticket" t-value="(not ticket.seats_limited or ticket.seats_available &gt; 9) and 10 or ticket.seats_available + 1"/>
<t t-set="seats_max_event" t-value="(not event.seats_limited or event.seats_available &gt; 9) and 10 or event.seats_available + 1"/>
<t t-set="seats_max" t-value="min(seats_max_ticket, seats_max_event)"/>
<t t-foreach="range(0, seats_max)" t-as="nb">
<option t-out="nb" t-att-selected="len(ticket) == 0 and nb == 0 and 'selected'"/>
</t>
</select>
<div t-else="" class="text-danger">
<span t-if="not ticket.sale_available and not ticket.is_expired and ticket.is_launched" >Sold Out</span>
<span t-if="ticket.is_expired">Expired</span>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-light" data-bs-dismiss="modal">Close</button>
<button type="submit" class="btn btn-primary o_wait_lazy_js a-submit" disabled="" t-attf-id="#{event.id}">
Register
<t t-if="event.seats_limited and event.seats_max and event.seats_available &lt;= (event.seats_max * 0.2)">
(only <t t-out="event.seats_available"/> available)
</t>
</button>
</div>
</t>
<div t-else="" class="o_wevent_registration_single">
<div class="modal-body row px-3 py-2 mx-0">
<div class="col-12 col-md-8 p-0" itemscope="itemscope" itemtype="http://schema.org/Offer">
<h5 itemprop="name" class="my-0 pe-3 o_wevent_single_ticket_name">
<span t-if="tickets" t-field="tickets.name"/>
<span t-else="">Registration</span>
</h5>
<t t-if="tickets.description">
<small t-field="tickets.description" class="text-muted py-2"/>
<br/>
</t>
<small t-if="tickets.end_sale_datetime and tickets.sale_available and not tickets.is_expired"
class="text-muted" itemprop="availabilityEnds">
Sales end on
<span itemprop="priceValidUntil" t-out="tickets.end_sale_datetime"
t-options="{'widget': 'datetime', 'tz_name': event.date_tz, 'format': 'short'}"/>
(<span t-out="tickets.event_id.date_tz"/>)
</small>
</div>
<div class="col-md-4 d-flex align-items-center justify-content-between p-0">
<t t-if="event.event_registrations_open">
<link itemprop="availability" content="http://schema.org/InStock"/>
<div class="o_wevent_registration_single_select w-auto ms-auto">
<select t-att-name="'nb_register-%s' % (tickets.id if tickets else 0)" class="d-inline w-auto form-select">
<t t-set="seats_max_ticket" t-value="(not tickets or not tickets.seats_limited or tickets.seats_available &gt; 9) and 10 or tickets.seats_available + 1"/>
<t t-set="seats_max_event" t-value="(not event.seats_limited or event.seats_available &gt; 9) and 10 or event.seats_available + 1"/>
<t t-set="seats_max" t-value="min(seats_max_ticket, seats_max_event) if tickets else seats_max_event"/>
<t t-foreach="range(0, seats_max)" t-as="nb">
<option t-out="nb" t-att-selected="nb == 1 and 'selected'"/>
</t>
</select>
</div>
</t>
<t t-else="">
<span itemprop="availability" content="http://schema.org/SoldOut" class="text-danger">
<i class="fa fa-ban me-2"/>Sold Out
</span>
</t>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-light" data-bs-dismiss="modal">Close</button>
<button type="submit" class="btn btn-primary o_wait_lazy_js a-submit" t-attf-id="#{event.id}" disabled="disabled">
Register
<t t-if="event.seats_limited and event.seats_max and event.seats_available &lt;= (event.seats_max * 0.2)">
(only <t t-out="event.seats_available"/> available)
</t>
</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div> </div>
</template> </template>
<!-- This template is called whenever the "Fold Ticket Details" option is checked on the website (Customize > Fold Tickets Details) -->
<template id="fold_register_details" inherit_id="website_event.registration_template" active="False" name="Fold ticket details">
<xpath expr="//div[@id='o_wevent_tickets']" position="attributes">
<attribute name="data-folded-by-default">1</attribute>
</xpath>
<xpath expr="//div[@id='o_wevent_tickets_collapse']" position="attributes">
<attribute name="class">collapse</attribute>
</xpath>
<xpath expr="//span[hasclass('o_wevent_registration_title')]" position="attributes">
<attribute name="class" add="d-none" separator=" "/>
</xpath>
<xpath expr="//div[hasclass('o_wevent_price_range')]" position="attributes">
<attribute name="class">o_wevent_price_range</attribute>
</xpath>
<xpath expr="//a[hasclass('o_wevent_registration_btn')]" position="attributes">
<attribute
name="class">btn btn-primary o_wevent_registration_btn collapsed ms-auto</attribute>
<attribute name="data-bs-toggle">collapse</attribute>
</xpath>
</template>
</odoo> </odoo>
@@ -4,7 +4,7 @@
<!-- Search Box --> <!-- Search Box -->
<template id="events_search_box_input" name="Events search box"> <template id="events_search_box_input" name="Events search box">
<t t-call="website.website_search_box_input"> <t t-call="website.website_search_box_input">
<t t-set="_classes" t-valuef="o_wevent_event_searchbar_form w-100 my-1 my-lg-0 #{_classes}"/> <t t-set="_classes" t-valuef="o_wevent_event_searchbar_form flex-grow-1 #{_classes}"/>
<t t-set="search_type" t-valuef="events"/> <t t-set="search_type" t-valuef="events"/>
<t t-set="action" t-valuef="/event"/> <t t-set="action" t-valuef="/event"/>
<t t-set="display_description" t-valuef="true"/> <t t-set="display_description" t-valuef="true"/>
@@ -21,7 +21,7 @@
<template id="events_search_box" inherit_id="website.website_search_box" primary="True"> <template id="events_search_box" inherit_id="website.website_search_box" primary="True">
<xpath expr="//div[@role='search']" position="replace"> <xpath expr="//div[@role='search']" position="replace">
<form t-attf-class="o_wevent_event_searchbar_form o_wait_lazy_js w-100 my-1 my-lg-0 #{_classes}" <form t-attf-class="o_wevent_event_searchbar_form o_wait_lazy_js w-100 flex-grow-1 #{_classes}"
t-att-action="action if action else '/event'" method="get"> t-att-action="action if action else '/event'" method="get">
<t t-set="search" t-value="search or _searches and _searches['search']"/> <t t-set="search" t-value="search or _searches and _searches['search']"/>
<t t-set="placeholder" t-value="placeholder or _placeholder"/> <t t-set="placeholder" t-value="placeholder or _placeholder"/>
@@ -47,13 +47,13 @@
<t t-set="_resize_height" t-value="256"/> <t t-set="_resize_height" t-value="256"/>
<t t-set="_resize_width" t-value="256"/> <t t-set="_resize_width" t-value="256"/>
<div class="s_events_event_date o_wevent_theme_bg_base position-absolute shadow-sm text-dark"> <div class="s_events_event_date position-absolute shadow-sm text-dark">
<span t-field="record.date_begin" t-options="{'format': 'LLL'}" class="s_events_event_month"/> <span t-field="record.date_begin" t-options="{'format': 'LLL'}" class="s_events_event_month"/>
<span t-field="record.date_begin" t-options="{'format': 'dd'}" class="s_events_event_day"/> <span t-field="record.date_begin" t-options="{'format': 'dd'}" class="s_events_event_day"/>
</div> </div>
</t> </t>
</a> </a>
<div class="o_wevent_theme_bg_base card-body p-3"> <div class="card-body p-3">
<div t-if="is_sample" class="h5 o_ribbon_right bg-primary text-uppercase">Sample</div> <div t-if="is_sample" class="h5 o_ribbon_right bg-primary text-uppercase">Sample</div>
<h5 class="mb-0 text-truncate" t-field="record.name"/> <h5 class="mb-0 text-truncate" t-field="record.name"/>
<time itemprop="startDate" t-att-datetime="record.date_begin"> <time itemprop="startDate" t-att-datetime="record.date_begin">
@@ -21,8 +21,8 @@ label.o_wbooth_category_unavailable {
} }
& > input + div { & > input + div {
padding: 10px; opacity: .4;
border: 5px solid mix(map-get($theme-colors, 'secondary'), #e9ecef); border: 3px solid $o-gray-600;
} }
&:not(.o_wbooth_category_unavailable) > input + div { &:not(.o_wbooth_category_unavailable) > input + div {
@@ -30,36 +30,12 @@ label.o_wbooth_category_unavailable {
} }
&:not(.o_wbooth_category_unavailable):hover > input + div { &:not(.o_wbooth_category_unavailable):hover > input + div {
border-color: map-get($theme-colors, 'secondary'); opacity: .8;
}
&:hover > input + div:before {
color: map-get($theme-colors, 'secondary');
} }
& > input:checked + div, & > input:checked + div,
&:hover > input:checked + div { &:hover > input:checked + div {
border-color: map-get($theme-colors, 'primary'); opacity: 1;
}
& > input:checked + div:before,
&:hover > input:checked + div:before {
color: map-get($theme-colors, 'primary');
}
& > input:checked + div:before,
&:not(.o_wbooth_category_unavailable):hover > input + div:before {
content: "\f058";
font-family: "FontAwesome";
width: 40px;
height: 40px;
position: absolute;
line-height: 40px;
top: -16px;
right: -16px;
background-color: $o-wevent-bg-color-base;
@include font-size(2em);
text-align: center;
} }
& img { & img {
@@ -68,55 +44,41 @@ label.o_wbooth_category_unavailable {
} }
.o_wbooth_booths .form-check{
position: relative;
padding-left: 0;
& > input {
visibility: hidden;
position: absolute;
}
& > input + label {
opacity: .4;
padding: 1rem;
border: 1px solid $o-gray-600;
}
&:hover > input + label {
opacity: 1;
}
& > input:checked + label,
&:hover > input:checked + label {
opacity: 1;
background-color: $o-gray-600;
color: $o-white;
}
}
.o_wevent_booth_category { .o_wevent_booth_category {
background-color: $o-wevent-bg-color-light; background-color: $o-wevent-bg-color-light;
} }
.o_wevent_booth_order_progress { .o_wevent_booth_order_progress {
$wevent-booth-order-progress-color: mix(map-get($theme-colors, 'primary'), $body-bg, 40%);
$wevent-booth-order-progress-color-2: mix(map-get($theme-colors, 'primary'), $body-bg, 33%);
$wevent-booth-order-progress-height: 48px;
height: $wevent-booth-order-progress-height;
li { li {
border: 1px solid $wevent-booth-order-progress-color;
border-right-width: 0;
padding-left: 24px;
height: $wevent-booth-order-progress-height;
line-height: $wevent-booth-order-progress-height;
width: calc(100%/3);
&.o_current_stage { &.o_current_stage {
background: $wevent-booth-order-progress-color; font-weight: bold;
.chevron:before {
border-left: 24px solid $wevent-booth-order-progress-color;
}
}
&:first-child {
padding-left: 0px;
&:hover:not(.o_current_stage) {
background-color: $wevent-booth-order-progress-color-2 !important;
.chevron, .chevron::before {
border-left-color: $wevent-booth-order-progress-color-2 !important;
}
}
}
&:last-child {
border-right-width: 1px !important;
}
.chevron {
top: -1px;
right: -24px;
z-index: 1;
border: 24px solid transparent;
border-right: 0;
border-left: 24px solid $wevent-booth-order-progress-color;
&:before {
@include o-position-absolute($top:-24px, $right:2px);
display: block;
border: 24px solid transparent;
border-right: 0;
border-left: 24px solid $o-wevent-bg-color-base;
content: "";
}
} }
} }
} }
@@ -9,24 +9,11 @@
</t> </t>
<t t-name="event_booth_registration_complete"> <t t-name="event_booth_registration_complete">
<ul class="o_wevent_booth_order_progress list-unstyled d-none d-lg-block mb-0"> <div class="col-12">
<li class="position-relative float-start m-0 text-center"> <div class="row my-3">
<a class="text-decoration-none text-reset" t-attf-href="/event/#{event_id}/booth?booth_category_id=#{booth_category_id}">
<span class="d-block">Booth Selection</span><span class="chevron position-absolute d-block"/>
</a>
</li>
<li class="position-relative float-start m-0 text-center">
Contact Details<span class="chevron position-absolute d-block"/>
</li>
<li class="position-relative float-start m-0 text-center o_current_stage">
Confirmed
</li>
</ul>
<div class="col-12 p-5">
<div class="row mb-3">
<div class="col-12"> <div class="col-12">
<h3>Booth Registration completed!</h3> <h4>Booth Registration completed!</h4>
<span class="h4 text-muted" t-out="event_name"/> <h5 class="text-muted" t-out="event_name"/>
</div> </div>
</div> </div>
<div class="d-flex flex-column"> <div class="d-flex flex-column">
@@ -9,14 +9,12 @@
<form method="post" <form method="post"
id="o_wbooth_contact_details_form" id="o_wbooth_contact_details_form"
t-att-data-event-id="event.id" t-att-data-event-id="event.id"
class="col-12 px-5 py-3 js_website_submit_form"> class="col-12 js_website_submit_form">
<input type="hidden" name="csrf_token" t-att-value="request.csrf_token()"/> <input type="hidden" name="csrf_token" t-att-value="request.csrf_token()"/>
<input type="hidden" name="booth_category_id" t-att-value="booth_category.id"/> <input type="hidden" name="booth_category_id" t-att-value="booth_category.id"/>
<input type="hidden" name="event_booth_ids" t-att-value="event_booths.ids"/> <input type="hidden" name="event_booth_ids" t-att-value="event_booths.ids"/>
<div id="o_wbooth_contact_details"> <div id="o_wbooth_contact_details">
<h4 class="mt32"> <h4>Contact Details</h4>
<strong>Contact Details</strong>
</h4>
<div class="row mb-3"> <div class="row mb-3">
<label class="col-form-label col-sm-auto"> <label class="col-form-label col-sm-auto">
<span>Name</span> <span>Name</span>
@@ -5,19 +5,10 @@
<t t-call="website_event.layout"> <t t-call="website_event.layout">
<div class="o_wbooth_registration" t-att-data-event-id="event.id" <div class="o_wbooth_registration" t-att-data-event-id="event.id"
itemscope="itemscope" itemtype="http://schema.org/Event"> itemscope="itemscope" itemtype="http://schema.org/Event">
<t t-call="website.record_cover"> <section>
<t t-set="_record" t-value="event"/>
<t t-set="use_filters" t-value="True"/>
<t t-set="use_text_align" t-value="True"/>
<t t-set="additionnal_classes" t-value="'pb128'"/>
<div class="container d-flex flex-column flex-grow-1">
<h1 class="text-white my-5">Get A Booth</h1>
</div>
</t>
<section class="mt-n5">
<div class="container overflow-hidden"> <div class="container overflow-hidden">
<div class="o_wevent_theme_bg_base row mb64 g-0 rounded shadow-sm"> <h3>Get A Booth</h3>
<div class="row g-0">
<t t-out="0"/> <t t-out="0"/>
</div> </div>
</div> </div>
@@ -56,22 +47,27 @@
<t t-call="website_event_booth.event_booth_order_progress"> <t t-call="website_event_booth.event_booth_order_progress">
<t t-set="step" t-value="'STEP_BOOTH_SELECTION'"/> <t t-set="step" t-value="'STEP_BOOTH_SELECTION'"/>
</t> </t>
<div t-attf-class="#{'col-lg-9' if available_booth_category_ids else 'col-lg-12'} p-4 pt-3"> <div t-attf-class="#{'col-lg-12' if available_booth_category_ids else 'col-lg-12'}">
<form method="post" class="form-horizontal justify-content-center mt32 js_website_submit_form o_wbooth_registration_form" <form method="post" class="form-horizontal js_website_submit_form o_wbooth_registration_form mt-1"
t-attf-action="/event/#{slug(event)}/booth/register" t-att-data-event-id="event.id"> t-attf-action="/event/#{slug(event)}/booth/register" t-att-data-event-id="event.id">
<input type="hidden" name="csrf_token" t-att-value="request.csrf_token()"/> <input type="hidden" name="csrf_token" t-att-value="request.csrf_token()"/>
<div class="row"> <div class="row mb-3">
<h4 class="mb-3">Choose your type of booth</h4>
<t t-foreach="event.event_booth_category_ids" t-as="booth_category"> <t t-foreach="event.event_booth_category_ids" t-as="booth_category">
<t t-set="booth_category_unavailable" t-value="booth_category not in available_booth_category_ids"/> <t t-set="booth_category_unavailable" t-value="booth_category not in available_booth_category_ids"/>
<div class="col-md-4 mb-3"> <div class="col-md-6 col-lg-4 mb-2">
<label t-attf-class="d-block #{'o_wbooth_category_unavailable' if booth_category_unavailable else ''}"> <label t-attf-class="d-block h-100 #{'o_wbooth_category_unavailable' if booth_category_unavailable else ''}">
<input type="radio" name="booth_category_id" t-att-value="booth_category.id" t-att-disabled="booth_category_unavailable" <input type="radio" name="booth_category_id" t-att-value="booth_category.id" t-att-disabled="booth_category_unavailable"
t-att-checked="booth_category.id == selected_booth_category_id"/> t-att-checked="booth_category.id == selected_booth_category_id"/>
<div> <div class="card h-100">
<h5 name="booth_category_name" class="m-0 text-truncate" t-out="booth_category.name"/> <div t-field="booth_category.image_1920" class="card-img-top border-bottom"
<span class="img img-responsive"> t-options='{"widget": "image", "qweb_img_responsive": False, "class": "img img-fluid h-100 w-100 mw-100", "style": "max-height: 208px; min-height: 208px; object-fit: cover"}'/>
<div t-field="booth_category.image_1920" t-options="{'widget': 'image', 'preview_image': 'image_256', 'class': 'mt-2'}"/> <div class="card-body">
</span> <h5 name="booth_category_name" class="card-title" t-out="booth_category.name"/>
<span class="booth_category_price"></span>
<div t-attf-id="o_wbooth_booth_description_#{booth_category.id}"
t-field="booth_category.description"/>
</div>
</div> </div>
<div t-if="booth_category_unavailable" class="o_ribbon_right bg-danger"> <div t-if="booth_category_unavailable" class="o_ribbon_right bg-danger">
<span class="text-nowrap">Sold Out</span> <span class="text-nowrap">Sold Out</span>
@@ -81,37 +77,35 @@
</t> </t>
</div> </div>
<t t-if="available_booth_category_ids"> <t t-if="available_booth_category_ids">
<div t-if="event.exhibition_map" class="row"> <div class="row">
<div class="d-grid col-sm-6 offset-sm-3 mb-4"> <div class="d-flex flex-wrap align-items-center gap-2 mb-3">
<a class="text-decoration-none text-center" href="#" data-bs-toggle="modal" data-bs-target="#mapModal"><i class="fa fa-map-o me-2"/>View Plan</a> <h4 class="mb-0">Location</h4>
<div role="dialog" id="mapModal" class="modal" tabindex="-1"> <div t-if="event.exhibition_map">
<div class="modal-dialog modal-lg"> <a class="text-decoration-none text-center" href="#" data-bs-toggle="modal" data-bs-target="#mapModal"><i class="fa fa-map-o me-2"/>View Plan</a>
<div class="modal-content"> <div role="dialog" id="mapModal" class="modal" tabindex="-1">
<div class="modal-body"> <div class="modal-dialog modal-lg">
<div t-field="event.exhibition_map" t-options="{'widget': 'image'}" class="img img-responsive"/> <div class="modal-content">
<div class="modal-body">
<div t-field="event.exhibition_map" t-options="{'widget': 'image'}" class="img img-responsive"/>
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> <div class="col-12 o_wbooth_booths d-flex flex-wrap align-items-center gap-2" t-att-data-selected-booth-ids="selected_booth_ids or ''"/>
<div class="row"> <div class="row">
<div class="col-sm-2 offset-sm-1"> <div class="alert alert-danger col-12 o_wbooth_unavailable_booth_alert d-none" role="alert">
<label for="booth_id" class="control-label">Booths</label> <i class="fa fa-exclamation-triangle"/>
<span>Sorry, several booths are now sold out. Please change your choices before validating again.</span>
</div>
</div> </div>
<div class="col-sm-6 o_wbooth_booths" t-att-data-selected-booth-ids="selected_booth_ids or ''"/> <div class="my-3" name="booth_registration_submit">
</div> <div class="d-flex flex-column align-content-end justify-content-end pt-3 border-top">
<div class="row"> <button type="submit" class="o_wbooth_registration_submit btn btn-primary btn-block ms-auto fw-bold" disabled="true">
<div class="alert alert-danger col-12 o_wbooth_unavailable_booth_alert d-none" role="alert"> <span>Book my Booth(s)</span>
<i class="fa fa-exclamation-triangle"/> </button>
<span>Sorry, several booths are now sold out. Please change your choices before validating again.</span> </div>
</div>
</div>
<div class="row" name="booth_registration_submit">
<div class="col-sm-6 offset-sm-3 mt-5">
<button type="submit" class="btn btn-primary btn-block fw-bold o_wbooth_registration_submit" disabled="true">
<span>Book my Booths</span>
</button>
</div> </div>
</div> </div>
</t> </t>
@@ -120,25 +114,19 @@
</div> </div>
</form> </form>
</div> </div>
<div t-if="available_booth_category_ids" class="o_wevent_booth_category col-lg-3 hidden-sm hidden-xs p-4 pt-3">
<t t-foreach="event.event_booth_category_ids" t-as="booth_category">
<div t-attf-id="o_wbooth_booth_description_#{booth_category.id}"
class="o_wbooth_booth_description d-none" t-field="booth_category.description"/>
</t>
</div>
</t> </t>
</t> </t>
</template> </template>
<template id="event_booth_order_progress"> <template id="event_booth_order_progress">
<ul class="o_wevent_booth_order_progress list-unstyled d-none d-lg-block mb-0"> <ul class="o_wevent_booth_order_progress list-unstyled d-none d-lg-block mb-3">
<li t-attf-class="position-relative float-start m-0 text-center #{'o_current_stage' if step=='STEP_BOOTH_SELECTION' else ''}"> <li t-attf-class="position-relative float-start m-0 text-center #{'o_current_stage' if step=='STEP_BOOTH_SELECTION' else ''}">
<a class="text-decoration-none text-reset" t-attf-href="/event/#{slug(event)}/booth?#{keep_query('booth_category_id', 'booth_ids')}"> <a class="text-decoration-none text-reset" t-attf-href="/event/#{slug(event)}/booth?#{keep_query('booth_category_id', 'booth_ids')}">
<span class="d-block">Booth Selection</span><span class="chevron position-absolute d-block"/> <span>Booth Selection</span><span class="fa fa-angle-right d-inline-block align-middle mx-sm-3 text-muted fs-5"></span>
</a> </a>
</li> </li>
<li t-attf-class="position-relative float-start m-0 text-center #{'o_current_stage' if step=='STEP_DETAILS_FORM' else 'text-muted'}"> <li t-attf-class="position-relative float-start m-0 text-center #{'o_current_stage' if step=='STEP_DETAILS_FORM' else 'text-muted'}">
Contact Details<span class="chevron position-absolute d-block"/> Contact Details<span class="fa fa-angle-right d-inline-block align-middle mx-sm-3 text-muted fs-5"></span>
</li> </li>
<li class="position-relative float-start m-0 text-center text-muted"> <li class="position-relative float-start m-0 text-center text-muted">
<span>Confirmed</span> <span>Confirmed</span>
@@ -25,7 +25,7 @@
trigger: '.o_wbooth_booths div:contains("OpenWood Demonstrator 2") input', trigger: '.o_wbooth_booths div:contains("OpenWood Demonstrator 2") input',
}, { }, {
content: "Validate attendees details", content: "Validate attendees details",
trigger: 'button:contains("Book my Booths")', trigger: 'button:enabled:contains("Book my Booth(s)")',
run: 'click', run: 'click',
}, { }, {
content: "Fill booth details", content: "Fill booth details",
@@ -4,7 +4,7 @@
<template id="event_booth_registration_details" inherit_id="website_event_booth.event_booth_registration_details"> <template id="event_booth_registration_details" inherit_id="website_event_booth.event_booth_registration_details">
<xpath expr="//button[hasclass('o_wbooth_registration_confirm')]//span" position="replace"> <xpath expr="//button[hasclass('o_wbooth_registration_confirm')]//span" position="replace">
<t t-if="has_payment_step">Go to Payment</t> <t t-if="has_payment_step">Go to Payment</t>
<t t-else="">Book my Booths</t> <t t-else="">Book my Booth(s)</t>
</xpath> </xpath>
</template> </template>
@@ -2,7 +2,7 @@
<odoo> <odoo>
<template id="event_booth_registration" inherit_id="website_event_booth.event_booth_registration"> <template id="event_booth_registration" inherit_id="website_event_booth.event_booth_registration">
<xpath expr="//h5[@name='booth_category_name']" position="after"> <xpath expr="//label//span[hasclass('booth_category_price')]" position="replace">
<t t-if="booth_category.price"> <t t-if="booth_category.price">
<t t-if="(booth_category.price - booth_category.price_reduce) &gt; 0 and website.pricelist_id.discount_policy == 'without_discount'"> <t t-if="(booth_category.price - booth_category.price_reduce) &gt; 0 and website.pricelist_id.discount_policy == 'without_discount'">
<del t-if="website.show_line_subtotals_tax_selection == 'tax_excluded'" <del t-if="website.show_line_subtotals_tax_selection == 'tax_excluded'"
@@ -14,14 +14,14 @@
t-field="booth_category.price_incl" t-field="booth_category.price_incl"
t-options="{'widget': 'monetary', 'from_currency': event.company_id.sudo().currency_id, 'display_currency': website.currency_id}"/> t-options="{'widget': 'monetary', 'from_currency': event.company_id.sudo().currency_id, 'display_currency': website.currency_id}"/>
</t> </t>
<span t-if="website.show_line_subtotals_tax_selection == 'tax_excluded'" <h5 t-if="website.show_line_subtotals_tax_selection == 'tax_excluded'"
t-field="booth_category.price_reduce" class="fw-normal text-muted" t-field="booth_category.price_reduce"
t-options="{'widget': 'monetary', 'from_currency': event.company_id.sudo().currency_id, 'display_currency': website.currency_id}"/> t-options="{'widget': 'monetary', 'from_currency': event.company_id.sudo().currency_id, 'display_currency': website.currency_id}"/>
<span t-else="" <h5 t-else=""
t-field="booth_category.price_reduce_taxinc" class="fw-normal text-muted" t-field="booth_category.price_reduce_taxinc"
t-options="{'widget': 'monetary', 'from_currency': event.company_id.sudo().currency_id, 'display_currency': website.currency_id}"/> t-options="{'widget': 'monetary', 'from_currency': event.company_id.sudo().currency_id, 'display_currency': website.currency_id}"/>
</t> </t>
<span t-else="" class="fw-normal text-muted">Free</span> <h5 t-else="">Free</h5>
</xpath> </xpath>
<xpath expr="//input[@name='booth_category_id']" position="attributes"> <xpath expr="//input[@name='booth_category_id']" position="attributes">
<attribute name="t-att-data-price"> <attribute name="t-att-data-price">
@@ -33,13 +33,11 @@
) or '0' ) or '0'
</attribute> </attribute>
</xpath> </xpath>
<xpath expr="//div[@name='booth_registration_submit']" position="before"> <xpath expr="//button[hasclass('o_wbooth_registration_submit')]" position="before">
<div class="row o_wbooth_booth_total_price d-none"> <div class="o_wbooth_booth_total_price d-none pb-3 text-end">
<div class="col-sm-2 offset-sm-1"> <div class="fw-bold">
<span class="fw-bold">Total</span> <span>Total</span>
</div> <span t-out="float(0)"
<div class="col-sm-6">
<span class="fw-bold" t-out="float(0)"
t-options="{'widget': 'monetary', 'from_currency': event.company_id.sudo().currency_id, 'display_currency': website.currency_id}"/> t-options="{'widget': 'monetary', 'from_currency': event.company_id.sudo().currency_id, 'display_currency': website.currency_id}"/>
</div> </div>
</div> </div>
@@ -55,7 +55,7 @@
</div> </div>
<span class="text-muted" t-if="sponsorData.subtitle" t-out="sponsorData.subtitle"/> <span class="text-muted" t-if="sponsorData.subtitle" t-out="sponsorData.subtitle"/>
<span t-if="sponsorData.url"> <span t-if="sponsorData.url">
<i class="fa fa-home me-2"/><a t-att-href="sponsorData.url"><span t-out="sponsorData.url"/></a> <i class="fa fa-globe me-2"/><a t-att-href="sponsorData.url"><span t-out="sponsorData.url"/></a>
</span> </span>
<span t-if="sponsorData.email"> <span t-if="sponsorData.email">
<i class="fa fa-envelope me-2"/><a t-att-mailto="sponsorData.email"><span t-out="sponsorData.email"/></a> <i class="fa fa-envelope me-2"/><a t-att-mailto="sponsorData.email"><span t-out="sponsorData.email"/></a>
@@ -9,10 +9,12 @@ publicWidget.registry.websiteEventSearchSponsor = publicWidget.Widget.extend({
'click .o_search_tag .btn': '_onTagRemove', 'click .o_search_tag .btn': '_onTagRemove',
'click .o_dropdown_reset_tags': '_onTagReset', 'click .o_dropdown_reset_tags': '_onTagReset',
'change .o_wevent_event_tags_form input': '_onTagAdd', 'change .o_wevent_event_tags_form input': '_onTagAdd',
'change .o_wevent_event_tags_mobile_form input': '_onTagAddMobile',
}, },
start: function () { start: function () {
this.form = this.$el.find('.o_wevent_event_tags_form'); this.form = this.$el.find('.o_wevent_event_tags_form');
this.mobileForm = this.$el.find('.o_wevent_event_tags_mobile_form');
return this._super.apply(this, arguments); return this._super.apply(this, arguments);
}, },
@@ -29,6 +31,10 @@ publicWidget.registry.websiteEventSearchSponsor = publicWidget.Widget.extend({
this.form.submit(); this.form.submit();
}, },
_onTagAddMobile: function () {
this.mobileForm.submit();
},
_onTagRemove: function (event) { _onTagRemove: function (event) {
const tag = $(event.target).parent(); const tag = $(event.target).parent();
const data = tag.data(); const data = tag.data();
@@ -23,6 +23,9 @@
padding: 1rem; padding: 1rem;
background-color: $o-wevent-bg-color-base !important; background-color: $o-wevent-bg-color-base !important;
color: $o-wevent-color; color: $o-wevent-color;
img{
max-height: 1rem;
}
} }
.card-footer { .card-footer {
@@ -99,8 +102,9 @@
} }
.o_wesponsor_aside_logo { .o_wesponsor_aside_logo {
max-width: 40px; width: 50px;
object-fit: contain; height: 30px;
object-fit: cover;
object-position: top; object-position: top;
} }
@@ -13,9 +13,6 @@
color: #404040; color: #404040;
padding-top: 2px; padding-top: 2px;
padding-bottom: 2px; padding-bottom: 2px;
-webkit-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
-moz-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
} }
.o_wevent_event .ribbon_Gold { .o_wevent_event .ribbon_Gold {
@@ -3,13 +3,13 @@
<template id="event_exhibitors" name="Event Exhibitors"> <template id="event_exhibitors" name="Event Exhibitors">
<t t-call="website_event.layout"> <t t-call="website_event.layout">
<div class="o_wevent_online o_wesponsor_index"> <div class="o_wevent_online o_wesponsor_index container">
<!-- Topbar --> <!-- Topbar -->
<t t-call="website_event_exhibitor.exhibitors_topbar"/> <t t-call="website_event_exhibitor.exhibitors_topbar"/>
<!-- Drag/Drop Area --> <!-- Drag/Drop Area -->
<div id="oe_structure_wesponsor_index_1" class="oe_structure"/> <div id="oe_structure_wesponsor_index_1" class="oe_structure"/>
<!-- Content --> <!-- Content -->
<div class="o_wesponsor_container container"> <div class="o_wesponsor_container">
<div class="row"> <div class="row">
<t t-call="website_event_exhibitor.exhibitors_search"/> <t t-call="website_event_exhibitor.exhibitors_search"/>
</div> </div>
@@ -31,22 +31,38 @@
<!-- Main topbar --> <!-- Main topbar -->
<template id="exhibitors_topbar" name="Exhibitor Tools"> <template id="exhibitors_topbar" name="Exhibitor Tools">
<nav class="navbar navbar-light border-top shadow-sm d-print-none"> <div class="d-flex d-print-none align-items-center justify-content-end flex-wrap gap-2 w-100">
<div class="container"> <h3 class="my-0 me-auto pe-sm-4">Exhibitors</h3>
<div class="d-flex flex-column flex-sm-row justify-content-between w-100"> <form class="o_wevent_event_tags_form d-none d-lg-block" action="#" method="POST">
<form class="o_wevent_event_tags_form" action="#" method="POST"> <input type="hidden" name="csrf_token" t-att-value="request.csrf_token()"/>
<input type="hidden" name="csrf_token" t-att-value="request.csrf_token()"/> <div class="o_wesponsor_topbar_filters o_wevent_index_topbar_filters d-flex gap-2"/>
<ul class="o_wesponsor_topbar_filters o_wevent_index_topbar_filters nav"/> </form>
</form> <div class="o_wevent_search d-flex w-100 w-lg-auto">
<div class="o_wevent_event_search_box d-flex align-items-center flex-wrap ps-sm-3 pe-0"> <div class="o_wevent_event_search_box d-flex align-items-center flex-wrap flex-grow-1">
<t t-call="website_event_exhibitor.exhibitor_search_box"> <t t-call="website_event_exhibitor.exhibitor_search_box">
<t t-set="search" t-value="search_key" /> <t t-set="search" t-value="search_key" />
<t t-set="placeholder" t-value="'Search an exhibitor ...'"/> <t t-set="placeholder" t-value="'Search an exhibitor ...'"/>
</t> </t>
</div>
</div> </div>
<button class="btn btn-light position-relative ms-2 d-lg-none"
data-bs-toggle="offcanvas"
data-bs-target="#o_wevent_exhibitors_offcanvas">
<i class="fa fa-sliders"/>
</button>
</div> </div>
</nav> </div>
<!-- Off canvas filters on mobile-->
<div id="o_wevent_exhibitors_offcanvas" class="o_website_offcanvas offcanvas offcanvas-end d-lg-none p-0 overflow-visible">
<div class="offcanvas-header">
<h5 class="offcanvas-title">Filters</h5>
<button type="button" class="btn-close" data-bs-dismiss="offcanvas" aria-label="Close"/>
</div>
<div class="offcanvas-body p-0">
<form class="o_wevent_event_tags_mobile_form" action="#" method="POST">
<div class="o_wesponsor_topbar_filters_mobile accordion accordion-flush"/>
</form>
</div>
</div>
</template> </template>
<!-- Topbar: optional country filters --> <!-- Topbar: optional country filters -->
@@ -54,10 +70,9 @@
inherit_id="website_event_exhibitor.exhibitors_topbar" inherit_id="website_event_exhibitor.exhibitors_topbar"
name="Filter by Country" name="Filter by Country"
active="True"> active="True">
<xpath expr="//ul[hasclass('o_wesponsor_topbar_filters')]" position="inside"> <xpath expr="//div[hasclass('o_wesponsor_topbar_filters')]" position="inside">
<li class="nav-item dropdown me-2 my-1"> <div class="dropdown flex-grow-1">
<a href="#" role="button" class="btn dropdown-toggle" data-bs-toggle="dropdown"> <a href="#" role="button" class="btn btn-light dropdown-toggle w-100" data-bs-toggle="dropdown">
<i class="fa fa-folder-open"/>
By Country By Country
</a> </a>
<div class="dropdown-menu"> <div class="dropdown-menu">
@@ -73,7 +88,44 @@
</label> </label>
</t> </t>
</div> </div>
</li> </div>
</xpath>
<xpath expr="//div[hasclass('o_wesponsor_topbar_filters_mobile')]" position="inside">
<div class="accordion-item">
<h2 class="accordion-header">
<button class="accordion-button collapsed"
type="button"
data-bs-toggle="collapse"
data-bs-target=".o_wevent_offcanvas_country"
aria-expanded="false"
aria-controls="o_wevent_offcanvas_country">
By Country
</button>
</h2>
<div class="o_wevent_offcanvas_country accordion-collapse collapse">
<div class="accordion-body pt-0">
<ul class="list-group list-group-flush">
<li class="list-group-item">
<a t-att-href="'/event/%s/exhibitors?%s' % (
slug(event),
keep_query('*', search_countries='')
)">
All Countries
</a>
</li>
<input type="hidden" name="csrf_token" t-att-value="request.csrf_token()"/>
<t t-foreach="sponsor_countries" t-as="sponsor_country">
<label t-attf-class="dropdown-item {{ 'active' if sponsor_country.id in search_countries.ids else '' }}">
<input class="d-none" type="checkbox" name="sponsor_country" multiple="multiple"
t-att-value="sponsor_country.id"
t-att-checked="'checked' if sponsor_country.id in search_countries.ids else None"/>
<t t-out="sponsor_country.name"/>
</label>
</t>
</ul>
</div>
</div>
</div>
</xpath> </xpath>
</template> </template>
@@ -82,10 +134,9 @@
inherit_id="website_event_exhibitor.exhibitors_topbar" inherit_id="website_event_exhibitor.exhibitors_topbar"
name="Filter by Sponsorship" name="Filter by Sponsorship"
active="True"> active="True">
<xpath expr="//ul[hasclass('o_wesponsor_topbar_filters')]" position="inside"> <xpath expr="//div[hasclass('o_wesponsor_topbar_filters')]" position="inside">
<li class="nav-item dropdown me-2 my-1"> <div class="dropdown flex-grow-1">
<a href="#" role="button" class="btn dropdown-toggle" data-bs-toggle="dropdown"> <a href="#" role="button" class="btn btn-light dropdown-toggle w-100" data-bs-toggle="dropdown">
<i class="fa fa-folder-open"/>
By Level By Level
</a> </a>
<div class="dropdown-menu"> <div class="dropdown-menu">
@@ -101,7 +152,41 @@
</label> </label>
</t> </t>
</div> </div>
</li> </div>
</xpath>
<xpath expr="//div[hasclass('o_wesponsor_topbar_filters_mobile')]" position="inside">
<div class="accordion-item">
<h2 class="accordion-header">
<button class="accordion-button collapsed"
type="button"
data-bs-toggle="collapse"
data-bs-target=".o_wevent_offcanvas_country"
aria-expanded="false"
aria-controls="o_wevent_offcanvas_country">
By Level
</button>
</h2>
<div class="o_wevent_offcanvas_country accordion-collapse collapse">
<div class="accordion-body pt-0">
<ul class="list-group list-group-flush">
<li class="list-group-item">
<a >
All Levels
</a>
</li>
<input type="hidden" name="csrf_token" t-att-value="request.csrf_token()"/>
<t t-foreach="sponsor_types" t-as="sponsor_type">
<label t-attf-class="dropdown-item {{ 'active' if sponsor_type.id in search_sponsorships.ids else '' }}">
<input class="d-none" type="checkbox" name="sponsor_type" multiple="multiple"
t-att-value="sponsor_type.id"
t-att-checked="'checked' if sponsor_type.id in search_sponsorships.ids else None"/>
<t t-out="sponsor_type.name"/>
</label>
</t>
</ul>
</div>
</div>
</div>
</xpath> </xpath>
</template> </template>
@@ -137,9 +222,8 @@
<!-- Exhibitors: Cards-based display --> <!-- Exhibitors: Cards-based display -->
<template id="exhibitors_display_cards" name="Exhibitors Cards"> <template id="exhibitors_display_cards" name="Exhibitors Cards">
<div t-foreach="sponsor_categories" t-as="sponsor_category" class="row mb-3"> <div t-foreach="sponsor_categories" t-as="sponsor_category" class="row mb-3">
<div class="col-12"> <div class="col-12 mb-3">
<h2 class="m-0" t-out="sponsor_category['sponsorship'].name"/> <h4 class="m-0" t-out="sponsor_category['sponsorship'].name"/>
<hr class="mt-2 mb-2"/>
</div> </div>
<div t-foreach="sponsor_category['sponsors']" t-as="sponsor" class="col-md-6 col-lg-3 mb-4"> <div t-foreach="sponsor_category['sponsors']" t-as="sponsor" class="col-md-6 col-lg-3 mb-4">
<t t-call="website_event_exhibitor.exhibitor_card"/> <t t-call="website_event_exhibitor.exhibitor_card"/>
@@ -152,9 +236,9 @@
<!-- ============================================================ --> <!-- ============================================================ -->
<template id="exhibitor_card" name="Exhibitor Card"> <template id="exhibitor_card" name="Exhibitor Card">
<article class="h-100 card border-0 shadow-sm o_wesponsor_card" <article class="o_wesponsor_card card h-100"
itemscope="itemscope" itemtype="http://schema.org/Event"> itemscope="itemscope" itemtype="http://schema.org/Event">
<div class="h-100 row g-0" t-att-data-publish="sponsor.website_published and 'on' or 'off'"> <div class="row g-0 h-100" t-att-data-publish="sponsor.website_published and 'on' or 'off'">
<t t-set="sponsor_image_url" t-value="sponsor.website_image_url"/> <t t-set="sponsor_image_url" t-value="sponsor.website_image_url"/>
<header t-att-class="'overflow-hidden col-12 %s' % ('bg-secondary' if not sponsor_image_url else '')"> <header t-att-class="'overflow-hidden col-12 %s' % ('bg-secondary' if not sponsor_image_url else '')">
<div class="d-block h-100 w-100"> <div class="d-block h-100 w-100">
@@ -163,7 +247,7 @@
<small t-if="not sponsor.is_published" class="o_wesponsor_card_header_badge bg-danger"> <small t-if="not sponsor.is_published" class="o_wesponsor_card_header_badge bg-danger">
<i class="fa fa-ban me-2"/>Unpublished <i class="fa fa-ban me-2"/>Unpublished
</small> </small>
<img class="position-absolute me-2 mt-2" <img class="position-absolute me-3 mt-3"
style="right: 0; top: 0; max-height: 20px;" style="right: 0; top: 0; max-height: 20px;"
t-if="sponsor.partner_id.country_id" t-if="sponsor.partner_id.country_id"
t-att-src="sponsor.partner_id.country_id.image_url" t-att-src="sponsor.partner_id.country_id.image_url"
@@ -177,10 +261,10 @@
</div> </div>
</div> </div>
</header> </header>
<div class="o_wevent_theme_bg_base col-12 h-100"> <div class="col-12 h-100 border-top">
<main class="card-body"> <main class="card-body">
<!-- Title --> <!-- Title -->
<h5 class="card-title mt-0 mb-0 d-flex align-items-start"> <h5 class="card-title d-flex align-items-start justify-content-between mt-0 mb-0">
<span t-field="sponsor.name" itemprop="name" class="text-break"/> <span t-field="sponsor.name" itemprop="name" class="text-break"/>
<span t-if="sponsor.is_in_opening_hours and sponsor.chat_room_id" <span t-if="sponsor.is_in_opening_hours and sponsor.chat_room_id"
class="ms-auto badge text-bg-danger">Live class="ms-auto badge text-bg-danger">Live
@@ -212,7 +296,7 @@
<!-- Searched terms --> <!-- Searched terms -->
<template id="exhibitors_search" name="Exhibitors: search terms"> <template id="exhibitors_search" name="Exhibitors: search terms">
<div class="d-flex align-items-center mb-3"> <div class="d-flex flex-wrap align-items-center mb-3">
<t t-foreach="search_countries" t-as="country"> <t t-foreach="search_countries" t-as="country">
<t t-call="website_event_exhibitor.exhibitors_search_tag"> <t t-call="website_event_exhibitor.exhibitors_search_tag">
<t t-set="value" t-value="country.id"/> <t t-set="value" t-value="country.id"/>
@@ -232,10 +316,10 @@
<template id="exhibitors_search_tag" name="Exhibitors: term"> <template id="exhibitors_search_tag" name="Exhibitors: term">
<span t-att-data-field="field" t-att-data-value="value" <span t-att-data-field="field" t-att-data-value="value"
class="o_search_tag align-items-baseline border d-inline-flex ps-2 mt-3 rounded ml16 mb-2 bg-white"> class="o_search_tag d-flex align-items-baseline ps-2 my-2 me-2 border rounded bg-white">
<i class="fa fa-tag me-2 text-muted"/> <i class="fa fa-tag me-2 text-muted"/>
<t t-out="label"/> <t t-out="label"/>
<span class="btn border-0 py-1">&#215;</span> <span class="btn border-0 py-1 px-2">&#215;</span>
</span> </span>
</template> </template>
@@ -30,7 +30,7 @@
<!-- ============================================================ --> <!-- ============================================================ -->
<template id="exhibitor_main" name="Exhibitor: Main Content"> <template id="exhibitor_main" name="Exhibitor: Main Content">
<div t-att-class="'col-12 o_wesponsor_exhibitor_main border mt-3 p-0 %s' % ('col-md-9 col-lg-10' if option_widescreen else 'col-md-8 col-lg-9')"> <div t-att-class="'o_wesponsor_exhibitor_main col-12 border mt-3 p-0 %s' % ('col-lg-10' if option_widescreen else 'col-lg-9')">
<!-- EVENT NOT STARTED ALERTS --> <!-- EVENT NOT STARTED ALERTS -->
<t t-if="not sponsor.event_id.is_ongoing"> <t t-if="not sponsor.event_id.is_ongoing">
<div t-if="sponsor.event_id.is_done" class="alert alert-warning rounded-0 text-center" role="alert"> <div t-if="sponsor.event_id.is_done" class="alert alert-warning rounded-0 text-center" role="alert">
@@ -97,8 +97,7 @@
<div class="h5 m-3"> <div class="h5 m-3">
About <t t-out="sponsor.name"/> About <t t-out="sponsor.name"/>
</div> </div>
<hr class="my-0"/> <div class="container clearfix border-top">
<div class="ms-3 clearfix">
<div t-if="sponsor.image_128 or sponsor.partner_id.image_128" class="float-start pt-3 pe-3"> <div t-if="sponsor.image_128 or sponsor.partner_id.image_128" class="float-start pt-3 pe-3">
<span t-if="sponsor.image_128" t-field="sponsor.image_128" class="o_wevent_online_page_avatar" <span t-if="sponsor.image_128" t-field="sponsor.image_128" class="o_wevent_online_page_avatar"
t-options="{'widget': 'image', 'filename-field': 'partner_name'}"/> t-options="{'widget': 'image', 'filename-field': 'partner_name'}"/>
@@ -110,7 +109,7 @@
<div class="d-flex align-items-center"> <div class="d-flex align-items-center">
<span t-field="sponsor.name" class="h4 mb-0"/> <span t-field="sponsor.name" class="h4 mb-0"/>
<span t-if="sponsor.sponsor_type_id.display_ribbon_style and sponsor.sponsor_type_id.display_ribbon_style != 'no_ribbon'" <span t-if="sponsor.sponsor_type_id.display_ribbon_style and sponsor.sponsor_type_id.display_ribbon_style != 'no_ribbon'"
t-field="sponsor.sponsor_type_id" t-attf-class="o_ribbon o_ribbon_right ribbon_#{sponsor.sponsor_type_id.display_ribbon_style}"/> t-field="sponsor.sponsor_type_id" t-attf-class="o_ribbon ribbon_#{sponsor.sponsor_type_id.display_ribbon_style} badge ms-3 fw-bold"/>
</div> </div>
<span t-field="sponsor.subtitle" <span t-field="sponsor.subtitle"
t-att-class="'text-muted %s' % '' if sponsor.hour_from and sponsor.hour_to else 'mb-3'"/> t-att-class="'text-muted %s' % '' if sponsor.hour_from and sponsor.hour_to else 'mb-3'"/>
@@ -123,10 +122,10 @@
(<span t-out="sponsor.event_date_tz"/>) (<span t-out="sponsor.event_date_tz"/>)
</div> </div>
<div t-if="sponsor.url" class="d-flex text-break align-items-baseline"> <div t-if="sponsor.url" class="d-flex text-break align-items-baseline">
<i class="fa fa-home me-2"/><a t-att-href="sponsor.url"><span t-field="sponsor.url"/></a> <i class="fa fa-globe me-2"/><a t-att-href="sponsor.url"><span t-field="sponsor.url"/></a>
</div> </div>
<div t-elif="sponsor.partner_id.website" class="d-flex text-break align-items-baseline"> <div t-elif="sponsor.partner_id.website" class="d-flex text-break align-items-baseline">
<i class="fa fa-home me-2"/><a t-att-href="sponsor.partner_id.website"><span t-field="sponsor.partner_id.website"/></a> <i class="fa fa-globe me-2"/><a t-att-href="sponsor.partner_id.website"><span t-field="sponsor.partner_id.website"/></a>
</div> </div>
<div t-if="sponsor.email" class="d-flex text-break align-items-baseline"> <div t-if="sponsor.email" class="d-flex text-break align-items-baseline">
<i class="fa fa-envelope me-2"/><a t-att-mailto="sponsor.email"><span t-field="sponsor.email"/></a> <i class="fa fa-envelope me-2"/><a t-att-mailto="sponsor.email"><span t-field="sponsor.email"/></a>
@@ -137,7 +136,7 @@
</div> </div>
<a t-if="sponsor.partner_id.country_id" <a t-if="sponsor.partner_id.country_id"
t-att-href="'/event/%s/exhibitors?countries=%s' % (slug(sponsor.event_id), [sponsor.partner_id.country_id.id])" t-att-href="'/event/%s/exhibitors?countries=%s' % (slug(sponsor.event_id), [sponsor.partner_id.country_id.id])"
t-attf-class="text-end d-none d-md-block #{'me-5' if sponsor.sponsor_type_id.display_ribbon_style and sponsor.sponsor_type_id.display_ribbon_style != 'no_ribbon' else ''}"> class="d-none d-md-block text-end">
<img class="img" <img class="img"
style="max-height: 36px;" style="max-height: 36px;"
t-att-src="sponsor.partner_id.country_id.image_url" t-att-src="sponsor.partner_id.country_id.image_url"
@@ -147,7 +146,7 @@
</div> </div>
<!-- Website description --> <!-- Website description -->
<div t-if="not is_html_empty(sponsor.website_description)" t-field="sponsor.website_description" <div t-if="not is_html_empty(sponsor.website_description)" t-field="sponsor.website_description"
class="my-2 mx-3 oe_no_empty"/> class="my-2 oe_no_empty"/>
<t t-elif="env.user.has_group('event.group_event_user')"> <t t-elif="env.user.has_group('event.group_event_user')">
<div t-field="sponsor.website_description" class="my-2 mx-3" <div t-field="sponsor.website_description" class="my-2 mx-3"
placeholder="e.g. &quot;Openwood specializes in home decoration...&quot;"/> placeholder="e.g. &quot;Openwood specializes in home decoration...&quot;"/>
@@ -167,35 +166,34 @@
<!-- ============================================================ --> <!-- ============================================================ -->
<template id="exhibitor_aside" name="Exhibitor: Aside"> <template id="exhibitor_aside" name="Exhibitor: Aside">
<div t-att-class="'col-12 mt-3 ps-0 pe-0 border o_wevent_online_page_aside o_wesponsor_exhibitor_aside %s' % ('col-md-3 col-lg-2' if option_widescreen else 'col-md-4 col-lg-3')"> <div t-att-class="'o_wevent_online_page_aside o_wesponsor_exhibitor_aside col-12 mt-3 ps-0 pe-0 border %s' % ('col-lg-2' if option_widescreen else 'col-lg-3')">
<div class="o_wevent_online_page_aside_content"> <div class="o_wevent_online_page_aside_content">
<div class="d-flex align-items-center justify-content-between me-2"> <div class="d-flex align-items-center justify-content-between">
<span class="h5 m-3">Other exhibitors</span> <span class="h5 m-3">Other exhibitors</span>
<a href="#collapse_exhibitor_aside" data-bs-toggle="collapse" <a href="#collapse_exhibitor_aside" data-bs-toggle="collapse"
class="d-lg-none p-2 text-decoration-none o_wevent_online_page_aside_collapse collapsed"> class="o_wevent_online_page_aside_collapse d-lg-none p-2 text-decoration-none collapsed">
<i class="oi oi-chevron-down d-lg-none"/> <i class="oi oi-chevron-down d-lg-none"/>
</a> </a>
</div> </div>
<ul id="collapse_exhibitor_aside" class="list-unstyled collapse d-lg-block mb-0"> <ul id="collapse_exhibitor_aside" class="list-group list-group-flush collapse d-lg-block">
<li t-foreach="sponsors_other" t-as="sponsor_other"> <li class="list-group-item list-group-item-action" t-foreach="sponsors_other" t-as="sponsor_other">
<a class="row g-0 px-2 pt-2 pb-1 text-decoration-none" <a class="d-flex flex-wrap flex-md-nowrap text-decoration-none text-dark"
t-att-href="sponsor_other.website_url" t-att-href="sponsor_other.website_url"
t-att-data-publish="sponsor_other.website_published and 'on' or 'off'"> t-att-data-publish="sponsor_other.website_published and 'on' or 'off'">
<div class="col-3 d-flex flex-column align-items-center"> <div class="d-flex flex-column align-items-center">
<img t-if="sponsor_other.partner_id.country_id" <img t-if="sponsor_other.partner_id.country_id"
class="me-2 mb-1 o_wesponsor_aside_logo" class="o_wesponsor_aside_logo mb-1"
t-att-src="sponsor_other.partner_id.country_id.image_url" t-att-src="sponsor_other.partner_id.country_id.image_url"
t-att-alt="sponsor_other.partner_id.country_id.name"/> t-att-alt="sponsor_other.partner_id.country_id.name"/>
<span t-if="sponsor_other.sponsor_type_id.display_ribbon_style not in [False, 'no_ribbon']" <span t-if="sponsor_other.sponsor_type_id.display_ribbon_style not in [False, 'no_ribbon']"
t-att-class="'badge text-bg-light me-2 ribbon_%s' % sponsor_other.sponsor_type_id.display_ribbon_style" t-att-class="'badge text-bg-light ribbon_%s' % sponsor_other.sponsor_type_id.display_ribbon_style"
t-out="sponsor_other.sponsor_type_id.name"/> t-out="sponsor_other.sponsor_type_id.name"/>
<span t-else="" class="badge text-bg-light me-2" <span t-else="" class="badge text-bg-light"
t-out="sponsor_other.sponsor_type_id.name"/> t-out="sponsor_other.sponsor_type_id.name"/>
</div> </div>
<div class="col flex-grow-1 overflow-auto"> <div class="flex-grow-1 overflow-auto px-2">
<span class="d-flex align-items-baseline o_wesponsor_sponsor_name"> <span class="d-flex align-items-baseline o_wesponsor_sponsor_name">
<span class="d-inline-block text-truncate" t-out="sponsor_other.name"/> <span class="d-inline-block text-truncate" t-out="sponsor_other.name"/>
</span> </span>
<small class="text-muted" t-out="sponsor_other.subtitle"/> <small class="text-muted" t-out="sponsor_other.subtitle"/>
<div class="d-inline-block float-end" t-if="not sponsor_other.website_published"> <div class="d-inline-block float-end" t-if="not sponsor_other.website_published">
@@ -5,17 +5,17 @@
<xpath expr="//div[@id='wrap']" position="inside"> <xpath expr="//div[@id='wrap']" position="inside">
<section class="o_wevent_sponsor_wrapper d-none d-md-block d-print-none mt-auto"> <section class="o_wevent_sponsor_wrapper d-none d-md-block d-print-none mt-auto">
<div class="container pt32 pb16" t-if="event.sponsor_ids"> <div class="container pt32 pb16" t-if="event.sponsor_ids">
<div t-attf-class="d-flex flex-wrap mb-5 #{'' if (len(event.sponsor_ids) > 10) else 'justify-content-md-center'}"> <div t-attf-class="d-flex flex-wrap mb-5 gap-3 #{'' if (len(event.sponsor_ids) > 10) else 'justify-content-md-center'}">
<t t-foreach="event.sponsor_ids.sorted( <t t-foreach="event.sponsor_ids.sorted(
lambda sponsor: (not sponsor.website_published, sponsor.sudo().sponsor_type_id.sequence, sponsor.sequence) lambda sponsor: (not sponsor.website_published, sponsor.sudo().sponsor_type_id.sequence, sponsor.sequence)
)" t-as="sponsor"> )" t-as="sponsor">
<t t-set="popover_content"> <t t-set="popover_content">
<div t-field="sponsor.name" class="h5"/> <div t-field="sponsor.name" class="h5"/>
<div t-if="sponsor.url" class="d-flex align-items-baseline"> <div t-if="sponsor.url" class="d-flex align-items-baseline">
<i class="fa fa-home me-2"/><a t-att-href="sponsor.url" t-field="sponsor.url" class="text-truncate"/> <i class="fa fa-globe me-2"/><a t-att-href="sponsor.url" t-field="sponsor.url" class="text-truncate"/>
</div> </div>
</t> </t>
<a class="o_wevent_sponsor o_wevent_sponsor_card h-100" tabindex="0" role="button" <a class="o_wevent_sponsor o_wevent_sponsor_card h-100 rounded text-decoration-none" tabindex="0" role="button"
t-att-data-publish="'on' if sponsor.website_published else 'off'" t-att-data-publish="'on' if sponsor.website_published else 'off'"
t-att-data-bs-content="popover_content" t-att-data-bs-content="popover_content"
data-bs-html="true" data-bs-trigger="focus" data-bs-toggle="popover" data-bs-placement="bottom"> data-bs-html="true" data-bs-trigger="focus" data-bs-toggle="popover" data-bs-placement="bottom">
@@ -30,12 +30,12 @@
<!-- Common template for sponsor images and 'Unpublished' badge --> <!-- Common template for sponsor images and 'Unpublished' badge -->
<template id="event_sponsor_thumb_details"> <template id="event_sponsor_thumb_details">
<div class="h-100 shadow-sm p-2"> <div class="p-2">
<span t-field="sponsor.image_128" <span t-field="sponsor.image_128"
t-options='{"widget": "image", "class": "img img-fluid", "filename-field": "partner_name"}'/> t-options='{"widget": "image", "class": "img img-fluid", "filename-field": "partner_name"}'/>
<span t-if="sponsor.sudo().sponsor_type_id.display_ribbon_style and sponsor.sudo().sponsor_type_id.display_ribbon_style != 'no_ribbon'"
t-field="sponsor.sudo().sponsor_type_id" t-attf-class="o_ribbon o_ribbon_right ribbon_#{sponsor.sudo().sponsor_type_id.display_ribbon_style}"/>
</div> </div>
<span t-if="sponsor.sudo().sponsor_type_id.display_ribbon_style and sponsor.sudo().sponsor_type_id.display_ribbon_style != 'no_ribbon'"
t-field="sponsor.sudo().sponsor_type_id" t-attf-class="o_ribbon d-block w-100 ribbon_#{sponsor.sudo().sponsor_type_id.display_ribbon_style}"/>
<span t-if="not sponsor.website_published" <span t-if="not sponsor.website_published"
class="d-flex justify-content-center badge text-bg-danger o_wevent_online_badge_unpublished">Unpublished</span> class="d-flex justify-content-center badge text-bg-danger o_wevent_online_badge_unpublished">Unpublished</span>
</template> </template>
@@ -3,7 +3,7 @@
<template id="snippet_options" inherit_id="website.snippet_options" name="Event exhibitor snippet options"> <template id="snippet_options" inherit_id="website.snippet_options" name="Event exhibitor snippet options">
<xpath expr="." position="inside"> <xpath expr="." position="inside">
<div data-selector="main:has(nav .o_wevent_event_tags_form)" data-page-options="true" groups="website.group_website_designer" data-no-check="true" string="Event Page"> <div data-selector="main:has(.o_wevent_event_tags_form)" data-page-options="true" groups="website.group_website_designer" data-no-check="true" string="Event Page">
<we-row string="Top Bar Filter" class="o_we_full_row"> <we-row string="Top Bar Filter" class="o_we_full_row">
<we-button string="Sponsorship" <we-button string="Sponsorship"
data-customize-website-views="website_event_exhibitor.exhibitors_topbar_sponsorship" data-customize-website-views="website_event_exhibitor.exhibitors_topbar_sponsorship"
@@ -15,10 +15,6 @@
height: 85vh; height: 85vh;
} }
} }
.o_wevent_meeting_room_card {
background-color: $o-wevent-bg-color-base;
}
} }
/* /*
@@ -3,12 +3,13 @@
<template id="event_meet" name="Meeting Rooms"> <template id="event_meet" name="Meeting Rooms">
<t t-call="website_event.layout"> <t t-call="website_event.layout">
<div class="o_wevent_online o_wemeet_index"> <t t-set="hide_submenu" t-value="True"/>
<div class="o_wevent_online o_wemeet_index h-100">
<!-- Drag/Drop Area --> <!-- Drag/Drop Area -->
<div id="oe_structure_website_event_location_1" class="oe_structure"/> <div id="oe_structure_website_event_location_1" class="oe_structure"/>
<!-- Content --> <!-- Content -->
<div class="o_wemeet_container container"> <div class="o_wemeet_container container h-100">
<div class="row mb-5 mx-0"> <div class="row h-100 mb-5 mx-0">
<t t-call="website_event_meet.community_main"/> <t t-call="website_event_meet.community_main"/>
<t t-call="website_event_meet.community_aside"/> <t t-call="website_event_meet.community_aside"/>
</div> </div>
@@ -25,22 +26,23 @@
<!-- Meeting Rooms Main Display --> <!-- Meeting Rooms Main Display -->
<template id="community_main" name="Meeting Rooms: Main Display"> <template id="community_main" name="Meeting Rooms: Main Display">
<div class="col-12 col-md-8 ps-0 pe-0 pe-md-3 mt-3"> <div class="col-12 col-lg-8 col-xl-9 ps-0">
<h2 class="d-flex flex-row justify-content-between"> <t t-call="website_event.navbar"/>
<span>Join a room</span> <div class="d-flex flex-row align-items-center justify-content-between mb-2">
<h3 class="mb-0">Join a room</h3>
<div class="dropdown"> <div class="dropdown">
<a class="dropdown-toggle o-no-caret btn btn-outline-secondary py-0 px-1" title="Languages Menu" <a class="dropdown-toggle btn btn-light" title="Languages Menu"
aria-label="Dropdown menu" data-bs-display="static" data-bs-toggle="dropdown" href="#" role="button"> aria-label="Dropdown menu" data-bs-display="static" data-bs-toggle="dropdown" href="#" role="button">
<span t-out="current_lang.name if current_lang else 'All Languages'"/> ▼</a> <span t-out="current_lang.name if current_lang else 'All Languages'"/></a>
<div class="dropdown-menu" role="menu"> <div class="dropdown-menu" role="menu">
<a class="dropdown-item" role="menuitem" t-attf-href="/event/#{slug(event)}/community">All Languages <a class="dropdown-item" role="menuitem" t-attf-href="/event/#{slug(event)}/community">All Languages
</a> </a>
<a class="dropdown-item" role="menuitem" t-as="language" t-attf-href="/event/#{slug(event)}/community?lang=#{language.id}" t-out="language.name" t-foreach="available_languages"/> <a class="dropdown-item" role="menuitem" t-as="language" t-attf-href="/event/#{slug(event)}/community?lang=#{language.id}" t-out="language.name" t-foreach="available_languages"/>
</div> </div>
</div> </div>
</h2> </div>
<hr class="mt-2 mb-3"/> <p class="lead">Choose a topic that interests you and start talking with the community. <br/> Don't forget to setup your camera and microphone.</p>
<p class="mt-">Choose a topic that interests you and start talking with the community. <br/> Don't forget to setup your camera and microphone.</p> <br/>
<div class="d-flex flex-column justify-content-start align-items-start"> <div class="d-flex flex-column justify-content-start align-items-start">
<t t-as="meeting_room" t-call="website_event_meet.meeting_room_card" t-foreach="meeting_rooms"> <t t-as="meeting_room" t-call="website_event_meet.meeting_room_card" t-foreach="meeting_rooms">
<t t-set="meeting_room" t-value="meeting_room"/> <t t-set="meeting_room" t-value="meeting_room"/>
@@ -116,30 +118,31 @@
</t> </t>
<a t-if="is_event_user or not meeting_room.room_is_full" <a t-if="is_event_user or not meeting_room.room_is_full"
class="card o_wevent_meeting_room_card w-100 my-2 d-block text-decoration-none rounded-0" class="card o_wevent_meeting_room_card w-100 my-2 d-block text-decoration-none rounded-0 text-dark"
t-att-data-meeting-room-id="meeting_room.id" t-att-data-meeting-room-id="meeting_room.id"
t-att-data-open-room="opened" t-att-data-open-room="opened"
t-att-data-is-event-manager="int(is_event_user)" t-att-data-is-event-manager="int(is_event_user)"
t-att-href="meeting_room_href" t-att-href="meeting_room_href"
t-att-data-bs-toggle="meeting_room_data_toggle" t-att-data-bs-toggle="meeting_room_data_toggle"
t-att-data-bs-target="meeting_room_data_target"> t-att-data-bs-target="meeting_room_data_target">
<div class="text-decoration-none w-100 h-100 p-3" t-att-data-publish="meeting_room.website_published and 'on' or 'off'"> <div class="w-100 h-100 p-3 border-start border-5 text-decoration-none" t-att-data-publish="meeting_room.website_published and 'on' or 'off'">
<div class="o_wevent_meeting_room_corner_ribbon" t-if="meeting_room.room_is_full">Full</div> <div class="o_wevent_meeting_room_corner_ribbon" t-if="meeting_room.room_is_full">Full</div>
<div class="d-flex flex-column"> <div class="d-flex flex-column">
<div class="d-flex flex-row"> <div class="d-flex flex-row">
<h4 t-att-class="'text-break text-uppercase %s' % ('w-75' if meeting_room.website_published else 'w-50')" t-out="meeting_room.name"/> <h4 t-att-class="'text-break %s' % ('w-75' if meeting_room.website_published else 'w-50')" t-out="meeting_room.name"/>
<div t-if="not meeting_room.is_published" class="w-25"> <div t-if="not meeting_room.is_published" class="w-25">
<span class="badge text-bg-danger">Unpublished</span> <span class="badge text-bg-danger">Unpublished</span>
</div> </div>
</div> </div>
<span class="text-muted" t-field="meeting_room.summary"/> <p class="text-muted" t-field="meeting_room.summary"/>
<div class="d-flex flex-row justify-content-between align-items-center"> <div class="d-flex flex-row justify-content-between align-items-center">
<span class="h6 m-0"> <p class="d-flex justify-content-between align-items-center gap-2 m-0 text-muted small">
<span t-out="meeting_room.room_participant_count"/>&amp;nbsp; <i class="fa fa-user"></i>
<span t-if="meeting_room.target_audience" class="text-uppercase" t-field="meeting_room.target_audience"/> <span t-out="meeting_room.room_participant_count"/>
<span t-else="" class="text-uppercase">participant(s)</span> <span t-if="meeting_room.target_audience" t-field="meeting_room.target_audience"/>
</span> <span t-else="">participant(s)</span>
<div class="d-inline border py-1 px-2 text-bg-secondary" t-out="meeting_room.room_lang_id.name"/> </p>
<div class="badge text-bg-secondary" t-out="meeting_room.room_lang_id.name"/>
</div> </div>
</div> </div>
</div> </div>
@@ -163,26 +166,26 @@
<!-- ============================================================ --> <!-- ============================================================ -->
<template id="community_aside" name="Community: Aside"> <template id="community_aside" name="Community: Aside">
<div class="col-md-4 p-0 mt-3 o_wevent_community_aside"> <div class="d-lg-flex justify-content-end col-lg-4 col-xl-3 mb-3 mb-lg-0">
<div class="d-none d-md-block mb-3" t-if="event.meeting_room_allow_creation"> <div class="o_wevent_community_aside mt-3">
<h2>Start a topic</h2> <div class="d-none d-md-block mb-3" t-if="event.meeting_room_allow_creation">
<hr class="mt-2 mb-3"/> <h4 class="o_page_header">Start a topic</h4>
<p>Want to create your own discussion room?</p> <p>Want to create your own discussion room?</p>
<a href="#" role="button" <a href="#" role="button"
class="btn btn-primary o_wevent_create_room_button" class="btn btn-secondary o_wevent_create_room_button w-100"
t-if="event.is_ongoing or event.start_today or is_event_user" t-if="event.is_ongoing or event.start_today or is_event_user"
t-att-data-event-id="event.id" t-att-data-event-id="event.id"
t-att-data-default-lang-code="default_lang_code"> t-att-data-default-lang-code="default_lang_code">
<span>Create a Room</span> Create a Room
</a> </a>
<div t-else="" class="d-flex flex-column"> <div t-else="" class="d-flex flex-column">
<button disabled="disabled" class="btn btn-primary align-self-start">Create a Room</button> <button disabled="disabled" class="btn btn-secondary w-100">Create a Room</button>
Room creation will be available when event starts at <p class="small">
<span> Room creation will be available when event starts at <span class="fw-bold" t-field="event.with_context(tz=event.date_tz).date_begin"
<span class="fw-bold" t-field="event.with_context(tz=event.date_tz).date_begin" t-options="{'format': 'medium'}"/>
t-options="{'format': 'medium'}"/> <span class="small">(<t t-out="event.date_tz"/>)</span>
<span class="small">(<t t-out="event.date_tz"/>)</span> </p>
</span> </div>
</div> </div>
</div> </div>
</div> </div>
@@ -30,7 +30,7 @@
<!-- ============================================================ --> <!-- ============================================================ -->
<template id="meeting_room_main" name="Meeting Room: Main Content"> <template id="meeting_room_main" name="Meeting Room: Main Content">
<div t-att-class="'col-12 o_wemeet_room_main o_wevent_theme_bg_base border mt-3 p-0 %s' % ('col-md-9 col-lg-10' if option_widescreen else 'col-md-8 col-lg-9')"> <div t-att-class="'col-12 o_wemeet_room_main border mt-3 p-0 %s' % ('col-lg-9 col-xl-10' if option_widescreen else 'col-lg-8 col-xl-9')">
<!-- EVENT NOT STARTED ALERTS --> <!-- EVENT NOT STARTED ALERTS -->
<t t-if="not meeting_room.event_id.is_ongoing"> <t t-if="not meeting_room.event_id.is_ongoing">
<div t-if="meeting_room.event_id.is_done" class="alert alert-warning text-center"> <div t-if="meeting_room.event_id.is_done" class="alert alert-warning text-center">
@@ -86,13 +86,13 @@
</div> </div>
<!-- ROOM DESCRIPTION --> <!-- ROOM DESCRIPTION -->
<div class="mx-3"> <div class="mx-3">
<div class="h5 my-3" t-out="meeting_room.name"/> <h5 class="mt-3" t-out="meeting_room.name"/>
<div t-if="meeting_room.room_participant_count > 0" class="text-muted mb-3"> <div t-if="meeting_room.room_participant_count > 0" class="text-muted mb-3">
A chat among <t t-out="meeting_room.room_participant_count"/> <span class="fw-bold" t-out="meeting_room.target_audience"/> A chat among <t t-out="meeting_room.room_participant_count"/> <span t-out="meeting_room.target_audience"/>
</div> </div>
</div> </div>
<hr class="my-0"/> <hr class="my-0"/>
<div t-field="meeting_room.summary" class="my-2 mx-3 oe_no_empty"/> <div t-field="meeting_room.summary" class="my-4 mx-3 oe_no_empty"/>
</div> </div>
</template> </template>
@@ -101,27 +101,28 @@
<!-- ============================================================ --> <!-- ============================================================ -->
<template id="meeting_room_aside" name="Meeting Room: Aside"> <template id="meeting_room_aside" name="Meeting Room: Aside">
<div t-att-class="'col-12 mt-3 ps-0 pe-0 border o_wevent_online_page_aside %s' % ('col-md-3 col-lg-2' if option_widescreen else 'col-md-4 col-lg-3')"> <div t-att-class="'o_wevent_online_page_aside col-12 mt-3 ps-0 pe-0 border %s' % ('col-lg-3 col-xl-2' if option_widescreen else 'col-lg-4 col-xl-3')">
<div class="o_wevent_online_page_aside_content"> <div class="o_wevent_online_page_aside_content">
<div class="d-flex align-items-center justify-content-between me-2"> <div class="d-flex align-items-center justify-content-between me-2">
<span class="h5 m-3">Other Rooms</span> <h5 class="m-3">Other Rooms</h5>
<a href="#collapse_meet_room_aside" data-bs-toggle="collapse" class="d-lg-none p-2 text-decoration-none o_wevent_online_page_aside_collapse collapsed"> <a href="#collapse_meet_room_aside" data-bs-toggle="collapse" class="d-lg-none p-2 text-decoration-none o_wevent_online_page_aside_collapse collapsed">
<i class="oi oi-chevron-down d-lg-none"/> <i class="oi oi-chevron-down d-lg-none"/>
</a> </a>
</div> </div>
<ul id="collapse_meet_room_aside" class="list-unstyled collapse d-lg-block mb-0"> <ul id="collapse_meet_room_aside" class="list-group list-group-flush collapse d-lg-block border-top">
<li t-foreach="meeting_rooms_other" t-as="meeting_room_other"> <li class="list-group-item list-group-item-action" t-foreach="meeting_rooms_other" t-as="meeting_room_other">
<a class="d-block w-100 h-100 px-2 pt-2 pb-1 text-decoration-none" <a class="text-decoration-none text-dark"
t-att-href="'/event/%s/meeting_room/%s' % (slug(event), slug(meeting_room_other))"> t-att-href="'/event/%s/meeting_room/%s' % (slug(event), slug(meeting_room_other))">
<div class="flex-grow-1 mw-100"> <div class="flex-grow-1 mw-100">
<div class="text-truncate" t-out="meeting_room_other.name"/> <div class="text-truncate fw-bold" t-out="meeting_room_other.name"/>
<span class="text-muted" t-out="meeting_room_other.summary"></span> <span class="text-muted" t-out="meeting_room_other.summary"></span>
<div class="d-flex justify-content-between align-items-center"> <div class="d-flex flex-column flex-xl-row flex-wrap justify-content-between align-items-start align-items-xl-center">
<div class="text-muted"> <p class="d-flex justify-content-between align-items-center gap-2 m-0 text-muted small">
<b>&amp;#9900;&amp;nbsp;</b> <i class="fa fa-user"></i>
<small><t t-out="meeting_room_other.room_participant_count"/> <t t-out="meeting_room_other.target_audience"/></small> <t t-out="meeting_room_other.room_participant_count"/>
</div> <t t-out="meeting_room_other.target_audience"/>
<small t-if="meeting_room_other.room_lang_id" class="text-muted"><i class="fa fa-globe"/> <t t-out="meeting_room_other.room_lang_id.name"/></small> </p>
<small t-if="meeting_room_other.room_lang_id" class="badge text-bg-secondary"> <t t-out="meeting_room_other.room_lang_id.name"/></small>
</div> </div>
</div> </div>
</a> </a>
@@ -8,8 +8,8 @@
</template> </template>
<template id="community_leaderboard_small" name="Small Leaderboard"> <template id="community_leaderboard_small" name="Small Leaderboard">
<div class="w-100 d-flex justify-content-between align-items-end o_page_header"> <div class="o_page_header d-flex flex-wrap justify-content-between align-items-end w-100">
<h2>Leaderboard</h2> <h4 class="mb-0">Leaderboard</h4>
<a t-attf-href="#{'/event/%s/community/leaderboard' % (slug(event))}">View all</a> <a t-attf-href="#{'/event/%s/community/leaderboard' % (slug(event))}">View all</a>
</div> </div>
<t t-call="website_event_meet_quiz.visitor_quiz_points_card"/> <t t-call="website_event_meet_quiz.visitor_quiz_points_card"/>
@@ -18,19 +18,21 @@
<template id='visitor_quiz_points_card' name="Small Leaderboard: top3"> <template id='visitor_quiz_points_card' name="Small Leaderboard: top3">
<table class="w-100"> <table class="w-100">
<tr t-foreach="top3_visitors" t-as="visitor"> <tr t-foreach="top3_visitors" t-as="visitor">
<td><div class="d-flex align-items-center mb-3"> <td>
<b class="me-2 text-muted" t-out="visitor['position']"/> <div class="d-flex align-items-center mb-2">
<img class="rounded-circle float-start" <b class="me-2 text-muted" t-out="visitor['position']"/>
style="width: 32px; height: 32px; object-fit: cover;" <img class="rounded-circle float-start"
t-att-src="image_data_uri(visitor['visitor'].partner_image) if visitor['visitor'].partner_image else '/web/static/img/user_placeholder.jpg'" style="width: 25px; height: 25px; object-fit: cover;"
t-att-alt="visitor['visitor'].display_name"/> t-att-src="image_data_uri(visitor['visitor'].partner_image) if visitor['visitor'].partner_image else '/web/static/img/user_placeholder.jpg'"
<div class="o_we_leaderboard_name"> t-att-alt="visitor['visitor'].display_name"/>
<span t-if="visitor['visitor'] == current_visitor and not visitor['visitor'].partner_id" class="fw-bold">You</span> <div class="o_we_leaderboard_name">
<span t-else="" class="fw-bold" t-out="visitor['visitor'].display_name"/> <span t-if="visitor['visitor'] == current_visitor and not visitor['visitor'].partner_id">You</span>
<span t-else="" t-out="visitor['visitor'].display_name"/>
</div>
</div> </div>
</div></td> </td>
<td class="text-end"> <td class="text-end">
<div class="mb-3"> <div class="mb-2">
<span class="text-nowrap"><t t-out="visitor['points']"/> xp</span> <span class="text-nowrap"><t t-out="visitor['points']"/> xp</span>
</div> </div>
</td> </td>
@@ -34,11 +34,19 @@ function checkPriceEvent(eventName, price) {
content: "Open the Pycon event", content: "Open the Pycon event",
trigger: `.o_wevent_events_list a:contains(${eventName})`, trigger: `.o_wevent_events_list a:contains(${eventName})`,
}, },
{
content: "Open the ticket picking modal",
trigger: `button:contains("Register")`,
},
{ {
content: "Verify Price", content: "Verify Price",
trigger: `.oe_currency_value:contains(${price})`, trigger: `.oe_currency_value:contains(${price})`,
run: function () {}, // it's a check run: function () {}, // it's a check
}, },
{
content: "Open the ticket picking modal",
trigger: `.modal-content button:contains("Close")`,
},
] ]
} }
function checkPriceDiscountEvent(eventName, price, discount) { function checkPriceDiscountEvent(eventName, price, discount) {
@@ -11,6 +11,10 @@ registry.category("web_tour.tours").add('event_buy_tickets', {
content: "Go to the `Events` page", content: "Go to the `Events` page",
trigger: 'a[href*="/event"]:contains("Conference for Architects TEST"):first', trigger: 'a[href*="/event"]:contains("Conference for Architects TEST"):first',
}, },
{
content: "Open the register modal",
trigger: 'button:contains("Register")',
},
{ {
content: "Select 1 unit of `Standard` ticket type", content: "Select 1 unit of `Standard` ticket type",
extra_trigger: '#wrap:not(:has(a[href*="/event"]:contains("Conference for Architects")))', extra_trigger: '#wrap:not(:has(a[href*="/event"]:contains("Conference for Architects")))',
@@ -11,9 +11,13 @@ registry.category("web_tour.tours").add('event_buy_last_ticket', {
trigger: '.o_wevent_events_list a:contains("Last ticket test")', trigger: '.o_wevent_events_list a:contains("Last ticket test")',
}, },
{ {
content: "Show available Tickets", content: "Open Registration Page",
trigger: '.btn-primary:contains("Register")', trigger: '.btn-primary:contains("Register")',
}, },
{
content: "Open the register modal",
trigger: 'button:contains("Register")',
},
{ {
content: "Select 2 units of `VIP` ticket type", content: "Select 2 units of `VIP` ticket type",
extra_trigger: '#wrap:not(:has(a[href*="/event"]:contains("Last ticket test")))', extra_trigger: '#wrap:not(:has(a[href*="/event"]:contains("Last ticket test")))',
@@ -13,12 +13,17 @@
trigger: '.o_wevent_events_list a:contains("Pycon")', trigger: '.o_wevent_events_list a:contains("Pycon")',
}, },
{ {
content: "Register", content: "Open the register modal",
trigger: '.btn-primary:contains("Register")', trigger: 'button:contains("Register")',
},
{
content: "Click on Register button inside modal",
trigger: 'div.modal-footer button:contains("Register")',
run: 'click'
}, },
{ {
content: "Fill attendees details", content: "Fill attendees details",
trigger: 'form[id="attendee_registration"] .btn[type=submit]', trigger: 'form[id="attendee_registration"]',
run: function () { run: function () {
$("input[name*='1-name']").val("Great Name"); $("input[name*='1-name']").val("Great Name");
$("input[name*='1-phone']").val("111 111"); $("input[name*='1-phone']").val("111 111");
@@ -1,7 +1,7 @@
<?xml version="1.0" encoding="utf-8"?> <?xml version="1.0" encoding="utf-8"?>
<odoo> <odoo>
<template id="registration_template" inherit_id="website_event.registration_template"> <template id="modal_ticket_registration" inherit_id="website_event.modal_ticket_registration">
<!-- Change pricelist --> <!-- Change pricelist -->
<xpath expr="//div[hasclass('o_wevent_price_range')]" position="after"> <xpath expr="//div[hasclass('o_wevent_price_range')]" position="after">
<div id="o_wevent_tickets_pricelist" class="collapse show"> <div id="o_wevent_tickets_pricelist" class="collapse show">
@@ -26,34 +26,36 @@
t-options="{'widget': 'monetary', 'from_currency': event.company_id.sudo().currency_id, 'display_currency': website.currency_id}"/> t-options="{'widget': 'monetary', 'from_currency': event.company_id.sudo().currency_id, 'display_currency': website.currency_id}"/>
</t> </t>
<span t-if="website.show_line_subtotals_tax_selection == 'tax_excluded'" <span t-if="website.show_line_subtotals_tax_selection == 'tax_excluded'"
class="badge text-bg-secondary fs-6"
t-field="ticket.price_reduce" t-field="ticket.price_reduce"
t-options="{'widget': 'monetary', 'from_currency': event.company_id.sudo().currency_id, 'display_currency': website.currency_id}"/> t-options="{'widget': 'monetary', 'from_currency': event.company_id.sudo().currency_id, 'display_currency': website.currency_id}"/>
<span t-else="" <span t-else=""
t-field="ticket.price_reduce_taxinc" t-field="ticket.price_reduce_taxinc"
class="badge text-bg-secondary fs-6"
t-options="{'widget': 'monetary', 'from_currency': event.company_id.sudo().currency_id, 'display_currency': website.currency_id}"/> t-options="{'widget': 'monetary', 'from_currency': event.company_id.sudo().currency_id, 'display_currency': website.currency_id}"/>
<span itemprop="price" class="d-none" t-out="ticket.price"/> <span itemprop="price" class="d-none" t-out="ticket.price"/>
<span itemprop="priceCurrency" class="d-none" t-out="website.currency_id.name"/> <span itemprop="priceCurrency" class="d-none" t-out="website.currency_id.name"/>
</t> </t>
<span t-else="" class="fw-bold text-uppercase">Free</span> <span t-else="" class="badge text-bg-secondary text-uppercase fs-6">Free</span>
</xpath> </xpath>
<xpath expr="//div[hasclass('o_wevent_price_range')]" position="inside"> <xpath expr="//div[hasclass('o_wevent_price_range')]" position="inside">
<t t-set="all_prices" t-value="event.event_ticket_ids.mapped('price_reduce')"/> <t t-set="all_prices" t-value="event.event_ticket_ids.mapped('price_reduce')"/>
<t t-set="lowest_price" t-value="min(all_prices)"/> <t t-set="lowest_price" t-value="min(all_prices)"/>
<t t-set="highest_price" t-value="max(all_prices)"/> <t t-set="highest_price" t-value="max(all_prices)"/>
<t t-if="highest_price > 0"> <t t-if="highest_price > 0">
<span class="text-dark"> <small class="text-muted">
From From
<span t-out="lowest_price" t-options="{'widget': 'monetary', 'from_currency': event.company_id.sudo().currency_id, 'display_currency': website.currency_id}"/> <span t-out="lowest_price" t-options="{'widget': 'monetary', 'from_currency': event.company_id.sudo().currency_id, 'display_currency': website.currency_id}"/>
<t t-if="lowest_price != highest_price"> <t t-if="lowest_price != highest_price">
to to
<span t-out="highest_price" t-options="{'widget': 'monetary', 'from_currency': event.company_id.sudo().currency_id, 'display_currency': website.currency_id}"/> <span t-out="highest_price" t-options="{'widget': 'monetary', 'from_currency': event.company_id.sudo().currency_id, 'display_currency': website.currency_id}"/>
</t> </t>
</span> </small>
</t> </t>
</xpath> </xpath>
<!-- Add price information on tickets (mono ticket, aka not in collapse) --> <!-- Add price information on tickets (mono ticket, aka not in collapse) -->
<xpath expr="//div[hasclass('o_wevent_registration_single')]//h6" position="after"> <xpath expr="//div[hasclass('o_wevent_registration_single_select')]" position="before">
<div class="px-2 text-dark d-flex align-items-center align-self-stretch"> <div class="flex-md-grow-1 me-2 text-end">
<t t-if="tickets.price"> <t t-if="tickets.price">
<t t-if="(tickets.price - tickets.price_reduce) &gt;0 and website.pricelist_id.discount_policy == 'without_discount'"> <t t-if="(tickets.price - tickets.price_reduce) &gt;0 and website.pricelist_id.discount_policy == 'without_discount'">
<del t-if="website.show_line_subtotals_tax_selection == 'tax_excluded'" <del t-if="website.show_line_subtotals_tax_selection == 'tax_excluded'"
@@ -66,15 +68,17 @@
t-options="{'widget': 'monetary', 'from_currency': event.company_id.sudo().currency_id, 'display_currency': website.currency_id}"/> t-options="{'widget': 'monetary', 'from_currency': event.company_id.sudo().currency_id, 'display_currency': website.currency_id}"/>
</t> </t>
<span t-if="website.show_line_subtotals_tax_selection == 'tax_excluded'" <span t-if="website.show_line_subtotals_tax_selection == 'tax_excluded'"
class="badge text-bg-secondary fs-6"
t-field="tickets.price_reduce" t-field="tickets.price_reduce"
t-options="{'widget': 'monetary', 'from_currency': event.company_id.sudo().currency_id, 'display_currency': website.currency_id}"/> t-options="{'widget': 'monetary', 'from_currency': event.company_id.sudo().currency_id, 'display_currency': website.currency_id}"/>
<span t-else="" <span t-else=""
class="badge text-bg-secondary fs-6"
t-field="tickets.price_reduce_taxinc" t-field="tickets.price_reduce_taxinc"
t-options="{'widget': 'monetary', 'from_currency': event.company_id.sudo().currency_id, 'display_currency': website.currency_id}"/> t-options="{'widget': 'monetary', 'from_currency': event.company_id.sudo().currency_id, 'display_currency': website.currency_id}"/>
<span itemprop="price" class="d-none" t-out="tickets.price"/> <span itemprop="price" class="d-none" t-out="tickets.price"/>
<span itemprop="priceCurrency" class="d-none" t-out="website.currency_id.name"/> <span itemprop="priceCurrency" class="d-none" t-out="website.currency_id.name"/>
</t> </t>
<span t-else="" class="fw-bold text-uppercase">Free</span> <span t-else="" class="badge text-bg-secondary fs-6 text-uppercase">Free</span>
</div> </div>
</xpath> </xpath>
</template> </template>
@@ -98,10 +102,4 @@
</xpath> </xpath>
</template> </template>
<template id="fold_register_details" inherit_id="website_event.fold_register_details" name="Fold ticket details">
<xpath expr="//div[@id='o_wevent_tickets_pricelist']" position="attributes">
<attribute name="class">collapse</attribute>
</xpath>
</template>
</odoo> </odoo>
@@ -2,7 +2,7 @@
<odoo> <odoo>
<template id="index_topbar" inherit_id="website_event.index_topbar"> <template id="index_topbar" inherit_id="website_event.index_topbar">
<xpath expr="//ul[hasclass('o_wevent_index_topbar_filters')]" position="inside"> <xpath expr="//div[hasclass('o_wevent_index_topbar_filters')]" position="inside">
<t t-set="website_sale_pricelists" t-value="website.get_pricelist_available(show_visible=True)" /> <t t-set="website_sale_pricelists" t-value="website.get_pricelist_available(show_visible=True)" />
<t t-set="hasPricelistDropdown" t-value="website_sale_pricelists and len(website_sale_pricelists)&gt;1"/> <t t-set="hasPricelistDropdown" t-value="website_sale_pricelists and len(website_sale_pricelists)&gt;1"/>
<t t-call="website_sale.pricelist_list"> <t t-call="website_sale.pricelist_list">
@@ -75,23 +75,12 @@ publicWidget.registry.websiteEventTrackReminder = publicWidget.Widget.extend({
_updateDisplay: function () { _updateDisplay: function () {
var $trackLink = this.$el.find('i'); var $trackLink = this.$el.find('i');
var isReminderLight = $trackLink.data('isReminderLight');
if (this.reminderOn) { if (this.reminderOn) {
$trackLink.addClass('fa-bell').removeClass('fa-bell-o'); $trackLink.addClass('fa-bell').removeClass('fa-bell-o');
$trackLink.attr('title', _t('Favorite On')); $trackLink.attr('title', _t('Favorite On'));
if (!isReminderLight) {
this.$el.addClass('btn-primary');
this.$el.removeClass('btn-outline-primary');
}
} else { } else {
$trackLink.addClass('fa-bell-o').removeClass('fa-bell'); $trackLink.addClass('fa-bell-o').removeClass('fa-bell');
$trackLink.attr('title', _t('Set Favorite')); $trackLink.attr('title', _t('Set Favorite'));
if (!isReminderLight) {
this.$el.removeClass('btn-primary');
this.$el.addClass('btn-outline-primary');
}
} }
}, },
@@ -7,19 +7,10 @@
padding: 0; padding: 0;
} }
// Ensure width for size coherency
&:not(.btn-link) {
min-width: 100px;
}
i { i {
&.fa-bell { &.fa-bell,&.fa-bell-o {
color: gold; color: $o-gray-600;
-webkit-text-stroke-width: 0.5px; -webkit-text-stroke-color: $o-gray-600;
-webkit-text-stroke-color: black;
}
&.fa-bell-o {
color: black;
} }
} }
} }
@@ -134,7 +125,6 @@
width: 100%; width: 100%;
position: absolute; position: absolute;
top: 0; top: 0;
border-top: 1px solid lighten($o-wevent-bg-color-base-contrast, 50%);
} }
&::after { &::after {
content: ""; content: "";
@@ -17,13 +17,15 @@
.o_wesession_track_card { .o_wesession_track_card {
background-color: $o-wevent-bg-color-base; background-color: $o-wevent-bg-color-base;
color: $o-wevent-color; color: $o-wevent-color;
.card-body { .card-body {
padding: 1rem; padding: 1rem;
background-color: $o-wevent-bg-color-base !important; background-color: $o-wevent-bg-color-base !important;
} }
.card-footer { .card-footer {
padding: 0.75rem 1rem; padding: 0.75rem 1rem;
div { div {
color: $o-wevent-color; color: $o-wevent-color;
} }
@@ -36,6 +38,7 @@
padding: $card-spacer-y $card-spacer-x; padding: $card-spacer-y $card-spacer-x;
text-align: right; text-align: right;
} }
&.o_wesession_track_card_unpublished { &.o_wesession_track_card_unpublished {
opacity: 0.8; opacity: 0.8;
} }
@@ -46,15 +49,20 @@
*/ */
.o_wevent_online_page_container { .o_wevent_online_page_container {
// Main panel: current track // Main panel: current track
.o_wesession_track_main { .o_wesession_track_main {
// Force side panel min-width to account for potential Youtube chat // Force side panel min-width to account for potential Youtube chat
// And adapt main panel max-width accordingly. // And adapt main panel max-width accordingly.
@include media-breakpoint-up(md) { &.o_youtube_chat {
max-width: calc(100% - 22rem); @include media-breakpoint-up(md) {
max-width: calc(100% - 22rem);
}
} }
@media screen and (min-width: 1900px) { @media screen and (min-width: 1900px) {
// return to bootstrap value for col-lg-9 / 10 breakpoint if screen is big enough // return to bootstrap value for col-lg-9 / 10 breakpoint if screen is big enough
&.col-lg-9 { &.col-lg-9 {
max-width: 75%; max-width: 75%;
@@ -68,9 +76,12 @@
// Left panel: other tracks // Left panel: other tracks
.o_wesession_track_aside { .o_wesession_track_aside {
// Force side panel min-width to account for potential Youtube chat // Force side panel min-width to account for potential Youtube chat
@include media-breakpoint-up(md) { &.o_youtube_chat {
min-width: 22rem; @include media-breakpoint-up(md) {
min-width: 22rem;
}
} }
@media screen and (min-width: 1900px) { @media screen and (min-width: 1900px) {
@@ -21,7 +21,7 @@
</div> </div>
</div> </div>
<div t-else="" class="o_wevent_online o_weagenda_index"> <div t-else="" class="o_wevent_online o_weagenda_index container">
<!-- Options --> <!-- Options -->
<t t-set="option_track_wishlist" t-value="not event.is_done and is_view_active('website_event_track.agenda_topbar_wishlist')"/> <t t-set="option_track_wishlist" t-value="not event.is_done and is_view_active('website_event_track.agenda_topbar_wishlist')"/>
<!-- Topbar --> <!-- Topbar -->
@@ -29,10 +29,8 @@
<!-- Drag/Drop Area --> <!-- Drag/Drop Area -->
<div class="oe_structure" id="oe_structure_website_event_track_agenda_1"/> <div class="oe_structure" id="oe_structure_website_event_track_agenda_1"/>
<!-- Content --> <!-- Content -->
<div class="container-fluid"> <div class="row mb-3">
<div class="row mb-5"> <t t-call="website_event_track.agenda_main"/>
<t t-call="website_event_track.agenda_main"/>
</div>
</div> </div>
<!-- Drag/Drop Area --> <!-- Drag/Drop Area -->
<div class="oe_structure" id="oe_structure_website_event_track_agenda_2"/> <div class="oe_structure" id="oe_structure_website_event_track_agenda_2"/>
@@ -46,18 +44,18 @@
<!-- Main topbar --> <!-- Main topbar -->
<template id="agenda_topbar" name="Agenda Tools"> <template id="agenda_topbar" name="Agenda Tools">
<nav class="navbar navbar-light border-top shadow-sm d-print-none"> <div class="o_weagenda_topbar_filters o_wevent_index_topbar_filters d-print-none d-flex flex-wrap align-items-center justify-content-end gap-2 w-100 mb-3">
<div class="container-fluid"> <h3 class="my-0 me-auto pe-sm-4">Agenda</h3>
<div class="d-flex flex-column flex-sm-row justify-content-between w-100"> <label class="invisible text-muted me-2" id="search_summary"><span id="search_number" class="me-1">0</span>Results</label>
<ul class="o_weagenda_topbar_filters o_wevent_index_topbar_filters nav"> <div class="o_wevent_search d-flex w-100 w-lg-auto">
</ul> <div class="input-group">
<div class="d-flex ps-sm-3 pe-0"> <input type="text" class="form-control search-query oe_search_box border-0 bg-light" placeholder="Search Tracks" id="event_track_search"/>
<label class="invisible text-muted me-2" id="search_summary"><span id="search_number" class="me-1">0</span>Results</label> <div class="btn oe_search_button btn-light">
<input type="text" class="form-control" placeholder="Filter Tracks..." id="event_track_search"/> <i class="oi oi-search"/>
</div> </div>
</div> </div>
</div> </div>
</nav> </div>
</template> </template>
<!-- Option: Tracks display: optional favorites --> <!-- Option: Tracks display: optional favorites -->
@@ -65,7 +63,7 @@
inherit_id="website_event_track.agenda_topbar" inherit_id="website_event_track.agenda_topbar"
name="Allow Wishlists" name="Allow Wishlists"
active="True"> active="True">
<xpath expr="//ul[hasclass('o_weagenda_topbar_filters')]" position="inside"> <xpath expr="//div[hasclass('o_weagenda_topbar_filters')]" position="inside">
</xpath> </xpath>
</template> </template>
@@ -77,18 +75,12 @@
<template id="agenda_main" name="Tracks: Main Display"> <template id="agenda_main" name="Tracks: Main Display">
<section t-foreach="days" t-as="day" class="col-12"> <section t-foreach="days" t-as="day" class="col-12">
<!-- DAY HEADER --> <!-- DAY HEADER -->
<div class="o_we_track_day_header mt-3 w-100 d-flex justify-content-between align-items-center"> <div class="o_we_track_day_header d-flex justify-content-between align-items-center w-100">
<div class="d-flex"> <div class="d-flex flex-column flex-grow-1">
<span class="h2 m-0 fw-bold" t-out="day" <span class="m-0 fw-bold" t-out="day" t-options="{'widget': 'date', 'format': 'EEEE '}"/>
t-options="{'widget': 'date', 'format': 'EEEE dd'}"/> <div class="d-flex align-items-center justify-content-start">
<div class="d-flex flex-column ms-2"> <span class="h3 mb-0 fw-bold" t-out="day" t-options="{'widget': 'date', 'format': 'dd MMMM YYYY'}"/>
<span class="fw-bold" t-out="day" <span class="small ms-2 fw-light">(<t t-out="event.date_tz"/>)</span>
t-options="{'widget': 'date', 'format': 'MMMM'}"/>
<span class="fw-bold" t-out="day"
t-options="{'widget': 'date', 'format': 'YYYY'}"/>
</div>
<div class="flex-column align-self-center ms-2">
<span class="small fw-light">(<t t-out="event.date_tz"/>)</span>
</div> </div>
</div> </div>
<small class="float-end text-muted align-self-end"><t t-out="tracks_by_days[day]"/> tracks</small> <small class="float-end text-muted align-self-end"><t t-out="tracks_by_days[day]"/> tracks</small>
@@ -173,7 +165,7 @@
class="ms-1 mt-1 mt-md-0 badge text-bg-danger o_wevent_online_badge_unpublished">Unpublished</small> class="ms-1 mt-1 mt-md-0 badge text-bg-danger o_wevent_online_badge_unpublished">Unpublished</small>
<span t-if="option_track_wishlist"> <span t-if="option_track_wishlist">
<t t-call="website_event_track.track_widget_reminder"> <t t-call="website_event_track.track_widget_reminder">
<t t-set="reminder_light" t-value="True"/> <t t-set="reminder_light" t-value="False"/>
<t t-set="reminder_small" t-value="True"/> <t t-set="reminder_small" t-value="True"/>
<t t-set="light_theme" t-value="False"/> <t t-set="light_theme" t-value="False"/>
</t> </t>
@@ -3,7 +3,7 @@
<template id="tracks_session" name="Event Tracks"> <template id="tracks_session" name="Event Tracks">
<t t-call="website_event.layout"> <t t-call="website_event.layout">
<div class="o_wevent_online o_wesession_index"> <div class="o_wevent_online o_wesession_index container">
<!-- Options --> <!-- Options -->
<t t-set="option_track_wishlist" t-value="not event.is_done and is_view_active('website_event_track.session_topbar_wishlist')"/> <t t-set="option_track_wishlist" t-value="not event.is_done and is_view_active('website_event_track.session_topbar_wishlist')"/>
<!-- Topbar --> <!-- Topbar -->
@@ -11,13 +11,9 @@
<!-- Drag/Drop Area --> <!-- Drag/Drop Area -->
<div id="oe_structure_wesession_index_1" class="oe_structure"/> <div id="oe_structure_wesession_index_1" class="oe_structure"/>
<!-- Content --> <!-- Content -->
<div class="o_wesession_container container"> <div class="o_wesession_container">
<div class="row"> <t t-call="website_event_track.tracks_search"/>
<t t-call="website_event_track.tracks_search"/> <t t-call="website_event_track.tracks_main"/>
</div>
<div class="row">
<t t-call="website_event_track.tracks_main"/>
</div>
</div> </div>
<!-- Drag/Drop Area --> <!-- Drag/Drop Area -->
<div id="oe_structure_wesession_index_2" class="oe_structure mb-5"/> <div id="oe_structure_wesession_index_2" class="oe_structure mb-5"/>
@@ -31,43 +27,122 @@
<!-- Main topbar --> <!-- Main topbar -->
<template id="session_topbar" name="Tracks Tools"> <template id="session_topbar" name="Tracks Tools">
<nav class="navbar navbar-light border-top shadow-sm d-print-none"> <div>
<div class="container"> <div class="o_wesession_topbar_filters o_wevent_index_topbar_filters d-print-none d-flex flex-wrap align-items-center justify-content-end gap-2 w-100 mb-3">
<div class="d-flex flex-column flex-sm-row justify-content-between w-100"> <h3 class="my-0 me-auto pe-sm-4">Talks</h3>
<ul class="o_wesession_topbar_filters o_wevent_index_topbar_filters nav"> <!-- Optional wishlist filter -->
<!-- Optional wishlist filter --> <div t-if="option_track_wishlist" class="dropdown d-none d-lg-block">
<li t-if="option_track_wishlist" class="nav-item dropdown me-2 my-1"> <a href="#" role="button" class="btn btn-light dropdown-toggle" data-bs-toggle="dropdown">
<a href="#" role="button" class="btn dropdown-toggle" data-bs-toggle="dropdown"> Favorites
<i class="fa fa-folder-open"/> Favorites </a>
</a> <div class="dropdown-menu">
<div class="dropdown-menu"> <a t-att-href="'/event/%s/track?%s' % (
<a t-att-href="'/event/%s/track?%s' % ( slug(event),
slug(event), keep_query('*', search_wishlist='')
keep_query('*', search_wishlist='') )"
)" class="dropdown-item d-flex align-items-center justify-content-between">
class="dropdown-item d-flex align-items-center justify-content-between"> All Talks
All Talks </a>
</a> <a t-att-href="'/event/%s/track?%s' % (
<a t-att-href="'/event/%s/track?%s' % ( slug(event),
slug(event), keep_query('*', search_wishlist='1')
keep_query('*', search_wishlist='1') )"
)" t-attf-class="dropdown-item d-flex align-items-center justify-content-between #{'active' if search_wishlist else ''}">
t-attf-class="dropdown-item d-flex align-items-center justify-content-between #{'active' if search_wishlist else ''}"> Favorites
</a>
</div>
</div>
<div class="o_wevent_search d-flex w-100 w-lg-auto">
<t t-call="website_event.events_search_box">
<t t-set="_searches" t-value="searches"/>
<t t-set="action" t-value="'/event/%s/track' % (slug(event))"/>
<t t-set="_placeholder" t-value="'Search a talk ...'"/>
</t>
<button class="btn btn-light position-relative ms-2 d-lg-none"
data-bs-toggle="offcanvas"
data-bs-target="#o_wevent_talk_offcanvas">
<i class="fa fa-sliders"/>
</button>
</div>
</div>
<!-- Off canvas filters on mobile-->
<div id="o_wevent_talk_offcanvas" class="o_website_offcanvas offcanvas offcanvas-end d-lg-none p-0 overflow-visible">
<div class="offcanvas-header">
<h5 class="offcanvas-title">Filters</h5>
<button type="button" class="btn-close" data-bs-dismiss="offcanvas" aria-label="Close"/>
</div>
<div class="offcanvas-body p-0">
<div class="accordion accordion-flush">
<div class="accordion-item">
<h2 class="accordion-header">
<button class="accordion-button collapsed"
type="button"
data-bs-toggle="collapse"
data-bs-target=".o_wevent_offcanvas_fav"
aria-expanded="false"
aria-controls="o_wevent_offcanvas_fav">
Favorites Favorites
</a> </button>
</h2>
<div class="o_wevent_offcanvas_fav accordion-collapse collapse">
<div class="accordion-body pt-0">
<ul class="list-group list-group-flush">
<!-- Optional wishlist filter -->
<li t-if="option_track_wishlist" class="list-group-item">
<a t-att-href="'/event/%s/track?%s' % (
slug(event),
keep_query('*', search_wishlist='')
)"
class="d-flex align-items-center justify-content-between">
All Talks
</a>
<a t-att-href="'/event/%s/track?%s' % (
slug(event),
keep_query('*', search_wishlist='1')
)"
t-attf-class="d-flex align-items-center justify-content-between #{'active' if search_wishlist else ''}">
Favorites
</a>
</li>
</ul>
</div>
</div> </div>
</li> </div>
</ul> <t t-foreach="tag_categories" t-as="tag_category">
<div class="d-flex align-items-center flex-wrap ps-sm-3 pe-0"> <div class="accordion-item">
<t t-call="website_event.events_search_box"> <h2 class="accordion-header">
<t t-set="_searches" t-value="searches"/> <button class="accordion-button border-top collapsed"
<t t-set="action" t-value="'/event/%s/track' % (slug(event))"/> type="button"
<t t-set="_placeholder" t-value="'Search a talk ...'"/> data-bs-toggle="collapse"
t-att-data-bs-target="'.o_wevent_offcanvas_tag_%s' % tag_category.name"
aria-expanded="false">
<t t-out="tag_category.name"/>
</button>
</h2>
<div t-attf-class="o_wevent_offcanvas_tag_#{tag_category.name} accordion-collapse collapse">
<div class="accordion-body pt-0">
<ul class="list-group list-group-flush">
<li t-if="tag_category.tag_ids and any(tag.color for tag in tag_category.tag_ids)" class="list-group-item">
<t t-foreach="tag_category.tag_ids" t-as="tag">
<a t-att-href="'/event/%s/track?%s' % (
slug(event),
keep_query('*', tags=str((search_tags - tag).ids if tag in search_tags else (tag | search_tags).ids))
)"
t-if="tag.color"
t-attf-class="d-flex align-items-center justify-content-between #{'active' if tag in search_tags else ''}">
<t t-out="tag.name"/>
</a>
</t>
</li>
</ul>
</div>
</div>
</div>
</t> </t>
</div> </div>
</div> </div>
</div> </div>
</nav> </div>
</template> </template>
<!-- Option: Topbar: optional tags filters --> <!-- Option: Topbar: optional tags filters -->
@@ -75,11 +150,10 @@
inherit_id="website_event_track.session_topbar" inherit_id="website_event_track.session_topbar"
name="Filter by Tags" name="Filter by Tags"
active="True"> active="True">
<xpath expr="//ul[hasclass('o_wesession_topbar_filters')]" position="inside"> <xpath expr="//div[hasclass('o_wevent_search')]" position="before">
<t t-foreach="tag_categories" t-as="tag_category"> <t t-foreach="tag_categories" t-as="tag_category">
<li t-if="tag_category.tag_ids and any(tag.color for tag in tag_category.tag_ids)" class="nav-item dropdown me-2 my-1"> <div t-if="tag_category.tag_ids and any(tag.color for tag in tag_category.tag_ids)" class="dropdown d-none d-lg-block me-2 my-1">
<a href="#" role="button" class="btn dropdown-toggle" data-bs-toggle="dropdown"> <a href="#" role="button" class="btn btn-light dropdown-toggle" data-bs-toggle="dropdown">
<i class="fa fa-folder-open"/>
<t t-out="tag_category.name"/> <t t-out="tag_category.name"/>
</a> </a>
<div class="dropdown-menu"> <div class="dropdown-menu">
@@ -94,7 +168,7 @@
</a> </a>
</t> </t>
</div> </div>
</li> </div>
</t> </t>
</xpath> </xpath>
</template> </template>
@@ -104,7 +178,7 @@
inherit_id="website_event_track.session_topbar" inherit_id="website_event_track.session_topbar"
name="Allow Wishlists" name="Allow Wishlists"
active="True"> active="True">
<xpath expr="//ul[hasclass('o_wesession_topbar_filters')]" position="inside"> <xpath expr="//div[hasclass('o_wesession_topbar_filters')]" position="inside">
</xpath> </xpath>
</template> </template>
@@ -117,7 +191,7 @@
<!-- No tracks --> <!-- No tracks -->
<div t-if="not tracks" class="col-12 text-center"> <div t-if="not tracks" class="col-12 text-center">
<div t-call="website_event.event_empty_events_svg" class="my-4"/> <div t-call="website_event.event_empty_events_svg" class="my-4"/>
<h2>No track found.</h2> <h4>No track found.</h4>
<p t-if="search_key">We could not find any track matching your search for: <strong t-out="search_key"/>.</p> <p t-if="search_key">We could not find any track matching your search for: <strong t-out="search_key"/>.</p>
<p t-else="">We could not find any track at this moment.</p> <p t-else="">We could not find any track at this moment.</p>
<div class="o_not_editable my-3" groups="event.group_event_user"> <div class="o_not_editable my-3" groups="event.group_event_user">
@@ -136,8 +210,7 @@
<template id="tracks_display_cards" name="Tracks: Cards Display"> <template id="tracks_display_cards" name="Tracks: Cards Display">
<div class="row mb-3" t-if="tracks_live"> <div class="row mb-3" t-if="tracks_live">
<div class="col-12"> <div class="col-12">
<h5 class="m-0 text-danger">Live Now</h5> <h4>Live Now</h4>
<hr class="mt-2 mb-2"/>
</div> </div>
<t t-call="website_event_track.track_cards_section"> <t t-call="website_event_track.track_cards_section">
<t t-set="tracks" t-value="tracks_live"/> <t t-set="tracks" t-value="tracks_live"/>
@@ -145,8 +218,7 @@
</div> </div>
<div class="row mb-3" t-if="tracks_soon"> <div class="row mb-3" t-if="tracks_soon">
<div class="col-12"> <div class="col-12">
<h5 class="m-0 text-danger">Coming soon ...</h5> <h4>Coming soon ...</h4>
<hr class="mt-2 mb-2"/>
</div> </div>
<t t-call="website_event_track.track_cards_section"> <t t-call="website_event_track.track_cards_section">
<t t-set="tracks" t-value="tracks_soon"/> <t t-set="tracks" t-value="tracks_soon"/>
@@ -157,41 +229,36 @@
<!-- Tracks: List-based display --> <!-- Tracks: List-based display -->
<template id="tracks_display_list" name="Tracks: List Display"> <template id="tracks_display_list" name="Tracks: List Display">
<div t-if="tracks"> <div t-if="tracks">
<h1>Book your talks</h1> <h4>Book your talks</h4>
<h4 class="mb-5">Plan your experience by adding your favorites talks to your wishlist</h4> <p class="mb-3">Plan your experience by adding your favorites talks to your wishlist</p>
</div> </div>
<div t-if="tracks" class="o_wesession_list mb-3"> <div t-if="tracks" class="o_wesession_list mb-3">
<ul class="list-unstyled"> <ul class="list-unstyled">
<li t-foreach="tracks_by_day" t-as="tracks_info" <li class="border-bottom" t-foreach="tracks_by_day" t-as="tracks_info">
class="mb-5">
<t t-set="tracks_date" t-value="tracks_info['date']"/> <t t-set="tracks_date" t-value="tracks_info['date']"/>
<t t-set="tracks_header_name" t-value="tracks_info['name']"/> <t t-set="tracks_header_name" t-value="tracks_info['name']"/>
<t t-set="tracks" t-value="tracks_info['tracks']"/> <t t-set="tracks" t-value="tracks_info['tracks']"/>
<!-- DAY HEADER --> <!-- DAY HEADER -->
<div class="o_we_track_day_header d-flex"> <div t-attf-class="o_we_track_day_header d-flex align-items-center py-3">
<div class="d-flex flex-grow-1" t-if="tracks_date"> <div class="d-flex flex-grow-1 flex-column" t-if="tracks_date">
<span class="h2 m-0 fw-bold" t-out="tracks_date" <span class="m-0 fw-bold" t-out="tracks_date"
t-options="{'widget': 'date', 'format': 'EEEE dd'}"/> t-options="{'widget': 'date', 'format': 'EEEE '}"/>
<div class="d-flex ms-3 me-2 flex-column"> <div class="d-flex align-items-center justify-content-start">
<span class="fw-bold" t-out="tracks_date" <span class="h3 mb-0 fw-bold" t-out="tracks_date"
t-options="{'widget': 'date', 'format': 'MMMM'}"/> t-options="{'widget': 'date', 'format': 'dd MMMM YYYY'}"/>
<span class="fw-bold" t-out="tracks_date" <span class="small ms-2 fw-light">(<t t-out="event.date_tz"/>)</span>
t-options="{'widget': 'date', 'format': 'YYYY'}"/>
</div>
<div class="flex-column align-self-center ms-2 d-none d-sm-block">
<span class="small fw-light">(<t t-out="event.date_tz"/>)</span>
</div> </div>
</div> </div>
<div class="d-flex flex-grow-1" t-elif="tracks_header_name"> <div class="d-flex flex-grow-1" t-elif="tracks_header_name">
<span class="h1 m-0 fw-bold" <span class="h1 m-0 fw-bold"
t-out="tracks_header_name"/> t-out="tracks_header_name"/>
</div> </div>
<a t-attf-class="ms-auto align-self-start text-black {{ 'collapsed' if tracks_info['default_collapsed'] else '' }}" <a t-attf-class="my-auto align-self-start text-black {{ 'collapsed' if tracks_info['default_collapsed'] else '' }}"
t-attf-href="#collapse_session_list_{{ tracks_info_index }}" t-attf-href="#collapse_session_list_{{ tracks_info_index }}"
t-attf-aria-controls="collapse_session_list_{{ tracks_info_index }}" t-attf-aria-controls="collapse_session_list_{{ tracks_info_index }}"
t-att-aria-expanded="'false' if tracks_info['default_collapsed'] else 'true'" t-att-aria-expanded="'false' if tracks_info['default_collapsed'] else 'true'"
data-bs-toggle="collapse"> data-bs-toggle="collapse">
<i class="oi fa-2x oi-chevron-down"/> <i class="oi oi-chevron-down"/>
</a> </a>
<hr class="mt-2 mb-2"/> <hr class="mt-2 mb-2"/>
</div> </div>
@@ -199,26 +266,35 @@
<div t-attf-class="collapse {{ '' if tracks_info['default_collapsed'] else 'show' }}" <div t-attf-class="collapse {{ '' if tracks_info['default_collapsed'] else 'show' }}"
t-attf-id="collapse_session_list_{{ tracks_info_index }}"> t-attf-id="collapse_session_list_{{ tracks_info_index }}">
<div t-foreach="tracks" t-as="track" <div t-foreach="tracks" t-as="track"
t-att-class="'o_wesession_list_item px-2 py-2 event_color_%d' % (track.color)"> t-att-class="'o_wesession_list_item p-3 event_color_%d' % (track.color)">
<!-- Side information in a floating div (desktop only) -->
<div t-if="not event.is_done and (not track.date or today_tz &lt;= tracks_date) and option_track_wishlist"
class="float-end d-none d-md-block ms-2 py-1">
<t t-call="website_event_track.track_widget_reminder">
<t t-set="reminder_small" t-value="False"/>
<t t-set="reminder_light" t-value="False"/>
</t>
</div>
<div class="row g-0"> <div class="row g-0">
<!-- Main column: name, speaker --> <div class="col-12 d-flex justify-content-between">
<div class="col-md-7"> <!-- Hour: Live > Remaining > Hour: desktop only -->
<!-- Reminder widget: directly in line to gain space, mobile only --> <div t-if="tracks_date and today_tz &lt;= tracks_date"
>
<span t-if="track.is_track_live and not track.is_track_done"
class="badge text-bg-danger">Live</span>
<span t-elif="not track.is_track_done and track.is_track_soon">
<span t-out="track.track_start_remaining"
t-options="{'widget': 'duration', 'digital': False, 'format': 'narrow',
'add_direction': True, 'unit': 'second', 'round': 'minute'}"/>
</span>
<span t-elif="not track.is_track_done and not track.is_track_soon"
t-out="track.date"
t-options="{'widget': 'datetime', 'time_only': True, 'format': 'short', 'tz_name': event.date_tz}"/>
<span t-else="" class="badge text-bg-info">Finished</span>
</div>
<!-- reminder -->
<div t-if="not event.is_done and (not track.date or today_tz &lt;= tracks_date) and option_track_wishlist" <div t-if="not event.is_done and (not track.date or today_tz &lt;= tracks_date) and option_track_wishlist"
class="float-end d-block d-md-none ms-2 py-1"> class="d-none d-md-block py-1">
<t t-call="website_event_track.track_widget_reminder"> <t t-call="website_event_track.track_widget_reminder">
<t t-set="reminder_small" t-value="True"/> <t t-set="reminder_small" t-value="False"/>
<t t-set="reminder_light" t-value="False"/> <t t-set="reminder_light" t-value="False"/>
</t> </t>
</div> </div>
</div>
<!-- Main column: name, speaker -->
<div class="col-12">
<span class="h5 mb0"> <span class="h5 mb0">
<a t-if="track.website_published or is_event_user" <a t-if="track.website_published or is_event_user"
class="me-2" class="me-2"
@@ -233,57 +309,23 @@
Unpublished Unpublished
</span> </span>
</span> </span>
<div class="text-muted d-flex align-items-center"> </div>
<div class="col-12 d-flex justify-content-between align-items-end">
<div class="d-flex align-items-center w-100 gap-2 text-muted">
<span class="text-muted" t-out="track.partner_tag_line"/> <span class="text-muted" t-out="track.partner_tag_line"/>
<t t-if="tracks_date and today_tz &lt;= tracks_date"> <t t-if="tracks_date and today_tz &lt;= tracks_date">
<!-- Hour: Live > Remaining > Hour: mobile only -->
<div class="d-block d-md-none">
<span t-if="track.partner_tag_line" class="ms-2">&amp;bull;</span>
<span t-if="track.is_track_live and not track.is_track_done"
class="badge text-bg-danger ms-2">Live</span>
<span t-elif="not track.is_track_done and track.is_track_soon"
class="ms-2">
<span t-out="track.track_start_remaining"
t-options="{'widget': 'duration', 'digital': False, 'format': 'narrow',
'add_direction': True, 'unit': 'second', 'round': 'minute'}"/>
</span>
<span t-elif="not track.is_track_done and not track.is_track_soon"
class="ms-2"
t-out="track.date"
t-options="{'widget': 'datetime', 'time_only': True, 'format': 'short', 'tz_name': track.event_id.date_tz}"/>
<span t-else="" class="badge text-bg-info ms-2">Finished</span>
</div>
<!-- Duration (desktop only) -->
<t t-if="track.duration and not track.is_track_done and not track.is_track_done"> <t t-if="track.duration and not track.is_track_done and not track.is_track_done">
<span class="d-none d-md-block ms-2">&amp;bull;</span> <span class="d-none d-md-block">&amp;bull;</span>
<span class="d-none d-md-block ms-2" <span class="d-none d-md-block"
t-out="track.duration" t-out="track.duration"
t-options="{'widget': 'duration', 'digital': False, 'format': 'short', 'unit': 'hour', 'round': 'minute'}"/> t-options="{'widget': 'duration', 'digital': False, 'format': 'short', 'unit': 'hour', 'round': 'minute'}"/>
</t> </t>
</t> </t>
</div> </div>
</div> <!-- Aside column: tags -->
<!-- Aside column: date, tags --> <div class="d-none d-md-flex justify-content-end align-items-center w-auto gap-2">
<div class="col-md-5 align-self-center"> <!-- Tags: desktop only -->
<!-- Hour: Live > Remaining > Hour: desktop only -->
<div t-if="tracks_date and today_tz &lt;= tracks_date"
class="d-none d-md-block float-end">
<span t-if="track.is_track_live and not track.is_track_done"
class="badge text-bg-danger ms-2">Live</span>
<span t-elif="not track.is_track_done and track.is_track_soon"
class="ms-2">
<span t-out="track.track_start_remaining"
t-options="{'widget': 'duration', 'digital': False, 'format': 'narrow',
'add_direction': True, 'unit': 'second', 'round': 'minute'}"/>
</span>
<span t-elif="not track.is_track_done and not track.is_track_soon"
class="ms-2"
t-out="track.date"
t-options="{'widget': 'datetime', 'time_only': True, 'format': 'short', 'tz_name': event.date_tz}"/>
<span t-else="" class="badge text-bg-info ms-2">Finished</span>
</div>
<!-- Tags: desktop only -->
<div class="d-none d-md-block">
<t t-foreach="track.tag_ids" t-as="tag"> <t t-foreach="track.tag_ids" t-as="tag">
<t t-if="tag.color" t-call="website_event_track.track_tag_badge_link"/> <t t-if="tag.color" t-call="website_event_track.track_tag_badge_link"/>
</t> </t>
@@ -302,7 +344,7 @@
<!-- ============================================================ --> <!-- ============================================================ -->
<template id="track_cards_section" name="Track Cards"> <template id="track_cards_section" name="Track Cards">
<div t-foreach="tracks" t-as="track" class="col-md-6 col-lg-3 mb-4"> <div t-foreach="tracks" t-as="track" class="col-md-6 col-lg-4 col-xl-3 mb-4">
<t t-if="track.website_published or is_event_user"> <t t-if="track.website_published or is_event_user">
<a t-att-href="'/event/%s/track/%s' % (slug(track.event_id), slug(track))" class="text-decoration-none"> <a t-att-href="'/event/%s/track/%s' % (slug(track.event_id), slug(track))" class="text-decoration-none">
<t t-call="website_event_track.track_card"/> <t t-call="website_event_track.track_card"/>
@@ -315,7 +357,7 @@
</template> </template>
<template id="track_card" name="Track Card"> <template id="track_card" name="Track Card">
<article t-att-class="'h-100 card rounded-0 border-0 shadow-sm o_wesession_track_card %s' % ('o_wesession_track_card_unpublished' if (not track.website_published and is_event_user) else '')" <article t-att-class="'card o_wesession_track_card h-100 %s' % ('o_wesession_track_card_unpublished' if (not track.website_published and is_event_user) else '')"
itemscope="itemscope" itemtype="http://schema.org/Event"> itemscope="itemscope" itemtype="http://schema.org/Event">
<div class="h-100 row g-0"> <div class="h-100 row g-0">
<header class="overflow-hidden bg-secondary col-12"> <header class="overflow-hidden bg-secondary col-12">
@@ -325,10 +367,9 @@
<div t-if="track.website_image_url" class="card-img-top" <div t-if="track.website_image_url" class="card-img-top"
t-attf-style="padding-top: 50%; background-image: url(#{track.website_image_url}); background-size: cover; background-position:center"> t-attf-style="padding-top: 50%; background-image: url(#{track.website_image_url}); background-size: cover; background-position:center">
<span t-if="option_track_wishlist and not track.is_track_live" class="position-absolute h3 mt-2 me-2" style="right: 0; top: 0;"> <span t-if="option_track_wishlist and not track.is_track_live" class="position-absolute h3 mt-2 me-2 text-white" style="right: 0; top: 0;">
<t t-call="website_event_track.track_widget_reminder"> <t t-call="website_event_track.track_widget_reminder">
<t t-set="reminder_light" t-value="True"/> <t t-set="reminder_light" t-value="True"/>
<t t-set="light_theme" t-value="True"/>
</t> </t>
</span> </span>
</div> </div>
@@ -344,20 +385,20 @@
</header> </header>
<div class="col-12"> <div class="col-12">
<main class="card-body"> <main class="card-body">
<!-- Title -->
<h5 class="card-title mt-0 mb-0 text-truncate">
<span t-field="track.name" itemprop="name"/>
</h5>
<!-- Tags> --> <!-- Tags> -->
<div> <div class="mb-2">
<t t-foreach="track.tag_ids" t-as="tag"> <t t-foreach="track.tag_ids" t-as="tag">
<t t-if="tag.color" t-call="website_event_track.track_tag_badge_info"/> <t t-if="tag.color" t-call="website_event_track.track_tag_badge_info"/>
</t> </t>
</div> </div>
<!-- Title -->
<h5 class="card-title mb-0 text-truncate">
<span t-field="track.name" itemprop="name"/>
</h5>
</main> </main>
</div> </div>
<!-- Footer --> <!-- Footer -->
<footer class="small align-self-end w-100 card-footer"> <footer class="small align-self-end w-100 p-3">
<div class="d-flex justify-content-between align-items-center"> <div class="d-flex justify-content-between align-items-center">
<!-- Speaker --> <!-- Speaker -->
<span class="text-muted text-truncate" t-field="track.partner_name" itemprop="performer"/> <span class="text-muted text-truncate" t-field="track.partner_name" itemprop="performer"/>
@@ -384,10 +425,10 @@
<!-- Searched tags --> <!-- Searched tags -->
<template id="tracks_search" name="Tracks: search tags"> <template id="tracks_search" name="Tracks: search tags">
<div class="d-flex align-items-center mb-3"> <div t-if="search_wishlist or search_tags" class="d-flex align-items-center my-3">
<span t-if="search_wishlist" <span t-if="search_wishlist"
class="align-items-baseline border d-inline-flex ps-2 mt-3 rounded ml16 mb-2 bg-white"> class="align-items-baseline border d-inline-flex rounded">
<i class="fa fa-bell me-2 text-muted"/> Favorite Talks <i class="fa fa-bell mx-2 text-muted"/> Favorite Talks
<a t-att-href="'/event/%s/track?%s' % (slug(event), keep_query('*', search_wishlist=''))" <a t-att-href="'/event/%s/track?%s' % (slug(event), keep_query('*', search_wishlist=''))"
class="btn border-0 py-1"> class="btn border-0 py-1">
&#215; &#215;
@@ -395,8 +436,8 @@
</span> </span>
<t t-foreach="search_tags" t-as="tag"> <t t-foreach="search_tags" t-as="tag">
<span class="align-items-baseline border d-inline-flex ps-2 mt-3 rounded ml16 mb-2 bg-white"> <span class="align-items-baseline border d-inline-flex rounded">
<i class="fa fa-tag me-2 text-muted"/> <i class="fa fa-tag mx-2 text-muted"/>
<t t-out="tag.display_name"/> <t t-out="tag.display_name"/>
<a t-att-href="'/event/%s/track?%s' % (slug(event), keep_query('*', tags=str((search_tags - tag).ids)))" <a t-att-href="'/event/%s/track?%s' % (slug(event), keep_query('*', tags=str((search_tags - tag).ids)))"
class="btn border-0 py-1"> class="btn border-0 py-1">
@@ -36,7 +36,7 @@
</t> </t>
</div> </div>
<div class="mb-1 align-items-baseline text-break" t-if="track.partner_id.website"> <div class="mb-1 align-items-baseline text-break" t-if="track.partner_id.website">
<i class="fa fa-home me-2"/><a t-att-href="track.partner_id.website"><span t-field="track.partner_id.website"/></a> <i class="fa fa-globe me-2"/><a t-att-href="track.partner_id.website"><span t-field="track.partner_id.website"/></a>
</div> </div>
<div class="mb-1 align-items-baseline text-break" t-if="track.partner_email"> <div class="mb-1 align-items-baseline text-break" t-if="track.partner_email">
<i class="fa fa-envelope me-2"/><a t-att-mailto="track.partner_email"><span t-field="track.partner_email"/></a> <i class="fa fa-envelope me-2"/><a t-att-mailto="track.partner_email"><span t-field="track.partner_email"/></a>
@@ -48,7 +48,7 @@
<template id="event_track_content" name="Track: Main Description"> <template id="event_track_content" name="Track: Main Description">
<div name="o_wesession_track_main" <div name="o_wesession_track_main"
t-att-class="'col-12 o_wesession_track_main o_wevent_theme_bg_base border mt-3 p-0 %s' % ('col-md-9 col-lg-10' if option_widescreen else 'col-md-8 col-lg-9')"> t-att-class="'o_wesession_track_main col-12 border p-0 %s %s' % ('col-md-9 col-xl-10' if option_widescreen else 'col-md-8 col-xl-9', 'o_youtube_chat' if track.is_youtube_chat_available else '')">
<!-- LIVE INFORMATIONS --> <!-- LIVE INFORMATIONS -->
<div t-if="not track.event_id.is_ongoing and track.event_id.start_remaining" class="pt-3"> <div t-if="not track.event_id.is_ongoing and track.event_id.start_remaining" class="pt-3">
<div class="mx-3 alert alert-warning"> <div class="mx-3 alert alert-warning">
@@ -76,8 +76,8 @@
</div> </div>
<!-- TRACK DESCRIPTION --> <!-- TRACK DESCRIPTION -->
<div class="o_wesession_track_main_description overflow-auto"> <div class="o_wesession_track_main_description overflow-auto">
<div class="mx-3 pt-3 mb-3 d-flex justify-content-between flex-column flex-md-row"> <div class="p-3 border-bottom">
<div class="d-flex flex-column"> <div class="d-flex flex-wrap justify-content-between align-items-center">
<span class="h4 mb-0" t-out="track.name"/> <span class="h4 mb-0" t-out="track.name"/>
<div> <div>
<t t-foreach="track.tag_ids" t-as="tag"> <t t-foreach="track.tag_ids" t-as="tag">
@@ -87,38 +87,38 @@
</t> </t>
</div> </div>
</div> </div>
<div class="o_we_track_action_buttons d-flex justify-content-md-end align-items-center flex-wrap"> <div class="d-flex flex-wrap justify-content-between align-items-center">
<div class="o_we_track_reminder_button my-1"> <div class="text-muted">
<div t-if="option_track_wishlist and not track.is_track_done" <t t-if="track.location_id">
t-call="website_event_track.track_widget_reminder"> <strong>Location:</strong> <span t-field="track.location_id"/>
<t t-set="reminder_small" t-value="False"/> <span> - </span>
<t t-set="reminder_light" t-value="False"/> </t>
<t t-if="track.date">
<span t-field="track.date"
t-options='{"hide_seconds":"True", "format": "short", "tz_name": event.date_tz}'/>
-
<span t-field="track.date_end"
t-options='{"hide_seconds":"True", "format": "short", "tz_name": event.date_tz}'/>
<t t-if="event.date_tz">
(<span t-out="event.date_tz"/>)
</t>
</t>
<t t-if="track.duration">
(<span t-field="track.duration"
t-options='{"widget": "duration", "unit": "hour", "round": "minute"}'/>)
</t>
</div>
<div class="o_we_track_action_buttons d-flex justify-content-md-end align-items-center flex-wrap">
<div class="o_we_track_reminder_button my-1">
<div t-if="option_track_wishlist and not track.is_track_done"
t-call="website_event_track.track_widget_reminder">
<t t-set="reminder_small" t-value="False"/>
<t t-set="reminder_light" t-value="False"/>
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="mx-3 text-muted">
<t t-if="track.location_id">
<strong>Location:</strong> <span t-field="track.location_id"/>
<span> - </span>
</t>
<t t-if="track.date">
<span t-field="track.date"
t-options='{"hide_seconds":"True", "format": "short", "tz_name": event.date_tz}'/>
-
<span t-field="track.date_end"
t-options='{"hide_seconds":"True", "format": "short", "tz_name": event.date_tz}'/>
<t t-if="event.date_tz">
(<span t-out="event.date_tz"/>)
</t>
</t>
<t t-if="track.duration">
(<span t-field="track.duration"
t-options='{"widget": "duration", "unit": "hour", "round": "minute"}'/>)
</t>
</div>
<hr class="mt-2 mb-0"/>
<!-- ABOUT AUTHOR --> <!-- ABOUT AUTHOR -->
<t t-set="track_fields" t-value="['image', 'partner_name', 'partner_function', 'partner_email', 'partner_phone']"/> <t t-set="track_fields" t-value="['image', 'partner_name', 'partner_function', 'partner_email', 'partner_phone']"/>
@@ -128,14 +128,13 @@
<div class="mt-2 mb-2 d-flex"> <div class="mt-2 mb-2 d-flex">
<div t-if="track.image" t-field="track.image" <div t-if="track.image" t-field="track.image"
t-options="{'widget': 'image', 'class': 'rounded-circle me-2', 'max_width': '96'}"/> t-options="{'widget': 'image', 'class': 'rounded-circle me-2', 'max_width': '96'}"/>
<div class="ps-2 pe-0 pe-md-2 d-flex flex-grow-1 flex-column"> <div class="d-none d-md-flex flex-grow-1 flex-column ps-2 pe-0 pe-md-2">
<div t-if="track.partner_name" t-field="track.partner_name" class="fw-bold mb-2"/> <div t-if="track.partner_name" t-field="track.partner_name" class="mb-2 fw-bold"/>
<div class="d-none d-lg-block"> <t t-call="website_event_track.event_track_content_partner_info"/>
<t t-call="website_event_track.event_track_content_partner_info"/>
</div>
</div> </div>
</div> </div>
<div class="d-block d-lg-none mt-3 mb-3"> <div class="d-flex d-md-none flex-grow-1 flex-column mt-3 mb-3 ps-2 pe-0 pe-md-2">
<div t-if="track.partner_name" t-field="track.partner_name" class="mb-2 fw-bold"/>
<t t-call="website_event_track.event_track_content_partner_info"/> <t t-call="website_event_track.event_track_content_partner_info"/>
</div> </div>
<div t-if="not is_html_empty(track.partner_biography)" t-field="track.partner_biography" <div t-if="not is_html_empty(track.partner_biography)" t-field="track.partner_biography"
@@ -166,8 +165,8 @@
<!-- ============================================================ --> <!-- ============================================================ -->
<template id="event_track_aside" name="Track: Aside"> <template id="event_track_aside" name="Track: Aside">
<div t-att-class="'col-12 ps-0 pe-0 mt-3 border o_wevent_online_page_aside o_wesession_track_aside %s' % ('col-md-3 col-lg-2' if option_widescreen else 'col-md-4 col-lg-3')"> <div t-att-class="'o_wevent_online_page_aside o_wesession_track_aside col-12 ps-0 pe-0 border %s %s' % ('col-md-3 col-xl-2' if option_widescreen else 'col-md-4 col-xl-3', 'o_youtube_chat' if track.is_youtube_chat_available else '')">
<div class="o_wevent_theme_bg_base o_wevent_online_page_aside_content"> <div class="o_wevent_online_page_aside_content">
<div class="mx-2" t-if="track.date and track.website_cta"> <div class="mx-2" t-if="track.date and track.website_cta">
<t t-set="cta_coundown" t-value="bool(track.website_cta_start_remaining)"/> <t t-set="cta_coundown" t-value="bool(track.website_cta_start_remaining)"/>
<div t-if="cta_coundown" class="text-center w-100 btn btn-primary d-none"> <div t-if="cta_coundown" class="text-center w-100 btn btn-primary d-none">
@@ -189,7 +188,7 @@
</a> </a>
</div> </div>
</div> </div>
<div class="d-flex align-items-center justify-content-between my-2 me-2"> <div class="d-flex align-items-center justify-content-between py-2 border-bottom">
<ul class="nav nav-tabs o_wesession_track_aside_nav d-flex border-0" role="tablist"> <ul class="nav nav-tabs o_wesession_track_aside_nav d-flex border-0" role="tablist">
<li class="nav-item flex-grow-1"> <li class="nav-item flex-grow-1">
<a href="#track_list" aria-controls="track_list" class="nav-link active" role="tab" data-bs-toggle="tab"> <a href="#track_list" aria-controls="track_list" class="nav-link active" role="tab" data-bs-toggle="tab">
@@ -204,11 +203,11 @@
<div id="collapse_track_aside" <div id="collapse_track_aside"
class="tab-content collapse d-md-block o_wesession_track_aside_tabs"> class="tab-content collapse d-md-block o_wesession_track_aside_tabs">
<div class="tab-pane fade show active" id="track_list" role="tabpanel"> <div class="tab-pane fade show active" id="track_list" role="tabpanel">
<ul class="list-unstyled mb-0"> <ul class="list-group list-group-flush">
<li t-foreach="tracks_other" t-as="track_other" class="w-100"> <li t-foreach="tracks_other" t-as="track_other" class="list-group-item list-group-item-action">
<a t-if="is_event_user or track_other.is_published" <a t-if="is_event_user or track_other.is_published"
t-att-data-publish="track_other.website_published and 'on' or 'off'" t-att-data-publish="track_other.website_published and 'on' or 'off'"
class="d-block w-100 h-100 px-2 pt-2 pb-1 text-decoration-none" class="d-flex flex-column flex-wrap flex-md-nowrap text-decoration-none text-dark"
t-att-href="track_other.website_url"> t-att-href="track_other.website_url">
<t t-call="website_event_track.event_track_aside_other_track"/> <t t-call="website_event_track.event_track_aside_other_track"/>
</a> </a>
@@ -226,10 +225,10 @@
</template> </template>
<template id="event_track_aside_other_track"> <template id="event_track_aside_other_track">
<span t-out="track_other.name" class="w-100"/> <span t-out="track_other.name" class="fw-bold"/>
<div class="d-flex align-items-center"> <div class="d-flex flex-column flex-lg-row flex-wrap justify-content-between align-items-start">
<small class="text-muted" t-out="track_other.partner_name"/> <small class="text-muted" t-out="track_other.partner_name"/>
<div class="d-inline-block ms-auto o_wesession_track_aside_info text-truncate"> <div class="d-inline-block o_wesession_track_aside_info text-truncate">
<small t-if="not track_other.website_published and user_event_manager" <small t-if="not track_other.website_published and user_event_manager"
class="badge text-bg-danger">Unpublished</small> class="badge text-bg-danger">Unpublished</small>
<small t-if="track_other.is_track_live and not track_other.is_track_done" <small t-if="track_other.is_track_live and not track_other.is_track_done"
@@ -237,7 +236,7 @@
<small t-elif="track_other.is_track_done" <small t-elif="track_other.is_track_done"
class="badge text-bg-light">Done</small> class="badge text-bg-light">Done</small>
<small t-elif="track_other.is_track_today and track_other.track_start_remaining" <small t-elif="track_other.is_track_today and track_other.track_start_remaining"
class="badge text-bg-light"> class="badge text-bg-secondary">
<span t-out="track_other.track_start_remaining" <span t-out="track_other.track_start_remaining"
t-options="{'widget': 'duration', 'digital': False, 'add_direction': True, t-options="{'widget': 'duration', 'digital': False, 'add_direction': True,
'unit': 'second', 'round': 'minute', 'format': 'narrow'}"/> 'unit': 'second', 'round': 'minute', 'format': 'narrow'}"/>
@@ -3,25 +3,27 @@
<template id="event_track_proposal"> <template id="event_track_proposal">
<t t-call="website_event.layout"> <t t-call="website_event.layout">
<t t-set="hide_submenu" t-value="True"/>
<div class="oe_structure" id="oe_structure_website_event_track_proposal_1"/> <div class="oe_structure" id="oe_structure_website_event_track_proposal_1"/>
<div class="container"> <div class="container">
<section class="pt48"> <section class="row mb-3">
<h1 class="o_page_header">Call for Proposals</h1> <div class="col-lg-8 col-xl-9">
<h2 class="text-center text-secondary fw-bold my-4" t-out="event.name"/> <t t-call="website_event.navbar"/>
</section>
<section id="forms" t-if="not event.website_track_proposal">
<h1>Proposals are closed!</h1>
<p>
This event does not accept proposals.
</p>
</section>
<section class="row mb32">
<div class="oe_structure col-lg-12">
<section> <section>
<h3 class="o_page_header mt8"> <h3>Call for Proposals</h3>
Introduction </section>
</h3> <section id="forms" t-if="not event.website_track_proposal">
<h2>Proposals are closed!</h2>
<p> <p>
This event does not accept proposals.
</p>
</section>
<div class="oe_structure">
<section>
<h4 class="mt-3">
Introduction
</h4>
<p class="lead">
We will accept a broad range of We will accept a broad range of
presentations, from reports on academic and presentations, from reports on academic and
commercial projects to tutorials and case commercial projects to tutorials and case
@@ -30,15 +32,15 @@
audience, it will be considered for audience, it will be considered for
inclusion in the programme. inclusion in the programme.
</p> </p>
<br/>
</section> </section>
</div> </div>
<div class="col-lg-9">
<div> <div>
<section id="forms" t-if="event.website_track_proposal"> <section id="forms" t-if="event.website_track_proposal">
<form class="mt32 js_website_submit_form o_website_event_track_proposal_form" t-att-data-event-id="event.id" enctype="multipart/form-data"> <form class="js_website_submit_form o_website_event_track_proposal_form mt-3" t-att-data-event-id="event.id" enctype="multipart/form-data">
<input name="csrf_token" type="hidden" t-att-value="request.csrf_token()"/> <input name="csrf_token" type="hidden" t-att-value="request.csrf_token()"/>
<div id="track_intro"> <div id="track_intro">
<h4 class="mt32"><b>Talk Intro</b></h4> <h4 class="mt-3">Talk Intro</h4>
<div class="form-text text-muted mb16"> <div class="form-text text-muted mb16">
What is your talk about? What is your talk about?
</div> </div>
@@ -67,8 +69,9 @@
</div> </div>
</div> </div>
</div> </div>
<br/>
<div id="speaker_profile"> <div id="speaker_profile">
<h4 class="mt32"><b>Speaker Profile</b></h4> <h4 class="mt-3">Speaker Profile</h4>
<div class="form-text text-muted mb16"> <div class="form-text text-muted mb16">
Who will give this talk? We will show this to attendees to showcase your talk. Who will give this talk? We will show this to attendees to showcase your talk.
</div> </div>
@@ -86,7 +89,7 @@
</div> </div>
<div class="row mb-3"> <div class="row mb-3">
<label class="col-form-label col-sm-auto" for="image" style="width: 200px">Picture</label><br/> <label class="col-form-label col-sm-auto" for="image" style="width: 200px">Picture</label><br/>
<div class="col-sm"><input name="image" type="file" accept="image/*" style="width: 100%"/></div> <div class="col-sm"><input name="image" class="form-control" type="file" accept="image/*" style="width: 100%"/></div>
</div> </div>
<div class="row mb-3"> <div class="row mb-3">
<label class="col-form-label col-sm-auto" for="partner_function" style="width: 200px">Job Title</label> <label class="col-form-label col-sm-auto" for="partner_function" style="width: 200px">Job Title</label>
@@ -98,7 +101,7 @@
</div> </div>
</div> </div>
<t t-call="website_event_track.event_track_proposal_contact_details"/> <t t-call="website_event_track.event_track_proposal_contact_details"/>
<div class="o_form_buttons"> <div class="o_form_buttons d-flex justify-content-end">
<button type="submit" class="btn btn-primary o_wetrack_proposal_submit_button">Submit Proposal</button> <button type="submit" class="btn btn-primary o_wetrack_proposal_submit_button">Submit Proposal</button>
<span class="o_wetrack_proposal_error_section text-danger d-none ml8"> <span class="o_wetrack_proposal_error_section text-danger d-none ml8">
<i class="fa fa-close mr4" role="img" aria-label="Error" title="Error"/> <i class="fa fa-close mr4" role="img" aria-label="Error" title="Error"/>
@@ -110,39 +113,32 @@
</div> </div>
<div class="oe_structure" id="oe_structure_website_event_track_proposal_2"/> <div class="oe_structure" id="oe_structure_website_event_track_proposal_2"/>
</div> </div>
<div class="col-lg-3"> <aside class="col-lg-4 col-xl-3 mt-3 mt-lg-0 pt-3">
<div class="card mb-3 border-0"> <h5 class="o_page_header">Talks Types</h5>
<h4 class="o_wevent_theme_bg_base card-header">Talks Types</h4> <h6 class="fw-bold">Regular Talks</h6>
<div class="o_wevent_theme_bg_light card-body"> <p>
<ul class="list-unstyled"> These are standard talks with slides, alocated in slots of 60 minutes.
<li> </p>
<strong>Regular Talks</strong>. These are standard talks with slides, <h6 class="fw-bold">Lightning Talks</h6>
alocated in slots of 60 minutes. <p>
</li><li> These are 30 minutes talks on many different topics. Most topics are accepted in lightning talks.
<strong>Lightning Talks</strong>. These are 30 minutes talks on many </p>
different topics. Most topics are accepted in lightning talks. <br/>
</li> <h5 class="o_page_header">Submission Agreement</h5>
</ul> <p>
</div> We require speakers to accept an agreement in which they commit to:
</div> </p>
<div class="card border-0"> <ul>
<h4 class="o_wevent_theme_bg_base card-header">Submission Agreement</h4> <li>
<div class="o_wevent_theme_bg_light card-body"> Timely release of presentation material (slides),
<p> for publishing on our website.
We require speakers to accept an agreement in which they commit to: </li>
</p> <li>
<ul class="list-unstyled"> Allow video and audio recording of their
<li> presentation, for publishing on our website.
Timely release of presentation material (slides), </li>
for publishing on our website. </ul>
</li><li> </aside>
Allow video and audio recording of their
presentation, for publishing on our website.
</li>
</ul>
</div>
</div>
</div>
</section> </section>
</div> </div>
<div class="oe_structure" id="oe_structure_website_event_track_proposal_3"/> <div class="oe_structure" id="oe_structure_website_event_track_proposal_3"/>
@@ -7,23 +7,16 @@
* light_theme: bell is white/gold if set; otherwse bell is gray / white * light_theme: bell is white/gold if set; otherwse bell is gray / white
--> -->
<template id="track_widget_reminder"> <template id="track_widget_reminder">
<t t-set="_btn_style" t-value="'btn-link' if reminder_light else (track.is_reminder_on and 'btn-primary') or 'btn-outline-primary'"/> <t t-set="_btn_style" t-value="'btn-link' if reminder_light else (track.is_reminder_on and '') or ''"/>
<t t-set="_btn_size" t-value="'btn-sm' if reminder_small else ''"/> <t t-set="_btn_size" t-value="'btn-sm' if reminder_small else ''"/>
<div t-att-class="'o_wetrack_js_reminder btn %s %s' % (_btn_style, _btn_size)"> <div t-att-class="'o_wetrack_js_reminder %s %s' % (_btn_style, _btn_size)" role="button">
<t t-if="track.is_reminder_on" t-set="title">Favorite On</t> <t t-if="track.is_reminder_on" t-set="title">Favorite On</t>
<t t-else="track.is_reminder_on" t-set="title">Set Favorite</t> <t t-else="track.is_reminder_on" t-set="title">Set Favorite</t>
<i t-att-class="'fa fa-bell%s inactive_color_%s' % ('' if track.is_reminder_on else '-o', 'dark' if reminder_light and not light_theme else 'light')" <i t-att-class="'fa fa-bell%s %s' % ('' if track.is_reminder_on else '-o', 'text-white' if reminder_light and not light_theme else 'text-dark')"
t-att-data-track-id="track.id" t-att-data-track-id="track.id"
t-att-title="title" t-att-title="title"
t-att-data-is-reminder-light="reminder_light" t-att-data-is-reminder-light="reminder_light"
t-att-data-reminder-on="bool(track.is_reminder_on)"></i> t-att-data-reminder-on="bool(track.is_reminder_on)"></i>
<span t-if="not reminder_light" class="o_wetrack_js_reminder_text">
<t t-if="not track.is_reminder_on">
Set Favorite
</t><t t-else="">
Favorite On
</t>
</span>
</div> </div>
</template> </template>
@@ -3,17 +3,17 @@
<template id="tracks_display_list" inherit_id="website_event_track.tracks_display_list"> <template id="tracks_display_list" inherit_id="website_event_track.tracks_display_list">
<!-- TRACK LIST: ADD REPLAY TAG FOR FINISHED TRACKS --> <!-- TRACK LIST: ADD REPLAY TAG FOR FINISHED TRACKS -->
<xpath expr="//div[@t-foreach='tracks']//div[hasclass('col-md-7')]//span[@t-elif='not track.is_track_done and not track.is_track_soon']" position="after"> <xpath expr="//div[@t-foreach='tracks']//div[hasclass('col-12')]//span[@t-elif='not track.is_track_done and not track.is_track_soon']" position="after">
<a t-elif="track.youtube_video_url and (track.is_published or is_event_user)" <a t-elif="track.youtube_video_url and (track.is_published or is_event_user)"
t-att-href="track.website_url" class="badge text-bg-danger ms-2">Replay t-att-href="track.website_url" class="badge text-bg-danger">Replay
</a> </a>
</xpath> </xpath>
<!-- ADD YOUTUBE ICON --> <!-- ADD YOUTUBE ICON -->
<xpath expr="//div[@t-foreach='tracks']//div[hasclass('col-md-7')]//a/span[@t-field='track.name']" position="before"> <xpath expr="//div[@t-foreach='tracks']//div[hasclass('col-12')]//a/span[@t-field='track.name']" position="before">
<i t-if="track.date and track.youtube_video_url and (track.is_track_soon or track.is_track_live or track.is_youtube_replay)" <i t-if="track.date and track.youtube_video_url and (track.is_track_soon or track.is_track_live or track.is_youtube_replay)"
class="fa fa-youtube-play text-danger me-1"/> class="fa fa-youtube-play text-danger me-1"/>
</xpath> </xpath>
<xpath expr="//div[@t-foreach='tracks']//div[hasclass('col-md-7')]//t/span[@t-field='track.name']" position="before"> <xpath expr="//div[@t-foreach='tracks']//div[hasclass('col-12')]//t/span[@t-field='track.name']" position="before">
<i t-if="track.date and track.youtube_video_url and (track.is_track_soon or track.is_track_live or track.is_youtube_replay)" <i t-if="track.date and track.youtube_video_url and (track.is_track_soon or track.is_track_live or track.is_youtube_replay)"
class="fa fa-youtube-play text-danger me-1"/> class="fa fa-youtube-play text-danger me-1"/>
</xpath> </xpath>
@@ -18,7 +18,6 @@ $o-wslides-fs-side-width: 300px;
} }
.o_quiz_main { .o_quiz_main {
background-color: $o-wslides-color-bg;
.o_quiz_js_quiz { .o_quiz_js_quiz {
i.o_quiz_js_quiz_icon { i.o_quiz_js_quiz_icon {
@@ -3,7 +3,7 @@
<template id="event_leaderboard" name="Leaderboard"> <template id="event_leaderboard" name="Leaderboard">
<t t-call="website_event.layout"> <t t-call="website_event.layout">
<div t-if="visitors" class="o_wevent_theme_bg_light pt32 pb32 o_wevent_quiz_leaderboard"> <div t-if="visitors" class="pt32 pb32 o_wevent_quiz_leaderboard">
<t t-call="website_event_track_quiz.leaderboard_search_bar"/> <t t-call="website_event_track_quiz.leaderboard_search_bar"/>
<div class="container mt32"> <div class="container mt32">
<div t-if="not search" class="row mb-3"> <div t-if="not search" class="row mb-3">
@@ -13,7 +13,7 @@
</div> </div>
<table class="table table-sm"> <table class="table table-sm">
<tr t-foreach="visitors" t-as="visitor" <tr t-foreach="visitors" t-as="visitor"
t-attf-class="#{'alert-info' if visitor['visitor'] == current_visitor else 'o_wevent_theme_bg_base'} #{'o_wevent_quiz_scroll_to' if scroll_to_position and visitor['visitor'] == current_visitor else ''}"> t-attf-class="#{'alert-info' if visitor['visitor'] == current_visitor else ''} #{'o_wevent_quiz_scroll_to' if scroll_to_position and visitor['visitor'] == current_visitor else ''}">
<t t-call="website_event_track_quiz.all_visitor_card"/> <t t-call="website_event_track_quiz.all_visitor_card"/>
</tr> </tr>
</table> </table>
@@ -26,7 +26,7 @@
<t t-call="website_event_track_quiz.leaderboard_search_bar"/> <t t-call="website_event_track_quiz.leaderboard_search_bar"/>
<div class='alert alert-warning mt32'>No user found for <strong><t t-out="search"/></strong>. Try another search.</div> <div class='alert alert-warning mt32'>No user found for <strong><t t-out="search"/></strong>. Try another search.</div>
</div> </div>
<div t-if="not visitors and not search" class="vh-100 o_wevent_theme_bg_light d-flex justify-content-center align-items-center"> <div t-if="not visitors and not search" class="vh-100 d-flex justify-content-center align-items-center">
<h4 class="text-muted fw-bold">There is currently no leaderboard available</h4> <h4 class="text-muted fw-bold">There is currently no leaderboard available</h4>
</div> </div>
</t> </t>
@@ -6,7 +6,7 @@
inherit_id="website_event_track.event_track_content"> inherit_id="website_event_track.event_track_content">
<xpath expr="//div[hasclass('o_wesession_track_main_description')]" position="after"> <xpath expr="//div[hasclass('o_wesession_track_main_description')]" position="after">
<div id="we_track_quiz_container" t-if="track.quiz_id" <div id="we_track_quiz_container" t-if="track.quiz_id"
t-att-class="'o_quiz_js_quiz_container o_quiz_main border-top o_wevent_theme_bg_base px-2 pt-4 pb-4 col-12 %s' % ('' if track.is_quiz_completed else 'd-none')" t-att-class="'o_quiz_js_quiz_container o_quiz_main border-top col-12 p-3 %s' % ('' if track.is_quiz_completed else 'd-none')"
t-att-data-object-id="track.id"> t-att-data-object-id="track.id">
<h3 class="col-12">Quiz</h3> <h3 class="col-12">Quiz</h3>
<t t-call="website_event_track_quiz.quiz_content"> <t t-call="website_event_track_quiz.quiz_content">