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

Infinite scrolling and comment migration

Browse source
This commit is contained in:
cuom1999 2023-02-20 17:15:13 -06:00
parent 4b558bd656
commit 799ff5f8f8
33 changed files with 639 additions and 556 deletions
Download patch file Download diff file Expand all files Collapse all files

2
templates/actionbar/list.html
View file

@ -45,7 +45,7 @@
</span>
<span class="actionbar-block" style="justify-content: flex-end;">
<span class="actionbar-button actionbar-share" style="position: relative"
{{"share-url=" + share_url if share_url else ""}}>
{{"share-url=" + share_url if share_url else ""}} onclick="javascript:actionbar_share(this, event)">
<i class=" fa fa-share" style="font-size: large;"></i>
<span class="actionbar-text">{{_("Share")}}</span>
</span>

8
templates/actionbar/media-js.html
View file

@ -107,15 +107,15 @@
}
}
};
$(".actionbar-share").click(function(e) {
window.actionbar_share = function(element, e) {
e.stopPropagation();
link = $(this).attr("share-url") || window.location.href;
link = $(element).attr("share-url") || window.location.href;
navigator.clipboard
.writeText(link)
.then(() => {
showTooltip(this, "Copied link", 'n');
showTooltip(element, "Copied link", 'n');
});
});
};
$('.actionbar-comment').on('click', function() {
$('#comment-section').show();

109
templates/blog/content.html
View file

@ -1,55 +1,58 @@
<section class="{% if post.sticky %}sticky {% endif %}blog-box">
<div style="margin-bottom: 0.5em">
<span class="time">
{% with authors=post.authors.all() %}
{%- if authors -%}
<img src="{{gravatar(authors[0])}}" style="width: 1.5em; border-radius: 50%; margin-bottom: -0.3em">
<span class="post-authors">{{ link_users(authors) }}</span>
{%- endif -%}
{% endwith %}
&#8226;
{{ relative_time(post.publish_on, abs=_('on {time}'), rel=_('{time}')) -}}
{%- if post.sticky %} &#8226;
<i title="Sticky" class="fa fa-star fa-fw"></i>{% endif -%}
{% if post.is_organization_private and show_organization_private_icon %}
&#8226;
<span>
{% for org in post.organizations.all() %}
<span class="organization-tag" style="display: inherit;">
<a href="{{ org.get_absolute_url() }}">
<i class="fa fa-lock"></i> {{ org.name }}
</a>
</span>
{% endfor %}
{% for post in posts%}
<section class="{% if post.sticky %}sticky {% endif %}blog-box">
<div style="margin-bottom: 0.5em">
<span class="time">
{% with authors=post.authors.all() %}
{%- if authors -%}
<img src="{{gravatar(authors[0])}}" style="width: 1.5em; border-radius: 50%; margin-bottom: -0.3em">
<span class="post-authors">{{ link_users(authors) }}</span>
{%- endif -%}
{% endwith %}
&#8226;
{{ relative_time(post.publish_on, abs=_('on {time}'), rel=_('{time}')) -}}
{%- if post.sticky %} &#8226;
<i title="Sticky" class="fa fa-star fa-fw"></i>{% endif -%}
{% if post.is_organization_private and show_organization_private_icon %}
&#8226;
<span>
{% for org in post.organizations.all() %}
<span class="organization-tag" style="display: inherit;">
<a href="{{ org.get_absolute_url() }}">
<i class="fa fa-lock"></i> {{ org.name }}
</a>
</span>
{% endfor %}
</span>
{% endif %}
</span>
<span style="float: right">
<a href="{{ url('blog_post', post.id, post.slug) }}#comments" class="blog-comment-count-link">
<i class="fa fa-comments blog-comment-icon"></i>
<span class="blog-comment-count">
{{- post_comment_counts[post.id] or 0 -}}
</span>
</a>
</span>
{% endif %}
</span>
<span style="float: right">
<a href="{{ url('blog_post', post.id, post.slug) }}#comments" class="blog-comment-count-link">
<i class="fa fa-comments blog-comment-icon"></i>
<span class="blog-comment-count">
{{- post_comment_counts[post.id] or 0 -}}
</span>
</a>
</span>
</div>
<h2 class="title">
<a href="{{ url('blog_post', post.id, post.slug) }}">{{ post.title }}</a>
</h2>
<div class="blog-description">
<div class="summary content-description">
{% cache 86400 'post_summary' post.id %}
{{ post.summary|default(post.content, true)|markdown(lazy_load=True)|reference|str|safe }}
{% endcache %}
</div>
<div class="show-more"> {{_("...More")}} </div>
</div>
<div class="actionbar-box">
{% set pagevote = post.pagevote %}
{% set bookmark = post.bookmark %}
{% set hide_actionbar_comment = True %}
{% set include_hr = False %}
{% set share_url = request.build_absolute_uri(post.get_absolute_url()) %}
{% include "actionbar/list.html" %}
</div>
</section>
<h2 class="title">
<a href="{{ url('blog_post', post.id, post.slug) }}">{{ post.title }}</a>
</h2>
<div class="blog-description">
<div class="summary content-description">
{% cache 86400 'post_summary' post.id %}
{{ post.summary|default(post.content, true)|markdown(lazy_load=True)|reference|str|safe }}
{% endcache %}
</div>
<div class="show-more"> {{_("...More")}} </div>
</div>
<div class="actionbar-box">
{% set pagevote = post.pagevote %}
{% set bookmark = post.bookmark %}
{% set hide_actionbar_comment = True %}
{% set include_hr = False %}
{% set share_url = request.build_absolute_uri(post.get_absolute_url()) %}
{% include "actionbar/list.html" %}
</div>
</section>
{% endfor %}
{% include "feed/has_next.html" %}

16
templates/blog/list.html
View file

@ -20,6 +20,7 @@
{% block three_col_js %}
{% include "actionbar/media-js.html" %}
{% include "feed/feed_js.html" %}
<script type="text/javascript">
$(document).ready(function () {
$('.time-remaining').each(function () {
@ -50,24 +51,15 @@
{% block middle_content %}
{% set show_organization_private_icon=True %}
{% if page_type == 'blog' %}
{% for post in posts %}
{% include "blog/content.html" %}
{% endfor %}
{% include "blog/content.html" %}
{% elif page_type == 'ticket' %}
{% if tickets %}
{% for ticket in tickets %}
{% include "ticket/feed.html" %}
{% endfor %}
{% include "ticket/feed.html" %}
{% else %}
<h3 style="text-align: center">{{_('You have no ticket')}}</h3>
{% endif %}
{% elif page_type == 'comment' %}
{% for comment in comments %}
{% include "comments/feed.html" %}
{% endfor %}
{% endif %}
{% if page_obj.num_pages > 1 %}
<div style="margin-bottom:10px;margin-top:10px">{% include "list-pages.html" %}</div>
{% include "comments/feed.html" %}
{% endif %}
{% endblock %}

39
templates/comments/feed.html
View file

@ -1,19 +1,22 @@
<div class="blog-box">
<h3 class="problem-feed-name">
<a href="{{ comment.link }}#comment-{{ comment.id }}">
{{ page_titles[comment.page] }}
</a>
</h3>
{% with author=comment.author %}
{% if author %}
<div class="problem-feed-info-entry">
<i class="fa fa-pencil-square-o fa-fw"></i>
<span class="pi-value">{{ link_user(author) }}</span>
{% for comment in comments %}
<div class="blog-box">
<h3 class="problem-feed-name">
<a href="{{ comment.get_absolute_url() }}">
{{ comment.page_title }}
</a>
</h3>
{% with author=comment.author %}
{% if author %}
<div class="problem-feed-info-entry">
<i class="fa fa-pencil-square-o fa-fw"></i>
<span class="pi-value">{{ link_user(author) }}</span>
</div>
{% endif %}
{% endwith %}
<div class='blog-description content-description'>
{{ comment.body|markdown(lazy_load=True)|reference|str|safe }}
<div class="show-more"> {{_("...More")}} </div>
</div>
</div>
{% endif %}
{% endwith %}
<div class='blog-description content-description'>
{{ comment.body|markdown(lazy_load=True)|reference|str|safe }}
<div class="show-more"> {{_("...More")}} </div>
</div>
</div>
{% endfor %}
{% include "feed/has_next.html" %}

30
templates/feed/feed_js.html Normal file
View file

@ -0,0 +1,30 @@
<script>
window.page = {{page_obj.number}};
window.has_next_page = {{1 if page_obj.has_next() else 0}};
window.loading_page = false;
$(function() {
$(window).on("scroll", function() {
if (window.loading_page || !window.has_next_page) return;
var distanceFromBottom = $(document).height() - ($(window).scrollTop() + $(window).height());
if (distanceFromBottom < 500) {
window.loading_page = true;
var params = {
"only_content": 1,
"page": window.page + 1,
};
$.get("{{feed_content_url}}", params)
.done(function(data) {
$(".has_next").remove();
$(".middle-content").append(data);
window.loading_page = false;
window.has_next_page = parseInt($(".has_next").attr("value"));
window.page++;
MathJax.typeset($('.middle-content')[0]);
onWindowReady();
activateBlogBoxOnClick();
})
}
});
});
</script>

1
templates/feed/has_next.html Normal file
View file

@ -0,0 +1 @@
<div class="has_next" style="display: none;" value="{{1 if has_next_page else 0}}"></div>

2
templates/notification/list.html
View file

@ -29,7 +29,7 @@
</td>
<td>
{% if notification.comment %}
<a href="{{ notification.comment.link }}#comment-{{ notification.comment.id }}">{{ page_titles[notification.comment.page] }}</a>
<a href="{{ notification.comment.link }}#comment-{{ notification.comment.id }}">{{ notification.comment.page_title }}</a>
{% else %}
{% autoescape off %}
{{notification.html_link}}

8
templates/organization/home.html
View file

@ -4,6 +4,7 @@
{% block org_js %}
{% include "actionbar/media-js.html" %}
{% include "feed/feed_js.html" %}
{% endblock %}
{% block middle_title %}
@ -40,12 +41,7 @@
{% block middle_content %}
{% block before_posts %}{% endblock %}
{% if is_member or can_edit %}
{% for post in posts %}
{% include "blog/content.html" %}
{% endfor %}
{% if posts.paginator.num_pages > 1 %}
<div style="margin-bottom:10px;margin-top:10px">{% include "list-pages.html" %}</div>
{% endif %}
{% include "blog/content.html" %}
{% else %}
<div class="blog-sidebox sidebox">
<h3>{{ _('About') }}<i class="fa fa-info-circle"></i></h3>

127
templates/problem/feed.html
View file

@ -2,6 +2,9 @@
{% block left_sidebar %}
{% include "problem/left-sidebar.html" %}
{% endblock %}
{% block problem_list_js %}
{% include "feed/feed_js.html" %}
{% endblock %}
{% block middle_content %}
<div class="problem-feed-option">
@ -24,127 +27,5 @@
<li><a href="{{url('admin:judge_volunteerproblemvote_changelist')}}">{{_('View your votes')}}</a></li>
</ul>
{% endif %}
{% for problem in problems %}
<div class="blog-box">
<h3 class="problem-feed-name">
<a href="{{ url('problem_detail', problem.code) }}">
{{ problem.i18n_name }}
</a>
{% if problem.id in completed_problem_ids %}
<i class="solved-problem-color fa fa-check-circle"></i>
{% elif problem.id in attempted_problems %}
<i class="attempted-problem-color fa fa-minus-circle"></i>
{% else %}
<i class="unsolved-problem-color fa fa-minus-circle"></i>
{% endif %}
</h3>
{% with authors=problem.authors.all() %}
{% if authors %}
<div class="problem-feed-info-entry">
<i class="fa fa-pencil-square-o fa-fw"></i>
<span class="pi-value">{{ link_users(authors) }}</span>
</div>
{% endif %}
{% endwith %}
{% if show_types %}
<div class="problem-feed-types">
<i class="fa fa-tag"></i>
{% for type in problem.types_list %}
<span class="type-tag">{{ type }}</span>{% if not loop.last %}, {% endif %}
{% endfor %}, *{{problem.points | int}}
</div>
{% endif %}
<div class="blog-description">
<div class='content-description'>
{% cache 86400 'problem_html' problem.id MATH_ENGINE LANGUAGE_CODE %}
{{ problem.description|markdown(lazy_load=True)|reference|str|safe }}
{% endcache %}
{% if problem.pdf_description %}
<embed src="{{url('problem_pdf_description', problem.code)}}" width="100%" height="500" type="application/pdf"
style="margin-top: 0.5em">
{% endif %}
</div>
{% if feed_type=='volunteer' and request.user.has_perm('judge.suggest_problem_changes') %}
<br>
<a href="#" class="view-statement-src">{{ _('View source') }}</a>
<pre class="statement-src" style="display: none">{{ problem.description|str }}</pre>
<hr>
<center>
<h3>{{_('Volunteer form')}}</h3>
</center>
<br>
<button class="edit-btn" id="edit-{{problem.id}}" pid="{{problem.id}}" style="float: right">{{_('Edit')}}</button>
<form class="volunteer-form" id="form-{{problem.id}}" pid="{{problem.id}}" style="display: none;" method="POST">
<input type="submit" class="volunteer-submit-btn" id="submit-{{problem.id}}" pid="{{problem.id}}"
pcode="{{problem.code}}" style="float: right" value="{{_('Submit')}}">
<table class="table">
<thead>
<tr>
<th>
</th>
<th>
{{_('Value')}}
</th>
</tr>
</thead>
<tbody>
<tr>
<td width="30%">
<label for="knowledge_point-{{problem.id}}"><i>{{ _('Knowledge point') }}</i></label>
</td>
<td>
<input id="knowledge_point-{{problem.id}}" type="number" class="point-input" required>
</td>
</tr>
<tr>
<td width="30%">
<label for="thinking_point-{{problem.id}}"><i>{{ _('Thinking point') }}</i></label>
</td>
<td>
<input id="thinking_point-{{problem.id}}" type="number" class="point-input" required>
</td>
</tr>
<tr>
<td width="30%">
<label for="types"><i>{{ _('Problem types') }}</i></label>
</td>
<td>
<select id="volunteer-types-{{problem.id}}" name="types" multiple>
{% for type in problem_types %}
<option value="{{ type.id }}" {% if type in problem.types.all() %} selected{% endif %}>
{{ type.full_name }}
</option>
{% endfor %}
</select>
</td>
</tr>
<tr>
<td width="30%">
<label for="feedback"><i>{{ _('Feedback') }}</i></label>
</td>
<td>
<textarea id="feedback-{{problem.id}}" rows="2" style="width: 100%"
placeholder="{{_('Any additional note here')}}"></textarea>
</td>
</tr>
</tbody>
</table>
</form>
<center id="thank-{{problem.id}}" style="display: none; margin-top: 3em"></center>
{% endif %}
<div class="show-more"> {{_("...More")}} </div>
</div>
<div class="actionbar-box">
{% set pagevote = problem.pagevote %}
{% set bookmark = problem.bookmark %}
{% set hide_actionbar_comment = True %}
{% set include_hr = False %}
{% set share_url = request.build_absolute_uri(problem.get_absolute_url()) %}
{% include "actionbar/list.html" %}
</div>
</div>
{% endfor %}
{% if page_obj.num_pages > 1 %}
<div style="margin-top:10px;">{% include "list-pages.html" %}</div>
{% endif %}
{% include "problem/feed/problems.html" %}
{% endblock %}

121
templates/problem/feed/problems.html Normal file
View file

@ -0,0 +1,121 @@
{% for problem in problems %}
<div class="blog-box">
<h3 class="problem-feed-name">
<a href="{{ url('problem_detail', problem.code) }}">
{{ problem.i18n_name }}
</a>
{% if problem.id in completed_problem_ids %}
<i class="solved-problem-color fa fa-check-circle"></i>
{% elif problem.id in attempted_problems %}
<i class="attempted-problem-color fa fa-minus-circle"></i>
{% else %}
<i class="unsolved-problem-color fa fa-minus-circle"></i>
{% endif %}
</h3>
{% with authors=problem.authors.all() %}
{% if authors %}
<div class="problem-feed-info-entry">
<i class="fa fa-pencil-square-o fa-fw"></i>
<span class="pi-value">{{ link_users(authors) }}</span>
</div>
{% endif %}
{% endwith %}
{% if show_types %}
<div class="problem-feed-types">
<i class="fa fa-tag"></i>
{% for type in problem.types_list %}
<span class="type-tag">{{ type }}</span>{% if not loop.last %}, {% endif %}
{% endfor %}, *{{problem.points | int}}
</div>
{% endif %}
<div class="blog-description">
<div class='content-description'>
{% cache 86400 'problem_html' problem.id MATH_ENGINE LANGUAGE_CODE %}
{{ problem.description|markdown(lazy_load=True)|reference|str|safe }}
{% endcache %}
{% if problem.pdf_description %}
<embed src="{{url('problem_pdf_description', problem.code)}}" width="100%" height="500" type="application/pdf"
style="margin-top: 0.5em">
{% endif %}
</div>
{% if feed_type=='volunteer' and request.user.has_perm('judge.suggest_problem_changes') %}
<br>
<a href="#" class="view-statement-src">{{ _('View source') }}</a>
<pre class="statement-src" style="display: none">{{ problem.description|str }}</pre>
<hr>
<center>
<h3>{{_('Volunteer form')}}</h3>
</center>
<br>
<button class="edit-btn" id="edit-{{problem.id}}" pid="{{problem.id}}" style="float: right">{{_('Edit')}}</button>
<form class="volunteer-form" id="form-{{problem.id}}" pid="{{problem.id}}" style="display: none;" method="POST">
<input type="submit" class="volunteer-submit-btn" id="submit-{{problem.id}}" pid="{{problem.id}}"
pcode="{{problem.code}}" style="float: right" value="{{_('Submit')}}">
<table class="table">
<thead>
<tr>
<th>
</th>
<th>
{{_('Value')}}
</th>
</tr>
</thead>
<tbody>
<tr>
<td width="30%">
<label for="knowledge_point-{{problem.id}}"><i>{{ _('Knowledge point') }}</i></label>
</td>
<td>
<input id="knowledge_point-{{problem.id}}" type="number" class="point-input" required>
</td>
</tr>
<tr>
<td width="30%">
<label for="thinking_point-{{problem.id}}"><i>{{ _('Thinking point') }}</i></label>
</td>
<td>
<input id="thinking_point-{{problem.id}}" type="number" class="point-input" required>
</td>
</tr>
<tr>
<td width="30%">
<label for="types"><i>{{ _('Problem types') }}</i></label>
</td>
<td>
<select id="volunteer-types-{{problem.id}}" name="types" multiple>
{% for type in problem_types %}
<option value="{{ type.id }}" {% if type in problem.types.all() %} selected{% endif %}>
{{ type.full_name }}
</option>
{% endfor %}
</select>
</td>
</tr>
<tr>
<td width="30%">
<label for="feedback"><i>{{ _('Feedback') }}</i></label>
</td>
<td>
<textarea id="feedback-{{problem.id}}" rows="2" style="width: 100%"
placeholder="{{_('Any additional note here')}}"></textarea>
</td>
</tr>
</tbody>
</table>
</form>
<center id="thank-{{problem.id}}" style="display: none; margin-top: 3em"></center>
{% endif %}
<div class="show-more"> {{_("...More")}} </div>
</div>
<div class="actionbar-box">
{% set pagevote = problem.pagevote %}
{% set bookmark = problem.bookmark %}
{% set hide_actionbar_comment = True %}
{% set include_hr = False %}
{% set share_url = request.build_absolute_uri(problem.get_absolute_url()) %}
{% include "actionbar/list.html" %}
</div>
</div>
{% endfor %}
{% include "feed/has_next.html" %}

1
templates/problem/list-base.html
View file

@ -55,6 +55,7 @@
{% block three_col_js %}
{% include "actionbar/media-js.html" %}
{% block problem_list_js %}{% endblock %}
<script>
window.point_start = {{point_start}};
window.point_end = {{point_end}};

4
templates/three-column-content.html
View file

@ -67,12 +67,13 @@
$('.left-sidebar-item').removeClass('active');
$elem.addClass('active');
}
$(window).off("scroll");
$('.middle-right-content').html(loading_page);
$.get(url, function (data) {
var reload_content = $(data).find('.middle-right-content');
if (reload_content.length) {
window.history.pushState("", "", url);
$('html, body').animate({scrollTop: 0}, 'fast');
$('.middle-right-content').html(reload_content.first().html());
if (reload_content.hasClass("wrapper")) {
$('.middle-right-content').addClass("wrapper");
@ -86,6 +87,7 @@
activateBlogBoxOnClick();
$('.xdsoft_datetimepicker').hide();
registerNavigation();
}
else {
window.location.href = url;

53
templates/ticket/feed.html
View file

@ -1,26 +1,29 @@
<div class="blog-box">
<h3 class="problem-feed-name">
<a href="{{ ticket.linked_item.get_absolute_url() }}">
{{ ticket.linked_item|item_title }}</a>
&#183
<a href="{{ url('ticket', ticket.id) }}">
{{ ticket.title }}
</a>
</h3>
{% with author=ticket.user %}
{% if author %}
<div class="problem-feed-info-entry">
<i class="fa fa-pencil-square-o fa-fw"></i>
<span class="pi-value">{{ link_user(author) }}</span>
{% for ticket in tickets %}
<div class="blog-box">
<h3 class="problem-feed-name">
<a href="{{ ticket.linked_item.get_absolute_url() }}">
{{ ticket.linked_item|item_title }}</a>
&#183
<a href="{{ url('ticket', ticket.id) }}">
{{ ticket.title }}
</a>
</h3>
{% with author=ticket.user %}
{% if author %}
<div class="problem-feed-info-entry">
<i class="fa fa-pencil-square-o fa-fw"></i>
<span class="pi-value">{{ link_user(author) }}</span>
</div>
{% endif %}
{% endwith %}
<div class="problem-feed-types">
<i class="fa fa-tag"></i>
{{link_user(ticket.messages.last().user)}} {{_(' replied')}}
</div>
<div class='blog-description content-description'>
{{ ticket.messages.last().body|markdown(lazy_load=True)|reference|str|safe }}
<div class="show-more"> {{_("...More")}} </div>
</div>
</div>
{% endif %}
{% endwith %}
<div class="problem-feed-types">
<i class="fa fa-tag"></i>
{{link_user(ticket.messages.last().user)}} {{_(' replied')}}
</div>
<div class='blog-description content-description'>
{{ ticket.messages.last().body|markdown(lazy_load=True)|reference|str|safe }}
<div class="show-more"> {{_("...More")}} </div>
</div>
</div>
{% endfor %}
{% include "feed/has_next.html" %}