mirror of
https://github.com/MadeBaruna/paimon-moe.git
synced 2024-12-22 14:35:38 +01:00
Add item list
This commit is contained in:
I Made Setia Baruna
parent
33e14ec8e9
commit
14f6a4ae06
13 changed files with 389 additions and 26 deletions
|
|
@ -62,6 +62,12 @@
|
|||
image="/images/calculator.png"
|
||||
label="Calculator"
|
||||
href="/calculator" />
|
||||
<SidebarItem
|
||||
on:clicked={close}
|
||||
active={segment === 'items'}
|
||||
image="/images/items.png"
|
||||
label="Items"
|
||||
href="/items" />
|
||||
<SidebarItem
|
||||
on:clicked={close}
|
||||
active={segment === 'todo'}
|
||||
|
|
|
|||
|
|
@ -1562,24 +1562,24 @@ export const characters = {
|
|||
stats: { hp: 10122, atk: 198, def: 635 },
|
||||
material: {
|
||||
book: [
|
||||
'teachings_of_freedom',
|
||||
'guide_to_resistance',
|
||||
'guide_to_ballad',
|
||||
'guide_to_freedom',
|
||||
'guide_to_resistance',
|
||||
'philosophies_of_ballad',
|
||||
'philosophies_of_freedom',
|
||||
'philosophies_of_resistance',
|
||||
itemList.teachings_of_freedom,
|
||||
itemList.guide_to_resistance,
|
||||
itemList.guide_to_ballad,
|
||||
itemList.guide_to_freedom,
|
||||
itemList.guide_to_resistance,
|
||||
itemList.philosophies_of_ballad,
|
||||
itemList.philosophies_of_freedom,
|
||||
itemList.philosophies_of_resistance,
|
||||
],
|
||||
material: [
|
||||
'divining_scroll',
|
||||
'sealed_scroll',
|
||||
'sealed_scroll',
|
||||
'sealed_scroll',
|
||||
'sealed_scroll',
|
||||
'forbidden_curse_scroll',
|
||||
'forbidden_curse_scroll',
|
||||
'forbidden_curse_scroll',
|
||||
itemList.divining_scroll,
|
||||
itemList.sealed_scroll,
|
||||
itemList.sealed_scroll,
|
||||
itemList.sealed_scroll,
|
||||
itemList.sealed_scroll,
|
||||
itemList.forbidden_curse_scroll,
|
||||
itemList.forbidden_curse_scroll,
|
||||
itemList.forbidden_curse_scroll,
|
||||
],
|
||||
boss: itemList.dvalins_sigh,
|
||||
},
|
||||
|
|
|
|||
82
src/data/itemGroup.js
Normal file
82
src/data/itemGroup.js
Normal file
|
|
@ -0,0 +1,82 @@
|
|||
import { itemList } from './itemList';
|
||||
|
||||
export const itemGroup = {
|
||||
teachings_of_freedom: {
|
||||
name: 'Freedom',
|
||||
items: [itemList.teachings_of_freedom, itemList.guide_to_freedom, itemList.philosophies_of_freedom],
|
||||
},
|
||||
teachings_of_ballad: {
|
||||
name: 'Ballad',
|
||||
items: [itemList.teachings_of_ballad, itemList.guide_to_ballad, itemList.philosophies_of_ballad],
|
||||
},
|
||||
teachings_of_gold: {
|
||||
name: 'Gold',
|
||||
items: [itemList.teachings_of_gold, itemList.guide_to_gold, itemList.philosophies_of_gold],
|
||||
},
|
||||
teachings_of_resistance: {
|
||||
name: 'Resistance',
|
||||
items: [itemList.teachings_of_resistance, itemList.guide_to_resistance, itemList.philosophies_of_resistance],
|
||||
},
|
||||
teachings_of_diligence: {
|
||||
name: 'Diligence',
|
||||
items: [itemList.teachings_of_diligence, itemList.guide_to_diligence, itemList.philosophies_of_diligence],
|
||||
},
|
||||
teachings_of_prosperity: {
|
||||
name: 'Prosperrity',
|
||||
items: [itemList.teachings_of_prosperity, itemList.guide_to_prosperity, itemList.philosophies_of_prosperity],
|
||||
},
|
||||
tile_of_decarabians_tower: {
|
||||
name: 'Decarabian',
|
||||
items: [
|
||||
itemList.tile_of_decarabians_tower,
|
||||
itemList.debris_of_decarabians_city,
|
||||
itemList.fragment_of_decarabians_epic,
|
||||
itemList.scattered_piece_of_decarabians_dream,
|
||||
],
|
||||
},
|
||||
luminous_sands_from_guyun: {
|
||||
name: 'Guyun',
|
||||
items: [
|
||||
itemList.luminous_sands_from_guyun,
|
||||
itemList.lustrous_stone_from_guyun,
|
||||
itemList.relic_from_guyun,
|
||||
itemList.divine_body_from_guyun,
|
||||
],
|
||||
},
|
||||
boreal_wolfs_milk_tooth: {
|
||||
name: 'Boreal Wolf',
|
||||
items: [
|
||||
itemList.boreal_wolfs_milk_tooth,
|
||||
itemList.boreal_wolfs_cracked_tooth,
|
||||
itemList.boreal_wolfs_broken_fang,
|
||||
itemList.boreal_wolfs_nostalgia,
|
||||
],
|
||||
},
|
||||
mist_veiled_lead_elixir: {
|
||||
name: 'Mist Veiled Elixir',
|
||||
items: [
|
||||
itemList.mist_veiled_lead_elixir,
|
||||
itemList.mist_veiled_mercury_elixir,
|
||||
itemList.mist_veiled_gold_elixir,
|
||||
itemList.mist_veiled_primo_elixir,
|
||||
],
|
||||
},
|
||||
fetters_of_the_dandelion_gladiator: {
|
||||
name: 'Dandelion Gladiator',
|
||||
items: [
|
||||
itemList.fetters_of_the_dandelion_gladiator,
|
||||
itemList.chains_of_the_dandelion_gladiator,
|
||||
itemList.shackles_of_the_dandelion_gladiator,
|
||||
itemList.dream_of_the_dandelion_gladiator,
|
||||
],
|
||||
},
|
||||
grain_of_aerosiderite: {
|
||||
name: 'Aerosiderite',
|
||||
items: [
|
||||
itemList.grain_of_aerosiderite,
|
||||
itemList.piece_of_aerosiderite,
|
||||
itemList.bit_of_aerosiderite,
|
||||
itemList.chunk_of_aerosiderite,
|
||||
],
|
||||
},
|
||||
};
|
||||
|
|
@ -600,7 +600,56 @@ export const weaponList = {
|
|||
secondary: 'ATK',
|
||||
type: weapons.sword,
|
||||
source: 'wish',
|
||||
ascension: [],
|
||||
ascension: [
|
||||
{
|
||||
items: [
|
||||
{ item: itemList.unknown, amount: 0 },
|
||||
{ item: itemList.unknown, amount: 0 },
|
||||
{ item: itemList.unknown, amount: 0 },
|
||||
],
|
||||
mora: 0,
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{ item: itemList.unknown, amount: 0 },
|
||||
{ item: itemList.unknown, amount: 0 },
|
||||
{ item: itemList.unknown, amount: 0 },
|
||||
],
|
||||
mora: 0,
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{ item: itemList.unknown, amount: 0 },
|
||||
{ item: itemList.unknown, amount: 0 },
|
||||
{ item: itemList.unknown, amount: 0 },
|
||||
],
|
||||
mora: 0,
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{ item: itemList.unknown, amount: 0 },
|
||||
{ item: itemList.unknown, amount: 0 },
|
||||
{ item: itemList.unknown, amount: 0 },
|
||||
],
|
||||
mora: 0,
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{ item: itemList.unknown, amount: 0 },
|
||||
{ item: itemList.unknown, amount: 0 },
|
||||
{ item: itemList.unknown, amount: 0 },
|
||||
],
|
||||
mora: 0,
|
||||
},
|
||||
{
|
||||
items: [
|
||||
{ item: itemList.unknown, amount: 0 },
|
||||
{ item: itemList.unknown, amount: 0 },
|
||||
{ item: itemList.unknown, amount: 0 },
|
||||
],
|
||||
mora: 0,
|
||||
},
|
||||
],
|
||||
},
|
||||
skyward_blade: {
|
||||
name: 'Skyward Blade',
|
||||
|
|
|
|||
|
|
@ -100,7 +100,7 @@
|
|||
<div class="lg:ml-64 pt-20 lg:pt-8">
|
||||
<h1 class="font-display px-8 font-black text-5xl text-white">Characters</h1>
|
||||
<p class="text-gray-400 px-8 font-medium pb-4" style="margin-top: -1rem;">
|
||||
※ Stat numbers are at level 60. You can also click the header to sort!
|
||||
※ Stat numbers are at level 80 Ascension 6. You can also click the header to sort!
|
||||
</p>
|
||||
|
||||
<div class="block overflow-x-auto whitespace-no-wrap pb-8">
|
||||
|
|
|
|||
226
src/routes/items.svelte
Normal file
226
src/routes/items.svelte
Normal file
|
|
@ -0,0 +1,226 @@
|
|||
<script>
|
||||
import { characters } from '../data/characters';
|
||||
import { itemGroup } from '../data/itemGroup';
|
||||
import { itemList } from '../data/itemList';
|
||||
import { weaponList } from '../data/weaponList';
|
||||
|
||||
let dayName = {
|
||||
monday_thursday: ['Monday', 'Thursday'],
|
||||
tuesday_friday: ['Tuesday', 'Friday'],
|
||||
wednesday_saturday: ['Wednesday', 'Saturday'],
|
||||
};
|
||||
|
||||
let charactersDays = {
|
||||
monday_thursday: {},
|
||||
tuesday_friday: {},
|
||||
wednesday_saturday: {},
|
||||
};
|
||||
|
||||
let weaponsDays = {
|
||||
monday_thursday: {},
|
||||
tuesday_friday: {},
|
||||
wednesday_saturday: {},
|
||||
};
|
||||
|
||||
let allItems = {};
|
||||
|
||||
function parseData() {
|
||||
for (const [_, character] of Object.entries(characters)) {
|
||||
const item = character.material.book[0];
|
||||
if (charactersDays[item.day.join('_')][item.id] === undefined) {
|
||||
charactersDays[item.day.join('_')][item.id] = [];
|
||||
}
|
||||
charactersDays[item.day.join('_')][item.id].push(character.id);
|
||||
|
||||
const ascension = character.ascension[0];
|
||||
for (const item of ascension.items) {
|
||||
if (item.amount) {
|
||||
if (allItems[item.item.id] === undefined) {
|
||||
allItems[item.item.id] = {};
|
||||
}
|
||||
allItems[item.item.id][character.id] = 'characters';
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
for (const [_, weapon] of Object.entries(weaponList)) {
|
||||
if (weapon.rarity < 4) continue;
|
||||
const items = weapon.ascension[0].items;
|
||||
for (const itemData of items) {
|
||||
const item = itemData.item;
|
||||
if (item.day) {
|
||||
if (weaponsDays[item.day.join('_')][item.id] === undefined) {
|
||||
weaponsDays[item.day.join('_')][item.id] = [];
|
||||
}
|
||||
weaponsDays[item.day.join('_')][item.id].push(weapon.id);
|
||||
} else if (itemData.amount) {
|
||||
if (allItems[item.id] === undefined) {
|
||||
allItems[item.id] = {};
|
||||
}
|
||||
allItems[item.id][weapon.id] = 'weapons';
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
console.log(allItems);
|
||||
}
|
||||
|
||||
parseData();
|
||||
</script>
|
||||
|
||||
<style>
|
||||
td {
|
||||
@apply text-white;
|
||||
@apply px-4;
|
||||
@apply align-top;
|
||||
|
||||
scrollbar-width: none;
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
width: 0;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
&.weapon-cell {
|
||||
min-width: 29.5rem;
|
||||
@apply whitespace-normal;
|
||||
@apply overflow-x-scroll;
|
||||
@apply overflow-y-hidden;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<svelte:head>
|
||||
<title>Item List - Paimon.moe</title>
|
||||
</svelte:head>
|
||||
<div class="lg:ml-64 pt-20 lg:pt-8">
|
||||
<h1 class="font-display px-8 font-black text-5xl text-white">Item List</h1>
|
||||
<p class="text-gray-400 px-8 font-medium pb-4" style="margin-top: -1rem;">
|
||||
※ Click the item image to add it to the todo list
|
||||
</p>
|
||||
<div class="block overflow-x-auto whitespace-no-wrap pb-8">
|
||||
<div class="px-8 table max-w-full">
|
||||
<table class="w-full block p-4 bg-item rounded-xl">
|
||||
<thead>
|
||||
<th class="text-gray-400 select-none font-display text-lg text-left px-4 pb-2 border-gray-700 border-b">
|
||||
Days
|
||||
</th>
|
||||
<th class="text-gray-400 select-none font-display text-lg text-left px-4 pb-2 border-gray-700 border-b">
|
||||
Materials
|
||||
</th>
|
||||
<th class="text-gray-400 select-none font-display text-lg text-left px-4 pb-2 border-gray-700 border-b">
|
||||
Characters
|
||||
</th>
|
||||
</thead>
|
||||
<tbody>
|
||||
{#each Object.entries(dayName) as [day, dayArr]}
|
||||
{#each Object.entries(charactersDays[day]) as [itemName, chars], index}
|
||||
<tr>
|
||||
<td class="py-2">
|
||||
{#if index === 0}{dayArr[0]}<br />{dayArr[1]}{/if}
|
||||
</td>
|
||||
<td class="border-gray-700 border-b text-center align-middle py-2">
|
||||
<div class="flex items-center">
|
||||
<div
|
||||
class="h-12 w-12 md:h-14 md:w-14 mr-2 cursor-pointer hover:bg-background rounded-xl
|
||||
inline-flex items-center justify-center align-top">
|
||||
<img
|
||||
class="w-full max-h-full object-contain"
|
||||
src={`/images/items/${itemName}.png`}
|
||||
alt={itemName} />
|
||||
</div>
|
||||
<span>{itemGroup[itemName].name}</span>
|
||||
</div>
|
||||
</td>
|
||||
<td class="border-gray-700 border-b py-2">
|
||||
{#each chars as char}
|
||||
<div
|
||||
class="h-12 w-12 md:h-14 md:w-14 cursor-pointer mr-2 hover:bg-background rounded-xl
|
||||
inline-flex items-center justify-center align-top">
|
||||
<img class="w-full max-h-full object-contain" src={`/images/characters/${char}.png`} alt={char} />
|
||||
</div>
|
||||
{/each}
|
||||
</td>
|
||||
</tr>
|
||||
{/each}
|
||||
{#each Object.entries(weaponsDays[day]) as [itemName, weapons], index}
|
||||
<tr>
|
||||
<td
|
||||
class={index === Object.entries(charactersDays[day]).length - 1 ? 'border-gray-700 border-b py-2' : 'py-2'} />
|
||||
<td class="border-gray-700 border-b text-center py-2">
|
||||
<div class="flex items-center">
|
||||
<div
|
||||
class="h-12 w-12 md:h-14 md:w-14 mr-2 cursor-pointer hover:bg-background rounded-xl
|
||||
inline-flex items-center justify-center align-top">
|
||||
<img
|
||||
class="w-full max-h-full object-contain"
|
||||
src={`/images/items/${itemName}.png`}
|
||||
alt={itemName} />
|
||||
</div>
|
||||
<span class="whitespace-normal text-left w-0">{itemGroup[itemName].name}</span>
|
||||
</div>
|
||||
</td>
|
||||
<td class="border-gray-700 border-b weapon-cell pt-2">
|
||||
{#each weapons as weapon}
|
||||
<div
|
||||
class="h-12 w-12 md:h-14 md:w-14 cursor-pointer mr-2 mb-2 hover:bg-background rounded-xl
|
||||
inline-flex items-center justify-center align-top">
|
||||
<img
|
||||
class="w-full max-h-full object-contain"
|
||||
src={`/images/weapons/${weapon}.png`}
|
||||
alt={weapon} />
|
||||
</div>
|
||||
{/each}
|
||||
</td>
|
||||
</tr>
|
||||
{/each}
|
||||
{/each}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<div class="block overflow-x-auto whitespace-no-wrap pb-8">
|
||||
<div class="px-8 table max-w-full">
|
||||
<table class="w-full block p-4 bg-item rounded-xl">
|
||||
<thead>
|
||||
<th class="text-gray-400 select-none font-display text-lg text-left px-4 pb-2 border-gray-700 border-b">
|
||||
Material
|
||||
</th>
|
||||
<th class="text-gray-400 select-none font-display text-lg text-left px-4 pb-2 border-gray-700 border-b">
|
||||
Characters
|
||||
</th>
|
||||
</thead>
|
||||
<tbody>
|
||||
{#each Object.entries(allItems).sort((a, b) => a[0].localeCompare(b[0])) as [itemName, char]}
|
||||
<tr>
|
||||
<td class="border-gray-700 border-b align-middle py-2">
|
||||
<div class="flex items-center">
|
||||
<div
|
||||
class="h-12 w-12 md:h-14 md:w-14 mr-2 cursor-pointer hover:bg-background rounded-xl inline-flex items-center justify-center">
|
||||
<img
|
||||
class="w-full max-h-full object-contain"
|
||||
src={`/images/items/${itemName}.png`}
|
||||
alt={itemName} />
|
||||
</div>
|
||||
<span>{itemList[itemName].name}</span>
|
||||
</div>
|
||||
</td>
|
||||
<td class="border-gray-700 border-b align-middle pt-2 weapon-cell">
|
||||
{#each Object.entries(char) as [charName, type]}
|
||||
<div
|
||||
class="h-12 w-12 md:h-14 md:w-14 mb-2 cursor-pointer mr-2 hover:bg-background rounded-xl
|
||||
inline-flex items-center justify-center align-top">
|
||||
<img
|
||||
class="w-full max-h-full object-contain"
|
||||
src={`/images/${type}/${charName}.png`}
|
||||
alt={charName} />
|
||||
</div>
|
||||
{/each}
|
||||
</td>
|
||||
</tr>
|
||||
{/each}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -1,7 +1,6 @@
|
|||
<script>
|
||||
import { getContext, tick } from 'svelte';
|
||||
import { mdiChevronLeft, mdiChevronRight, mdiClose, mdiLoading } from '@mdi/js';
|
||||
import dayjs from 'dayjs';
|
||||
import { mdiChevronLeft, mdiChevronRight, mdiClose, mdiLoading, mdiPlus } from '@mdi/js';
|
||||
import { todos, loading } from '../stores/todo';
|
||||
import { itemList } from '../data/itemList';
|
||||
import Masonry from 'svelte-masonry/Masonry.svelte';
|
||||
|
|
@ -109,12 +108,9 @@
|
|||
{#if $loading}
|
||||
<Icon path={mdiLoading} color="white" spin />
|
||||
{:else if $todos.length > 0}
|
||||
<div>
|
||||
<Button className="float-right" size="md" on:click={toggleTodayOnly}>
|
||||
Show
|
||||
{todayOnly ? 'All Day' : 'Today Only'}
|
||||
</Button>
|
||||
<p class="font-bold text-xl mb-4">Summary</p>
|
||||
<div class="flex items-center mb-4">
|
||||
<p class="font-bold text-xl mr-2 flex-1">Summary</p>
|
||||
<Button size="md" on:click={toggleTodayOnly}>Show {todayOnly ? 'All Day' : 'Today Only'}</Button>
|
||||
</div>
|
||||
{:else}
|
||||
<p class="font-bold text-xl">Nothing to do yet 😀<br />Add some here or from the Calculator!</p>
|
||||
|
|
|
|||
BIN
static/images/items.png
Normal file
BIN
static/images/items.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.1 KiB |
BIN
static/images/items/guide_to_freedom.png
Normal file
BIN
static/images/items/guide_to_freedom.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 61 KiB |
BIN
static/images/items/guide_to_resistance.png
Normal file
BIN
static/images/items/guide_to_resistance.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 62 KiB |
BIN
static/images/items/philosophies_of_freedom.png
Normal file
BIN
static/images/items/philosophies_of_freedom.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 62 KiB |
BIN
static/images/items/starconch.png
Normal file
BIN
static/images/items/starconch.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 37 KiB |
|
|
@ -43,6 +43,9 @@ module.exports = {
|
|||
height: {
|
||||
14: '3.5rem',
|
||||
},
|
||||
width: {
|
||||
14: '3.5rem',
|
||||
},
|
||||
},
|
||||
},
|
||||
variants: {
|
||||
|
|
@ -51,6 +54,7 @@ module.exports = {
|
|||
backgroundImage: ['responsive', 'hover', 'focus'],
|
||||
borderColor: ['responsive', 'hover', 'focus', 'focus-within', 'disabled'],
|
||||
opacity: ['group-hover', 'responsive', 'hover', 'focus', 'disabled'],
|
||||
borderWidth: ['responsive', 'last', 'hover', 'focus'],
|
||||
},
|
||||
plugins: [],
|
||||
future: {
|
||||
|
|
|
|||
Loading…
Reference in a new issue