diff mbox series

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

Message ID 20210813053127.2160595-4-raxel@google.com
State Accepted
Headers show
Series patch-detail: add unaddressed/addressed status to patch comments | expand

Commit Message

Raxel Gutierrez Aug. 13, 2021, 5:31 a.m. UTC 
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@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

Comments

Stephen Finucane Aug. 13, 2021, 9:22 a.m. UTC | #1 
On Fri, 2021-08-13 at 05:31 +0000, Raxel Gutierrez wrote:
> 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.
> 

This isn't entirely accurate since there's clearly more than code motion going
on here. The click listeners should have been added in the previous patch. I've
moved their removal to this patch and updated the commit message before applyin
both.

Thanks!

Stephen

> Signed-off-by: Raxel Gutierrez <raxel@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" %}
diff mbox series

Patch

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" %}