Compare commits

...

2 commits

Author SHA1 Message Date
1e5529838d
responsive! 2024-10-31 23:50:00 +01:00
7208b5d5c4
add katakana 2024-10-31 23:34:46 +01:00
5 changed files with 412 additions and 17 deletions

BIN
bun.lockb

Binary file not shown.

327
package-lock.json generated Normal file
View file

@ -0,0 +1,327 @@
{
"name": "is-this-your-weeb-card",
"version": "0.1.0",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"name": "is-this-your-weeb-card",
"version": "0.1.0",
"dependencies": {
"@hamcha/domutil": "^1.0.0",
"@hamcha/weeblib": "0.2.0"
},
"devDependencies": {
"@biomejs/biome": "^1.9.4",
"typescript": "^5.6.3",
"vite": "^5.4.10",
"vite-plugin-wasm": "^3.3.0"
}
},
"node_modules/@biomejs/biome": {
"version": "1.9.4",
"dev": true,
"hasInstallScript": true,
"license": "MIT OR Apache-2.0",
"bin": {
"biome": "bin/biome"
},
"engines": {
"node": ">=14.21.3"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/biome"
},
"optionalDependencies": {
"@biomejs/cli-darwin-arm64": "1.9.4",
"@biomejs/cli-darwin-x64": "1.9.4",
"@biomejs/cli-linux-arm64": "1.9.4",
"@biomejs/cli-linux-arm64-musl": "1.9.4",
"@biomejs/cli-linux-x64": "1.9.4",
"@biomejs/cli-linux-x64-musl": "1.9.4",
"@biomejs/cli-win32-arm64": "1.9.4",
"@biomejs/cli-win32-x64": "1.9.4"
}
},
"node_modules/@biomejs/cli-win32-x64": {
"version": "1.9.4",
"cpu": [
"x64"
],
"dev": true,
"license": "MIT OR Apache-2.0",
"optional": true,
"os": [
"win32"
],
"engines": {
"node": ">=14.21.3"
}
},
"node_modules/@esbuild/win32-x64": {
"version": "0.21.5",
"cpu": [
"x64"
],
"dev": true,
"license": "MIT",
"optional": true,
"os": [
"win32"
],
"engines": {
"node": ">=12"
}
},
"node_modules/@hamcha/domutil": {
"version": "1.0.0",
"license": "AGPL-3.0"
},
"node_modules/@hamcha/weeblib": {
"version": "0.2.0",
"resolved": "https://git.fromouter.space/api/packages/hamcha/npm/%40hamcha%2Fweeblib/-/0.2.0/weeblib-0.2.0.tgz",
"integrity": "sha512-TnO1FcLa00kryOA1cXGk4gs90jZXVE2JaSPif+SsqFEhxT5ytzdwxfk1IzHJGB9uvBqfleRnGfQYcEULxSjRcw=="
},
"node_modules/@rollup/rollup-win32-x64-msvc": {
"version": "4.24.0",
"cpu": [
"x64"
],
"dev": true,
"license": "MIT",
"optional": true,
"os": [
"win32"
]
},
"node_modules/@types/estree": {
"version": "1.0.6",
"dev": true,
"license": "MIT"
},
"node_modules/@types/node": {
"version": "20.12.14",
"dev": true,
"license": "MIT",
"optional": true,
"peer": true,
"dependencies": {
"undici-types": "~5.26.4"
}
},
"node_modules/esbuild": {
"version": "0.21.5",
"dev": true,
"hasInstallScript": true,
"license": "MIT",
"bin": {
"esbuild": "bin/esbuild"
},
"engines": {
"node": ">=12"
},
"optionalDependencies": {
"@esbuild/aix-ppc64": "0.21.5",
"@esbuild/android-arm": "0.21.5",
"@esbuild/android-arm64": "0.21.5",
"@esbuild/android-x64": "0.21.5",
"@esbuild/darwin-arm64": "0.21.5",
"@esbuild/darwin-x64": "0.21.5",
"@esbuild/freebsd-arm64": "0.21.5",
"@esbuild/freebsd-x64": "0.21.5",
"@esbuild/linux-arm": "0.21.5",
"@esbuild/linux-arm64": "0.21.5",
"@esbuild/linux-ia32": "0.21.5",
"@esbuild/linux-loong64": "0.21.5",
"@esbuild/linux-mips64el": "0.21.5",
"@esbuild/linux-ppc64": "0.21.5",
"@esbuild/linux-riscv64": "0.21.5",
"@esbuild/linux-s390x": "0.21.5",
"@esbuild/linux-x64": "0.21.5",
"@esbuild/netbsd-x64": "0.21.5",
"@esbuild/openbsd-x64": "0.21.5",
"@esbuild/sunos-x64": "0.21.5",
"@esbuild/win32-arm64": "0.21.5",
"@esbuild/win32-ia32": "0.21.5",
"@esbuild/win32-x64": "0.21.5"
}
},
"node_modules/nanoid": {
"version": "3.3.7",
"dev": true,
"funding": [
{
"type": "github",
"url": "https://github.com/sponsors/ai"
}
],
"license": "MIT",
"bin": {
"nanoid": "bin/nanoid.cjs"
},
"engines": {
"node": "^10 || ^12 || ^13.7 || ^14 || >=15.0.1"
}
},
"node_modules/picocolors": {
"version": "1.1.1",
"dev": true,
"license": "ISC"
},
"node_modules/postcss": {
"version": "8.4.47",
"dev": true,
"funding": [
{
"type": "opencollective",
"url": "https://opencollective.com/postcss/"
},
{
"type": "tidelift",
"url": "https://tidelift.com/funding/github/npm/postcss"
},
{
"type": "github",
"url": "https://github.com/sponsors/ai"
}
],
"license": "MIT",
"dependencies": {
"nanoid": "^3.3.7",
"picocolors": "^1.1.0",
"source-map-js": "^1.2.1"
},
"engines": {
"node": "^10 || ^12 || >=14"
}
},
"node_modules/rollup": {
"version": "4.24.0",
"dev": true,
"license": "MIT",
"dependencies": {
"@types/estree": "1.0.6"
},
"bin": {
"rollup": "dist/bin/rollup"
},
"engines": {
"node": ">=18.0.0",
"npm": ">=8.0.0"
},
"optionalDependencies": {
"@rollup/rollup-android-arm-eabi": "4.24.0",
"@rollup/rollup-android-arm64": "4.24.0",
"@rollup/rollup-darwin-arm64": "4.24.0",
"@rollup/rollup-darwin-x64": "4.24.0",
"@rollup/rollup-linux-arm-gnueabihf": "4.24.0",
"@rollup/rollup-linux-arm-musleabihf": "4.24.0",
"@rollup/rollup-linux-arm64-gnu": "4.24.0",
"@rollup/rollup-linux-arm64-musl": "4.24.0",
"@rollup/rollup-linux-powerpc64le-gnu": "4.24.0",
"@rollup/rollup-linux-riscv64-gnu": "4.24.0",
"@rollup/rollup-linux-s390x-gnu": "4.24.0",
"@rollup/rollup-linux-x64-gnu": "4.24.0",
"@rollup/rollup-linux-x64-musl": "4.24.0",
"@rollup/rollup-win32-arm64-msvc": "4.24.0",
"@rollup/rollup-win32-ia32-msvc": "4.24.0",
"@rollup/rollup-win32-x64-msvc": "4.24.0",
"fsevents": "~2.3.2"
}
},
"node_modules/source-map-js": {
"version": "1.2.1",
"dev": true,
"license": "BSD-3-Clause",
"engines": {
"node": ">=0.10.0"
}
},
"node_modules/typescript": {
"version": "5.6.3",
"dev": true,
"license": "Apache-2.0",
"bin": {
"tsc": "bin/tsc",
"tsserver": "bin/tsserver"
},
"engines": {
"node": ">=14.17"
}
},
"node_modules/undici-types": {
"version": "5.26.5",
"dev": true,
"license": "MIT",
"optional": true,
"peer": true
},
"node_modules/vite": {
"version": "5.4.10",
"dev": true,
"license": "MIT",
"dependencies": {
"esbuild": "^0.21.3",
"postcss": "^8.4.43",
"rollup": "^4.20.0"
},
"bin": {
"vite": "bin/vite.js"
},
"engines": {
"node": "^18.0.0 || >=20.0.0"
},
"funding": {
"url": "https://github.com/vitejs/vite?sponsor=1"
},
"optionalDependencies": {
"fsevents": "~2.3.3"
},
"peerDependencies": {
"@types/node": "^18.0.0 || >=20.0.0",
"less": "*",
"lightningcss": "^1.21.0",
"sass": "*",
"sass-embedded": "*",
"stylus": "*",
"sugarss": "*",
"terser": "^5.4.0"
},
"peerDependenciesMeta": {
"@types/node": {
"optional": true
},
"less": {
"optional": true
},
"lightningcss": {
"optional": true
},
"sass": {
"optional": true
},
"sass-embedded": {
"optional": true
},
"stylus": {
"optional": true
},
"sugarss": {
"optional": true
},
"terser": {
"optional": true
}
}
},
"node_modules/vite-plugin-wasm": {
"version": "3.3.0",
"dev": true,
"license": "MIT",
"peerDependencies": {
"vite": "^2 || ^3 || ^4 || ^5"
}
}
}
}

View file

@ -14,6 +14,6 @@
},
"dependencies": {
"@hamcha/domutil": "^1.0.0",
"@hamcha/weeblib": "0.1.2"
"@hamcha/weeblib": "0.2.0"
}
}

View file

@ -45,7 +45,7 @@ img.bg {
z-index: -1;
filter: blur(20px);
&.revealed {
&.reveal {
filter: none;
}
}
@ -56,6 +56,7 @@ h1 {
justify-content: center;
margin-bottom: 10rem;
word-spacing: 10px;
padding: 0 2rem;
}
.manacost {
@ -82,7 +83,7 @@ h2 {
}
.cardbox {
width: 50rem;
max-width: 50rem;
text-align: left;
padding: 2rem;
background-color: rgba(2, 9, 23, 0.8);
@ -105,6 +106,35 @@ h2 {
}
}
@media (max-width: 800px) {
.cardbox {
border-radius: 0;
}
main {
height: 100vh;
display: grid;
grid-template-columns: 1fr;
grid-template-rows: 1fr 1fr 100px;
h1 {
margin-bottom: 0;
flex-direction: column;
gap: 2rem;
}
.actions {
justify-self: center;
align-self: center;
button {
font-size: 1.2rem;
padding: 1rem 0.8rem;
}
}
}
}
.actions {
display: flex;
gap: 1rem;

View file

@ -1,5 +1,5 @@
import { $el } from '@hamcha/domutil';
import { convert_to_hiragana } from '@hamcha/weeblib';
import { convert_to_hiragana, convert_to_katakana } from '@hamcha/weeblib';
import { loadCardData } from './read-data';
@ -16,15 +16,37 @@ const parseMC = (mc: string) =>
let main = $el(
'main',
$el('h1', convert_to_hiragana('Caricamento in corso...')),
$el('h1', convert_to_katakana('Caricamento in corso...')),
);
document.body.appendChild(main);
const cards = await loadCardData();
const render = () => {
const randomCard = cards[Math.floor(Math.random() * cards.length)];
const cardImage = $el('img.bg', { src: scryfallURL(randomCard.id) });
type Format = 'hiragana' | 'katakana' | 'both';
const render = (format: Format, reveal = false, card_id?: number) => {
const index = card_id || Math.floor(Math.random() * cards.length);
const randomCard = cards[index];
const cardImage = $el('img', {
className: `bg ${format}`,
src: scryfallURL(randomCard.id),
});
const translate = (text: string) => {
if (reveal) {
return text;
}
switch (format) {
case 'hiragana':
return convert_to_hiragana(text);
case 'katakana':
return convert_to_katakana(text);
case 'both':
if (Math.random() > 0.5) {
return convert_to_hiragana(text);
}
return convert_to_katakana(text);
}
};
main.remove();
main = $el(
@ -32,17 +54,17 @@ const render = () => {
cardImage,
$el(
'h1',
convert_to_hiragana(randomCard.name),
translate(randomCard.name),
randomCard.manaCost
? $el('span.manacost', ...parseMC(randomCard.manaCost))
: '',
),
$el(
'article.cardbox',
$el('h2', convert_to_hiragana(randomCard.type.replace(' ', ''))),
$el('p.rules', convert_to_hiragana(randomCard.text)),
$el('h2', translate(randomCard.type.replace(' ', ''))),
$el('p.rules', translate(randomCard.text)),
randomCard.flavorText
? $el('p.flavor', convert_to_hiragana(randomCard.flavorText))
? $el('p.flavor', translate(randomCard.flavorText))
: '',
randomCard.power ? $el('p.power', `${randomCard.power}`) : '',
),
@ -53,19 +75,35 @@ const render = () => {
{
type: 'button',
'@click': () => {
cardImage.classList.toggle('revealed');
render(format, !reveal, index);
},
},
convert_to_hiragana('Rivela'),
reveal ? 'Nascondi' : translate('Rivela'),
),
$el(
'button',
{ type: 'button', '@click': () => render() },
convert_to_hiragana('Nuova carta'),
{ type: 'button', '@click': () => render(format, false) },
translate('Nuova carta'),
),
$el(
'button',
{
type: 'button',
'@click': () => {
render(
format === 'hiragana' ? 'katakana' : 'hiragana',
reveal,
index,
);
},
},
format === 'hiragana'
? convert_to_katakana('Katakana')
: convert_to_hiragana('Hiragana'),
),
),
);
document.body.appendChild(main);
};
render();
render('hiragana');