Skip to content
Snippets Groups Projects
Commit 8ecff655 authored by sri-odoo's avatar sri-odoo Committed by David Beguin
Browse files

[IMP] website_profile: merge ranks/badges pages

Merge ranks & badges pages. This commit adapt the final page
layout, controllers and templates.

Added the badge category filter. If used in url parameter, hide ranks and show
only the badge part of the page, filtered on matching badge_category.

Task ID : 1941250
PR #31567

Co-authored-by: @stefanorigano
Co-authored-by: @dbeguin
parent 150d7730
No related branches found
No related tags found
No related merge requests found
...@@ -161,7 +161,7 @@ ...@@ -161,7 +161,7 @@
t-attf-class="nav-link #{searches.get('tags') and 'active' or ''}">Tags</a> t-attf-class="nav-link #{searches.get('tags') and 'active' or ''}">Tags</a>
</li> </li>
<li class="nav-item"> <li class="nav-item">
<a t-attf-href="/profile/badge?category=forum" <a t-attf-href="/profile/ranks_badges?badge_category=forum"
t-attf-class="nav-link #{searches.get('badges') and 'active' or ''}">Badges</a> t-attf-class="nav-link #{searches.get('badges') and 'active' or ''}">Badges</a>
</li> </li>
<li class="nav-item" t-if="user.karma >= forum.karma_moderate"> <li class="nav-item" t-if="user.karma >= forum.karma_moderate">
......
...@@ -163,40 +163,36 @@ class WebsiteProfile(http.Controller): ...@@ -163,40 +163,36 @@ class WebsiteProfile(http.Controller):
return werkzeug.utils.redirect("/profile/user/%d?%s" % (user.id, kwargs['url_param'])) return werkzeug.utils.redirect("/profile/user/%d?%s" % (user.id, kwargs['url_param']))
else: else:
return werkzeug.utils.redirect("/profile/user/%d" % user.id) return werkzeug.utils.redirect("/profile/user/%d" % user.id)
# Ranks
# ---------------------------------------------------
@http.route('/profile/ranks', type='http', auth="public", website=True)
def ranks(self, **kwargs):
Rank = request.env['gamification.karma.rank']
ranks = Rank.sudo().search([])
ranks = ranks.sorted(key=lambda b: b.karma_min)
values = {
'ranks': ranks,
'user': request.env.user,
}
return request.render("website_profile.rank_main", values)
# Badges # Ranks and Badges
# --------------------------------------------------- # ---------------------------------------------------
def _prepare_badges_domain(self, **kwargs): def _prepare_badges_domain(self, **kwargs):
""" """
Hook for other modules to restrict the badges showed on profile page, depending of the context Hook for other modules to restrict the badges showed on profile page, depending of the context
""" """
domain = [('website_published', '=', True)] domain = [('website_published', '=', True)]
if 'category' in kwargs: if 'badge_category' in kwargs:
domain = expression.AND([[('challenge_ids.category', '=', kwargs.get('category'))], domain]) domain = expression.AND([[('challenge_ids.category', '=', kwargs.get('badge_category'))], domain])
return domain return domain
@http.route('/profile/badge', type='http', auth="public", website=True) @http.route('/profile/ranks_badges', type='http', auth="public", website=True)
def badges(self, **kwargs): def view_ranks_badges(self, **kwargs):
ranks = []
if 'badge_category' not in kwargs:
Rank = request.env['gamification.karma.rank']
ranks = Rank.sudo().search([], order='karma_min DESC')
Badge = request.env['gamification.badge'] Badge = request.env['gamification.badge']
badges = Badge.sudo().search(self._prepare_badges_domain(**kwargs)) badges = Badge.sudo().search(self._prepare_badges_domain(**kwargs))
badges = sorted(badges, key=lambda b: b.stat_count_distinct, reverse=True) badges = sorted(badges, key=lambda b: b.stat_count_distinct, reverse=True)
values = self._prepare_user_values(searches={'badges': True}) values = self._prepare_user_values(searches={'badges': True})
values.update({ values.update({
'ranks': ranks,
'badges': badges, 'badges': badges,
'user': request.env.user,
}) })
return request.render("website_profile.badge_main", values) return request.render("website_profile.rank_badge_main", values)
# All Users Page # All Users Page
# --------------------------------------------------- # ---------------------------------------------------
......
...@@ -179,7 +179,7 @@ ...@@ -179,7 +179,7 @@
<div t-if="user.rank_id" class="d-flex align-items-center"> <div t-if="user.rank_id" class="d-flex align-items-center">
<small class="font-weight-bold mr-2">Rank:</small> <small class="font-weight-bold mr-2">Rank:</small>
<img t-attf-src="/web/image/gamification.karma.rank/#{user.rank_id.id}/image_small" height="16" alt="" class="mr-1"/> <img t-attf-src="/web/image/gamification.karma.rank/#{user.rank_id.id}/image_small" height="16" alt="" class="mr-1"/>
<a href="/profile/ranks" t-field="user.rank_id"/> <a href="/profile/ranks_badges" t-field="user.rank_id"/>
</div> </div>
<button class="btn btn-sm d-md-none bg-white border" type="button" data-toggle="collapse" data-target="#o_wprofile_sidebar_collapse" aria-expanded="false" aria-controls="o_wprofile_sidebar_collapse">More info</button> <button class="btn btn-sm d-md-none bg-white border" type="button" data-toggle="collapse" data-target="#o_wprofile_sidebar_collapse" aria-expanded="false" aria-controls="o_wprofile_sidebar_collapse">More info</button>
</div> </div>
...@@ -288,18 +288,18 @@ ...@@ -288,18 +288,18 @@
<p class="text-muted">No badge yet</p> <p class="text-muted">No badge yet</p>
</div> </div>
<div class="text-right"> <div class="text-right">
<a t-if="not user.badge_ids and badge_category" t-attf-href="/profile/badge?category=#{badge_category}"><i class="fa fa-arrow-right"/> Check available badges</a> <a t-if="not user.badge_ids and badge_category" t-attf-href="/profile/ranks_badges?badge_category=#{badge_category}"><i class="fa fa-arrow-right"/> Check available badges</a>
<a t-else="" href="/profile/badge" class="btn btn-link btn-sm"><i class="fa fa-arrow-right mr-1"/>Check all available badges</a> <a t-else="" href="/profile/ranks_badges" class="btn btn-link btn-sm"><i class="fa fa-arrow-right mr-1"/>Check all available badges</a>
</div> </div>
</template> </template>
<!-- About Rank Page --> <!-- About Ranks and badges Page -->
<template id="rank_main" name="Ranks Page"> <template id="rank_badge_main" name="Ranks Page">
<t t-call="website.layout"> <t t-call="website.layout">
<div class="container mb32 mt48"> <div class="container mb32 mt48">
<div class="row justify-content-between"> <div class="row justify-content-between" t-if="ranks">
<div class="col-12 col-md-6"> <div class="col-12 col-md-6 col-lg-5">
<h1>Ranks &amp; Badges</h1> <h1>Ranks</h1>
<p class="lead mb-4">Keep learning with <t t-esc="user.company_id.name"/>. Collect points on the forum or on the eLearning platform. Those points will make you reach new ranks.</p> <p class="lead mb-4">Keep learning with <t t-esc="user.company_id.name"/>. Collect points on the forum or on the eLearning platform. Those points will make you reach new ranks.</p>
<h5>How do I earn badges?</h5> <h5>How do I earn badges?</h5>
<p>When you finish a course or reach milestones, you're awarded badges.</p> <p>When you finish a course or reach milestones, you're awarded badges.</p>
...@@ -307,64 +307,55 @@ ...@@ -307,64 +307,55 @@
<p>You can score more points by answering quizzes at the end of each course content. Points can also be earned on the forum. Follow this link to the guidelines of the forum.</p> <p>You can score more points by answering quizzes at the end of each course content. Points can also be earned on the forum. Follow this link to the guidelines of the forum.</p>
</div> </div>
<div class="col-12 col-md-5 col-lg-4"> <div class="col-12 col-md-5 col-lg-4">
<t t-call="website_profile.rank_content"/> <div class="card">
</div> <div class="card-header border-bottom-0">Ranks</div>
</div> <ul class="list-group list-group-flush">
</div> <t t-foreach="ranks" t-as="rank">
</t> <li t-attf-class="list-group-item">
</template> <div class="media align-items-center">
<img height="40" t-attf-src="/web/image/gamification.karma.rank/#{rank.id}/image" class="mr-2" alt="Rank badge"/>
<template id="rank_content" name="Rank Page content"> <div class="media-body">
<h5 class="text-muted my-2">Ranks</h5> <h5 class="mt-0 mb-0" t-field="rank.name"/>
<div class="row flex-column"> <span class="badge badge-success"><span t-field="rank.karma_min"/></span> point<span t-if="rank.karma_min">s</span>
<t t-foreach="ranks" t-as="rank"> </div>
<t t-set="order_inverse" t-value="6 - rank.id"/> </div>
</li>
<div t-attf-class="col order-#{order_inverse}"> </t>
<div class="media align-items-center py-2 border-top"> </ul>
<img height="50" t-attf-src="/web/image/gamification.karma.rank/#{rank.id}/image" class="mr-2" alt="Rank badge"/>
<div class="media-body">
<h5 class="mt-0 mb-0" t-field="rank.name"/>
<span class="badge badge-success"><span t-field="rank.karma_min"/></span> point<span t-if="rank.karma_min">s</span>
</div> </div>
</div> </div>
</div> </div>
</t> <t t-call="website_profile.badge_content"/>
</div>
</template>
<!-- About Badge Page -->
<template id="badge_main" name="Badges Page">
<t t-call="website.layout">
<div class="container mb32 mt48">
<t t-call="website_profile.badge_content">
</t>
</div> </div>
</t> </t>
</template> </template>
<template id="badge_content" name="Badges Page content"> <template id="badge_content" name="Badges Page content">
<h1>Badges</h1> <div class="row">
<p class="lead"> <div class="col-12">
Besides gaining reputation with your questions and answers, <h1 class="mt-4 mt-lg-2">Badges</h1>
you receive badges for being especially helpful.<br/>Badges <p class="lead">
appear on your profile page, and your posts. Besides gaining reputation with your questions and answers,
</p> you receive badges for being especially helpful.<br class="d-none d-lg-inline-block"/>Badges
<table class="table table-sm mt32 mb64"> appear on your profile page, and your posts.
<tr t-foreach="badges" t-as="badge"> </p>
<td class="align-middle"> </div>
<img t-attf-src="/website_profile/static/src/img/badge_#{badge.level}.svg" class="my-1" style="height:2.5em" alt=""/> </div>
<h6 t-field="badge.name" class="d-inline my-0"/> <table class="table table-sm mb64">
</td> <tr t-foreach="badges" t-as="badge">
<td class="align-middle d-none d-md-table-cell"> <td class="align-middle">
<b t-esc="badge.stat_count_distinct"/> <img t-attf-src="/website_profile/static/src/img/badge_#{badge.level}.svg" class="my-1" style="height:2.5em" t-att-alt="badge.level"/>
<i class="text-muted"> awarded users</i> <h6 t-field="badge.name" class="d-inline my-0"/>
</td> </td>
<td class="align-middle"> <td class="align-middle d-none d-md-table-cell">
<span t-field="badge.description"/> <b t-esc="badge.stat_count_distinct"/>
</td> <i class="text-muted"> awarded users</i>
</tr> </td>
</table> <td class="align-middle">
<span t-field="badge.description"/>
</td>
</tr>
</table>
</template> </template>
<!--Private profile--> <!--Private profile-->
......
...@@ -360,7 +360,7 @@ ...@@ -360,7 +360,7 @@
<div t-if="user.rank_id" class="d-flex align-items-center"> <div t-if="user.rank_id" class="d-flex align-items-center">
<span class="font-weight-bold text-muted mr-2">Current rank:</span> <span class="font-weight-bold text-muted mr-2">Current rank:</span>
<img t-attf-src="/web/image/gamification.karma.rank/#{user.rank_id.id}/image_small" height="16" alt="" class="mr-1"/> <img t-attf-src="/web/image/gamification.karma.rank/#{user.rank_id.id}/image_small" height="16" alt="" class="mr-1"/>
<a href="/profile/ranks" t-field="user.rank_id"/> <a href="/profile/ranks_badges" t-field="user.rank_id"/>
</div> </div>
<t t-if="user.next_rank_id"> <t t-if="user.next_rank_id">
<div class="font-weight-bold text-muted mt-1">Next rank:</div> <div class="font-weight-bold text-muted mt-1">Next rank:</div>
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment