From 3434bab6d7d4426764efacd7a2716f61a5b03286 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jean-S=C3=A9bastien=20Caux?= <git@jscaux.org> Date: Wed, 3 Nov 2021 05:56:04 +0100 Subject: [PATCH] Add vn 4 --- .../static/scipost/toggle-header-forms.js | 9 + .../scipost/_hx_participates_in.html | 6 +- .../scipost/templates/scipost/navbar2.html | 5 +- .../scipost/templates/scipost/navbar4.html | 113 +++++++++++ .../templates/scipost/portal/_hx_home.html | 178 ++++++++++++++++++ .../templates/scipost/portal/portal4.html | 170 +++++++++++++++++ scipost_django/scipost/urls.py | 9 + scipost_django/scipost/views.py | 20 ++ 8 files changed, 505 insertions(+), 5 deletions(-) create mode 100644 scipost_django/scipost/static/scipost/toggle-header-forms.js create mode 100644 scipost_django/scipost/templates/scipost/navbar4.html create mode 100644 scipost_django/scipost/templates/scipost/portal/_hx_home.html create mode 100644 scipost_django/scipost/templates/scipost/portal/portal4.html diff --git a/scipost_django/scipost/static/scipost/toggle-header-forms.js b/scipost_django/scipost/static/scipost/toggle-header-forms.js new file mode 100644 index 000000000..bbd68f66f --- /dev/null +++ b/scipost_django/scipost/static/scipost/toggle-header-forms.js @@ -0,0 +1,9 @@ +/* If home tab is chosen, don't show header forms to set acad_field and specialty. */ +document.getElementById('home-tab').addEventListener('show.bs.tab', () => { + document.getElementById('session_acad_field_form').style.display = 'none' + document.getElementById('session_specialty_form').style.display = 'none' +}) +document.getElementById('home-tab').addEventListener('hide.bs.tab', () => { + document.getElementById('session_acad_field_form').style.display = 'block' + document.getElementById('session_specialty_form').style.display = 'block' +}) diff --git a/scipost_django/scipost/templates/scipost/_hx_participates_in.html b/scipost_django/scipost/templates/scipost/_hx_participates_in.html index 7954bedd5..4fafaec4e 100644 --- a/scipost_django/scipost/templates/scipost/_hx_participates_in.html +++ b/scipost_django/scipost/templates/scipost/_hx_participates_in.html @@ -1,10 +1,10 @@ {% load static %} -<div class="row"> - <div class="col-md-4"> +<div class="card"> + <div class="card-header"> <h1>SciPost participates in</h1> </div> - <div class="col-md-8 logos"> + <div class="card-body logos"> <a href="https://www.crossref.org" target="_blank" rel="noopener"><img src="https://assets.crossref.org/logo/crossref-logo-200.svg" width="100" alt="Crossref logo"></a> <a href="https://www.doaj.org" target="_blank" rel="noopener"><img src="{% static 'scipost/images/doaj_logo_200.jpg' %}" width="90" alt="DOAJ logo"></a> <a href="https://www.clockss.org" target="_blank" rel="noopener"><img src="{% static 'scipost/images/clockss_original_logo_boxed_ai-cropped-90.png' %}" width="80" alt="Clockss logo"></a> diff --git a/scipost_django/scipost/templates/scipost/navbar2.html b/scipost_django/scipost/templates/scipost/navbar2.html index 1ceb1cdab..532f259cb 100644 --- a/scipost_django/scipost/templates/scipost/navbar2.html +++ b/scipost_django/scipost/templates/scipost/navbar2.html @@ -7,8 +7,6 @@ {% is_active_fellow request.user as is_active_fellow %} - - <nav class="navbar navbar-expand-lg main-nav"> <div class="container"> <button class="navbar-toggler p-0 border-0" type="button" data-bs-toggle="collapse" data-bs-target="#main-navbar" aria-label="Navbar toggler"> @@ -36,6 +34,9 @@ <div class="dropdown-item"> <a href="{% url 'scipost:index3' %}">3: homepage, restyled</a> </div> + <div class="dropdown-item"> + <a href="{% url 'scipost:index4' %}">4: home + portal, into one</a> + </div> </div> </li> {% endif %} diff --git a/scipost_django/scipost/templates/scipost/navbar4.html b/scipost_django/scipost/templates/scipost/navbar4.html new file mode 100644 index 000000000..7182080cc --- /dev/null +++ b/scipost_django/scipost/templates/scipost/navbar4.html @@ -0,0 +1,113 @@ +{% load request_filters %} +{% load static %} +{% load scipost_extras %} +{% load journals_extras %} +{% load user_groups %} + +{% is_active_fellow request.user as is_active_fellow %} + + +<nav class="navbar navbar-expand-lg main-nav"> + <div class="container"> + <button class="navbar-toggler p-0 border-0" type="button" data-bs-toggle="collapse" data-bs-target="#main-navbar" aria-label="Navbar toggler"> + <span class="navbar-toggler-icon">{% include 'bi/list.html' %}</span> + </button> + <div class="collapse navbar-collapse mt-lg-0 mt-3" id="main-navbar"> + <ul class="navbar-nav me-auto"> + + {% if perms.scipost.can_preview_new_features %} + <li class="nav-item dropdown border border-warning"> + <a class="nav-link dropdown-toggle" href="#" id="HomepagesDropdown" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false" data-trigger="hover"> + <span class="d-none d-lg-inline-block text-warning" aria-hidden="true" style="min-width: 16px;">{% include 'bi/house-fill.html' %}</span> + <span class="d-lg-none d-inline-block text-warning">Homepages</span> + </a> + <div class="dropdown-menu" aria-labelledby="HomepagesDropdown"> + <div class="dropdown-item"> + <a href="{% url 'scipost:index' %}">Current homepage</a> + </div> + <div class="dropdown-item"> + <a href="{% url 'scipost:index2' %}">2: home + portal</a> + </div> + <div class="dropdown-item"> + <a href="{% url 'scipost:portal2p2' %}">2.2: ----> portal2p2</a> + </div> + <div class="dropdown-item"> + <a href="{% url 'scipost:index3' %}">3: homepage, restyled</a> + </div> + <div class="dropdown-item"> + <a href="{% url 'scipost:index4' %}">4: home + portal, into one</a> + </div> + </div> + </li> + {% endif %} + + <li class="nav-item{% if request.path == '/home4' %} active{% endif %}"> + <a href="{% url 'scipost:index2' %}" class="nav-link" aria-label="SciPost Home"> + <span class="d-none d-lg-inline-block" aria-hidden="true" style="min-width: 16px;">{% include 'bi/house-fill.html' %}</span> + <span class="d-lg-none d-inline-block">Home</span> + </a> + </li> + + </ul> + + <hr class="lg d-lg-none"> + + <ul class="navbar-nav me-0"> + {% if user.is_authenticated %} + <li class="nav-item dropdown"> + <a class="nav-link dropdown-toggle" href="#" id="PersonalDropdown" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false" data-trigger="hover"> + Logged in as {% if user.last_name %}{% if user.contributor %}{{ user.contributor.profile.get_title_display }} {% endif %}{{ user.first_name }} {{ user.last_name }}{% else %}{{ user.username }}{% endif %}</a> + + {% if request.user.contributor and not request.user.contributor.is_currently_available %} + <button type="button" class="btn btn-link p-0 text-warning" data-bs-toggle="tooltip" data-bs-title="You are currently unavailable.<br>Check your availability on your Personal Page if this should not be the case." data-bs-html="true">{% include 'bi/exclamation-triangle-fill.html' %}</button> + + {% endif %} + <div class="dropdown-menu dropdown-menu-right" aria-labelledby="PersonalDropdown"> + {% if user.contributor %} + <div class="dropdown-item"> + <a href="{% url 'scipost:personal_page' %}">Personal Page</a> + </div> + {% if is_active_fellow %} + <div class="dropdown-item"> + <a href="{% url 'submissions:pool' %}">Submissions Pool</a> + </div> + {% endif %} + {% endif %} + {% if perms.scipost.can_view_production %} + <div class="dropdown-item"> + <a href="{% url 'production:production' %}">Production</a> + </div> + {% endif %} + {% if perms.scipost.can_manage_organizations or user.org_contact %} + <div class="dropdown-item"> + <a href="{% url 'organizations:dashboard' %}">Orgs dashboard</a> + </div> + {% endif %} + <div class="dropdown-divider"></div> + <div class="dropdown-item"> + <a href="{% url 'forums:forums' %}">Forums and Meetings</a> + </div> + <div class="dropdown-divider"></div> + <div class="dropdown-item"> + <a href="{% url 'helpdesk:helpdesk' %}">Helpdesk</a> + </div> + <div class="dropdown-divider"></div> + <div class="dropdown-item"> + <a href="{% url 'scipost:logout' %}?next={{ request.path }}">Logout</a> + </div> + </div> + </li> + + <li class="nav-item"> +  <a href="{% url 'helpdesk:ticket_create' %}" target="_blank" class="nav-link"><span style="font-size: 80%;" data-bs-toggle="tooltip" data-bs-html="true" title="Notice something wrong?<br/>Open a support ticket">{% include 'bi/sticky-fill.html' %}</span></a> + </li> + + {% else %} + <li class="nav-item{% if request.path == '/login/' %} active{% endif %}"> + <a class="nav-link" href="{% url 'scipost:login' %}?next={{request.path}}">Login or register</a> + </li> + {% endif %} + </ul> + </div> + </div> +</nav> diff --git a/scipost_django/scipost/templates/scipost/portal/_hx_home.html b/scipost_django/scipost/templates/scipost/portal/_hx_home.html new file mode 100644 index 000000000..828746c9c --- /dev/null +++ b/scipost_django/scipost/templates/scipost/portal/_hx_home.html @@ -0,0 +1,178 @@ +{% load static %} + +{% block headsup %} + <style> + .sp-swap.htmx-added { + opacity: 0; + } + .sp-swap.htmx-swapping { + opacity: 0; + } + .sp-swap { + opacity: 1; + transition: opacity 1s; + } + </style> +{% endblock %} + +{% block content %} + + <div class="row gx-4"> + <div class="col-md-8"> + <div class="card"> + <div class="card-header"> + <h1>The Home of Genuine Open Publishing</h1> + </div> + <div class="card-body"> + <p>SciPost is a complete publishing infrastructure serving professional scientists worldwide.</p> + <div class="row g-2"> + <div class="col-lg-6"> + <div class="card"> + <div class="card-header"> + <h3>We implement<br><a href="{% url 'scipost:about' %}#GOA">Genuine Open Access</a></h3> + </div> + <div class="card-body"> + <ul class="list list-unstyled"> + <li>{% include 'bi/check-square.html' %} Community Ownership</li> + <li>{% include 'bi/check-square.html' %} Open Infrastructure</li> + <li>{% include 'bi/check-square.html' %} Copyright to Authors</li> + <li>{% include 'bi/check-square.html' %} Open Access</li> + <li>{% include 'bi/check-square.html' %} Open Citations</li> + <li>{% include 'bi/check-square.html' %} Fee Free</li> + <li>{% include 'bi/check-square.html' %} Non Profit</li> + <li>{% include 'bi/check-square.html' %} Open Finances</li> + <li>{% include 'bi/check-square.html' %} Academic Editing</li> + </ul> + </div> + </div> + </div> + <div class="col-lg-6"> + <div class="card mb-2"> + <div class="card-header"> + <h3>Info</h3> + </div> + <div class="card-body"> + <ul class="list list-unstyled"> + <li>{% include 'bi/arrow-right.html' %} + <a href="{% url 'scipost:about' %}">About SciPost</a></li> + <li>{% include 'bi/arrow-right.html' %} + <a href="{% url 'scipost:foundation' %}">The Foundation</a></li> + <li>{% include 'bi/arrow-right.html' %} + <a href="{% url 'scipost:FAQ' %}">FAQ</a></li> + <li>{% include 'bi/arrow-right.html' %} + <a href="{% url 'scipost:contact' %}">Contact us</a></li> + <li>{% include 'bi/arrow-right.html' %} + <a href="{% url 'careers:jobopenings' %}">Careers@SciPost</a></li> + <li>{% include 'bi/arrow-right.html' %} + <a href="https://disc.{{ request.get_host }}" target="_blank" rel="noopener">{% include 'bi/chat-right-text.html' %} Community</a></li> + <li>{% include 'bi/arrow-right.html' %} + <a href="https://git.{{ request.get_host }}" target="_blank" rel="noopener">{% include 'bi/code-square.html' %} git.{{ request.get_host }}</a></li> + <li class="mt-4">{% include 'bi/arrow-right.html' %} + <a href="{% url 'finances:business_model' %}">Our Business Model</a></li> + <li class="mt-2">{% include 'bi/arrow-right.html' %} + <a href="{% url 'organizations:organizations' %}">Organizations<br/><span class="small">  benefitting from our activities</span></a></li> + </ul> + + </div> + </div> + + {% if not user.is_authenticated %} + <!-- Register --> + <div class="card border border-danger"> + <div class="card-header"> + <h3>Register</h3> + </div> + <div class="card-body"> + <p class="mb-1">Professional scientists (PhD students and above) can become Contributors to SciPost by filling the <a href="{% url 'scipost:register' %}">registration form</a>.</p> + </div><!-- End Register --> + </div> + {% endif %} + </div> + + <div class="col-lg-12"> + <div class="card"> + <div class="card-header"> + <h1>Sponsors</h1> + </div> + <div class="card-body"> + <div class="row"> + <div class="col"> + <p> + We invite <a href="{% url 'organizations:organizations' %}">organizations benefitting from SciPost's activities</a> to join our growing <a href="{% url 'sponsors:sponsors' %}">list of Sponsors</a>. Look at our <a href="{% static 'sponsors/SciPost_Sponsors_Board_Prospectus.pdf' %}">one-page Prospectus</a> and at our full <a href="{% static 'sponsors/SciPost_Sponsorship_Agreement.pdf' %}">Sponsorship Agreement template</a>. + </p> + <p> + <strong>Scientists, please help us out:</strong> Please petition your local librarian/director/... to consider sponsoring us. You can use this email <a href="mailto:?subject=Petition to support SciPost&body={% autoescape on %}{% include 'sponsors/sponsor_petition_email.html' %}{% endautoescape %}&cc=sponsors@{{ request.get_host }}">template</a>. + </p> + </div> + <div class="col-md-4"> + <a href="{% url 'sponsors:sponsors' %}">See all sponsors</a> + <br> + <div id="sponsor-logos" class="sp-swap" + hx-get="{% url 'scipost:_hx_sponsors' %}" + hx-trigger="load" + hx-swap="outerHTML swap:1s" + > + </div> + </div> + </div> + </div> + </div> + </div> + + <div class="col-lg-12" + hx-get="{% url 'scipost:_hx_participates_in' %}" + hx-trigger="load" + > + </div> + + + + </div> + </div> + </div> + </div> + + + + + <div class="col-md-4"> + <h1 class="title"> + News + <button class="btn btn-link btn-sm m-0 mb-1" href="{% url 'scipost:feeds' %}" aria-label="RSS feeds">{% include 'bi/rss-fill.html' %}</button> + </h1> + <a href="{% url 'news:news' %}" class="my-1 float-right">See complete News list</a> + + <div class="card"> + <div class="card-header"> + <h3>Latest</h3> + </div> + <div class="card-body"> + <h3><a href="{% url 'news:news' %}#news_{{ latest_newsitem.id }}">{{ latest_newsitem.headline }}</a></h3> + <div class="text-muted">{{ latest_newsitem.date|date:'j F Y' }}</div> + <p> + {{ latest_newsitem.blurb_short }} + <br> + <br> + <a href="{% url 'news:news' %}#news_{{ latest_newsitem.id }}" class="my-1">Read more →</a> + </p> + </div> + </div> + + <div class="card"> + <div class="card-header"> + <h3>Further news</h3> + </div> + <div class="card-body"> + <div id="further-news" class="sp-swap" + hx-get="{% url 'scipost:_hx_news' %}" + hx-trigger="load" + hx-swap="outerHTML swap:1s" + > + </div> + </div> + </div> + </div> + + </div> + +{% endblock %} diff --git a/scipost_django/scipost/templates/scipost/portal/portal4.html b/scipost_django/scipost/templates/scipost/portal/portal4.html new file mode 100644 index 000000000..82b354c1b --- /dev/null +++ b/scipost_django/scipost/templates/scipost/portal/portal4.html @@ -0,0 +1,170 @@ +{% extends 'scipost/base.html' %} +{% load static %} + +{% load render_bundle from webpack_loader %} +{% load static %} + +{% block navbar %} + {% include 'scipost/navbar4.html' %} +{% endblock %} + +{% block body_class %}{{ block.super }} homepage{% endblock %} + +{% block meta_description %}{{ block.super }} homepage{% endblock meta_description %} +{% block pagetitle %}Homepage{% endblock pagetitle %} + +{% block header %} + {% include 'scipost/header_with_acad_field_and_spec2p2.html' %} +{% endblock %} + + +{% block content %} + + + <ul class="nav nav-pills flex-wrap flex-sm-row mb-3 justify-content-center" + id="portal-tablist" + role="tablist"> + + <li class="nav-item" role="presentation"> + <button class="nav-link" id="home-tab" + data-bs-toggle="tab" data-bs-target="#home" + type="button" role="tab" + aria-controls="home" aria-selected="true"> + Home + </button> + </li> + + <li class="nav-item" role="presentation"> + <button class="nav-link" id="journals-tab" + data-bs-toggle="tab" data-bs-target="#journals" + type="button" role="tab" + aria-controls="journals" aria-selected="true"> + Journals + </button> + </li> + + <li class="nav-item" role="presentation"> + <button class="nav-link active" id="publications-tab" + data-bs-toggle="tab" data-bs-target="#publications" + type="button" role="tab" + aria-controls="publications" aria-selected="true"> + Publications + </button> + </li> + + <li class="nav-item" role="presentation"> + <button class="nav-link" id="submissions-tab" + data-bs-toggle="tab" data-bs-target="#submissions" + type="button" role="tab" + aria-controls="submissions" aria-selected="true"> + Submissions + </button> + </li> + + <li class="nav-item" role="presentation"> + <button class="nav-link border border-warning" id="reports-needed-tab" + data-bs-toggle="tab" data-bs-target="#reports-needed" + type="button" role="tab" + aria-controls="reports-needed" aria-selected="true"> + Reports needed <span class="text-warning">{% include 'bi/exclamation-square-fill.html' %}</span> + </button> + </li> + + <li class="nav-item" role="presentation"> + <button class="nav-link" id="reports-tab" + data-bs-toggle="tab" data-bs-target="#reports" + type="button" role="tab" + aria-controls="reports" aria-selected="true"> + Reports + </button> + </li> + + <li class="nav-item" role="presentation"> + <button class="nav-link" id="comments-tab" + data-bs-toggle="tab" data-bs-target="#comments" + type="button" role="tab" + aria-controls="comments" aria-selected="true"> + Comments + </button> + </li> + + <li class="nav-item" role="presentation"> + <a class="btn btn-outline-success border-2 ms-4" + href="{% url 'submissions:submit_manuscript' %}"> + {% include 'bi/arrow-right.html' %}<strong>Submit</strong> + </a> + </li> + + </ul> + + <hr> + + <div class="tab-content mt-4" id="portalTabContent"> + + <div class="tab-pane portal-tab fade" id="home" + role="tabpanel" aria-labelledby="home-tab"> + <div hx-get="{% url 'scipost:portal_hx_home' %}" + hx-trigger="click delay:200ms from:#home-tab" + > + </div> + </div> + + <div class="tab-pane portal-tab fade" id="journals" + role="tabpanel" aria-labelledby="journals-tab"> + <div hx-get="{% url 'scipost:portal_hx_journals' %}" + hx-trigger="click delay:200ms from:#journals-tab, session-acad-field-set from:body" + > + </div> + </div> + + <div class="tab-pane portal-tab fade show active" id="publications" + role="tabpanel" aria-labelledby="publications-tab"> + <div hx-get="{% url 'scipost:portal_hx_publications' %}" + hx-trigger="load, click delay:200ms from:#publications-tab, session-acad-field-set from:body, session-specialty-set from:body" + > + </div> + </div> + + <div class="tab-pane portal-tab fade" id="submissions" + role="tabpanel" aria-labelledby="submissions-tab"> + <div hx-get="{% url 'scipost:portal_hx_submissions' %}" + hx-trigger="click delay:200ms from:#submissions-tab, session-acad-field-set from:body, session-specialty-set from:body" + > + </div> + </div> + + <div class="tab-pane portal-tab fade" id="reports-needed" + role="tabpanel" aria-labelledby="reports-needed-tab"> + <div hx-get="{% url 'scipost:portal_hx_submissions' %}?reports_needed=1" + hx-trigger="click delay:200ms from:#reports-needed-tab, session-acad-field-set from:body, session-specialty-set from:body" + > + </div> + </div> + + <div class="tab-pane portal-tab fade" id="reports" + role="tabpanel" aria-labelledby="reports-tab"> + <div hx-get="{% url 'scipost:portal_hx_reports' %}" + hx-trigger="click delay:200ms from:#reports-tab, session-acad-field-set from:body, session-specialty-set from:body" + > + </div> + </div> + + <div class="tab-pane portal-tab fade" id="comments" + role="tabpanel" aria-labelledby="comments-tab"> + <div hx-get="{% url 'scipost:portal_hx_comments' %}" + hx-trigger="click delay:200ms from:#comments-tab, session-acad-field-set from:body, session-specialty-set from:body" + > + </div> + </div> + + </div> + +{% endblock %} + +{% block footer_script %} + {{ block.super }} + <script nonce="{{ request.csp_nonce }}" src="{% static 'scipost/toggle-proceedings.js' %}"> + </script> + <script nonce="{{ request.csp_nonce }}" src="{% static 'scipost/toggle-header-forms.js' %}"> + </script> +{% endblock footer_script %} diff --git a/scipost_django/scipost/urls.py b/scipost_django/scipost/urls.py index a4a29f0f1..d84ad60bc 100644 --- a/scipost_django/scipost/urls.py +++ b/scipost_django/scipost/urls.py @@ -83,6 +83,10 @@ urlpatterns = [ 'home3', views.index3, name='index3' ), + path( + 'home4', + views.index4, name='index4' + ), # Portal path( @@ -97,6 +101,11 @@ urlpatterns = [ ), # HTMX-delivered fragments + path( + 'portal/_hx_home', + views.portal_hx_home, + name='portal_hx_home' + ), path( 'portal/_hx_journals', TemplateView.as_view(template_name='scipost/portal/_hx_journals.html'), diff --git a/scipost_django/scipost/views.py b/scipost_django/scipost/views.py index d855bdc6b..a897a3969 100644 --- a/scipost_django/scipost/views.py +++ b/scipost_django/scipost/views.py @@ -190,6 +190,14 @@ def index2(request): return render(request, 'scipost/index2.html', context) +@permission_required('scipost.can_preview_new_features', return_403=True) +def index4(request): + if request.GET.get('field', None): + request.session['session_acad_field_slug'] = request.GET.get('field', None) + request.session['session_specialty_slug'] = '' + return render(request, 'scipost/portal/portal4.html') + + @permission_required('scipost.can_preview_new_features', return_403=True) def portal(request): """ @@ -212,6 +220,18 @@ def portal2p2(request): return render(request, 'scipost/portal/portal2p2.html') +def portal_hx_home(request): + """Homepage view of SciPost.""" + if NewsItem.objects.homepage().exists(): + latest_newsitem = NewsItem.objects.homepage().order_by('-date').first() + else: + latest_newsitem = NewsItem.objects.none() + context = { + 'latest_newsitem': latest_newsitem + } + return render(request, 'scipost/portal/_hx_home.html', context) + + def portal_hx_publications(request): form = PublicationSearchForm( acad_field_slug=request.session.get('session_acad_field_slug', None), -- GitLab