pengyuthon/odoo_source
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[FIX] website_event_meet_quiz: redesign leaderboard in community page

Browse Source 
Make it looking nice in mobile (and desktop). Also remove some unnecessary
complexity in DOM.

Display leaderboard even if only one or two visitors had points. It is
better for onboarding purpose.

Display 'You' only in if the visitor is you AND if visitor.name is empty.
This allows to display 'You' instead of 'Website Visitor #123' but still
display your complete name if you are logged in or if you have a registration.

LINKS

Coming from internal feedback while deploying online support
Task ID-2314778
PR #55634

X-original-commit: d767c998f2d269ec0f23a6e96874b47f78fd87f8
This commit is contained in:
David Beguin
2020-08-14 12:06:11 +00:00
committed by Thibault Delavallée
parent ed89738ba6
commit 48a5ea290a
2 changed files with 29 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files
addons/website_event_meet_quiz/views/event_meet_templates.xml
+25 -30
View File
@@ -8,39 +8,34 @@
</template>
<template id="community_leaderboard_small" name="Small Leaderboard">
<div class="row">
<div class="col">
<div class="w-100 d-flex justify-content-between align-items-end o_page_header">
<h1 class="m-0">Leaderboard</h1>
<a t-attf-href="#{'/event/%s/community/leaderboard' % (slug(event))}">View all</a>
</div>
</div>
</div>
<div class="row">
<div class="col">
<t t-foreach="top3_visitors" t-as="visitor">
<t t-call="website_event_meet_quiz.visitor_quiz_points_card"/>
</t>
</div>
<div class="w-100 d-flex justify-content-between align-items-end o_page_header">
<h1 class="m-0">Leaderboard</h1>
<a t-attf-href="#{'/event/%s/community/leaderboard' % (slug(event))}">View all</a>
</div>
<t t-call="website_event_meet_quiz.visitor_quiz_points_card"/>
</template>
<template id='visitor_quiz_points_card' name="User Quick Quiz Points Card">
<div class="d-flex mb-3 align-items-center justify-content-between">
<div class="d-flex align-items-center">
<b class="mr-2 text-muted" t-esc="visitor['position']"/>
<img class="rounded-circle float-left"
style="width: 32px; height: 32px; object-fit: cover;"
t-att-src="image_data_uri(visitor['visitor'].partner_image) if visitor['visitor'].partner_image else '/web/static/src/img/user_placeholder.jpg'"
t-att-alt="visitor['visitor'].display_name"/>
<div style="line-height:1.3">
<span class="font-weight-bold" t-esc="visitor['visitor'].display_name"/>
</div>
</div>
<div class="d-flex align-items-center">
<span><t t-esc="visitor['points']"/> Points</span>
</div>
</div>
<template id='visitor_quiz_points_card' name="Small Leaderboard: top3">
<table class="w-100">
<tr t-foreach="top3_visitors" t-as="visitor">
<td><div class="d-flex align-items-center mb-3">
<b class="mr-2 text-muted" t-esc="visitor['position']"/>
<img class="rounded-circle float-left"
style="width: 32px; height: 32px; object-fit: cover;"
t-att-src="image_data_uri(visitor['visitor'].partner_image) if visitor['visitor'].partner_image else '/web/static/src/img/user_placeholder.jpg'"
t-att-alt="visitor['visitor'].display_name"/>
<div class="o_we_leaderboard_name">
<span t-if="visitor['visitor'] == current_visitor and not visitor['visitor'].name" class="font-weight-bold">You</span>
<span t-else="" class="font-weight-bold" t-esc="visitor['visitor'].display_name"/>
</div>
</div></td>
<td class="text-right">
<div class="mb-3">
<span class="text-nowrap"><t t-esc="visitor['points']"/> xp</span>
</div>
</td>
</tr>
</table>
</template>
</odoo>
addons/website_event_track_quiz/views/event_leaderboard_templates.xml
+4 -2
View File
@@ -61,7 +61,8 @@
t-att-src="image_data_uri(visitor['visitor'].partner_image) if visitor['visitor'].partner_image else '/web/static/src/img/user_placeholder.jpg'"/>
<img class="position-absolute" t-attf-src="/website_profile/static/src/img/rank_#{visitor['position']}.svg" alt="User rank" style="bottom: 0; right: -10px"/>
</div>
<h3 class="mt-2 mb-0" t-esc="visitor['visitor'].display_name"></h3>
<h3 t-if="visitor['visitor'] == current_visitor and not visitor['visitor'].name" class="mt-2 mb-0">You</h3>
<h3 t-else="" class="mt-2 mb-0" t-esc="visitor['visitor'].display_name"/>
</div>
<div class="row mx-0 o_wprofile_top3_card_footer text-nowrap">
<div class="col py-3"><b t-esc="visitor['points']"/> <span class="text-muted">Points</span></div>
@@ -80,7 +81,8 @@
t-att-src="image_data_uri(visitor['visitor'].partner_image) if visitor['visitor'].partner_image else '/web/static/src/img/user_placeholder.jpg'"/>
</td>
<td class="align-middle w-md-75">
<span class="font-weight-bold" t-esc="visitor['visitor'].display_name"/><br/>
<span t-if="visitor['visitor'] == current_visitor and not visitor['visitor'].name" class="font-weight-bold">You</span>
<span t-else="" class="font-weight-bold" t-esc="visitor['visitor'].display_name"/><br/>
</td>
<td class="align-middle font-weight-bold text-right text-nowrap">
<b t-esc="visitor['points']"/> <span class="text-muted small font-weight-bold">Points</span>