diff options
Diffstat (limited to 'app/javascript/flavours/glitch/packs')
-rw-r--r-- | app/javascript/flavours/glitch/packs/about.js | 23 | ||||
-rw-r--r-- | app/javascript/flavours/glitch/packs/admin.js | 2 | ||||
-rw-r--r-- | app/javascript/flavours/glitch/packs/error.js | 2 | ||||
-rw-r--r-- | app/javascript/flavours/glitch/packs/home.js | 8 | ||||
-rw-r--r-- | app/javascript/flavours/glitch/packs/public.js | 40 | ||||
-rw-r--r-- | app/javascript/flavours/glitch/packs/settings.js | 31 | ||||
-rw-r--r-- | app/javascript/flavours/glitch/packs/share.js | 4 |
7 files changed, 64 insertions, 46 deletions
diff --git a/app/javascript/flavours/glitch/packs/about.js b/app/javascript/flavours/glitch/packs/about.js deleted file mode 100644 index 2e2cce501..000000000 --- a/app/javascript/flavours/glitch/packs/about.js +++ /dev/null @@ -1,23 +0,0 @@ -import 'packs/public-path'; -import loadPolyfills from 'flavours/glitch/util/load_polyfills'; - -function loaded() { - const TimelineContainer = require('flavours/glitch/containers/timeline_container').default; - const React = require('react'); - const ReactDOM = require('react-dom'); - const mountNode = document.getElementById('mastodon-timeline'); - - if (mountNode !== null) { - const props = JSON.parse(mountNode.getAttribute('data-props')); - ReactDOM.render(<TimelineContainer {...props} />, mountNode); - } -} - -function main() { - const ready = require('flavours/glitch/util/ready').default; - ready(loaded); -} - -loadPolyfills().then(main).catch(error => { - console.error(error); -}); diff --git a/app/javascript/flavours/glitch/packs/admin.js b/app/javascript/flavours/glitch/packs/admin.js index 4c09ddb05..56cdfc30a 100644 --- a/app/javascript/flavours/glitch/packs/admin.js +++ b/app/javascript/flavours/glitch/packs/admin.js @@ -1,5 +1,5 @@ import 'packs/public-path'; -import ready from 'flavours/glitch/util/ready'; +import ready from 'flavours/glitch/ready'; ready(() => { const React = require('react'); diff --git a/app/javascript/flavours/glitch/packs/error.js b/app/javascript/flavours/glitch/packs/error.js index 9f692ad37..f13e32149 100644 --- a/app/javascript/flavours/glitch/packs/error.js +++ b/app/javascript/flavours/glitch/packs/error.js @@ -1,5 +1,5 @@ import 'packs/public-path'; -import ready from 'flavours/glitch/util/ready'; +import ready from 'flavours/glitch/ready'; ready(() => { const image = document.querySelector('img'); diff --git a/app/javascript/flavours/glitch/packs/home.js b/app/javascript/flavours/glitch/packs/home.js index d06688985..ace9dc3c4 100644 --- a/app/javascript/flavours/glitch/packs/home.js +++ b/app/javascript/flavours/glitch/packs/home.js @@ -1,8 +1,10 @@ import 'packs/public-path'; -import loadPolyfills from 'flavours/glitch/util/load_polyfills'; +import loadPolyfills from 'flavours/glitch/load_polyfills'; -loadPolyfills().then(() => { - require('flavours/glitch/util/main').default(); +loadPolyfills().then(async () => { + const { default: main } = await import('flavours/glitch/main'); + + return main(); }).catch(e => { console.error(e); }); diff --git a/app/javascript/flavours/glitch/packs/public.js b/app/javascript/flavours/glitch/packs/public.js index 84ec9fce7..843fd5163 100644 --- a/app/javascript/flavours/glitch/packs/public.js +++ b/app/javascript/flavours/glitch/packs/public.js @@ -1,18 +1,17 @@ import 'packs/public-path'; -import loadPolyfills from 'flavours/glitch/util/load_polyfills'; -import ready from 'flavours/glitch/util/ready'; -import loadKeyboardExtensions from 'flavours/glitch/util/load_keyboard_extensions'; +import loadPolyfills from 'flavours/glitch/load_polyfills'; +import ready from 'flavours/glitch/ready'; +import loadKeyboardExtensions from 'flavours/glitch/load_keyboard_extensions'; function main() { const IntlMessageFormat = require('intl-messageformat').default; const { timeAgoString } = require('flavours/glitch/components/relative_timestamp'); const { delegate } = require('@rails/ujs'); - const emojify = require('flavours/glitch/util/emoji').default; + const emojify = require('flavours/glitch/features/emoji/emoji').default; const { getLocale } = require('locales'); const { messages } = getLocale(); const React = require('react'); const ReactDOM = require('react-dom'); - const Rellax = require('rellax'); const { createBrowserHistory } = require('history'); const scrollToDetailedStatus = () => { @@ -90,12 +89,6 @@ function main() { scrollToDetailedStatus(); } - const parallaxComponents = document.querySelectorAll('.parallax'); - - if (parallaxComponents.length > 0 ) { - new Rellax('.parallax', { speed: -1 }); - } - delegate(document, '#registration_user_password_confirmation,#registration_user_password', 'input', () => { const password = document.getElementById('registration_user_password'); const confirmation = document.getElementById('registration_user_password_confirmation'); @@ -146,8 +139,31 @@ function main() { }); }); + 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', () => { - document.querySelector('.sidebar ul').classList.toggle('visible'); + toggleSidebar(); + }); + + delegate(document, '.sidebar__toggle__icon', 'keydown', e => { + if (e.key === ' ' || e.key === 'Enter') { + e.preventDefault(); + toggleSidebar(); + } }); // Empty the honeypot fields in JS in case something like an extension diff --git a/app/javascript/flavours/glitch/packs/settings.js b/app/javascript/flavours/glitch/packs/settings.js index de88d4f52..31c88b2b5 100644 --- a/app/javascript/flavours/glitch/packs/settings.js +++ b/app/javascript/flavours/glitch/packs/settings.js @@ -1,14 +1,37 @@ import 'packs/public-path'; -import loadPolyfills from 'flavours/glitch/util/load_polyfills'; -import ready from 'flavours/glitch/util/ready'; -import loadKeyboardExtensions from 'flavours/glitch/util/load_keyboard_extensions'; +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', () => { - document.querySelector('.sidebar ul').classList.toggle('visible'); + toggleSidebar(); + }); + + delegate(document, '.sidebar__toggle__icon', 'keydown', e => { + if (e.key === ' ' || e.key === 'Enter') { + e.preventDefault(); + toggleSidebar(); + } }); } diff --git a/app/javascript/flavours/glitch/packs/share.js b/app/javascript/flavours/glitch/packs/share.js index f4a97e201..e5a79849a 100644 --- a/app/javascript/flavours/glitch/packs/share.js +++ b/app/javascript/flavours/glitch/packs/share.js @@ -1,5 +1,5 @@ import 'packs/public-path'; -import loadPolyfills from 'flavours/glitch/util/load_polyfills'; +import loadPolyfills from 'flavours/glitch/load_polyfills'; function loaded() { const ComposeContainer = require('flavours/glitch/containers/compose_container').default; @@ -14,7 +14,7 @@ function loaded() { } function main() { - const ready = require('flavours/glitch/util/ready').default; + const ready = require('flavours/glitch/ready').default; ready(loaded); } |