forked from MapComplete/MapComplete
53 lines
1.7 KiB
Svelte
53 lines
1.7 KiB
Svelte
<script lang="ts">
|
|
/*
|
|
* Visualises collection times for a single collection range
|
|
*/
|
|
import { OH } from "../OpeningHours/OpeningHours"
|
|
import type { OpeningRange } from "../OpeningHours/OpeningHours"
|
|
|
|
import Translations from "../i18n/Translations"
|
|
import Tr from "../Base/Tr.svelte"
|
|
|
|
export let range: OpeningRange[][]
|
|
const wt = Translations.t.general.weekdays
|
|
const weekdays: Translation[] = [wt.sunday, wt.monday, wt.tuesday, wt.wednesday, wt.thursday, wt.friday, wt.saturday]
|
|
let allTheSame = OH.weekdaysIdentical(range, 0, range.length - 1)
|
|
let today = new Date().getDay()
|
|
|
|
let dayZero = -1
|
|
for (let i = 0; i < range.length; i++) {
|
|
const moments = range[i]
|
|
if (moments.length === 0) {
|
|
continue
|
|
}
|
|
const moment = moments[0]
|
|
const day = moment.startDate.getDay()
|
|
dayZero = day - i
|
|
}
|
|
function isToday(i:number ){
|
|
i = (i+dayZero) % 7
|
|
return i === today
|
|
}
|
|
</script>
|
|
|
|
{#if allTheSame && range[0]?.length > 0}
|
|
<div class="flex justify-between">
|
|
<slot />
|
|
{#each range[0] as moment (moment)}
|
|
<div class="ml-8">{moment.startDate.toLocaleTimeString()}</div>
|
|
{/each}
|
|
</div>
|
|
{:else if dayZero >= 0 } <!-- /*If dayZero == -1, then we got no valid values at all*/ -->
|
|
{#each range as moments, i (moments)}
|
|
<div class="flex gap-x-4 justify-between w-full px-2" class:interactive={isToday(i)} class:text-bold={isToday(i)} >
|
|
<Tr t={weekdays[(i + dayZero) % 7]} />
|
|
{#if range[i].length > 0}
|
|
{#each moments as moment (moment)}
|
|
<div class="ml-8">{moment.startDate.toLocaleTimeString()}</div>
|
|
{/each}
|
|
{:else}
|
|
<Tr cls="italic subtle" t={Translations.t.general.points_in_time.closed}/>
|
|
{/if}
|
|
</div>
|
|
{/each}
|
|
{/if}
|