diff --git a/src/components/Sidebar/Sidebar.svelte b/src/components/Sidebar/Sidebar.svelte index f1eb4555..c08810c2 100644 --- a/src/components/Sidebar/Sidebar.svelte +++ b/src/components/Sidebar/Sidebar.svelte @@ -105,6 +105,7 @@ 'weapons', 'artifacts', 'radiant-spincrystal', + 'calendar', ].includes(segment)} image="/images/items.png" label={$t('sidebar.database')} @@ -117,6 +118,7 @@ { label: $t('sidebar.artifacts'), href: '/artifacts' }, { label: $t('sidebar.fishing'), href: '/fishing' }, { label: $t('sidebar.radiantSpincrystal'), href: '/radiant-spincrystal' }, + { label: $t('sidebar.calendar'), href: '/calendar' }, ]} /> + import { t } from 'svelte-i18n'; + + export let char; + export let time; + + +
+
+ {#each char as c} +
+ {c.name} +
+ {/each} +
+ {#each char as c} +

{$t(c.name)} {$t('calendar.birthday')}

+ {/each} +

+ + {time.format('D MMMM')} + +

+
diff --git a/src/routes/timeline/_detail.svelte b/src/routes/calendar/_detail.svelte similarity index 63% rename from src/routes/timeline/_detail.svelte rename to src/routes/calendar/_detail.svelte index 5983f14e..c9b561e1 100644 --- a/src/routes/timeline/_detail.svelte +++ b/src/routes/calendar/_detail.svelte @@ -4,12 +4,28 @@ import dayjs from 'dayjs'; import { onMount } from 'svelte'; + import { bannersDual } from '../../data/bannersDual'; + + export let type; export let event; export let timeDifference; + let start = dayjs(event.start); + let end = dayjs(event.end); + let now = dayjs().add(timeDifference, 'minute'); + let image = type === 'banners' ? `${event.name} ${event.image}.png` : event.image; + let banner2 = null; + onMount(() => { + console.log(bannersDual[`${event.name} ${event.image}`]); + if (type === 'banners') { + if (bannersDual[`${event.name} ${event.image}`] !== undefined) { + banner2 = bannersDual[`${event.name} ${event.image}`][1]; + } + } + const interval = setInterval(() => { now = dayjs().add(timeDifference, 'minute'); }, 1000); @@ -21,22 +37,28 @@ $: started = now.isAfter(event.start); $: ended = now.isAfter(event.end); - $: diffStart = event.start.diff(now); - $: diffEnd = event.end.diff(now); + $: diffStart = start.diff(now); + $: diffEnd = end.diff(now);
{#if event.image} - {event.name} + {event.name} + {/if} + {#if banner2} + {banner2.name} {/if}

{event.name}

+ {#if banner2} +

{banner2.name}

+ {/if}

- {event.start.format('ddd, D MMM YYYY HH:mm')} + {start.format('ddd, D MMM YYYY HH:mm')} {#if !event.startOnly}-{/if} {#if !event.startOnly} - {event.end.format('ddd, D MMM YYYY HH:mm')} + {end.format('ddd, D MMM YYYY HH:mm')} {/if}

{#if event.url} diff --git a/src/routes/calendar/_old.svelte b/src/routes/calendar/_old.svelte new file mode 100644 index 00000000..ed7f7293 --- /dev/null +++ b/src/routes/calendar/_old.svelte @@ -0,0 +1,273 @@ + + + + +
+
+ + + {monthName} + {selectedYear} + + +
+ + + + {#each weekNames as day} + + {/each} + + +
+ {day} +
+ {#each month as week, i} +
+ + + {#each week as day} + +
+ {/each} +
+ + + {#each week as day} + + {/each} + + {#each weeks[i] as stack} + + {#each stack as w} + {#if w.t === 'b'} + + {:else if w.t === 'w'} + + {:else} + + {/each} +
{day.d}
+

+ {#each w.d as char} + {char} + {/each} + Birthday +

+ 		+

+ {w.d.name} +

+ 		+ {/if} + {/each} +
+
+ {/each} +
diff --git a/src/routes/calendar/index.svelte b/src/routes/calendar/index.svelte new file mode 100644 index 00000000..7f8908f3 --- /dev/null +++ b/src/routes/calendar/index.svelte @@ -0,0 +1,520 @@ + + + + +
+
+
+ + +
+

+ {browserTimeZone} +

+

+ {monthName} + {selectedYear} +

+

+ {$server} Server +

+
+ + +
+
+ {#each weekNames as day} +
+ {day} +
+ {/each} +
+ {#each month as week} +
+ {#each week as day} +
+

{day.d}

+
+ {#if day.wc} +
openDetail('banners', day.wc)} + style="--tw-ring-color: {day.wc.color}; background-color: {day.wc.color};" + class="cursor-pointer rounded-md inline-flex items-center text-sm px-2 space-x-1 ring-offset-1 ring-offset-background hover:ring-2" + > + + {#each day.wc.featured as char} + {char} + {/each} + {#each day.wc.featuredRare as char} + {char} + {/each} + +
+ {/if} + {#if day.wp} +
openDetail('banners', day.wp)} + class="cursor-pointer bg-orange-200 rounded-md inline-flex items-center text-sm px-2 ring-orange-200 ring-offset-1 ring-offset-background hover:ring-2" + > + + {#each day.wp.featured as weapon} + {weapon} + {/each} + +
+ {/if} + {#if day.b} +
openBirthday(day.b, day.d, day.m)} + class="cursor-pointer bg-purple-400 rounded-md inline-flex items-center px-2 ring-purple-400 ring-offset-1 ring-offset-background hover:ring-2" + > + {#each day.b as char} + {char} + {/each} + 🎁 +
+ {/if} + {#if day.e} + {#each day.e as event} +
hoverEvent(event.e.name)} + on:mouseleave={() => hoverEvent('')} + on:click={() => openDetail('events', event.e)} + style="--tw-ring-color: {event.e.color}; --color: {event.e.color};" + class="cursor-pointer rounded-md ring-offset-1 ring-offset-background h-6 w-full inline-flex items-center text-xs px-2 space-x-1 event-strip {event.s + ? '' + : 'end'} {hovered === event.e.name ? 'ring-2' : ''}" + > +

{event.e.name}

+
+ {/each} + {/if} +
+
+ {/each} +
+ {/each} +
+ +

{$t('calendar.lastAppearance')}

+

+ ※ {$t('calendar.lastAppearanceDesc')} +

+
+
+ + + + + + + {#each sortedLegendary as [char, val]} + goToBannerTime(lastBannerStart[char])}> + + + + + + {/each} +
+ Name + Banner + Time
+ {char} + {characters[char].name}{val} + {lastBannerDate[char].humanize(true)} +
+
+
+ + + + + + + {#each sortedRare as [char, val]} + goToBannerTime(lastBannerStart[char])}> + + + + + + {/each} +
+ Name + Banner + Time
+ {char} + {characters[char].name}{val} + {lastBannerDate[char].humanize(true)} +
+
+
+
+ + diff --git a/src/routes/timeline/index.svelte b/src/routes/timeline/index.svelte index bc919250..807de607 100644 --- a/src/routes/timeline/index.svelte +++ b/src/routes/timeline/index.svelte @@ -13,7 +13,7 @@ import Checkbox from '../../components/Checkbox.svelte'; import EventItem from './_item.svelte'; - import DetailModal from './_detail.svelte'; + import DetailModal from '../calendar/_detail.svelte'; import { getAccountPrefix } from '../../stores/account'; import { readSave } from '../../stores/saveManager'; import Ad from '../../components/Ad.svelte'; diff --git a/src/service-worker.js b/src/service-worker.js index 6be05133..b94cedaf 100644 --- a/src/service-worker.js +++ b/src/service-worker.js @@ -7,7 +7,7 @@ const IMAGE_CACHE = `cacheimg${IMAGE_CACHE_VER}`; const IMAGE_URL = `${self.location.origin}/images/`; -const changelog = ['Update timeline', 'Fix item list on safari', 'Fix summit shaper materials']; +const changelog = ['Added calendar (database > calendar)', 'Minor fixes']; const channel = new BroadcastChannel('paimonmoe-sw'); diff --git a/static/images/characters/paimon.png b/static/images/characters/paimon.png new file mode 100644 index 00000000..f20211fa Binary files /dev/null and b/static/images/characters/paimon.png differ diff --git a/static/images/events/evermotion_mechanical_painting.jpg b/static/images/events/evermotion_mechanical_painting.jpg index b8cc591d..8db784ef 100644 Binary files a/static/images/events/evermotion_mechanical_painting.jpg and b/static/images/events/evermotion_mechanical_painting.jpg differ