Move gallery JavaScript to gallery_detail.js

photologue/static/gallery_detail.js

@@ -0,0 +1,9 @@
+// This file is part of photo21
+// Copyright (C) 2022  Amicale des élèves de l'ENS Paris-Saclay
+// SPDX-License-Identifier: GPL-3.0-or-later
+
+// Init gallery
+lightGallery(document.getElementById('lightgallery'), {
+    plugins: [lgAdmin, lgHash, lgThumbnail, lgZoom],
+    customSlideName: true,
+});

photologue/static/lightgallery/plugins/admin/lg-admin.js

@@ -10,8 +10,8 @@ class lgAdmin {
     constructor(instance, $LG) {
         this.core = instance;
         this.$LG = $LG;
-        this.isStaff = instance.settings.isStaff;
+        this.isStaff = document.querySelector('[name=is_staff]').value === "true";
-        this.csrfToken = instance.settings.csrfToken;
+        this.csrfToken = document.querySelector('[name=csrfmiddlewaretoken]').value;
         this.photoId = 0;
         return this;
     }

photologue/templates/photologue/gallery_detail.html

@@ -15,19 +15,15 @@ SPDX-License-Identifier: GPL-3.0-or-later
 {% endblock %}
 
 {% block extrajs %}
+{# Javascript code fetches CSRF token from HTML #}
+{% csrf_token %}
+<input type="hidden" name="is_staff" value="{{ request.user.is_staff|yesno:'true,false' }}">
 <script src="{% static 'lightgallery/lightgallery.min.js' %}"></script>
 <script src="{% static 'lightgallery/plugins/admin/lg-admin.js' %}"></script>
 <script src="{% static 'lightgallery/plugins/hash/lg-hash.min.js' %}"></script>
 <script src="{% static 'lightgallery/plugins/thumbnail/lg-thumbnail.min.js' %}"></script>
 <script src="{% static 'lightgallery/plugins/zoom/lg-zoom.min.js' %}"></script>
-<script>
+<script src="{% static 'gallery_detail.js' %}"></script>
-    lightGallery(document.getElementById('lightgallery'), {
-        plugins: [lgAdmin, lgHash, lgThumbnail, lgZoom],
-        customSlideName: true,
-        isStaff: {{ request.user.is_staff|yesno:"true,false" }},
-        csrfToken: "{{ csrf_token }}",
-    });
-</script>
 {% endblock %}
 
 {% block content %}