Fix incorrect `toggle` buttons (#23676)

Some of those are still Copy&Paste problems.

This PR:

* Only cleans the legacy incorrect code, doesn't change or improve the
"action" logic.
* Remove the redundant `$('.toggle.button').on('click')`, now
`$('.show-panel.button').on('click')` handles that kinds of buttons

Actually, there is only one correct "toggle button" in code, the one on
the webhook page.

No need to backport.

diff --git a/templates/repo/diff/options_dropdown.tmpl b/templates/repo/diff/options_dropdown.tmpl
index 8bb92c45fe028ec3fd566e67361638d8ab8a0883..93e1183d1b18f40bffabf2a90933c72068c5137e 100644 (file)
--- a/templates/repo/diff/options_dropdown.tmpl
+++ b/templates/repo/diff/options_dropdown.tmpl
@@ -1,7 +1,7 @@
 <div class="ui dropdown tiny basic button icon-button" data-tooltip-content="{{.locale.Tr "repo.diff.options_button"}}">
        {{svg "octicon-kebab-horizontal"}}
        <div class="menu">
-               <a class="item tiny basic toggle button" id="show-file-list-btn">{{.locale.Tr "repo.diff.show_diff_stats"}}</a>
+               <a class="item" id="show-file-list-btn">{{.locale.Tr "repo.diff.show_diff_stats"}}</a>
                {{if .Issue.Index}}
                        <a class="item" href="{{$.RepoLink}}/pulls/{{.Issue.Index}}.patch" download="{{.Issue.Index}}.patch">{{.locale.Tr "repo.diff.download_patch"}}</a>
                        <a class="item" href="{{$.RepoLink}}/pulls/{{.Issue.Index}}.diff" download="{{.Issue.Index}}.diff">{{.locale.Tr "repo.diff.download_diff"}}</a>

diff --git a/templates/repo/diff/whitespace_dropdown.tmpl b/templates/repo/diff/whitespace_dropdown.tmpl
index 790bcfef5ad79cfdc8c2f7b76527e688fcd14a6c..4d9b00cb5512e4ed828fbc6d5006c099dad633ba 100644 (file)
--- a/templates/repo/diff/whitespace_dropdown.tmpl
+++ b/templates/repo/diff/whitespace_dropdown.tmpl
@@ -28,4 +28,4 @@
                </a>
        </div>
 </div>
-<a class="ui tiny basic toggle button icon-button" href="?style={{if .IsSplitStyle}}unified{{else}}split{{end}}&whitespace={{$.WhitespaceBehavior}}" data-tooltip-content="{{if .IsSplitStyle}}{{.locale.Tr "repo.diff.show_unified_view"}}{{else}}{{.locale.Tr "repo.diff.show_split_view"}}{{end}}">{{if .IsSplitStyle}}{{svg "gitea-join"}}{{else}}{{svg "gitea-split"}}{{end}}</a>
+<a class="ui tiny basic button icon-button" href="?style={{if .IsSplitStyle}}unified{{else}}split{{end}}&whitespace={{$.WhitespaceBehavior}}" data-tooltip-content="{{if .IsSplitStyle}}{{.locale.Tr "repo.diff.show_unified_view"}}{{else}}{{.locale.Tr "repo.diff.show_split_view"}}{{end}}">{{if .IsSplitStyle}}{{svg "gitea-join"}}{{else}}{{svg "gitea-split"}}{{end}}</a>

diff --git a/templates/repo/settings/webhook/history.tmpl b/templates/repo/settings/webhook/history.tmpl
index ff482846a79f05955aa1be1d22e766a710062f8a..e573d221d14bedde958949f4fd6770cf6ef920f0 100644 (file)
--- a/templates/repo/settings/webhook/history.tmpl
+++ b/templates/repo/settings/webhook/history.tmpl
@@ -18,7 +18,7 @@
                                                {{else}}
                                                        <span class="text red">{{svg "octicon-alert"}}</span>
                                                {{end}}
-                                               <a class="ui primary sha label toggle button" data-target="#info-{{.ID}}">{{.UUID}}</a>
+                                               <a class="ui primary sha label toggle button show-panel" data-panel="#info-{{.ID}}">{{.UUID}}</a>
                                                <div class="ui right">
                                                        <span class="text grey time">
                                                                {{.DeliveredString}}

diff --git a/web_src/js/features/common-global.js b/web_src/js/features/common-global.js
index a061e53d8a9c105b63af4d8d9cd3c1e4b8200ae6..96fa8a7dd2cac072933df8b6efb03b809b2b7b1e 100644 (file)
--- a/web_src/js/features/common-global.js
+++ b/web_src/js/features/common-global.js
@@ -118,10 +118,6 @@ export function initGlobalCommon() {
 
   $('.tabular.menu .item').tab();
 
-  $('.toggle.button').on('click', function () {
-    toggleElem($($(this).data('target')));
-  });
-
   // prevent multiple form submissions on forms containing .loading-button
   document.addEventListener('submit', (e) => {
     const btn = e.target.querySelector('.loading-button');
@@ -310,8 +306,15 @@ export function initGlobalButtons() {
   });
 
   $('.show-panel.button').on('click', function (e) {
+    // a '.show-panel.button' can show a panel, by `data-panel="selector"`
+    // if the button is a "toggle" button, it toggles the panel
     e.preventDefault();
-    showElem($(this).data('panel'));
+    const sel = $(this).attr('data-panel');
+    if (this.classList.contains('toggle')) {
+      toggleElem(sel);
+    } else {
+      showElem(sel);
+    }
   });
 
   $('.hide-panel.button').on('click', function (e) {