diff --git a/app/javascript/mastodon/main.js b/app/javascript/mastodon/main.js index cc422c109..a7fc22a00 100644 --- a/app/javascript/mastodon/main.js +++ b/app/javascript/mastodon/main.js @@ -1,12 +1,14 @@ +import * as OfflinePluginRuntime from 'offline-plugin/runtime'; +import * as WebPushSubscription from './web_push_subscription'; +import Mastodon from 'mastodon/containers/mastodon'; +import React from 'react'; +import ReactDOM from 'react-dom'; import ready from './ready'; const perf = require('./performance'); function main() { perf.start('main()'); - const Mastodon = require('mastodon/containers/mastodon').default; - const React = require('react'); - const ReactDOM = require('react-dom'); if (window.history && history.replaceState) { const { pathname, search, hash } = window.location; @@ -23,9 +25,6 @@ function main() { ReactDOM.render(, mountNode); if (process.env.NODE_ENV === 'production') { // avoid offline in dev mode because it's harder to debug - const OfflinePluginRuntime = require('offline-plugin/runtime'); - const WebPushSubscription = require('./web_push_subscription'); - OfflinePluginRuntime.install(); WebPushSubscription.register(); } diff --git a/app/javascript/packs/about.js b/app/javascript/packs/about.js index 7b8ab5e5d..6705377c1 100644 --- a/app/javascript/packs/about.js +++ b/app/javascript/packs/about.js @@ -1,12 +1,11 @@ -import TimelineContainer from '../mastodon/containers/timeline_container'; -import React from 'react'; -import ReactDOM from 'react-dom'; import loadPolyfills from '../mastodon/load_polyfills'; -import ready from '../mastodon/ready'; require.context('../images/', true); 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) { @@ -16,6 +15,7 @@ function loaded() { } function main() { + const ready = require('../mastodon/ready').default; ready(loaded); } diff --git a/app/javascript/packs/application.js b/app/javascript/packs/application.js index 63c5d6272..116632dea 100644 --- a/app/javascript/packs/application.js +++ b/app/javascript/packs/application.js @@ -1,6 +1,7 @@ -import main from '../mastodon/main'; import loadPolyfills from '../mastodon/load_polyfills'; -loadPolyfills().then(main).catch(e => { +loadPolyfills().then(() => { + require('../mastodon/main').default(); +}).catch(e => { console.error(e); }); diff --git a/app/javascript/packs/public.js b/app/javascript/packs/public.js index 371e0f445..ce79836d6 100644 --- a/app/javascript/packs/public.js +++ b/app/javascript/packs/public.js @@ -1,44 +1,43 @@ -import { length } from 'stringz'; -import IntlRelativeFormat from 'intl-relativeformat'; -import { delegate } from 'rails-ujs'; -import emojify from '../mastodon/emoji'; -import { getLocale } from '../mastodon/locales'; import loadPolyfills from '../mastodon/load_polyfills'; -import ready from '../mastodon/ready'; -const { localeData } = getLocale(); -localeData.forEach(IntlRelativeFormat.__addLocaleData); +function main() { + const { length } = require('stringz'); + const IntlRelativeFormat = require('intl-relativeformat').default; + const { delegate } = require('rails-ujs'); + const emojify = require('../mastodon/emoji').default; + const { getLocale } = require('../mastodon/locales'); + const ready = require('../mastodon/ready').default; -function loaded() { - 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); + const { localeData } = getLocale(); + localeData.forEach(IntlRelativeFormat.__addLocaleData); - [].forEach.call(document.querySelectorAll('.emojify'), (content) => { - content.innerHTML = emojify(content.innerHTML); - }); + 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('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('.emojify'), (content) => { + content.innerHTML = emojify(content.innerHTML); + }); - [].forEach.call(document.querySelectorAll('time.time-ago'), (content) => { - const datetime = new Date(content.getAttribute('datetime')); - content.textContent = relativeFormat.format(datetime);; - }); -} + [].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; + }); -function main() { - ready(loaded); + [].forEach.call(document.querySelectorAll('time.time-ago'), (content) => { + const datetime = new Date(content.getAttribute('datetime')); + content.textContent = relativeFormat.format(datetime);; + }); + }); delegate(document, '.video-player video', 'click', ({ target }) => { if (target.paused) {