summaryrefslogtreecommitdiff
path: root/app/assets/javascripts/behaviors/toggler_behavior.js
diff options
context:
space:
mode:
Diffstat (limited to 'app/assets/javascripts/behaviors/toggler_behavior.js')
-rw-r--r--app/assets/javascripts/behaviors/toggler_behavior.js84
1 files changed, 42 insertions, 42 deletions
diff --git a/app/assets/javascripts/behaviors/toggler_behavior.js b/app/assets/javascripts/behaviors/toggler_behavior.js
index 576b8a0425f..77e92ff8caf 100644
--- a/app/assets/javascripts/behaviors/toggler_behavior.js
+++ b/app/assets/javascripts/behaviors/toggler_behavior.js
@@ -1,44 +1,44 @@
-/* eslint-disable wrap-iife, func-names, space-before-function-paren, prefer-arrow-callback, vars-on-top, no-var, max-len */
-(function(w) {
- $(function() {
- var toggleContainer = function(container, /* optional */toggleState) {
- var $container = $(container);
-
- $container
- .find('.js-toggle-button .fa')
- .toggleClass('fa-chevron-up', toggleState)
- .toggleClass('fa-chevron-down', toggleState !== undefined ? !toggleState : undefined);
-
- $container
- .find('.js-toggle-content')
- .toggle(toggleState);
- };
-
- // Toggle button. Show/hide content inside parent container.
- // Button does not change visibility. If button has icon - it changes chevron style.
- //
- // %div.js-toggle-container
- // %button.js-toggle-button
- // %div.js-toggle-content
- //
- $('body').on('click', '.js-toggle-button', function(e) {
- toggleContainer($(this).closest('.js-toggle-container'));
-
- const targetTag = e.currentTarget.tagName.toLowerCase();
- if (targetTag === 'a' || targetTag === 'button') {
- e.preventDefault();
- }
- });
-
- // If we're accessing a permalink, ensure it is not inside a
- // closed js-toggle-container!
- var hash = w.gl.utils.getLocationHash();
- var anchor = hash && document.getElementById(hash);
- var container = anchor && $(anchor).closest('.js-toggle-container');
-
- if (container) {
- toggleContainer(container, true);
- anchor.scrollIntoView();
+
+// Toggle button. Show/hide content inside parent container.
+// Button does not change visibility. If button has icon - it changes chevron style.
+//
+// %div.js-toggle-container
+// %button.js-toggle-button
+// %div.js-toggle-content
+//
+
+$(() => {
+ function toggleContainer(container, toggleState) {
+ const $container = $(container);
+
+ $container
+ .find('.js-toggle-button .fa')
+ .toggleClass('fa-chevron-up', toggleState)
+ .toggleClass('fa-chevron-down', toggleState !== undefined ? !toggleState : undefined);
+
+ $container
+ .find('.js-toggle-content')
+ .toggle(toggleState);
+ }
+
+ $('body').on('click', '.js-toggle-button', function toggleButton(e) {
+ e.target.classList.toggle('open');
+ toggleContainer($(this).closest('.js-toggle-container'));
+
+ const targetTag = e.currentTarget.tagName.toLowerCase();
+ if (targetTag === 'a' || targetTag === 'button') {
+ e.preventDefault();
}
});
-})(window);
+
+ // If we're accessing a permalink, ensure it is not inside a
+ // closed js-toggle-container!
+ const hash = window.gl.utils.getLocationHash();
+ const anchor = hash && document.getElementById(hash);
+ const container = anchor && $(anchor).closest('.js-toggle-container');
+
+ if (container) {
+ toggleContainer(container, true);
+ anchor.scrollIntoView();
+ }
+});