diff options
Diffstat (limited to 'app/javascript/flavours/glitch/packs/settings.js')
-rw-r--r-- | app/javascript/flavours/glitch/packs/settings.js | 43 |
1 files changed, 43 insertions, 0 deletions
diff --git a/app/javascript/flavours/glitch/packs/settings.js b/app/javascript/flavours/glitch/packs/settings.js new file mode 100644 index 000000000..31c88b2b5 --- /dev/null +++ b/app/javascript/flavours/glitch/packs/settings.js @@ -0,0 +1,43 @@ +import 'packs/public-path'; +import loadPolyfills from 'flavours/glitch/load_polyfills'; +import ready from 'flavours/glitch/ready'; +import loadKeyboardExtensions from 'flavours/glitch/load_keyboard_extensions'; +import 'cocoon-js-vanilla'; + +function main() { + const { delegate } = require('@rails/ujs'); + + const toggleSidebar = () => { + const sidebar = document.querySelector('.sidebar ul'); + const toggleButton = document.querySelector('.sidebar__toggle__icon'); + + if (sidebar.classList.contains('visible')) { + document.body.style.overflow = null; + toggleButton.setAttribute('aria-expanded', false); + } else { + document.body.style.overflow = 'hidden'; + toggleButton.setAttribute('aria-expanded', true); + } + + toggleButton.classList.toggle('active'); + sidebar.classList.toggle('visible'); + }; + + delegate(document, '.sidebar__toggle__icon', 'click', () => { + toggleSidebar(); + }); + + delegate(document, '.sidebar__toggle__icon', 'keydown', e => { + if (e.key === ' ' || e.key === 'Enter') { + e.preventDefault(); + toggleSidebar(); + } + }); +} + +loadPolyfills() + .then(main) + .then(loadKeyboardExtensions) + .catch(error => { + console.error(error); + }); |