From 85428340c9c3421e6e7c7b111105b182615226d4 Mon Sep 17 00:00:00 2001
From: Jorran de Wit <jorrandewit@outlook.com>
Date: Fri, 29 Sep 2017 21:59:35 +0200
Subject: [PATCH] Dynamic loading and sticky cards
---
scipost/static/scipost/assets/css/_pool.scss | 42 ++++++++++----
scipost/static/scipost/assets/js/scripts.js | 44 +++++++++++---
.../pool/required_actions_tooltip.html | 2 +-
.../submissions/pool/submission_details.html | 58 +++++++++++++++++++
.../submissions/pool/submission_li.html | 6 +-
.../submissions/_remark_add_form.html | 16 +++--
.../templates/submissions/pool/pool.html | 8 +--
submissions/views.py | 33 ++++++-----
8 files changed, 161 insertions(+), 48 deletions(-)
create mode 100644 submissions/templates/partials/submissions/pool/submission_details.html
diff --git a/scipost/static/scipost/assets/css/_pool.scss b/scipost/static/scipost/assets/css/_pool.scss
index e5e62bc3d..32ba99f0e 100644
--- a/scipost/static/scipost/assets/css/_pool.scss
+++ b/scipost/static/scipost/assets/css/_pool.scss
@@ -2,19 +2,37 @@ $pool-icons-width: 40px;
$pool-flex-width: calc(100% - 40px);
-.pool .pool-item {
- .icons {
- padding-left: 10px;
- padding-right: 10px;
- position: relative;
- min-height: 1px;
- flex: 0 0 $pool-icons-width;
- max-width: $pool-icons-width;
+.pool {
+ .pool-item {
+ .icons {
+ padding-left: 10px;
+ padding-right: 10px;
+ position: relative;
+ min-height: 1px;
+ flex: 0 0 $pool-icons-width;
+ max-width: $pool-icons-width;
+ }
+
+ .item {
+ flex: 0 0 $pool-flex-width;
+ width: $pool-flex-width;
+ max-width: none;
+ }
+ }
+
+ .card.submission-detail {
+ position: sticky;
+ top: 15px;
+ }
+
+ #details .loading {
+ position: sticky;
+ top: 15px;
+ padding: 5rem 0 3rem 0;
+ text-align: center;
}
- .item {
- flex: 0 0 $pool-flex-width;
- width: $pool-flex-width;
- max-width: none;
+ li.active {
+ background-color: $gray-100;
}
}
diff --git a/scipost/static/scipost/assets/js/scripts.js b/scipost/static/scipost/assets/js/scripts.js
index d39b0efcd..fcc6ddc4c 100644
--- a/scipost/static/scipost/assets/js/scripts.js
+++ b/scipost/static/scipost/assets/js/scripts.js
@@ -20,6 +20,19 @@ var getUrlParameter = function getUrlParameter(sParam) {
}
};
+function init_page() {
+ // Show right tab if url contains `tab` GET request
+ var tab = getUrlParameter('tab')
+ if (tab) {
+ $('a[href="#' + tab + '"][data-toggle="tab"]').tab('show');
+ }
+
+ // Auto-submit hook for general form elements
+ $("form .auto-submit input, form.auto-submit input, form.auto-submit select").on('change', function(){
+ $(this).parents('form').submit()
+ });
+}
+
$(function(){
// Remove all alerts in screen automatically after 15sec.
setTimeout(function() {hide_all_alerts()}, 15000);
@@ -29,20 +42,33 @@ $(function(){
$($(this).attr('data-target')).toggle();
});
- // Show right tab if url contains `tab` GET request
- var tab = getUrlParameter('tab')
- if (tab) {
- $('a[href="#' + tab + '"][data-toggle="tab"]').tab('show');
- }
-
// Change `tab` GET parameter for page-reload
$('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
var tab_name = e.target.hash.substring(1)
window.history.replaceState({}, null, '?tab=' + tab_name);
});
- // Auto-submit hook for general form elements
- $("form .auto-submit input, form.auto-submit input, form.auto-submit select").on('change', function(){
- $(this).parents('form').submit()
+ init_page();
+
+ // Simple simple Angular-like loading!
+ $('a[data-toggle="dynamic"]').on('click', function(event) {
+ event.preventDefault();
+ var self = this,
+ url = $(this).attr('href'),
+ target = $(this).attr('data-target');
+ // console.log('click', url, target);
+
+ $(target).html('<div class="loading"><i class="fa fa-circle-o-notch fa-spin fa-3x fa-fw"></i></div>');
+
+ $.get(url + '?json=1').done(function(data) {
+ // console.log('done', data);
+ $(target).html(data);
+ $('[data-target="active-list"]')
+ .find('> li')
+ .removeClass('active')
+ $(self).parents('[data-target="active-list"] > li')
+ .addClass('active');
+ init_page();
+ });
});
});
diff --git a/submissions/templates/partials/submissions/pool/required_actions_tooltip.html b/submissions/templates/partials/submissions/pool/required_actions_tooltip.html
index fd34f9c6d..1e9ce2a72 100644
--- a/submissions/templates/partials/submissions/pool/required_actions_tooltip.html
+++ b/submissions/templates/partials/submissions/pool/required_actions_tooltip.html
@@ -1,5 +1,5 @@
{% if submission.cycle.has_required_actions and submission.cycle.get_required_actions %}
- <i class="fa fa-exclamation-circle text-danger" data-toggle="tooltip" data-html="true" title="
+ <i class="fa fa-exclamation-circle {{ classes }}" data-toggle="tooltip" data-html="true" title="
Required Actions:
<ul class='mb-0 pl-3 text-left'>
{% for action in submission.cycle.get_required_actions %}
diff --git a/submissions/templates/partials/submissions/pool/submission_details.html b/submissions/templates/partials/submissions/pool/submission_details.html
new file mode 100644
index 000000000..7d8014f77
--- /dev/null
+++ b/submissions/templates/partials/submissions/pool/submission_details.html
@@ -0,0 +1,58 @@
+{% load guardian_tags %}
+{% load scipost_extras %}
+{% load submissions_extras %}
+
+
+<div class="card submission-detail">
+ {% include 'submissions/_submission_card_fellow_content.html' with submission=submission %}
+
+ <div class="card-body">
+ {% if submission.remarks.all %}
+ <h4>Remarks on this submission:</h4>
+ <ul>
+ {% for rem in submission.remarks.all %}
+ {% include 'scipost/_remark_li.html' with remark=rem %}
+ {% endfor %}
+ </ul>
+ {% endif %}
+
+ {% if remark_form %}
+ {% include 'submissions/_remark_add_form.html' with submission=submission form=remark_form auto_show=1 %}
+ {% endif %}
+
+ {% get_obj_perms request.user for submission as "sub_perms" %}
+ {% if "can_take_editorial_actions" in sub_perms or is_ECAdmin %}
+ {% include 'submissions/_required_actions_block.html' with submission=submission %}
+ <h4>
+ <a href="{% url 'submissions:editorial_page' submission.arxiv_identifier_w_vn_nr %}">Go to this Submission's Editorial Page</a>
+ </h4>
+ {% endif %}
+
+ {% if perms.scipost.can_assign_submissions %}
+ {% if submission.editorial_assignments.exists %}
+ <h4>EIC Assignment requests:</h4>
+ <ul>
+ {% for assignment in submission.editorial_assignments.all %}
+ {% include 'submissions/_assignment_info.html' with assignment=assignment %}
+ {% endfor %}
+ </ul>
+ {% endif %}
+ {% if submission.editor_in_charge == None %}
+ <h4>Actions:</h4>
+ <ul>
+ <li><a href="{% url 'submissions:assign_submission' submission.arxiv_identifier_w_vn_nr %}">Send a new assignment request</a></li>
+ <li><a href="{% url 'submissions:assignment_failed' submission.arxiv_identifier_w_vn_nr %}">Close pre-screening: failure to find EIC</a></li>
+ </ul>
+ {% endif %}
+ {% endif %}
+
+ {% if is_ECAdmin %}
+ <h4>
+ <a href="{% url 'submissions:communication' arxiv_identifier_w_vn_nr=submission.arxiv_identifier_w_vn_nr comtype='StoE' %}">Send a communication to the Editor-in-charge</a>
+ </h4>
+ {% if submission.status == 'accepted' %}
+ <h4>After proofs have been accepted, you can <a href="{% url 'journals:initiate_publication' %}">initiate the publication process</a> (leads to the validation page)</h4>
+ {% endif %}
+ {% endif %}
+ </div>
+</div>
diff --git a/submissions/templates/partials/submissions/pool/submission_li.html b/submissions/templates/partials/submissions/pool/submission_li.html
index a5d71a453..73bc7fa51 100644
--- a/submissions/templates/partials/submissions/pool/submission_li.html
+++ b/submissions/templates/partials/submissions/pool/submission_li.html
@@ -4,8 +4,6 @@
{% if submission.status == 'unassigned' %}
<i class="fa fa-exclamation mt-1 px-1 text-danger" data-toggle="tooltip" data-html="true" title="You can volunteer to become Editor-in-charge"></i>
- {% else %}
- {% include 'partials/submissions/pool/required_actions_tooltip.html' with submission=submission %}
{% endif %}
</div>
<div class="item col-auto">
@@ -15,14 +13,14 @@
</p>
<p class="card-text mb-3">
- <a href="{% url 'submissions:pool' submission.arxiv_identifier_w_vn_nr %}">See details in the pool</a>
+ <a href="{% url 'submissions:pool' submission.arxiv_identifier_w_vn_nr %}" data-toggle="dynamic" data-target="#details">See details</a>
{% if submission.editor_in_charge == request.user.contributor %}
· <a href="{% url 'submissions:editorial_page' submission.arxiv_identifier_w_vn_nr %}">Go directly to editorial page</a>
{% endif %}
</p>
{% if submission.cycle.has_required_actions and submission.cycle.get_required_actions %}
- <p class="card-text text-danger">This Submission contains required actions.</p>
+ <p class="card-text bg-danger text-white p-1 px-2">This Submission contains required actions, <a href="{% url 'submissions:pool' submission.arxiv_identifier_w_vn_nr %}" class="text-white" data-toggle="dynamic" data-target="#details">click to see details.</a> {% include 'partials/submissions/pool/required_actions_tooltip.html' with submission=submission classes='text-white' %}</p>
{% endif %}
{% if submission.status == 'unassigned' %}
diff --git a/submissions/templates/submissions/_remark_add_form.html b/submissions/templates/submissions/_remark_add_form.html
index 1541145e2..f2872b2a1 100644
--- a/submissions/templates/submissions/_remark_add_form.html
+++ b/submissions/templates/submissions/_remark_add_form.html
@@ -16,11 +16,19 @@ $(document).ready(function(){
});
</script>
-<button class="btn btn-secondary mb-2" data-toggle="toggle" data-target="#remarkForm{{ submission.id }}" id="remarkButton{{ submission.id }}">Add a remark on this Submission</button>
-<div class="submitRemarkForm pb-2" id="remarkForm{{ submission.id }}" style="display:none;">
- <form action="{% url 'submissions:add_remark' submission.arxiv_identifier_w_vn_nr %}" method="post">
+{% if auto_show %}
+ <form action="{% url 'submissions:add_remark' submission.arxiv_identifier_w_vn_nr %}" method="post" class="pb-2">
{% csrf_token %}
{{ form|bootstrap:'0,12' }}
<input class="btn btn-secondary" type="submit" value="Submit" />
</form>
-</div>
+{% else %}
+ <button class="btn btn-secondary mb-2" data-toggle="toggle" data-target="#remarkForm{{ submission.id }}" id="remarkButton{{ submission.id }}">Add a remark on this Submission</button>
+ <div class="submitRemarkForm pb-2" id="remarkForm{{ submission.id }}" style="display:none;">
+ <form action="{% url 'submissions:add_remark' submission.arxiv_identifier_w_vn_nr %}" method="post">
+ {% csrf_token %}
+ {{ form|bootstrap:'0,12' }}
+ <input class="btn btn-secondary" type="submit" value="Submit" />
+ </form>
+ </div>
+{% endif %}
diff --git a/submissions/templates/submissions/pool/pool.html b/submissions/templates/submissions/pool/pool.html
index 8572b5c2c..19c631f12 100644
--- a/submissions/templates/submissions/pool/pool.html
+++ b/submissions/templates/submissions/pool/pool.html
@@ -61,10 +61,10 @@
</form>
{% endif %}
- <ul class="list-unstyled">
+ <ul class="list-unstyled" data-target="active-list">
<!-- Submissions list -->
{% for sub in submissions_in_pool %}
- <li class="p-2{% if sub == submission %} bg-light{% endif %}">
+ <li class="p-2{% if sub == submission %} active{% endif %}">
{% if sub == submission %}
{% include 'partials/submissions/pool/submission_li.html' with submission=sub is_current=1 %}
{% else %}
@@ -79,9 +79,9 @@
</ul>
</div><!-- End page content -->
- <div class="col-md-5">
+ <div class="col-md-5" id="details">
{% if submission %}
- {% include 'submissions/_submission_card_in_pool.html' with submission=submission remark_form=remark_form is_ECAdmin=is_ECAdmin user=request.user %}
+ {% include 'partials/submissions/pool/submission_details.html' with submission=submission remark_form=remark_form is_ECAdmin=is_ECAdmin user=request.user %}
{% else %}
<h3><em>Click on a submission to see its summary and actions</em></h3>
{% endif %}
diff --git a/submissions/views.py b/submissions/views.py
index 5ead9d428..5cf5ae5c0 100644
--- a/submissions/views.py
+++ b/submissions/views.py
@@ -337,11 +337,11 @@ def pool(request, arxiv_identifier_w_vn_nr=None):
.prefetch_related('referee_invitations', 'remarks', 'comments'))
recommendations_undergoing_voting = (EICRecommendation.objects
.get_for_user_in_pool(request.user)
- .filter(submission__status__in=['put_to_EC_voting']))
+ .filter(submission__status='put_to_EC_voting'))
recommendations_to_prepare_for_voting = (EICRecommendation.objects
.get_for_user_in_pool(request.user)
.filter(
- submission__status__in=['voting_in_preparation']))
+ submission__status='voting_in_preparation'))
contributor = Contributor.objects.get(user=request.user)
assignments_to_consider = EditorialAssignment.objects.open().filter(to=contributor)
consider_assignment_form = ConsiderAssignmentForm()
@@ -354,15 +354,18 @@ def pool(request, arxiv_identifier_w_vn_nr=None):
.exclude(submission__status__in=SUBMISSION_STATUS_VOTING_DEPRECATED))
rec_vote_form = RecommendationVoteForm()
remark_form = RemarkForm()
- context = {'submissions_in_pool': submissions_in_pool,
- 'submission_status': SUBMISSION_STATUS,
- 'recommendations_undergoing_voting': recommendations_undergoing_voting,
- 'recommendations_to_prepare_for_voting': recommendations_to_prepare_for_voting,
- 'assignments_to_consider': assignments_to_consider,
- 'consider_assignment_form': consider_assignment_form,
- 'recs_to_vote_on': recs_to_vote_on,
- 'rec_vote_form': rec_vote_form,
- 'remark_form': remark_form, }
+ context = {
+ 'submissions_in_pool': submissions_in_pool,
+ 'submission_status': SUBMISSION_STATUS,
+ 'recommendations_undergoing_voting': recommendations_undergoing_voting,
+ 'recommendations_to_prepare_for_voting': recommendations_to_prepare_for_voting,
+ 'assignments_to_consider': assignments_to_consider,
+ 'consider_assignment_form': consider_assignment_form,
+ 'recs_to_vote_on': recs_to_vote_on,
+ 'rec_vote_form': rec_vote_form,
+ 'remark_form': remark_form,
+ 'submission': None
+ }
# The following is in test phase. Update if test is done
# --
@@ -380,10 +383,12 @@ def pool(request, arxiv_identifier_w_vn_nr=None):
context['submission'] = context['submissions_in_pool'].get(
arxiv_identifier_w_vn_nr=arxiv_identifier_w_vn_nr)
except Submission.DoesNotExist:
- context['submission'] = None
+ pass
# Temporary test logic: only testers see the new Pool
- if is_tester(request.user) and not request.GET.get('test'):
+ if context['submission'] and request.GET.get('json'):
+ template = 'partials/submissions/pool/submission_details.html'
+ elif is_tester(request.user) and not request.GET.get('test'):
template = 'submissions/pool/pool.html'
else:
template = 'submissions/pool.html'
@@ -431,7 +436,7 @@ def add_remark(request, arxiv_identifier_w_vn_nr):
messages.success(request, 'Your remark has succesfully been posted')
else:
messages.warning(request, 'The form was invalidly filled.')
- return redirect(reverse('submissions:pool'))
+ return redirect(reverse('submissions:pool', args=(arxiv_identifier_w_vn_nr,)))
@login_required
--
GitLab