You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

87 lines
3.3 KiB

  1. import loadPolyfills from '../mastodon/load_polyfills';
  2. import ready from '../mastodon/ready';
  3. import { start } from '../mastodon/common';
  4. start();
  5. function main() {
  6. const { length } = require('stringz');
  7. const IntlMessageFormat = require('intl-messageformat').default;
  8. const { timeAgoString } = require('../mastodon/components/relative_timestamp');
  9. const { delegate } = require('rails-ujs');
  10. const emojify = require('../mastodon/features/emoji/emoji').default;
  11. const { getLocale } = require('../mastodon/locales');
  12. const { messages } = getLocale();
  13. const React = require('react');
  14. const ReactDOM = require('react-dom');
  15. const Rellax = require('rellax');
  16. const createHistory = require('history').createBrowserHistory;
  17. ready(() => {
  18. const locale = document.documentElement.lang;
  19. const dateTimeFormat = new Intl.DateTimeFormat(locale, {
  20. year: 'numeric',
  21. month: 'long',
  22. day: 'numeric',
  23. hour: 'numeric',
  24. minute: 'numeric',
  25. });
  26. [].forEach.call(document.querySelectorAll('.emojify'), (content) => {
  27. content.innerHTML = emojify(content.innerHTML);
  28. });
  29. [].forEach.call(document.querySelectorAll('time.formatted'), (content) => {
  30. const datetime = new Date(content.getAttribute('datetime'));
  31. const formattedDate = dateTimeFormat.format(datetime);
  32. content.title = formattedDate;
  33. content.textContent = formattedDate;
  34. });
  35. [].forEach.call(document.querySelectorAll('time.time-ago'), (content) => {
  36. const datetime = new Date(content.getAttribute('datetime'));
  37. const now = new Date();
  38. content.title = dateTimeFormat.format(datetime);
  39. content.textContent = timeAgoString({
  40. formatMessage: ({ id, defaultMessage }, values) => (new IntlMessageFormat(messages[id] || defaultMessage, locale)).format(values),
  41. formatDate: (date, options) => (new Intl.DateTimeFormat(locale, options)).format(date),
  42. }, datetime, now, datetime.getFullYear());
  43. });
  44. [].forEach.call(document.querySelectorAll('.modal-button'), (content) => {
  45. content.addEventListener('click', (e) => {
  46. e.preventDefault();
  47. window.open(e.target.href, 'mastodon-intent', 'width=445,height=600,resizable=no,menubar=no,status=no,scrollbars=yes');
  48. });
  49. });
  50. const reactComponents = document.querySelectorAll('[data-component]');
  51. if (reactComponents.length > 0) {
  52. import(/* webpackChunkName: "containers/media_container" */ '../mastodon/containers/media_container')
  53. .then(({ default: MediaContainer }) => {
  54. const content = document.createElement('div');
  55. ReactDOM.render(<MediaContainer locale={locale} components={reactComponents} />, content);
  56. document.body.appendChild(content);
  57. })
  58. .catch(error => console.error(error));
  59. }
  60. new Rellax('.parallax', { speed: -1 });
  61. const history = createHistory();
  62. const detailedStatuses = document.querySelectorAll('.public-layout .detailed-status');
  63. const location = history.location;
  64. if (detailedStatuses.length === 1 && (!location.state || !location.state.scrolledToDetailedStatus)) {
  65. detailedStatuses[0].scrollIntoView();
  66. history.replace(location.pathname, { ...location.state, scrolledToDetailedStatus: true });
  67. }
  68. });
  69. }
  70. loadPolyfills().then(main).catch(error => {
  71. console.error(error);
  72. });