MetuFSS
/
metu.life
2
1
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Add localization of datetime in public page (#3296)

Browse Source
master
Yamagishi Kazutoshi 8 years ago committed by Eugen Rochko
parent 58f5040ee8
commit 531c1bb245
4 changed files with 80 additions and 99 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 171
      app/javascript/packs/public.js
  2. 2
      app/views/stream_entries/_detailed_status.html.haml
  3. 2
      package.json
  4. 4
      yarn.lock

171
app/javascript/packs/public.js
Unescape View File

@ -1,111 +1,96 @@
import emojify from 'mastodon/emoji';
import { getLocale } from 'mastodon/locales';
import { length } from 'stringz';
import { default as dateFormat } from 'date-fns/format';
import distanceInWordsStrict from 'date-fns/distance_in_words_strict';
import IntlRelativeFormat from 'intl-relativeformat';
import { delegate } from 'rails-ujs';
require.context('../images/', true);
const parseFormat = (format) => format.replace(/%(\w)/g, (_, modifier) => {
switch (modifier) {
case '%':
return '%';
case 'a':
return 'ddd';
case 'A':
return 'ddd';
case 'b':
return 'MMM';
case 'B':
return 'MMMM';
case 'd':
return 'DD';
case 'H':
return 'HH';
case 'I':
return 'hh';
case 'l':
return 'H';
case 'm':
return 'M';
case 'M':
return 'mm';
case 'p':
return 'A';
case 'S':
return 'ss';
case 'w':
return 'd';
case 'y':
return 'YY';
case 'Y':
return 'YYYY';
default:
return `%${modifier}`;
}
});
const { localeData } = getLocale();
localeData.forEach(IntlRelativeFormat.__addLocaleData);
document.addEventListener('DOMContentLoaded', () => {
[].forEach.call(document.querySelectorAll('.emojify'), (content) => {
content.innerHTML = emojify(content.innerHTML);
function main() {
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[data-format]'), (content) => {
const format = parseFormat(content.dataset.format);
const formattedDate = dateFormat(content.getAttribute('datetime'), format);
content.textContent = formattedDate;
});
document.addEventListener('DOMContentLoaded', () => {
[].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 timeAgo = distanceInWordsStrict(new Date(), content.getAttribute('datetime'), {
addSuffix: true,
[].forEach.call(document.querySelectorAll('time.time-ago'), (content) => {
const datetime = new Date(content.getAttribute('datetime'));
content.textContent = relativeFormat.format(datetime);;
});
content.textContent = timeAgo;
});
});
delegate(document, '.video-player video', 'click', ({ target }) => {
if (target.paused) {
target.play();
} else {
target.pause();
}
});
delegate(document, '.video-player video', 'click', ({ target }) => {
if (target.paused) {
target.play();
} else {
target.pause();
}
});
delegate(document, '.media-spoiler', 'click', ({ target }) => {
target.style.display = 'none';
});
delegate(document, '.media-spoiler', 'click', ({ target }) => {
target.style.display = 'none';
});
delegate(document, '.webapp-btn', 'click', ({ target, button }) => {
if (button !== 0) {
return true;
}
window.location.href = target.href;
return false;
});
delegate(document, '.webapp-btn', 'click', ({ target, button }) => {
if (button !== 0) {
return true;
}
window.location.href = target.href;
return false;
});
delegate(document, '.status__content__spoiler-link', 'click', ({ target }) => {
const contentEl = target.parentNode.parentNode.querySelector('.e-content');
if (contentEl.style.display === 'block') {
contentEl.style.display = 'none';
target.parentNode.style.marginBottom = 0;
} else {
contentEl.style.display = 'block';
target.parentNode.style.marginBottom = null;
}
return false;
});
delegate(document, '.status__content__spoiler-link', 'click', ({ target }) => {
const contentEl = target.parentNode.parentNode.querySelector('.e-content');
if (contentEl.style.display === 'block') {
contentEl.style.display = 'none';
target.parentNode.style.marginBottom = 0;
} else {
contentEl.style.display = 'block';
target.parentNode.style.marginBottom = null;
}
return false;
});
delegate(document, '.account_display_name', 'input', ({ target }) => {
const nameCounter = document.querySelector('.name-counter');
if (nameCounter) {
nameCounter.textContent = 30 - length(target.value);
}
});
delegate(document, '.account_display_name', 'input', ({ target }) => {
const nameCounter = document.querySelector('.name-counter');
if (nameCounter) {
nameCounter.textContent = 30 - length(target.value);
}
});
delegate(document, '.account_note', 'input', ({ target }) => {
const noteCounter = document.querySelector('.note-counter');
if (noteCounter) {
noteCounter.textContent = 160 - length(target.value);
}
});
}
delegate(document, '.account_note', 'input', ({ target }) => {
const noteCounter = document.querySelector('.note-counter');
if (noteCounter) {
noteCounter.textContent = 160 - length(target.value);
}
});
if (!window.Intl) {
import(/* webpackChunkName: "base_polyfills" */ 'mastodon/base_polyfills').then(() => {
main();
}).catch(error => {
console.log(error); // eslint-disable-line no-console
});
} else {
main();
}

2
app/views/stream_entries/_detailed_status.html.haml
Unescape View File

@ -31,7 +31,7 @@
.detailed-status__meta
%data.dt-published{ value: status.created_at.to_time.iso8601 }
= link_to TagManager.instance.url_for(status), class: 'detailed-status__datetime u-url u-uid', target: stream_link_target, rel: 'noopener' do
%time{ datetime: status.created_at.iso8601, title: l(status.created_at), data: { format: t('time.formats.default') } }= l(status.created_at)
%time.formatted{ datetime: status.created_at.iso8601, title: l(status.created_at) }= l(status.created_at)
·
- if status.application
- if status.application.website.blank?

2
package.json
Unescape View File

@ -42,7 +42,6 @@
"coffee-script": "^1.12.5",
"compression-webpack-plugin": "^0.4.0",
"css-loader": "^0.28.0",
"date-fns": "^1.28.4",
"dotenv": "^4.0.0",
"emojione": "^2.2.7",
"emojione-picker": "^2.2.1",
@ -57,6 +56,7 @@
"immutable": "^3.8.1",
"intersection-observer": "^0.2.1",
"intl": "^1.2.5",
"intl-relativeformat": "^1.3.0",
"is-nan": "^1.2.1",
"js-yaml": "^3.8.3",
"lodash": "^4.17.4",

4
yarn.lock
Unescape View File

@ -2016,10 +2016,6 @@ dashdash@^1.12.0:
dependencies:
assert-plus "^1.0.0"
date-fns@^1.28.4:
version "1.28.4"
resolved "https://registry.yarnpkg.com/date-fns/-/date-fns-1.28.4.tgz#7938aec34ba31fc8bd134d2344bc2e0bbfd95165"
date-now@^0.1.4:
version "0.1.4"
resolved "https://registry.yarnpkg.com/date-now/-/date-now-0.1.4.tgz#eaf439fd4d4848ad74e5cc7dbef200672b9e345b"

Write Preview
Loading…
Cancel
Save