Improve time display for upcoming Salmon Run shifts
Some checks failed
Deploy / deploy-frontend (push) Has been cancelled
Deploy / deploy-backend (push) Has been cancelled

This commit is contained in:
Matt Isenhower 2024-11-22 14:03:12 -08:00
parent be2ff7bac6
commit 951a12e7b8
2 changed files with 11 additions and 6 deletions

View File

@ -51,13 +51,18 @@ export function formatShortDuration(value) {
const { t } = useI18n();
let { negative, days, hours, minutes, seconds } = getDurationParts(value);
days = days && t('time.days', days);
hours = hours && t('time.hours', hours);
minutes = minutes && t('time.minutes', { n: minutes }, minutes);
seconds = t('time.seconds', { n: seconds }, seconds);
if (days)
return t('time.days', { n: `${negative}${days}` }, days);
return hours ? `${negative}${days} ${hours}` : `${negative}${days}`;
if (hours)
return t('time.hours', { n: `${negative}${hours}` }, hours);
return `${negative}${hours}`;
if (minutes)
return t('time.minutes', { n: `${negative}${minutes}` }, minutes);
return t('time.seconds', { n: `${negative}${seconds}` }, seconds);
return `${negative}${minutes}`;
return `${negative}${seconds}`;
}
export function formatShortDurationFromNow(value) {

View File

@ -14,7 +14,7 @@
<div v-if="time.isUpcoming(schedule.startTime)" class="inline-block">
{{ $t('salmonrun.opens') }}
{{ $t('time.in', { time: formatDurationHoursFromNow(schedule.startTime, true) }) }}
{{ $t('time.in', { time: formatShortDurationFromNow(schedule.startTime, true, true) }) }}
</div>
<div v-else class="inline-block">
{{ $t('time.remaining', { time: formatDurationHoursFromNow(schedule.endTime) }) }}
@ -57,7 +57,7 @@ import KingSalmonid from './KingSalmonid.vue';
import SalmonRunWeapons from './SalmonRunWeapons.vue';
import { useTimeStore } from '@/stores/time.mjs';
import StageImage from '@/components/StageImage.vue';
import { formatDurationFromNow, formatDurationHoursFromNow } from '@/common/time';
import { formatDurationFromNow, formatDurationHoursFromNow, formatShortDurationFromNow } from '@/common/time';
defineProps({
schedule: Object,