lkva/NDOJ
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Design organization list page and add organization search (#119)

Browse source
This commit is contained in:
Phuoc Anh Kha Le 2024-06-18 22:11:36 -05:00 • committed by GitHub
parent 02ba30a29e
commit 326b3d5dd3
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
20 changed files with 553 additions and 286 deletions
Download patch file Download diff file Expand all files Collapse all files

41
templates/contest/list.html
View file

@ -33,47 +33,6 @@
{% block three_col_js %}
<script type="text/javascript">
function changeTabParameter(newTab) {
const url = new URL(window.location);
const searchParams = new URLSearchParams(url.search);
searchParams.set('tab', newTab);
searchParams.delete('page');
url.search = searchParams.toString();
return url.href;
}
function submitFormWithParams($form, method) {
const currentUrl = new URL(window.location.href);
const searchParams = new URLSearchParams(currentUrl.search);
const formData = $form.serialize();
const params = new URLSearchParams(formData);
if (searchParams.has('tab')) {
params.set('tab', searchParams.get('tab'));
}
const fullUrl = currentUrl.pathname + '?' + params.toString();
if (method === "GET") {
window.location.href = fullUrl;
}
else {
var $formToSubmit = $('<form>')
.attr('action', fullUrl)
.attr('method', 'POST')
.appendTo('body');
$formToSubmit.append($('<input>').attr({
type: 'hidden',
name: 'csrfmiddlewaretoken',
value: $.cookie('csrftoken')
}));
$formToSubmit.submit();
}
}
$(document).ready(function () {
$('#active-url').attr('href', changeTabParameter('active'));
$('#current-url').attr('href', changeTabParameter('current'));

2
templates/course/left_sidebar.html
View file

@ -2,7 +2,7 @@
{{ make_tab_item('home', 'fa fa-home', course.get_absolute_url(), _('Home')) }}
{% if is_editable %}
{{ make_tab_item('edit_lesson', 'fa fa-edit', url('edit_course_lessons', course.slug), _('Edit lessons')) }}
{{ make_tab_item('grades', 'fa fa-check-square-o', url('course_grades', course.slug), _('Grades')) }}
{{ make_tab_item('grades', 'fa fa-check-square', url('course_grades', course.slug), _('Grades')) }}
{% endif %}
{% if perms.judge.change_course %}
{{ make_tab_item('admin', 'fa fa-edit', url('admin:judge_course_change', course.id), _('Admin'), force_new_page=True) }}

126
templates/organization/list.html
View file

@ -1,50 +1,110 @@
{% extends "two-column-content.html" %}
{% extends "three-column-content.html" %}
{% block two_col_media %}
<style>
.organization-container {
border-bottom: none;
}
.org-logo {
height: 2em;
width: 2em;
margin-right: 1em;
margin-left: 0.5em;
}
.toggle {
cursor: pointer;
}
</style>
{% block three_col_js %}
<script type="text/javascript">
$(document).ready(function () {
$('#mine-tab').attr('href', changeTabParameter('mine'));
$('#public-tab').attr('href', changeTabParameter('public'));
$('#private-tab').attr('href', changeTabParameter('private'));
var $form = $('form#filter-form');
$('#go').click(function() {
submitFormWithParams($form, "GET");
});
$form.on('keypress', function(e) {
if (e.key === 'Enter') {
e.preventDefault();
}
});
$('#search-organization').keypress(function (e) {
if (e.keyCode === 13) {
$('#go').click();
}
});
$('#order').select2();
});
</script>
{% block contest_list_js %}{% endblock %}
{% endblock %}
{% block title_ruler %}{% endblock %}
{% block left_sidebar %}
{% include "user/user-left-sidebar.html" %}
<div class="left-sidebar">
{% if request.user.is_authenticated %}
{{ make_tab_item('mine', 'fa fa-user', request.path + '?tab=mine', _('Mine')) }}
{% endif %}
{{ make_tab_item('public', 'fa fa-globe', request.path + '?tab=public', _('Public')) }}
{{ make_tab_item('private', 'fa fa-lock', request.path + '?tab=private', _('Private')) }}
{% if request.user.is_superuser %}
{{ make_tab_item('import', 'fa fa-table', url('import_users'), _('Import'), force_new_page=True) }}
{% endif %}
</div>
{% endblock %}
{% macro org_list(title, queryset) %}
{% block right_sidebar %}
<div class="right-sidebar">
{% include "organization/search-form.html" %}
</div>
{% endblock %}
{% macro org_list(queryset, tab) %}
{% if queryset %}
<h3 style="padding-bottom: 1em" class="toggle open"><i class="fa fa-chevron-right fa-fw"></i> {{title}} ({{queryset.count()}})</h3>
<div class="organization-container toggled">
<div class="organization-container">
{% for org in queryset %}
<a href="{{ org.get_absolute_url() }}" class="organization-row">
<div class="organization-card" style="cursor: pointer;" onclick="location.href='{{ org.get_absolute_url() }}';">
{% if org.logo_override_image %}
<img class="user-img org-logo" loading="lazy" src="{{ org.logo_override_image }}">
<img class="org-logo" loading="lazy" src="{{ org.logo_override_image }}">
{% else %}
<img class="org-logo" loading="lazy" src="{{ static('icons/icon.svg') }}" onerror="{{static('icons/logo.svg')}}">
<img class="org-logo" loading="lazy" src="{{ static('icons/icon.svg') }}" onerror="this.onerror=null;this.src='{{ static('icons/logo.svg') }}';">
{% endif %}
<span style="margin-right: auto">{{ org.name }}</span>
<span style="font-weight: normal"><i>{{ org.member_count }} {{_('members')}}</i></span>
</a>
<div class="org-details">
<span style="font-weight: bold;">{{ org.name }}</span>
<span style="margin-bottom: 0"><i>{{ org.member_count }} {{ _('members') }}</i></span>
</div>
{% if tab == 'mine' %}
<div class="background-royalblue button small">{{ _('View') }}</div>
{% elif tab == 'public' %}
<form method="post" action="{{ url('join_organization', org.id, org.slug) }}">
{% csrf_token %}
<input type="submit" style="width: 100%" class="background-royalblue button small" value="{{ _('Join') }}">
</form>
{% else %}
<a href="{{ url('request_organization', org.id, org.slug) }}" style="font-size: 15px;" class="background-royalblue button small">{{ _('Request membership') }}</a>
{% endif %}
</div>
{% endfor %}
</div>
{% if page_obj and page_obj.num_pages > 1 %}
{% include "list-pages.html" %}
{% endif %}
{% endif %}
{% endmacro %}
{% block middle_content %}
<a style="float: right" class="button small" href="{{url('organization_add')}}">{{_("Create group")}}</a>
{{ org_list(_('My groups'), my_organizations) }}
{{ org_list(_('Open groups'), open_organizations) }}
{{ org_list(_('Private groups'), private_organizations) }}
{% endblock %}
{% if current_tab == 'mine' %}
{% if organizations %}
{{ org_list(organizations, 'mine') }}
{% else %}
<i> {{ _('You have not joined any organization yet.') }} </i>
{% endif %}
{% endif %}
{% if current_tab == 'public' %}
{% if organizations %}
{{ org_list(organizations, 'public') }}
{% else %}
<i> {{ _('There is no public organization.') }} </i>
{% endif %}
{% endif %}
{% if current_tab == 'private' %}
{% if organizations %}
{{ org_list(organizations, 'private') }}
{% else %}
<i> {{ _('There is no private organization.') }} </i>
{% endif %}
{% endif %}
{% endblock %}

24
templates/organization/search-form.html Normal file
View file

@ -0,0 +1,24 @@
<div class="sidebox">
<h3 class="colored-text"><i class="fa fa-search"></i>{{ _('Organization search') }}</h3>
<div class="sidebox-content">
<form id="filter-form" method="GET">
<input id="search-organization" type="text" name="organization" value="{{ organization_query or '' }}"
placeholder="{{ _('Search organizations...') }}">
<div class="filter-form-group">
<label for="order" class="bold-text margin-label">{{ _('Order by') }}</label>
<select id="order" name="order" style="width: 100%">
<option value="">---</option>
{% for value, name in all_sort_options %}
<option value="{{value}}"{% if selected_order == value%} selected{% endif %}>
{{ name }}
</option>
{% endfor %}
</select>
</div>
<div class="form-submit-group">
<a class="button small" href="{{url('organization_add')}}">{{_("Create group")}}</a>
<a id="go" class="button small">{{ _('Go') }}</a>
</div>
</form>
</div>
</div>

2
templates/problem/feed.html
View file

@ -7,7 +7,7 @@
{% endblock %}
{% block middle_content %}
<div class="tabs tabs-no-flex" style="width: 90%;margin-left: auto;margin-right: auto;">
<div class="tabs tabs-no-flex">
<ul>
<li class="{{'active' if feed_type=='for_you'}}">
<a href="{{url('problem_feed')}}">{{_('FOR YOU')}}</a>

2
templates/submission/row.html
View file

@ -58,7 +58,7 @@
{% if not hide_contest_in_row and submission.contest_object_id %}
<a href="{{ url('contest_view', submission.contest_object.key) }}"
class="submission-contest">
<i title="{{ submission.contest_object.name }}" class="fa fa-dot-circle-o"></i>
<i title="{{ submission.contest_object.name }}" class="far fa-dot-circle"></i>
</a>
{% endif %}
</div>

6
templates/ticket/list.html
View file

@ -1,7 +1,7 @@
{% extends "base.html" %}
{% block media %}
<style>
#ticket-list .fa-check-circle-o {
#ticket-list .fa-check-circle {
color: #00a900;
}
@ -131,10 +131,10 @@
if ($row.length) {
var $status = $row.find('td').first().find('i');
if (ticket.open) {
$status.removeClass('fa-check-circle-o').addClass('fa-exclamation-circle');
$status.removeClass('fa-check-circle').addClass('fa-exclamation-circle');
notify('ticket', '{{ _('Reopened: ') }}' + ticket.title);
} else {
$status.removeClass('fa-exclamation-circle').addClass('fa-check-circle-o');
$status.removeClass('fa-exclamation-circle').addClass('fa-check-circle');
notify('ticket', '{{ _('Closed: ') }}' + ticket.title);
}
}

2
templates/ticket/row.html
View file

@ -1,5 +1,5 @@
<tr id="ticket-{{ ticket.id }}">
<td><i class="fa {% if ticket.is_open %}fa-exclamation-circle{% else %}fa-check-circle-o{% endif %}"></i></td>
<td><i class="fa {% if ticket.is_open %}fa-exclamation-circle{% else %}fa-check-circle{% endif %}"></i></td>
<td>{{ ticket.id }}</td>
<td><a href="{{ url('ticket', ticket.id) }}">{{ ticket.title }}</a></td>
<td>{{ link_user(ticket.user) }}</td>

6
templates/ticket/ticket.html
View file

@ -13,9 +13,9 @@
function update_ticket_state(open) {
if (open)
$status.removeClass('fa-check-circle-o').addClass('fa-exclamation-circle');
$status.removeClass('fa-check-circle').addClass('fa-exclamation-circle');
else
$status.removeClass('fa-exclamation-circle').addClass('fa-check-circle-o');
$status.removeClass('fa-exclamation-circle').addClass('fa-check-circle');
$('.close-ticket').toggle(open);
$('.open-ticket').toggle(!open);
}
@ -144,7 +144,7 @@
{% block content_title %}
<span class="status">
<i class="fa {% if ticket.is_open %}fa-exclamation-circle{% else %}fa-check-circle-o{% endif %}"></i>
<i class="fa {% if ticket.is_open %}fa-exclamation-circle{% else %}fa-check-circle{% endif %}"></i>
</span>
<span class="title">{{ ticket.title }}</span><small>#{{ ticket.id }}</small>
{% endblock %}