make dates rendered server-side & consistently in YYYY-MM-DD format
client-side time zone adjustment still persists---the server renders them out in UTC, but the client will adjust the date to its timezone during loading. this shouldn't cause any layout shifting because we use `font-variant-numeric: tabular-nums` (though Recursive seems to use tabular numbers either way.)
This commit is contained in:
parent
81373b1076
commit
1953b649cf
3 changed files with 20 additions and 5 deletions
|
@ -1,6 +1,8 @@
|
||||||
use std::{borrow::Cow, fmt::Write};
|
use std::{borrow::Cow, fmt::Write};
|
||||||
|
|
||||||
|
use chrono::{DateTime, Utc};
|
||||||
use treehouse_format::pull::BranchKind;
|
use treehouse_format::pull::BranchKind;
|
||||||
|
use ulid::Ulid;
|
||||||
|
|
||||||
use crate::{
|
use crate::{
|
||||||
config::Config,
|
config::Config,
|
||||||
|
@ -153,6 +155,15 @@ pub fn branch_to_html(
|
||||||
|
|
||||||
s.push_str("<th-bb>");
|
s.push_str("<th-bb>");
|
||||||
{
|
{
|
||||||
|
if let Some(date_time) = Ulid::from_string(&branch.attributes.id)
|
||||||
|
.ok()
|
||||||
|
.as_ref()
|
||||||
|
.map(Ulid::timestamp_ms)
|
||||||
|
.and_then(|ms| DateTime::from_timestamp_millis(ms as i64))
|
||||||
|
{
|
||||||
|
write!(s, "<th-bd>{}</th-bd>", date_time.format("%F")).unwrap();
|
||||||
|
}
|
||||||
|
|
||||||
if let Content::ResolvedLink(file_id) = &branch.attributes.content {
|
if let Content::ResolvedLink(file_id) = &branch.attributes.content {
|
||||||
let path = treehouse.tree_path(*file_id).expect(".tree file expected");
|
let path = treehouse.tree_path(*file_id).expect(".tree file expected");
|
||||||
write!(
|
write!(
|
||||||
|
|
|
@ -318,9 +318,10 @@ th-bb {
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Style branch dates to be smaller and less noticable. */
|
/* Style branch dates to be smaller and less noticable. */
|
||||||
th-bb .branch-date {
|
th-bd {
|
||||||
opacity: 50%;
|
opacity: 50%;
|
||||||
font-size: 0.8em;
|
font-size: 0.8em;
|
||||||
|
font-variant-numeric: tabular-nums;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Hide branch dates on very small displays. No clue how to fix this just yet. */
|
/* Hide branch dates on very small displays. No clue how to fix this just yet. */
|
||||||
|
|
|
@ -18,6 +18,10 @@ function branchIsOpen(branchID) {
|
||||||
return branchState[branchID];
|
return branchState[branchID];
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function dateToString(date) {
|
||||||
|
return new Date(date - date.getTimezoneOffset() * 60000).toISOString().substring(0, 10);
|
||||||
|
}
|
||||||
|
|
||||||
export class Branch {
|
export class Branch {
|
||||||
static branchesByNamedID = new Map();
|
static branchesByNamedID = new Map();
|
||||||
static onAdded = [];
|
static onAdded = [];
|
||||||
|
@ -70,11 +74,10 @@ export class Branch {
|
||||||
}
|
}
|
||||||
|
|
||||||
if (ulid.isCanonicalUlid(this.namedID)) {
|
if (ulid.isCanonicalUlid(this.namedID)) {
|
||||||
|
// Adjust dates to fit the user's time zone.
|
||||||
let timestamp = ulid.getTimestamp(this.namedID);
|
let timestamp = ulid.getTimestamp(this.namedID);
|
||||||
let date = document.createElement("span");
|
let branchDate = this.buttonBar.getElementsByTagName("th-bd")[0];
|
||||||
date.classList.add("branch-date");
|
branchDate.textContent = dateToString(timestamp);
|
||||||
date.innerText = timestamp.toLocaleDateString();
|
|
||||||
this.buttonBar.insertBefore(date, this.buttonBar.firstChild);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
for (let callback of Branch.onAdded) {
|
for (let callback of Branch.onAdded) {
|
||||||
|
|
Loading…
Reference in a new issue