[PATCH v3 03/10] patch-detail: refactor JS code into submission.js

[Raxel Gutierrez]

Move submission.html script code for toggling header info to a separate
submission.js file that makes the code easy to read and ready for change
in one place.

Signed-off-by: Raxel Gutierrez <raxel at google.com>
---
 htdocs/js/submission.js                       | 42 +++++++++++++++++++
 patchwork/templates/patchwork/submission.html | 23 +++-------
 2 files changed, 47 insertions(+), 18 deletions(-)
 create mode 100644 htdocs/js/submission.js

diff --git a/htdocs/js/submission.js b/htdocs/js/submission.js
new file mode 100644
index 0000000..9676f34
--- /dev/null
+++ b/htdocs/js/submission.js
@@ -0,0 +1,42 @@
+$( document ).ready(function() {
+    function toggleDiv(link_id, headers_id, label_show, label_hide) {
+        const link = document.getElementById(link_id)
+        const headers = document.getElementById(headers_id)
+
+        const hidden = headers.style['display'] == 'none';
+
+        if (hidden) {
+            link.innerHTML = label_hide || 'hide';
+            headers.style['display'] = 'block';
+        } else {
+            link.innerHTML = label_show || 'show';
+            headers.style['display'] = 'none';
+        }
+    }
+
+    // Click listener to show/hide headers
+    document.getElementById("toggle-patch-headers").addEventListener("click", function() {
+        toggleDiv("toggle-patch-headers", "patch-headers");
+    });
+
+    // Click listener to expand/collapse series
+    document.getElementById("toggle-patch-series").addEventListener("click", function() {
+        toggleDiv("toggle-patch-series", "patch-series", "expand", "collapse");
+    });
+
+    // Click listener to show/hide related patches
+    let related = document.getElementById("toggle-related");
+    if (related) {
+        document.getElementById("toggle-related").addEventListener("click", function() {
+            toggleDiv("toggle-related", "related");
+        });
+    }
+
+    // Click listener to show/hide related patches from different projects
+    let relatedOutside = document.getElementById("toggle-related-outside");
+    if (relatedOutside) {
+        document.getElementById("toggle-related-outside").addEventListener("click", function() {
+            toggleDiv("toggle-related-outside", "related-outside", "show from other projects");
+        });
+    }
+});
\ No newline at end of file
diff --git a/patchwork/templates/patchwork/submission.html b/patchwork/templates/patchwork/submission.html
index 2e457cf..19d9413 100644
--- a/patchwork/templates/patchwork/submission.html
+++ b/patchwork/templates/patchwork/submission.html
@@ -4,28 +4,15 @@
 {% load syntax %}
 {% load person %}
 {% load patch %}
+{% load static %}
+
+{% block headers %}
+  <script type="module" src="{% static "js/submission.js" %}"></script>
+{% endblock %}
 
 {% block title %}{{submission.name}}{% endblock %}
 
 {% block body %}
-<script>
-function toggle_div(link_id, headers_id, label_show, label_hide)
-{
-    var link = document.getElementById(link_id)
-    var headers = document.getElementById(headers_id)
-
-    var hidden = headers.style['display'] == 'none';
-
-    if (hidden) {
-        link.innerHTML = label_hide || 'hide';
-        headers.style['display'] = 'block';
-    } else {
-        link.innerHTML = label_show || 'show';
-        headers.style['display'] = 'none';
-    }
-
-}
-</script>
 
 <div>
   {% include "patchwork/partials/download-buttons.html" %}
-- 
2.33.0.rc1.237.g0d66db33f3-goog