Add turbolinks

- Load scripts in the head with `defer` instead of at the end of the body
- Disable turbolinks for application shortcuts and manual download

Signed-off-by: Joseph Nuthalapati <njoseph@thoughtworks.com>
Reviewed-by: James Valleroy <jvalleroy@mailbox.org>
This commit is contained in:
Joseph Nuthalapati 2018-06-23 13:22:16 +05:30 committed by James Valleroy
parent d8c7382045
commit f762f57d1c
No known key found for this signature in database
GPG Key ID: 77C0C75E7B650808
4 changed files with 21 additions and 10 deletions

1
debian/control vendored
View File

@ -63,6 +63,7 @@ Depends: ${python3:Depends}
, libjs-jquery
, libjs-modernizr
, network-manager
, node-turbolinks
, ppp
, pppoe
, python3-apt

View File

@ -94,3 +94,12 @@
{% endif %}
{% endblock %}
{% block page_js %}
<script type="text/javascript">
(function($) {
let downloadManualButton = $('a[href="/plinth/help/manual/download/"]');
downloadManualButton.attr("data-turbolinks", "false");
})(jQuery);
</script>
{% endblock %}

View File

@ -70,6 +70,15 @@
<link rel="stylesheet" href="{% static '/javascript/bootstrap/css/bootstrap.min.css' %}"/>
<link rel="stylesheet" href="{% static 'theme/css/plinth.css' %}"/>
<link rel="stylesheet" href="{% static 'theme/css/responsive.css' %}"/>
<!-- Local link to system Turbolinks JS -->
<script type="text/javascript" src="{% static '/javascript/turbolinks/turbolinks.js' %}" defer></script>
<!-- Local link to system Modernizr (includes HTML5 Shiv) -->
<script type="text/javascript" src="{% static '/javascript/modernizr/modernizr.min.js' %}" defer></script>
<!-- Local link to system jQuery -->
<!-- TODO Deferring jQuery is causing scripts to be loaded before jQuery is available -->
<script type="text/javascript" src="{% static '/javascript/jquery/jquery.min.js' %}"></script>
<!-- Local link to system Bootstrap JS -->
<script type="text/javascript" src="{% static '/javascript/bootstrap/js/bootstrap.min.js' %}" defer></script>
{% block app_head %}<!-- placeholder for app/module-specific head files -->{% endblock %}
{% block page_head %}<!-- placeholder for page-specific head files -->{% endblock %}
</head>
@ -244,14 +253,6 @@
</div>
</footer><!--/.footer-->
</div><!--/#container-->
<!-- JavaScript <script> tags are placed at the end of the document to speed up initial page loads-->
<!-- Local link to system Modernizr (includes HTML5 Shiv) -->
<script type="text/javascript" src="{% static '/javascript/modernizr/modernizr.min.js' %}"></script>
<!-- Local link to system jQuery -->
<script type="text/javascript" src="{% static '/javascript/jquery/jquery.min.js' %}"></script>
<!-- Local link to system Bootstrap JS -->
<script type="text/javascript" src="{% static '/javascript/bootstrap/js/bootstrap.min.js' %}"></script>
{% block app_js %}<!-- placeholder for app-specific js files -->{% endblock %}
{% block page_js %}<!-- placeholder for page-specific js files -->{% endblock %}
</body>

View File

@ -82,9 +82,9 @@
{% if user.is_authenticated or not shortcut.login_required %}
<div class="card thumbnail">
{% if selected_id == shortcut.id %}
<a href="{{ shortcut.url }}" class="nav-link active">
<a href="{{ shortcut.url }}" class="nav-link active" data-turbolinks="false">
{% else %}
<a href="{{ shortcut.url }}" class="nav-link">
<a href="{{ shortcut.url }}" class="nav-link" data-turbolinks="false">
{% endif %}
<div class="card-icon">
<img src="{% static 'theme/icons/' %}{{ shortcut.icon }}.png"/>