From c2f5c96306bbdc0ebdc8450dc322ea4af395b666 Mon Sep 17 00:00:00 2001 From: kvgarg Date: Fri, 14 Jun 2019 17:03:49 +0530 Subject: [PATCH] meta-review/: Redesign the webpage The redesigned web-page provides a nice UI/UX design to the web-page with "search" feature. Closes https://github.com/coala/community/issues/259 --- community/urls.py | 4 +- meta_review/urls.py | 4 +- meta_review/views.py | 29 ++++-- static/css/meta-reviewers.css | 96 +++++++++++++++++ static/js/contributors.js | 17 ++- templates/meta_review.html | 190 +++++++++++++++++++++++++--------- 6 files changed, 274 insertions(+), 66 deletions(-) create mode 100644 static/css/meta-reviewers.css diff --git a/community/urls.py b/community/urls.py index f01d1c3f..a171c0e8 100644 --- a/community/urls.py +++ b/community/urls.py @@ -12,7 +12,7 @@ from ci_build.view_log import BuildLogsView from data.views import ContributorsListView from gamification.views import index as gamification_index -from meta_review.views import index as meta_review_index +from meta_review.views import ContributorsMetaReview from inactive_issues.inactive_issues_scraper import inactive_issues_json from openhub.views import index as openhub_index from model.views import index as model_index @@ -103,7 +103,7 @@ def get_organization(): distill_file='contributors/index.html', ), distill_url( - r'meta-review/$', meta_review_index, + r'meta-review/$', ContributorsMetaReview.as_view(), name='meta_review_data', distill_func=get_index, distill_file='meta-review/index.html', diff --git a/meta_review/urls.py b/meta_review/urls.py index a3780aa2..6189e683 100644 --- a/meta_review/urls.py +++ b/meta_review/urls.py @@ -1,7 +1,7 @@ from django.conf.urls import url -from . import views +from .views import ContributorsMetaReview urlpatterns = [ - url(r'^$', views.index, name='index'), + url(r'^$', ContributorsMetaReview.as_view(), name='index'), ] diff --git a/meta_review/views.py b/meta_review/views.py index 45e68cfd..7e30a539 100644 --- a/meta_review/views.py +++ b/meta_review/views.py @@ -1,15 +1,22 @@ from meta_review.models import Participant -from django.shortcuts import render from django.db.models import Q +from django.views.generic import TemplateView +from community.views import get_header_and_footer -def index(request): - participants = Participant.objects.all().exclude( - Q(pos_in=0), - Q(neg_in=0), - Q(pos_out=0), - Q(neg_out=0), - Q(offset=0) - ) - args = {'participants': participants} - return render(request, 'meta_review.html', args) + +class ContributorsMetaReview(TemplateView): + template_name = 'meta_review.html' + + def get_context_data(self, **kwargs): + context = super().get_context_data(**kwargs) + context = get_header_and_footer(context) + participants = Participant.objects.all().exclude( + Q(pos_in=0), + Q(neg_in=0), + Q(pos_out=0), + Q(neg_out=0), + Q(offset=0) + ) + context['contributors_meta_review_details'] = participants + return context diff --git a/static/css/meta-reviewers.css b/static/css/meta-reviewers.css new file mode 100644 index 00000000..f1b810b3 --- /dev/null +++ b/static/css/meta-reviewers.css @@ -0,0 +1,96 @@ +.contributor-details-part-1 { + padding-right: 5px; +} + +.contributor-details-part-2 { + padding-left: 5px; + border-left: 1px #37474f solid; +} + +.column-flex { + display: flex; + flex-direction: column; +} + +.received-reactions div { + padding-left: 14px; +} + +.meta-reviewer { + background-color: #c7da99; + width: 580px; + border: 4px #6c9a55 solid; +} + +.metareviewer-details { + display: flex; + width: 66%; +} + +.meta-reviewer-image { + position: relative; + text-align: center; + color: white; +} + +.meta-reviewer-image img{ + border-radius: 30px; + margin: 20px; + width: 150px; +} + +.top-right { + position: absolute; + top: 30px; + right: 25px; + width: 30px; + border-radius: 100%; + background-color: #37474f; +} + +@media only screen and (max-width: 706px){ + .contributors-cards { + margin: 50px 0; + } + .contributor-card { + margin: 0 10px 20px; + min-height: 230px; + } + + .metareviewer-details { + width: 60%; + } + + .meta-reviewer-image { + width: 40%; + } + + .meta-reviewer-image img { + max-width: 80%; + margin: 20px 10px; + } + + @media only screen and (max-width:419px){ + + .metareviewer-details { + width: 100%; + } + + .meta-reviewer { + margin: 0 10px 20px 10px; + } + + .meta-reviewer-image { + width: 100%; + } + + .contributor-details-part-1 { + padding: 0 0 10px 10px; + } + + .top-right { + right: 105px; + } + + } +} diff --git a/static/js/contributors.js b/static/js/contributors.js index a6164024..beaa9d64 100644 --- a/static/js/contributors.js +++ b/static/js/contributors.js @@ -13,7 +13,13 @@ $(document).ready(function(){ var row_id = result_td.id; var login = row_id.replace('td-', ''); $('.contributor-card').css('display', 'none'); - $('[login=' + login +']').css('display', 'block'); + var contrib_card = $('[login=' + login +']'); + if(contrib_card.hasClass('meta-reviewer')){ + contrib_card.css('display', 'flex'); + } + else{ + contrib_card.css('display', 'block'); + } $('.search-results').css('display', 'none'); }); } @@ -57,8 +63,15 @@ $(document).ready(function(){ }); close_icon.on('click', function(){ - $('.contributor-card').css('display', 'block'); + var all_contrib_cards = $('.contributor-card'); + if(all_contrib_cards.hasClass('meta-reviewer')){ + all_contrib_cards.css('display', 'flex'); + } + else { + all_contrib_cards.css('display', 'block'); + } close_icon.css('display', 'none'); search_input.val(null); + $('.search-results').css('display', 'none'); }); }); diff --git a/templates/meta_review.html b/templates/meta_review.html index a6215de4..956c9935 100644 --- a/templates/meta_review.html +++ b/templates/meta_review.html @@ -1,53 +1,145 @@ - - - - - - - - - Meta-review Score Ranking List - - -

Details of meta-review score

- - - + + Negative point offset: + {{ contributor.offset|floatformat:2 }} + + + + + {% endfor %}{# for contributor in contributors_meta_review_details #} + +{% endblock %}