From 7f4f8632d93d2ec185645ddb38c5d84f99deb354 Mon Sep 17 00:00:00 2001
From: Jorran de Wit <jorrandewit@outlook.com>
Date: Tue, 1 May 2018 17:23:24 +0200
Subject: [PATCH] Undone 2.
---
journals/templates/journals/journals.html | 40 ++--
.../templates/journals/publication_list.html | 8 +-
news/templates/news/news_card_content.html | 17 +-
.../news/news_card_content_for_api.html | 18 +-
.../news/news_card_content_short.html | 2 +-
news/templates/news/newsitem_list.html | 17 +-
.../scipost/assets/config/preconfig.scss | 3 +-
.../static/scipost/assets/css/_homepage.scss | 196 +++++++++---------
scipost/static/scipost/assets/css/_modal.scss | 5 +
.../static/scipost/assets/css/_navbar.scss | 76 +++++--
.../scipost/assets/css/_notifications.scss | 139 ++++++++++---
.../static/scipost/assets/js/newsticker.js | 2 +-
.../static/scipost/assets/js/notifications.js | 168 +++------------
.../scipost/notification_center_modal.html | 69 ++++++
scipost/templates/scipost/bare_base.html | 2 +
scipost/templates/scipost/layout_2_col.html | 57 ++---
scipost/templates/scipost/navbar.html | 16 +-
submissions/models.py | 1 +
18 files changed, 467 insertions(+), 369 deletions(-)
create mode 100644 scipost/templates/partials/scipost/notification_center_modal.html
diff --git a/journals/templates/journals/journals.html b/journals/templates/journals/journals.html
index 2dad808af..dde2c967c 100644
--- a/journals/templates/journals/journals.html
+++ b/journals/templates/journals/journals.html
@@ -3,30 +3,25 @@
{% block pagetitle %}: Journals{% endblock pagetitle %}
{% block breadcrumb %}
- <div class="container-outside header">
+ <nav class="navbar navbar-expand-lg sub-nav">
<div class="container">
- <h1 class="highlight">SciPost Physics Journals</h1>
- </div>
- </div>
+ <ul class="navbar-nav mr-auto">
+ <li class="nav-item">
+ <span class="nav-link">Our Journals:</span>
+ </li>
- <div class="container-outside sub-nav lighter">
- <div class="container">
- <nav class="navbar sub-nav navbar-expand-lg">
- <ul class="navbar-nav">
- <li class="nav-item"><span class="nav-link">Our Journals:</span></li>
- {% for journal in journals %}
- <li class="nav-item">
- {% if journal.active %}
- <a href="{{journal.get_absolute_url}}" class="nav-link">{{journal}}</a>
- {% else %}
- <a href="{% url 'journal:about' journal.name %}" class="nav-link">{{journal}}</a>
- {% endif %}
- </li>
- {% endfor %}
- </div>
- </nav>
+ {% for journal in journals %}
+ <li class="nav-item">
+ {% if journal.active %}
+ <a href="{{ journal.get_absolute_url }}" class="nav-link">{{journal}}</a>
+ {% else %}
+ <a href="{% url 'journal:about' journal.name %}" class="nav-link">{{journal}}</a>
+ {% endif %}
+ </li>
+ {% endfor %}
+ </ul>
</div>
- </div>
+ </nav>
{% endblock %}
@@ -35,7 +30,8 @@
<div class="row">
<div class="col-12">
- <h2>View and comment on current <a href="{% url 'submissions:submissions' %}">Submissions</a> <small>(login required)</small></h2>
+ <h1 class="highlight">SciPost Physics Journals</h1>
+ <h3>View and comment on current <a href="{% url 'submissions:submissions' %}">Submissions</a> <small>(login required)</small></h3>
</div>
</div>
diff --git a/journals/templates/journals/publication_list.html b/journals/templates/journals/publication_list.html
index 86e25fbd6..e94c892a9 100644
--- a/journals/templates/journals/publication_list.html
+++ b/journals/templates/journals/publication_list.html
@@ -12,8 +12,8 @@
{% block page_header %}<h1 class="highlight">Recent SciPost Publications</h1>{% endblock page_header %}
{% block breadcrumb_items %}
- <a href="{% url 'journals:journals' %}" class="breadcrumb-item">Journals</a>
- <span class="breadcrumb-item">Publications</span>
+ <li class="breadcrumb-item"><a href="{% url 'journals:journals' %}">Journals</a></li>
+ <li class="breadcrumb-item active">Publications</li>
{% endblock %}
{% block content %}
@@ -22,7 +22,7 @@
<div class="col-12">
<ul class="list-unstyled">
{% for publication in object_list %}
- <li>
+ <li class="my-3">
<div class="card card-gray card-publication">
{% include 'journals/_publication_card_content.html' with publication=publication %}
</div>
@@ -45,7 +45,7 @@
{% block sidebar %}
<div class="row">
<div class="col-12">
- <h2 class="mb-2">Recent Issues</h2>
+ <h2 class="mt-4">Recent Issues</h2>
<div class="mb-1 pl-2">
<a href="?{% url_replace issue='' page='' subject='' %}" class="{% active_get_request 'issue' '' %}">All Issues</a>
</div>
diff --git a/news/templates/news/news_card_content.html b/news/templates/news/news_card_content.html
index 134db502b..2c800a983 100644
--- a/news/templates/news/news_card_content.html
+++ b/news/templates/news/news_card_content.html
@@ -1,11 +1,8 @@
-<div class="card-body news-item" id="news_{{news.id}}">
- <h2 class="card-title">{{news.headline}}</h2>
- <div>
- <div class="text-muted date">{{news.date|date:'j F Y'}}</div>
- <div class="pb-3">{{news.blurb|safe}}</div>
-
- {% if news.followup_link %}
- <a href="{{news.followup_link}}">{{news.followup_link_text}}</a>
- {% endif %}
- </div>
+<div class="p-3 mb-3 bg-light news-item scipost-bar" id="news_{{news.id}}">
+ <h3 class="title">{{news.headline}}</h3>
+ <h5 class="sub-title">{{news.date|date:'j F Y'}}</h5>
+ <p class="mb-0">{{ news.blurb|safe }}</p>
+ {% if news.followup_link %}
+ <a class="mt-3 d-inline-block" href="{{news.followup_link}}">{{news.followup_link_text}}</a>
+ {% endif %}
</div>
diff --git a/news/templates/news/news_card_content_for_api.html b/news/templates/news/news_card_content_for_api.html
index 5815a30d3..e97c86549 100644
--- a/news/templates/news/news_card_content_for_api.html
+++ b/news/templates/news/news_card_content_for_api.html
@@ -1,12 +1,8 @@
-<div class="card-body px-0 py-2 news-item">
- <h3 class="card-title mb-0 pb-0">{{headline}}</h3>
- <div>
- <h5 class="text-muted mb-2">{{date}}</h5>
- <div>
- {{blurb|truncatechars_html:180|safe}}
-
- <br>
- <a href="{% url 'news:news' %}#news_{{id}}" class="my-1 d-inline-block">Read more</a>
- </div>
- </div>
+<div class="news-item">
+ <h3 class="title">{{headline}}</h3>
+ <h5 class="sub-title">{{date}}</h5>
+ <p>
+ {{blurb|truncatechars_html:180|safe}}
+ </p>
+ <a href="{% url 'news:news' %}#news_{{id}}" class="my-1 d-inline-block">Read more</a>
</div>
diff --git a/news/templates/news/news_card_content_short.html b/news/templates/news/news_card_content_short.html
index 2eb038709..3e4b9696b 100644
--- a/news/templates/news/news_card_content_short.html
+++ b/news/templates/news/news_card_content_short.html
@@ -1,4 +1,4 @@
-<div class=" news-item">
+<div class="news-item">
<h3 class="title">{{news.headline}}</h3>
<h5 class="sub-title">{{news.date|date:'j F Y'}}</h5>
<p>
diff --git a/news/templates/news/newsitem_list.html b/news/templates/news/newsitem_list.html
index 7f7e7100f..fe96e590f 100644
--- a/news/templates/news/newsitem_list.html
+++ b/news/templates/news/newsitem_list.html
@@ -5,6 +5,19 @@
{% load request_filters %}
{% load staticfiles %}
+
+{% block breadcrumb %}
+ <nav class="breadcrumb-nav">
+ <div class="container">
+ <ol class="breadcrumb">
+ <li class="breadcrumb-item"><a href="{% url 'scipost:index' %}" >Home</a></li>
+ <li class="breadcrumb-item active" aria-current="page">News</span>
+ </ol>
+ </div>
+ </nav>
+{% endblock %}
+
+
{% block content %}
<div class="row">
@@ -29,9 +42,7 @@
{% endif %}
{% for item in object_list %}
- <div class="card card-gray card-news">
- {% include 'news/news_card_content.html' with news=item %}
- </div>
+ {% include 'news/news_card_content.html' with news=item %}
{% empty %}
<div>No news found.</div>
{% endfor %}
diff --git a/scipost/static/scipost/assets/config/preconfig.scss b/scipost/static/scipost/assets/config/preconfig.scss
index f47809c27..86585837e 100644
--- a/scipost/static/scipost/assets/config/preconfig.scss
+++ b/scipost/static/scipost/assets/config/preconfig.scss
@@ -48,6 +48,7 @@ $body-bg: #f3f3f3; // $gray-100
$body-color: $scipost-darkblue;
+
// Alerts
//
$alert-border-radius: $base-border-radius;
@@ -66,7 +67,7 @@ $card-gray-border-color: $scipost-lightblue $gray-100 $gray-100;
// breadcrumb
//
-$breadcrumb-bg: $gray-100;
+$breadcrumb-bg: #f1f1f1;
$breadcrumb-active-color: $scipost-darkblue;
$breadcrumb-divider-color: $scipost-orange;
diff --git a/scipost/static/scipost/assets/css/_homepage.scss b/scipost/static/scipost/assets/css/_homepage.scss
index 4c78a1719..85479306e 100644
--- a/scipost/static/scipost/assets/css/_homepage.scss
+++ b/scipost/static/scipost/assets/css/_homepage.scss
@@ -1,63 +1,63 @@
-.has-sidebar {
- .content-wrapper {
- display: flex;
- flex-wrap: wrap;
- position: relative;
- }
-
- .sidebar,
- .main-panel {
- padding-top: 0;
- overflow: auto;
- max-height: 100%;
- height: 100%;
- -webkit-overflow-scrolling: touch;
- }
-
- .main-panel {
- position: relative;
- z-index: 2;
- float: left;
- min-height: 100%;
- }
-
- .sidebar {
- width: 100%;
- padding-left: 1rem;
- padding-right: 1rem;
- .card {
- margin-bottom: 1rem;
- }
- }
-
- &.sidebar-left {
- .main-panel {
- order: 2;
- }
- .sidebar {
- order: 1;
- }
- }
-}
-
-.sidebar {
- margin-bottom: 2rem;
-
- a {
- &.active {
- font-weight: 700;
- }
- }
-}
-
-.container.header {
- padding-top: 0.5rem;
- margin-bottom: 1.5rem;
-
- .highlight {
- background-color: $white;
- }
-}
+// .has-sidebar {
+// .content-wrapper {
+// display: flex;
+// flex-wrap: wrap;
+// position: relative;
+// }
+//
+// .sidebar,
+// .main-panel {
+// padding-top: 0;
+// overflow: auto;
+// max-height: 100%;
+// height: 100%;
+// -webkit-overflow-scrolling: touch;
+// }
+//
+// .main-panel {
+// position: relative;
+// z-index: 2;
+// float: left;
+// min-height: 100%;
+// }
+//
+// .sidebar {
+// width: 100%;
+// padding-left: 1rem;
+// padding-right: 1rem;
+// .card {
+// margin-bottom: 1rem;
+// }
+// }
+//
+// &.sidebar-left {
+// .main-panel {
+// order: 2;
+// }
+// .sidebar {
+// order: 1;
+// }
+// }
+// }
+//
+// .sidebar {
+// margin-bottom: 2rem;
+//
+// a {
+// &.active {
+// font-weight: 700;
+// }
+// }
+// }
+//
+// .container.header {
+// padding-top: 0.5rem;
+// margin-bottom: 1.5rem;
+//
+// .highlight {
+// background-color: $white;
+// }
+// }
.granting-institutions > a {
width: 25%;
@@ -80,41 +80,41 @@
}
}
}
-
-
-@media (min-width: 768px) {
- .has-sidebar {
- .main-panel {
- width: calc(100% - 350px);
- padding-left: 0;
- padding-right: 1rem;
- }
- .sidebar {
- width: 350px;
- padding-right: 0;
- }
-
- &.sidebar-left {
- .main-panel {
- padding-right: 0;
- padding-left: 1rem;
- }
- .sidebar {
- padding-right: 1rem;
- padding-left: 0;
- }
- }
- }
-}
-
-@media (min-width: 1280px) {
- .has-sidebar {
- .main-panel {
- width: calc(100% - 400px);
- }
-
- .sidebar {
- width: 400px;
- }
- }
-}
+//
+//
+// @media (min-width: 768px) {
+// .has-sidebar {
+// .main-panel {
+// width: calc(100% - 350px);
+// padding-left: 0;
+// padding-right: 1rem;
+// }
+// .sidebar {
+// width: 350px;
+// padding-right: 0;
+// }
+//
+// &.sidebar-left {
+// .main-panel {
+// padding-right: 0;
+// padding-left: 1rem;
+// }
+// .sidebar {
+// padding-right: 1rem;
+// padding-left: 0;
+// }
+// }
+// }
+// }
+//
+// @media (min-width: 1280px) {
+// .has-sidebar {
+// .main-panel {
+// width: calc(100% - 400px);
+// }
+//
+// .sidebar {
+// width: 400px;
+// }
+// }
+// }
diff --git a/scipost/static/scipost/assets/css/_modal.scss b/scipost/static/scipost/assets/css/_modal.scss
index 499e54911..ba982c80b 100644
--- a/scipost/static/scipost/assets/css/_modal.scss
+++ b/scipost/static/scipost/assets/css/_modal.scss
@@ -1,3 +1,8 @@
+.modal-header {
+ padding-top: 0.5rem;
+ padding-bottom: 0.5rem;
+}
+
.modal-content {
border-radius: 1.4px;
}
diff --git a/scipost/static/scipost/assets/css/_navbar.scss b/scipost/static/scipost/assets/css/_navbar.scss
index 51e89a584..9bc935092 100644
--- a/scipost/static/scipost/assets/css/_navbar.scss
+++ b/scipost/static/scipost/assets/css/_navbar.scss
@@ -29,6 +29,11 @@
// }
// }
+.navbar {
+ padding-left: 1rem;
+ padding-right: 1rem;
+}
+
.main-nav {
background-color: $scipost-lightblue;
@@ -51,23 +56,25 @@
background-color: $scipost-lightblue;
}
- .full-height-bar {
- z-index: 1;
- position: absolute;
- top: 0;
- height: 100%;
- width: 100%;
- left: 0;
-
- > .container {
+ @media (min-width: 992px) {
+ .full-height-bar {
+ z-index: 1;
+ position: absolute;
+ top: 0;
height: 100%;
- }
+ width: 100%;
+ left: 0;
- .form-wrapper {
- float: right;
- height: 100%;
- padding: $navbar-padding-y 0.5rem;
- background: #343a40;
+ > .container {
+ height: 100%;
+ }
+
+ .form-wrapper {
+ float: right;
+ height: 100%;
+ padding: $navbar-padding-y 0.5rem;
+ background: #343a40;
+ }
}
}
@@ -104,6 +111,45 @@
.sub-nav {
background-color: $breadcrumb-bg;
box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, .05);
+ border-bottom: 1px solid #ddd;
+}
+
+.navbar-toggler {
+ margin: 4px 0;
+ outline: none !important;
+}
+
+.navbar-toggler-icon {
+ display: inline-block;
+ cursor: pointer;
+ margin: -3px 0 3px 3px;
+
+ .bar1,
+ .bar2,
+ .bar3 {
+ width: 100%;
+ height: 5px;
+ border-radius: 1px;
+ background-color: $scipost-lightestblue;
+ margin: 5px 0;
+ transition: 0.2s;
+ }
+
+ &.change {
+ .bar1 {
+ -webkit-transform: rotate(-45deg) translate(-9px, 6px);
+ transform: rotate(-45deg) translate(-9px, 6px);
+ }
+
+ .bar2 {
+ opacity: 0;
+ }
+
+ .bar3 {
+ -webkit-transform: rotate(45deg) translate(-8px, -8px);
+ transform: rotate(45deg) translate(-8px, -5px);
+ }
+ }
}
// .container-outside {
diff --git a/scipost/static/scipost/assets/css/_notifications.scss b/scipost/static/scipost/assets/css/_notifications.scss
index 3607c064c..b4fb8aa1c 100644
--- a/scipost/static/scipost/assets/css/_notifications.scss
+++ b/scipost/static/scipost/assets/css/_notifications.scss
@@ -140,30 +140,30 @@
}
}
- .actions {
- // display: none;
- opacity: 0.0;
- transition: opacity 0.1s;
- width: 20px;
- height: 100%;
- padding-left: 1rem;
- padding-right: 0.5rem;
- padding-bottom: 0.1rem;
-
- .fa[data-toggle="tooltip"] {
- font-size: 1em;
- }
-
- a:hover {
- .fa-circle-o:before {
- content: '\f111';
- }
-
- .fa-circle:before {
- content: '\f10c';
- }
- }
- }
+ // .actions {
+ // // display: none;
+ // opacity: 0.0;
+ // transition: opacity 0.1s;
+ // width: 20px;
+ // height: 100%;
+ // padding-left: 1rem;
+ // padding-right: 0.5rem;
+ // padding-bottom: 0.1rem;
+ //
+ // .fa[data-toggle="tooltip"] {
+ // font-size: 1em;
+ // }
+ //
+ // a:hover {
+ // .fa-circle-o:before {
+ // content: '\f111';
+ // }
+ //
+ // .fa-circle:before {
+ // content: '\f10c';
+ // }
+ // }
+ // }
.links .item {
@@ -193,3 +193,94 @@
}
}
}
+
+.notification-center {
+ .links li {
+ padding: 0.25rem 0;
+ }
+}
+
+.notifications {
+ .item {
+ padding: 0.4rem 0.25rem 0.4rem 0.75rem;
+ border-radius: 0;
+ border-top: 1px solid $white;
+ border-left: 0;
+ border-right: 0;
+ margin-bottom: 5px;
+ flex-direction: row;
+ justify-content: space-between;
+ display: flex;
+ position: relative;
+
+ &:hover {
+ background-color: #f4f4f4 !important;
+ }
+
+ &[href] {
+ cursor: pointer;
+ }
+
+ &:before {
+ content: '';
+ height: 100%;
+ width: 5px;
+ display: block;
+ position: absolute;
+ left: 0;
+ top: 0;
+ background: $scipost-darkblue;
+ }
+
+ > div {
+ white-space: normal;
+ }
+
+ &:last-child {
+ border-bottom: 0;
+ }
+
+ .show-unread,
+ .show-read {
+ display: none;
+ }
+
+ &.unread {
+ background-color: rgba(114, 141, 199, 0.05);
+
+ .show-unread {
+ display: inherit;
+ }
+ }
+ &.read .show-read {
+ display: inherit;
+ }
+
+ .actions {
+ opacity: 0.0;
+ transition: opacity 0.1s;
+ width: 20px;
+ height: 100%;
+ padding-left: 0.1rem;
+ padding-right: 0.1rem;
+
+ .fa[data-toggle="tooltip"] {
+ font-size: 1em;
+ }
+
+ a:hover {
+ .fa-circle-o:before {
+ content: '\f111';
+ }
+
+ .fa-circle:before {
+ content: '\f10c';
+ }
+ }
+ }
+
+ .item:hover .actions {
+ opacity: 1.0;
+ }
+ }
+}
diff --git a/scipost/static/scipost/assets/js/newsticker.js b/scipost/static/scipost/assets/js/newsticker.js
index c4e090fcf..657387df8 100644
--- a/scipost/static/scipost/assets/js/newsticker.js
+++ b/scipost/static/scipost/assets/js/newsticker.js
@@ -36,7 +36,7 @@ NewsTicker = (function() {
var self = this
if(typeof(this.cached_items[item.id]) == 'undefined') {
- $.get(this.options.url + '/' + item.id + '/?format=html')
+ $.get(this.options.url + item.id + '/?format=html')
.done(function(data) {
self.cached_items[item.id] = data
self.set_item(item.id)
diff --git a/scipost/static/scipost/assets/js/notifications.js b/scipost/static/scipost/assets/js/notifications.js
index 6d995a57e..b047e7c71 100644
--- a/scipost/static/scipost/assets/js/notifications.js
+++ b/scipost/static/scipost/assets/js/notifications.js
@@ -1,8 +1,4 @@
-function fetch_api_data(callback, url, args) {
- if (!url) {
- var url = notify_api_url_count;
- }
-
+function fetch_api_data(url, callback, args) {
if (callback) {
//only fetch data if a function is setup
var r = new XMLHttpRequest();
@@ -23,165 +19,65 @@ function fetch_api_data(callback, url, args) {
}
-function update_counter_callback(data, args) {
- var counter = data['unread_count'];
- var el = $(args['element']);
-
- if (typeof counter == 'undefined') {
- counter = 0;
- }
-
- el.html(counter);
- if (counter > 0) {
- el.parents('.notifications_container').addClass('positive_count')
- } else {
- el.parents('.notifications_container').removeClass('positive_count')
- }
+function update_list(el) {
+ fetch_api_data("/notifications/api/list/?mark_as_read=1", update_list_callback, {'element': el});
}
function update_list_callback(data, args) {
var items = data['list'];
var el = $(args['element']);
-
+ var template = el.find('.template').html();
+ var re = {
+ actor: new RegExp("{actor}","g"),
+ verb: new RegExp("{verb}","g"),
+ forward_link: new RegExp("{forward_link}","g"),
+ target: new RegExp("{target}","g"),
+ timesince: new RegExp("{timesince}","g"),
+ unread: new RegExp("{unread}","g"),
+ };
var messages = items.map(function (item) {
// Notification content
var message = '',
link = '';
- if(typeof item.actor !== 'undefined'){
- message += '<strong>' + item.actor + '</strong>';
- }
- if(typeof item.verb !== 'undefined'){
- message += " " + item.verb;
- }
- if(typeof item.target !== 'undefined'){
- if(typeof item.forward_link !== 'undefined') {
- link = item.forward_link;
- message += " <a href='" + item.forward_link + "'>" + item.target + "</a>";
- } else {
- message += " " + item.target;
- }
- }
- if(typeof item.timesince !== 'undefined'){
- message += "<div class='meta'>";
- if(typeof item.forward_link !== 'undefined') {
- message += " <a href='" + item.forward_link + "'>Direct link</a> · ";
- }
- message += "<span class='text-muted'>" + item.timesince + " ago</span></div>";
- }
-
- // Notification actions
+ t = template.replace(re.actor, item.actor);
+ t = t.replace(re.verb, item.verb);
+ t = t.replace(re.forward_link, item.forward_link);
+ t = t.replace(re.target, item.target);
+ t = t.replace(re.timesince, item.timesince);
if(item.unread) {
- var mark_toggle = '<a href="javascript:;" class="mark-toggle" data-slug="' + item.slug + '"><i class="fa fa-circle" data-toggle="tooltip" data-placement="auto" title="Mark as read" aria-hidden="true"></i></a>';
- } else {
- var mark_toggle = '<a href="javascript:;" class="mark-toggle" data-slug="' + item.slug + '"><i class="fa fa-circle-o" data-toggle="tooltip" data-placement="auto" title="Mark as unread" aria-hidden="true"></i></a>';
- }
-
- if(typeof item.forward_link !== 'undefined') {
- mark_toggle += "<br><a href='" + item.forward_link + "' data-toggle='tooltip' data-placement='auto' title='Go to item'><i class='fa fa-share' aria-hidden='true'></i></a>";
- }
-
- // Complete list html
- if(link !== '') {
- return '<li href="' + link + '" class="item ' + (item.unread ? ' active' : '') + '"><div>' + message + '</div><div class="actions">' + mark_toggle + '</div></li>';
+ t = t.replace(re.unread, 'unread');
} else {
- return '<li class="item ' + (item.unread ? ' active' : '') + '"><div>' + message + '</div><div class="actions">' + mark_toggle + '</div></li>';
+ t = t.replace(re.unread, 'read');
}
+ return t;
+ });
- }).join('');
-
- if (messages == '') {
- messages = '<li class="item px-5"><em>You have no new notifications</em></li>'
+ if(messages == '') {
+ messages = '<li class="item"><em>You have no new notifications</em></li>'
}
// Fill DOM
- el.find('.live_notify_list').html(messages).parents('body').trigger('refresh_notify_list');
+ el.append(messages).trigger('refresh-notifications');
}
-function update_mark_callback(data, args) {
- var el = $(args['element']);
- $(el).parents('.item').toggleClass('active');
- trigger_badge();
-}
-
-
-function update_counter(el) {
- fetch_api_data(update_counter_callback, "/notifications/api/unread_count/", {'element': el});
-}
-
-function mark_toggle(el) {
- var url = "/notifications/mark-toggle/" + $(el).data('slug') + "?json=1";
- fetch_api_data(update_mark_callback, url, {'element': el});
-}
-
-function update_list(el) {
- fetch_api_data(update_list_callback, "/notifications/api/list/?mark_as_read=1", {'element': el});
-}
-
-function trigger_badge() {
- $('.live_notify_badge').trigger('notification_count_updated');
-}
-// Update Badge count every minute
-var badge_timer = setInterval(trigger_badge, 60000);
-
-function initiate_popover() {
- var template = $('.notifications_container .popover-template').html();
- $('.notifications_container a[data-toggle="popover"]').popover({
- trigger: 'focus',
- animation: false,
- offset: '0, 10px',
- template: template,
- delay: {
- 'show': 0,
- 'hide': 200,
- },
- placement: 'bottom',
- boundary: 'viewport',
- title: 'empty-on-purpose'
- })
- .on('inserted.bs.popover', function() {
- $('body').trigger('notification_open_list');
- var self = this;
- $('.popover').on('click', function() {
- $('.notifications_container a[data-toggle="popover"]').focus();
- });
- })
- .on('hide.bs.popover', function() {
- // Bug: force removal of tooltip
+$(function(){
+ $('#notification_center').on('show.bs.modal', function(e) {
+ update_list('#notifications-list');
+ }).on('hide.bs.modal', function() {
$('body > .tooltip').remove();
});
-}
-
-$(function(){
- $('body').on('notification_open_list', function() {
- update_list(this);
- })
-
- $('.live_notify_badge').on('notification_count_updated', function() {
- update_counter(this);
- }).trigger('notification_count_updated');
+ $('body').on('refresh-notifications', function(e) {
+ var list = $(e.target.children).filter('[data-refresh=1]');
- $('body').on('refresh_notify_list', function() {
- // Bloody js
- var list = $('.live_notify_list');
- list.find('li.item').on('click', function(e) {
- e.stopPropagation();
- })
- .filter('[href]').on('click', function(e) {
- window.location.href = $(this).attr('href')
- });
list.find('[data-toggle="tooltip"]').tooltip({
animation: false,
delay: {"show": 500, "hide": 100},
fallbackPlacement: 'clockwise',
placement: 'bottom'
});
- list.find('.actions a.mark-toggle').on('click', function(e) {
- e.stopPropagation();
- mark_toggle(this);
- });
- });
- initiate_popover();
+ list.removeAttr('data-refresh');
+ });
});
diff --git a/scipost/templates/partials/scipost/notification_center_modal.html b/scipost/templates/partials/scipost/notification_center_modal.html
new file mode 100644
index 000000000..f0a80be59
--- /dev/null
+++ b/scipost/templates/partials/scipost/notification_center_modal.html
@@ -0,0 +1,69 @@
+{% load request_filters %}
+
+<!-- Modal -->
+<div class="modal notification-center" id="notification_center" tabindex="-1" role="dialog" aria-labelledby="notification_center" aria-hidden="true">
+ <div class="modal-dialog" role="document">
+ <div class="modal-content">
+ <div class="modal-header">
+ {% if request.user.contributor %}
+ <h4 class="modal-title">{{ request.user.contributor.get_title_display }} {{ request.user.first_name }} {{ request.user.last_name }}</h4>
+ {% endif %}
+ <!-- <h5 class="modal-title" id="exampleModalLongTitle">Modal title</h5> -->
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+ <span aria-hidden="true">×</span>
+ </button>
+ </div>
+ <div class="modal-body pb-2">
+ <ul class="list-unstyled links mb-0">
+ <li><a class="item {% active 'scipost:personal_page' %}" href="{% url 'scipost:personal_page' %}">Personal Page</a></li>
+ {% if user.partner_contact or perms.scipost.can_read_partner_page %}
+ <li><a class="item {% active 'partners:dashboard' %}" href="{% url 'partners:dashboard' %}">Partner Page</a></li>
+ {% endif %}
+
+ {% if perms.scipost.can_view_timesheets %}
+ <li><a class="item {% active 'finances:finance' %}" href="{% url 'finances:finance' %}">Financial Administration</a></li>
+ {% endif %}
+
+ {% if perms.scipost.can_view_all_funding_info %}
+ <li><a class="item {% active 'funders:funders_dashboard' %}" href="{% url 'funders:funders_dashboard' %}">Funders</a></li>
+ {% endif %}
+
+ {% if perms.scipost.can_view_production %}
+ <li><a class="item {% active 'production:production' %}" href="{% url 'production:production' %}">Production</a></li>
+ {% endif %}
+
+ {% if perms.scipost.can_view_pool %}
+ <li><a class="item {% active 'submissions:pool' %}" href="{% url 'submissions:pool' %}">Submissions Pool</a></li>
+ {% endif %}
+
+ <li><a class="item" href="{% url 'scipost:logout' %}">Logout</a></li>
+ </ul>
+ </div>
+ <div class="modal-header">
+ <h4 class="modal-title">Inbox</h4>
+ </div>
+ <div class="modal-body py-2">
+ <ul class="list-unstyled notifications" id="notifications-list">
+ <div style="display: none;" class="template">
+ <li class="{unread} item" data-refresh=1>
+ <div>
+ <strong>{actor}</strong>
+ <span>{verb}</span>
+ · <span class="text-muted">{timesince}</span>
+ <a href="{forward_link}">{target}</a>
+ </div>
+ <div class="actions">
+ <a href="javascript:;" class="mark-toggle show-unread" data-slug="{slug}"><i class="fa fa-circle" data-toggle="tooltip" data-placement="auto" title="Mark as read" aria-hidden="true"></i></a>
+ <a href="javascript:;" class="mark-toggle show-read" data-slug="{slug}"><i class="fa fa-circle-o" data-toggle="tooltip" data-placement="auto" title="Mark as unread" aria-hidden="true"></i></a>
+ <a href="{forward_link}" data-toggle='tooltip' data-placement="auto" title="Go to item"><i class="fa fa-share" aria-hidden="true"></i></a>
+ </div>
+ </li>
+ </div>
+ </ul>
+ </div>
+ <div class="modal-footer py-2">
+ <button type="button" class="btn btn-link" data-dismiss="modal">Close</button>
+ </div>
+ </div>
+ </div>
+</div>
diff --git a/scipost/templates/scipost/bare_base.html b/scipost/templates/scipost/bare_base.html
index 5efb4b3ae..17ab59d33 100644
--- a/scipost/templates/scipost/bare_base.html
+++ b/scipost/templates/scipost/bare_base.html
@@ -37,6 +37,8 @@
{% block base %}{% endblock base %}
+
+ {% include 'partials/scipost/notification_center_modal.html' %}
<script type="text/x-mathjax-config">
MathJax.Hub.Config({
tex2jax: {
diff --git a/scipost/templates/scipost/layout_2_col.html b/scipost/templates/scipost/layout_2_col.html
index 024cc1e83..29707b1b4 100644
--- a/scipost/templates/scipost/layout_2_col.html
+++ b/scipost/templates/scipost/layout_2_col.html
@@ -3,55 +3,32 @@
{% block body_class %}{{block.super}} has-sidebar layout-2-col{% endblock %}
{% block breadcrumb %}
- <div class="container-outside header">
+ <nav class="breadcrumb-nav">
<div class="container">
- <nav class="breadcrumb hidden-sm-down">
+ <ol class="breadcrumb">
{% block breadcrumb_items %}
- <a href="{% url 'scipost:index' %}" class="breadcrumb-item">SciPost</a>
+ <li class="breadcrumb-item"><a href="{% url 'scipost:index' %}">Home</a></li>
{% endblock %}
- </nav>
+ </ol>
</div>
- </div>
+ </nav>
{% endblock %}
{% block base %}
-
- <!-- <div class="container"> -->
- <!-- <div class="content-wrapper"> -->
- <!-- <div class="main-panel"> -->
- <!-- <div class="container-inner"> -->
- <!-- <div class="{% block container_class %}{% endblock %}"> -->
-
-
-
- <!-- </div> -->
-
-
- <!-- </div> -->
-
- <!-- </div> -->
-
- <!-- <div class="sidebar {% block sidebar_class %}{% endblock %}"> -->
- <!-- <div class="container-inner"> -->
-
- <!-- </div> -->
- <!-- </div> -->
- <!-- </div> -->
- <!-- </div> -->
- <main class="container">
- <div class="row">
- <div class="col-md-8 main">
- {% block content %}{% endblock content %}
- {% block content_footer %}{% endblock content_footer %}
- <hr>
- {% block secondary_footer %}{% endblock secondary_footer %}
- </div>
- <div class="col-md-4 sidebar">
- {% block sidebar %}{% endblock %}
- </div>
+ <main class="container">
+ <div class="row">
+ <div class="col-md-4 col-lg-3 sidebar">
+ {% block sidebar %}{% endblock %}
</div>
- </main>
+ <div class="col-md-8 col-lg-9">
+ {% block content %}{% endblock content %}
+ {% block content_footer %}{% endblock content_footer %}
+ <hr>
+ {% block secondary_footer %}{% endblock secondary_footer %}
+ </div>
+ </div>
+ </main>
{% include 'scipost/footer.html' %}
{% endblock base %}
diff --git a/scipost/templates/scipost/navbar.html b/scipost/templates/scipost/navbar.html
index fe228eb2b..510cea8f8 100644
--- a/scipost/templates/scipost/navbar.html
+++ b/scipost/templates/scipost/navbar.html
@@ -6,7 +6,11 @@
<!-- <a class="navbar-brand mr-auto mr-lg-0" href="#">Offcanvas navbar</a> -->
<div class="container">
<button class="navbar-toggler p-0 border-0" type="button" data-toggle="collapse" data-target="#main-navbar">
- <span class="navbar-toggler-icon"></span>
+ <div class="navbar-toggler-icon" onclick="navbarIconToggle(this)">
+ <div class="bar1"></div>
+ <div class="bar2"></div>
+ <div class="bar3"></div>
+ </div>
</button>
<div class="collapse navbar-collapse" id="main-navbar">
@@ -46,8 +50,8 @@
{% if request.user|is_in_group:'Testers' %}
<li class="nav-item navbar-counter">
<div class="nav-link notifications_container">
- <a href="javascript:;" class="d-inline-block ml-1 badge_link" id="notifications_badge" data-toggle="popover">
- <span class="user">{% if user.last_name %}{% if user.contributor %}{{ user.contributor.get_title_display }} {% endif %}{{ user.first_name }} {{ user.last_name }}{% else %}{{ user.username }}{% endif %}</span>
+ <a href="javascript:;" class="d-inline-block ml-1 badge_link" id="notifications_badge" data-toggle="modal" data-target="#notification_center">
+ <span class="user d-inline d-lg-none d-xl-inline">{% if user.last_name %}{% if user.contributor %}{{ user.contributor.get_title_display }} {% endif %}{{ user.first_name }} {{ user.last_name }}{% else %}{{ user.username }}{% endif %}</span>
<i class="fa fa-inbox" aria-hidden="true" style="min-width: 16px;"></i>
{% live_notify_badge classes="badge badge-pill badge-primary" %}
</a>
@@ -111,3 +115,9 @@
</div>
</div>
</nav>
+
+<script>
+ function navbarIconToggle(x) {
+ x.classList.toggle("change");
+ }
+</script>
diff --git a/submissions/models.py b/submissions/models.py
index 9c3bbcf7b..191654e2a 100644
--- a/submissions/models.py
+++ b/submissions/models.py
@@ -696,6 +696,7 @@ class EICRecommendation(SubmissionRelatedObjectMixin, models.Model):
recommendation = models.SmallIntegerField(choices=REPORT_REC)
version = models.SmallIntegerField(default=1)
active = models.BooleanField(default=True)
+ # status = models.CharField(default='', max_length=180)
# Editorial Fellows who have assessed this recommendation:
eligible_to_vote = models.ManyToManyField('scipost.Contributor', blank=True,
--
GitLab