Merge pull request #248 from oliver-mitchell/fix-non-whole-hour-timezone-display-on-clock

fix: non-whole-hour timezones now correctly shown on Clock widget
This commit is contained in:
Svilen Markov 2024-10-30 15:48:24 +00:00 committed by GitHub
commit c4149f5d94
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 35 additions and 4 deletions

View File

@ -503,9 +503,34 @@ function timeInZone(now, zone) {
timeInZone = now timeInZone = now
} }
const diffInHours = Math.round((timeInZone.getTime() - now.getTime()) / 1000 / 60 / 60); const diffInMinutes = Math.round((timeInZone.getTime() - now.getTime()) / 1000 / 60);
return { time: timeInZone, diffInHours: diffInHours }; return { time: timeInZone, diffInMinutes: diffInMinutes };
}
function zoneDiffText(diffInMinutes) {
if (diffInMinutes == 0) {
return "";
}
const sign = diffInMinutes < 0 ? "-" : "+";
const signText = diffInMinutes < 0 ? "behind" : "ahead";
diffInMinutes = Math.abs(diffInMinutes);
const hours = Math.floor(diffInMinutes / 60);
const minutes = diffInMinutes % 60;
const hourSuffix = hours == 1 ? "" : "s";
if (minutes == 0) {
return { text: `${sign}${hours}h`, title: `${hours} hour${hourSuffix} ${signText}` };
}
if (hours == 0) {
return { text: `${sign}${minutes}m`, title: `${minutes} minutes ${signText}` };
}
return { text: `${sign}${hours}h~`, title: `${hours} hour${hourSuffix} and ${minutes} minutes ${signText}` };
} }
function setupClocks() { function setupClocks() {
@ -548,9 +573,11 @@ function setupClocks() {
); );
updateCallbacks.push((now) => { updateCallbacks.push((now) => {
const { time, diffInHours } = timeInZone(now, timeZoneContainer.dataset.timeInZone); const { time, diffInMinutes } = timeInZone(now, timeZoneContainer.dataset.timeInZone);
setZoneTime(time); setZoneTime(time);
diffElement.textContent = (diffInHours <= 0 ? diffInHours : '+' + diffInHours) + 'h'; const { text, title } = zoneDiffText(diffInMinutes);
diffElement.textContent = text;
diffElement.title = title;
}); });
} }
} }

View File

@ -1350,6 +1350,10 @@ details[open] .summary::after {
transform: translate(-50%, -50%); transform: translate(-50%, -50%);
} }
.clock-time {
min-width: 8ch;
}
.clock-time span { .clock-time span {
color: var(--color-text-highlight); color: var(--color-text-highlight);
} }