tyler.durden
/
pandorafms
mirror of https://github.com/pandorafms/pandorafms.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Visual Console Refactor: added localization to the humanDate function 

Former-commit-id: 35ebb12a87ad3c39e0883c1eeb00ad03a91905dd
This commit is contained in:
Alejandro Gallardo Escobar 2019-04-24 13:28:14 +02:00
parent 46d7d68585
commit 029445d90b
2 changed files with 21 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
visual_console_client/src/items/Clock/index.ts
View File

@ -500,7 +500,7 @@ export default class Clock extends Item<ClockProps> {
if (this.props.clockFormat === "datetime") { if (this.props.clockFormat === "datetime") {
const dateElem: HTMLSpanElement = document.createElement("span"); const dateElem: HTMLSpanElement = document.createElement("span");
dateElem.className = "date"; dateElem.className = "date";
dateElem.textContent = humanDate(date); dateElem.textContent = humanDate(date, "default");
dateElem.style.fontSize = `${dateFontSize}px`; dateElem.style.fontSize = `${dateFontSize}px`;
if (this.props.color) dateElem.style.color = this.props.color; if (this.props.color) dateElem.style.color = this.props.color;
element.append(dateElem); element.append(dateElem);

31
visual_console_client/src/lib.ts
View File

@ -281,19 +281,29 @@ export function decodeBase64(input: string): string {
/** /**
* Generate a date representation with the format 'd/m/Y'. * Generate a date representation with the format 'd/m/Y'.
* @param initialDate Date to be used instead of a generated one. * @param initialDate Date to be used instead of a generated one.
* @param locale Locale to use if localization is required and available.
* @example 24/02/2020. * @example 24/02/2020.
* @return Date representation. * @return Date representation.
*/ */
export function humanDate(initialDate: Date | null = null): string { export function humanDate(date: Date, locale: string | null = null): string {
const date = initialDate || new Date(); if (locale && Intl && Intl.DateTimeFormat) {
// Use getDate, getDay returns the week day. // Format using the user locale.
const day = leftPad(date.getDate(), 2, 0); const options: Intl.DateTimeFormatOptions = {
// The getMonth function returns the month starting by 0. day: "2-digit",
const month = leftPad(date.getMonth() + 1, 2, 0); month: "2-digit",
const year = leftPad(date.getFullYear(), 4, 0); year: "numeric"
};
return Intl.DateTimeFormat(locale, options).format(date);
} else {
// Use getDate, getDay returns the week day.
const day = leftPad(date.getDate(), 2, 0);
// The getMonth function returns the month starting by 0.
const month = leftPad(date.getMonth() + 1, 2, 0);
const year = leftPad(date.getFullYear(), 4, 0);
// Format: 'd/m/Y'. // Format: 'd/m/Y'.
return `${day}/${month}/${year}`; return `${day}/${month}/${year}`;
}
} }
/** /**
@ -302,8 +312,7 @@ export function humanDate(initialDate: Date | null = null): string {
* @example 01:34:09. * @example 01:34:09.
* @return Time representation. * @return Time representation.
*/ */
export function humanTime(initialDate: Date | null = null): string { export function humanTime(date: Date): string {
const date = initialDate || new Date();
const hours = leftPad(date.getHours(), 2, 0); const hours = leftPad(date.getHours(), 2, 0);
const minutes = leftPad(date.getMinutes(), 2, 0); const minutes = leftPad(date.getMinutes(), 2, 0);
const seconds = leftPad(date.getSeconds(), 2, 0); const seconds = leftPad(date.getSeconds(), 2, 0);