diff options
Diffstat (limited to 'app/javascript/flavours/glitch/packs')
-rw-r--r-- | app/javascript/flavours/glitch/packs/about.js | 22 | ||||
-rw-r--r-- | app/javascript/flavours/glitch/packs/common.js | 4 | ||||
-rw-r--r-- | app/javascript/flavours/glitch/packs/home.js | 7 | ||||
-rw-r--r-- | app/javascript/flavours/glitch/packs/public.js | 75 | ||||
-rw-r--r-- | app/javascript/flavours/glitch/packs/share.js | 22 |
5 files changed, 130 insertions, 0 deletions
diff --git a/app/javascript/flavours/glitch/packs/about.js b/app/javascript/flavours/glitch/packs/about.js new file mode 100644 index 000000000..bc0a4887b --- /dev/null +++ b/app/javascript/flavours/glitch/packs/about.js @@ -0,0 +1,22 @@ +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/common.js b/app/javascript/flavours/glitch/packs/common.js new file mode 100644 index 000000000..8dd4372bc --- /dev/null +++ b/app/javascript/flavours/glitch/packs/common.js @@ -0,0 +1,4 @@ +import 'flavours/glitch/styles/index.scss'; + +// This ensures that webpack compiles our images. +require.context('../images', true); diff --git a/app/javascript/flavours/glitch/packs/home.js b/app/javascript/flavours/glitch/packs/home.js new file mode 100644 index 000000000..b8f7b7d8e --- /dev/null +++ b/app/javascript/flavours/glitch/packs/home.js @@ -0,0 +1,7 @@ +import loadPolyfills from 'flavours/glitch/util/load_polyfills'; + +loadPolyfills().then(() => { + require('flavours/glitch/util/main').default(); +}).catch(e => { + console.error(e); +}); diff --git a/app/javascript/flavours/glitch/packs/public.js b/app/javascript/flavours/glitch/packs/public.js new file mode 100644 index 000000000..9ea82b53a --- /dev/null +++ b/app/javascript/flavours/glitch/packs/public.js @@ -0,0 +1,75 @@ +import loadPolyfills from 'flavours/glitch/util/load_polyfills'; +import ready from 'flavours/glitch/util/ready'; + +function main() { + const IntlRelativeFormat = require('intl-relativeformat').default; + const emojify = require('flavours/glitch/util/emoji').default; + const { getLocale } = require('locales'); + const { localeData } = getLocale(); + const VideoContainer = require('flavours/glitch/containers/video_container').default; + const MediaGalleryContainer = require('flavours/glitch/containers/media_gallery_container').default; + const CardContainer = require('flavours/glitch/containers/card_container').default; + const React = require('react'); + const ReactDOM = require('react-dom'); + + localeData.forEach(IntlRelativeFormat.__addLocaleData); + + ready(() => { + const locale = document.documentElement.lang; + + const dateTimeFormat = new Intl.DateTimeFormat(locale, { + year: 'numeric', + month: 'long', + day: 'numeric', + hour: 'numeric', + minute: 'numeric', + }); + + const relativeFormat = new IntlRelativeFormat(locale); + + [].forEach.call(document.querySelectorAll('.emojify'), (content) => { + content.innerHTML = emojify(content.innerHTML); + }); + + [].forEach.call(document.querySelectorAll('time.formatted'), (content) => { + const datetime = new Date(content.getAttribute('datetime')); + const formattedDate = dateTimeFormat.format(datetime); + + content.title = formattedDate; + content.textContent = formattedDate; + }); + + [].forEach.call(document.querySelectorAll('time.time-ago'), (content) => { + const datetime = new Date(content.getAttribute('datetime')); + + content.title = dateTimeFormat.format(datetime); + content.textContent = relativeFormat.format(datetime); + }); + + [].forEach.call(document.querySelectorAll('.logo-button'), (content) => { + content.addEventListener('click', (e) => { + e.preventDefault(); + window.open(e.target.href, 'mastodon-intent', 'width=400,height=400,resizable=no,menubar=no,status=no,scrollbars=yes'); + }); + }); + + [].forEach.call(document.querySelectorAll('[data-component="Video"]'), (content) => { + const props = JSON.parse(content.getAttribute('data-props')); + ReactDOM.render(<VideoContainer locale={locale} {...props} />, content); + }); + + [].forEach.call(document.querySelectorAll('[data-component="MediaGallery"]'), (content) => { + const props = JSON.parse(content.getAttribute('data-props')); + ReactDOM.render(<MediaGalleryContainer locale={locale} {...props} />, content); + }); + + [].forEach.call(document.querySelectorAll('[data-component="Card"]'), (content) => { + const props = JSON.parse(content.getAttribute('data-props')); + ReactDOM.render(<CardContainer locale={locale} {...props} />, content); + }); + }); +} + +loadPolyfills().then(main).catch(error => { + console.error(error); +}); diff --git a/app/javascript/flavours/glitch/packs/share.js b/app/javascript/flavours/glitch/packs/share.js new file mode 100644 index 000000000..9f2aa2553 --- /dev/null +++ b/app/javascript/flavours/glitch/packs/share.js @@ -0,0 +1,22 @@ +import loadPolyfills from 'flavours/glitch/util/load_polyfills'; + +function loaded() { + const ComposeContainer = require('flavours/glitch/containers/compose_container').default; + const React = require('react'); + const ReactDOM = require('react-dom'); + const mountNode = document.getElementById('mastodon-compose'); + + if (mountNode !== null) { + const props = JSON.parse(mountNode.getAttribute('data-props')); + ReactDOM.render(<ComposeContainer {...props} />, mountNode); + } +} + +function main() { + const ready = require('flavours/glitch/util/ready').default; + ready(loaded); +} + +loadPolyfills().then(main).catch(error => { + console.error(error); +}); |