From 6900e4a6be1ae860a3945ff2e6dee79d162fffd6 Mon Sep 17 00:00:00 2001
From: Tim van Dijen <tvdijen@gmail.com>
Date: Mon, 21 Mar 2022 00:33:58 +0100
Subject: [PATCH] Reorder JS
---
modules/admin/templates/federation.twig | 5 ++
src/js/bundle.js | 63 +++++-----------------
src/js/expander.js | 16 ------
src/js/main.js | 69 +++++++++++++++++++++++++
templates/auth_status.twig | 8 +++
templates/base.twig | 4 +-
templates/includes/expander.twig | 3 --
webpack.config.js | 1 -
8 files changed, 96 insertions(+), 73 deletions(-)
delete mode 100644 src/js/expander.js
create mode 100644 src/js/main.js
diff --git a/modules/admin/templates/federation.twig b/modules/admin/templates/federation.twig
index 367acbe68..bcf5c6fba 100644
--- a/modules/admin/templates/federation.twig
+++ b/modules/admin/templates/federation.twig
@@ -4,6 +4,7 @@
{% block preload %}
<link rel="stylesheet" href="{{ asset('css/admin.css', 'admin') }}">
+<link rel="preload" href="{{ asset('js/bundle.js') }}" as="script">
{% endblock %}
{% block content %}
@@ -146,3 +147,7 @@
</fieldset>
</form>
{% endblock %}
+{% block postload %}
+ <script src="{{ asset('js/bundle.js') }}"></script>
+{% endblock %}
+
diff --git a/src/js/bundle.js b/src/js/bundle.js
index 2a50cad51..f2d1436b8 100644
--- a/src/js/bundle.js
+++ b/src/js/bundle.js
@@ -1,66 +1,27 @@
-import "es5-shim";
-import "es6-shim";
import ClipboardJS from "clipboard/dist/clipboard";
import hljs from "highlight.js/lib/core";
import xml from "highlight.js/lib/languages/xml";
import php from "highlight.js/lib/languages/php";
import json from "highlight.js/lib/languages/json";
-window.readyHandlers = [];
-window.ready = function ready(handler)
-{
- window.readyHandlers.push(handler);
- handleState();
-};
-
-window.handleState = function handleState()
-{
- if (document.readyState === 'interactive' || document.readyState === "complete") {
- while (window.readyHandlers.length > 0) {
- (window.readyHandlers.shift())();
- }
- }
-};
-
-document.onreadystatechange = window.handleState;
-
-ready(function () {
- // Language selector
- var languageSelector = document.getElementById("language-selector");
- languageSelector.onchange = function () {
- let languageForm = document.getElementById("language-form");
- languageForm.submit();
- return true;
- };
-
-
- // Side menu
- var menuLink = document.getElementById("menuLink");
- menuLink.onclick = function (e) {
+// Expander boxes
+var expandable = document.querySelectorAll('.expandable > .expander');
+expandable.forEach(function (currentValue, index, arr) {
+ currentValue.onclick = function (e) {
e.preventDefault();
- let layout = document.getElementById("layout");
- if (layout.className.match(/(?:^|\s)active(?!\S)/)) {
- layout.className = layout.className.replace(/(?:^|\s)active(?!\S)/g , '');
+ var parent = e.currentTarget.parentNode;
+ if (parent.className.match(/(?:^|\s)expanded(?!\S)/)) {
+ parent.className = parent.className.replace(/(?:^|\s)expanded(?!\S)/g , '');
} else {
- layout.className += " active";
+ parent.className += " expanded";
}
- let foot = document.getElementById("foot");
- if (foot.className.match(/(?:^|\s)active(?!\S)/)) {
- foot.className = foot.className.replace(/(?:^|\s)active(?!\S)/g , '');
- } else {
- foot.className += " active";
- }
-
- if (menuLink.className.match(/(?:^|\s)active(?!\S)/)) {
- menuLink.className = menuLink.className.replace(/(?:^|\s)active(?!\S)/g , '');
- } else {
- menuLink.className += " active";
- }
- };
-
+ e.currentTarget.blur();
+ }
+});
+ready(function () {
// Syntax highlight
hljs.registerLanguage('xml', xml);
hljs.registerLanguage('php', php);
diff --git a/src/js/expander.js b/src/js/expander.js
deleted file mode 100644
index a141b0a48..000000000
--- a/src/js/expander.js
+++ /dev/null
@@ -1,16 +0,0 @@
-// Expander boxes
-var expandable = document.querySelectorAll('.expandable > .expander');
-expandable.forEach(function (currentValue, index, arr) {
- currentValue.onclick = function (e) {
- e.preventDefault();
-
- var parent = e.currentTarget.parentNode;
- if (parent.className.match(/(?:^|\s)expanded(?!\S)/)) {
- parent.className = parent.className.replace(/(?:^|\s)expanded(?!\S)/g , '');
- } else {
- parent.className += " expanded";
- }
-
- e.currentTarget.blur();
- }
-});
diff --git a/src/js/main.js b/src/js/main.js
new file mode 100644
index 000000000..ec5d4fc1f
--- /dev/null
+++ b/src/js/main.js
@@ -0,0 +1,69 @@
+import "es5-shim";
+import "es6-shim";
+
+window.readyHandlers = [];
+window.ready = function ready(handler) {
+ window.readyHandlers.push(handler);
+ handleState();
+};
+
+window.handleState = function handleState () {
+ if (document.readyState === 'interactive' || document.readyState === "complete") {
+ while(window.readyHandlers.length > 0) {
+ (window.readyHandlers.shift())();
+ }
+ }
+};
+
+document.onreadystatechange = window.handleState;
+
+ready(function () {
+ // Language selector
+ var languageSelector = document.getElementById("language-selector");
+ languageSelector.onchange = function() {
+ let languageForm = document.getElementById("language-form");
+ languageForm.submit();
+ return true;
+ };
+
+
+ // Side menu
+ var menuLink = document.getElementById("menuLink");
+ menuLink.onclick = function(e) {
+ e.preventDefault();
+
+ let layout = document.getElementById("layout");
+ if (layout.className.match(/(?:^|\s)active(?!\S)/)) {
+ layout.className = layout.className.replace(/(?:^|\s)active(?!\S)/g , '');
+ } else {
+ layout.className += " active";
+ }
+
+ let foot = document.getElementById("foot");
+ if (foot.className.match(/(?:^|\s)active(?!\S)/)) {
+ foot.className = foot.className.replace(/(?:^|\s)active(?!\S)/g , '');
+ } else {
+ foot.className += " active";
+ }
+
+ if (menuLink.className.match(/(?:^|\s)active(?!\S)/)) {
+ menuLink.className = menuLink.className.replace(/(?:^|\s)active(?!\S)/g , '');
+ } else {
+ menuLink.className += " active";
+ }
+ };
+
+ // Expander boxes
+ var expandable = document.querySelectorAll('.expandable > .expander');
+ expandable.forEach(function (currentValue, index, arr) {
+ currentValue.onclick = function (e) {
+ var parent = e.currentTarget.parentNode;
+ if (parent.className.match(/(?:^|\s)expanded(?!\S)/)) {
+ parent.className = parent.className.replace(/(?:^|\s)expanded(?!\S)/g , '');
+ } else {
+ parent.className += " expanded";
+ }
+ e.currentTarget.blur();
+ }
+ )};
+});
diff --git a/templates/auth_status.twig b/templates/auth_status.twig
index 731ef1f87..f276f26b9 100644
--- a/templates/auth_status.twig
+++ b/templates/auth_status.twig
@@ -1,6 +1,10 @@
{% set pagetitle = 'Authentication status'|trans %}
{% extends 'base.twig' %}
+{% block preload %}
+ <link rel="preload" href="{{ asset('js/main.js') }}" as="script">
+{% endblock %}
+
{% block content %}
<h2>{{ pagetitle }}</h2>
@@ -116,3 +120,7 @@
</div>
{% endif %}
{% endblock %}
+{% block postload %}
+ <script src="{{ asset('js/bundle.js') }}"></script>
+{% endblock %}
+
diff --git a/templates/base.twig b/templates/base.twig
index 8579598f8..34641fb8b 100644
--- a/templates/base.twig
+++ b/templates/base.twig
@@ -12,7 +12,7 @@
<link rel="stylesheet" href="{{ asset("assets/css/src/default-rtl.css") }}">
{% endif %}
<meta name="robots" content="noindex, nofollow">
- <link rel="preload" href="{{ asset('js/bundle.js') }}" as="script">
+ <link rel="preload" href="{{ asset('js/main.js') }}" as="script">
{% block preload %}{% endblock %}
</head>
<body id="{{ templateId }}">
@@ -30,7 +30,7 @@
<div id="foot">
{% block footer %}{% include "_footer.twig" %}{% endblock %}
</div>
- <script src="{{ asset('js/bundle.js') }}"></script>
+ <script src="{{ asset('js/main.js') }}"></script>
{% block postload %}{% endblock %}
</body>
</html>
diff --git a/templates/includes/expander.twig b/templates/includes/expander.twig
index 55db45ae6..37deceb6b 100644
--- a/templates/includes/expander.twig
+++ b/templates/includes/expander.twig
@@ -11,6 +11,3 @@
</div>
</div>
-{% block postload %}
- <script src="{{ asset('js/expander.js') }}"></script>
-{% endblock %}
diff --git a/webpack.config.js b/webpack.config.js
index 01b924209..12a13b08a 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -18,7 +18,6 @@ module.exports = environment => {
return {
entry: {
bundle: './src/js/bundle',
- expander: './src/js/expander',
logout: './src/js/logout/main',
stylesheet: './src/js/style'
},
--
GitLab