From bdbbd06dad298dc3e1a5f568f4a3ff3635b48f22 Mon Sep 17 00:00:00 2001 From: kibigo! Date: Mon, 20 Nov 2017 22:13:37 -0800 Subject: Finalized theme loading and stuff --- app/javascript/packs/about.js | 22 +++++++++++ app/javascript/packs/application.js | 10 ----- app/javascript/packs/common.js | 3 ++ app/javascript/packs/public.js | 75 +++++++++++++++++++++++++++++++++++++ app/javascript/packs/share.js | 22 +++++++++++ 5 files changed, 122 insertions(+), 10 deletions(-) create mode 100644 app/javascript/packs/about.js create mode 100644 app/javascript/packs/common.js create mode 100644 app/javascript/packs/public.js create mode 100644 app/javascript/packs/share.js (limited to 'app/javascript/packs') diff --git a/app/javascript/packs/about.js b/app/javascript/packs/about.js new file mode 100644 index 000000000..63e12da42 --- /dev/null +++ b/app/javascript/packs/about.js @@ -0,0 +1,22 @@ +import loadPolyfills from '../mastodon/load_polyfills'; + +function loaded() { + const TimelineContainer = require('../mastodon/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(, mountNode); + } +} + +function main() { + const ready = require('../mastodon/ready').default; + ready(loaded); +} + +loadPolyfills().then(main).catch(error => { + console.error(error); +}); diff --git a/app/javascript/packs/application.js b/app/javascript/packs/application.js index ee5bf244c..116632dea 100644 --- a/app/javascript/packs/application.js +++ b/app/javascript/packs/application.js @@ -1,15 +1,5 @@ -// THIS IS THE `vanilla` THEME PACK FILE!! -// IT'S HERE FOR UPSTREAM COMPATIBILITY!! -// THE `glitch` PACK FILE IS IN `themes/glitch/index.js`!! - import loadPolyfills from '../mastodon/load_polyfills'; -// import default stylesheet with variables -import 'font-awesome/css/font-awesome.css'; -import '../styles/application.scss'; - -require.context('../images/', true); - loadPolyfills().then(() => { require('../mastodon/main').default(); }).catch(e => { diff --git a/app/javascript/packs/common.js b/app/javascript/packs/common.js new file mode 100644 index 000000000..f3156c1c6 --- /dev/null +++ b/app/javascript/packs/common.js @@ -0,0 +1,3 @@ +import 'font-awesome/css/font-awesome.css'; +import 'styles/application.scss' +require.context('../images/', true); diff --git a/app/javascript/packs/public.js b/app/javascript/packs/public.js new file mode 100644 index 000000000..3472af6c1 --- /dev/null +++ b/app/javascript/packs/public.js @@ -0,0 +1,75 @@ +import loadPolyfills from '../mastodon/load_polyfills'; +import ready from '../mastodon/ready'; + +function main() { + const IntlRelativeFormat = require('intl-relativeformat').default; + const emojify = require('../mastodon/features/emoji/emoji').default; + const { getLocale } = require('../mastodon/locales'); + const { localeData } = getLocale(); + const VideoContainer = require('../mastodon/containers/video_container').default; + const MediaGalleryContainer = require('../mastodon/containers/media_gallery_container').default; + const CardContainer = require('../mastodon/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(, content); + }); + + [].forEach.call(document.querySelectorAll('[data-component="MediaGallery"]'), (content) => { + const props = JSON.parse(content.getAttribute('data-props')); + ReactDOM.render(, content); + }); + + [].forEach.call(document.querySelectorAll('[data-component="Card"]'), (content) => { + const props = JSON.parse(content.getAttribute('data-props')); + ReactDOM.render(, content); + }); + }); +} + +loadPolyfills().then(main).catch(error => { + console.error(error); +}); diff --git a/app/javascript/packs/share.js b/app/javascript/packs/share.js new file mode 100644 index 000000000..e9580f648 --- /dev/null +++ b/app/javascript/packs/share.js @@ -0,0 +1,22 @@ +import loadPolyfills from '../mastodon/load_polyfills'; + +function loaded() { + const ComposeContainer = require('../mastodon/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(, mountNode); + } +} + +function main() { + const ready = require('../mastodon/ready').default; + ready(loaded); +} + +loadPolyfills().then(main).catch(error => { + console.error(error); +}); -- cgit