-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
dd58b6e
commit 61f75c7
Showing
2 changed files
with
138 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,130 @@ | ||
<script lang="ts"> | ||
import { ChevronDoubleDown, Icon } from "svelte-hero-icons"; | ||
import NameInput from "../../components/NameInput.svelte"; | ||
import Message from "../../components/Message.svelte"; | ||
let libCurses: any; | ||
import { onMount } from "svelte"; | ||
let regexps: Record<string, RegExp[]>; | ||
let loadingPromise: Promise<Record<string, RegExp[]>>; | ||
let name: string; | ||
let matchKey: string; | ||
onMount(async () => { | ||
libCurses = await import("$lib/curses"); | ||
loadingPromise = libCurses.getNameRegexps(); | ||
regexps = await loadingPromise; | ||
}); | ||
function onNameInput(e: Event) { | ||
matchKey = libCurses.checkName((e.target as HTMLInputElement).value, regexps); | ||
} | ||
</script> | ||
|
||
<div class="h-auto w-screen lg:h-screen"> | ||
<div | ||
class="flex h-full w-full flex-col place-content-center place-items-center justify-center lg:flex-row lg:place-content-around lg:place-items-center" | ||
> | ||
<div class="flex h-[90vh] w-4/5 flex-col place-content-center gap-2 p-[2%] lg:h-2/3 lg:w-1/2"> | ||
<div class="mb-3 text-center"> | ||
<h1 class="text-2xl font-medium"> | ||
MAS Name Checker | ||
<span class="rounded-full bg-blue-500 px-1.5 align-super text-base text-white">beta</span> | ||
</h1> | ||
<h2 class="text-xl text-gray-500">Check if a name is good, bad, awkward or okay with Monika</h2> | ||
</div> | ||
{#await loadingPromise} | ||
<div class="flex justify-center"> | ||
<div class="w-full lg:w-2/3"> | ||
<Message title="Loading" text="Please wait while the tool loads..." type="neutral" /> | ||
</div> | ||
</div> | ||
{:then} | ||
<div class="flex justify-center"> | ||
<div class="w-full lg:w-2/3"> | ||
{#if matchKey === undefined || name?.length === 0} | ||
<Message title="Enter your name" text="To check a name, type it in the box below." type="neutral" /> | ||
{:else if !matchKey} | ||
<Message title="This name is okay" text="Not bad, but nothing too special either. A good choice." type="neutral" /> | ||
{:else if matchKey === "playerGood"} | ||
<Message title="This name is good!" text="If you name yourself like that, Monika will like it." type="good" /> | ||
{:else if matchKey === "monikaGood"} | ||
<Message title="This name is good!" text="If you give your Monika this name, she will like it." type="good" /> | ||
{:else if matchKey === "awkward"} | ||
<Message title="This name is... awkward." text="If you try to name yourself or your Monika like that, she will not like it." type="warning" /> | ||
{:else if matchKey === "bad"} | ||
<Message title="This name is terrible!" text="If you try to name yourself or your Monika like that, she will be furious!" type="error" /> | ||
{/if} | ||
</div> | ||
</div> | ||
<div class="flex flex-col place-items-center gap-2"> | ||
<div class="mb-3"> | ||
<NameInput on:input={onNameInput}/> | ||
</div> | ||
</div> | ||
{/await} | ||
</div> | ||
<div class="flex h-[10vh] flex-col place-items-center gap-1 lg:hidden"> | ||
Scroll for more | ||
<Icon src={ChevronDoubleDown} class="h-5 w-5" /> | ||
</div> | ||
<div | ||
class="mb-[3vh] flex min-h-[100vh] w-4/5 flex-col place-content-center gap-[5vh] p-[2%] lg:h-2/3 lg:w-1/4 lg:gap-4" | ||
> | ||
<div> | ||
<h1 class="mb-4 text-2xl">Helpful links</h1> | ||
<ul> | ||
<li class="mb-1 font-medium text-blue-500"> | ||
<a href="https://github.com/Monika-After-Story/MonikaModDev/wiki/Adding-Sprite-Objects" target="_blank"> | ||
📄 Official spritepacks documentation | ||
</a> | ||
</li> | ||
<li class="mb-1 font-medium text-blue-500"> | ||
<a | ||
href="https://github.com/Monika-After-Story/MonikaModDev/wiki/Official-MAS-Art-PSDs-and-Guidelines" | ||
target="_blank" | ||
> | ||
🎨 Official spritepack PSDs and templates | ||
</a> | ||
</li> | ||
<li class="mb-1 font-medium text-blue-500"> | ||
<a href="https://github.com/Friends-of-Monika/mas-web-utils" target="_blank"> | ||
🧪 MAS Web Utils Github repository | ||
</a> | ||
</li> | ||
<li class="mb-1 font-medium text-blue-500"> | ||
<a href="https://github.com/Friends-of-Monika/mas-sprite-schema" target="_blank"> | ||
🔍 MAS Spritepack JSON schema repository | ||
</a> | ||
</li> | ||
<li class="font-medium text-blue-500"> | ||
<a href="https://github.com/Friends-of-Monika/mas-web-utils/issues/new" target="_blank"> | ||
🐛 Report an issue | ||
</a> | ||
</li> | ||
</ul> | ||
</div> | ||
<div> | ||
<h1 class="mb-3 text-2xl">About this tool</h1> | ||
<p class="mb-2 text-gray-700"> | ||
This validator will help you quickly (without starting up the game) check for common issues in the JSON file | ||
you select. Supports both split/unsplit Accessories, Clothes and Hair spritepack JSONs. | ||
</p> | ||
<p class="mb-[3vh] text-gray-700"> | ||
<b>This is public beta.</b> While this tool has been tested thoroughly on some official spritepack files, it could | ||
still produce false positives/negatives — if you're absolutely sure that the file is valid (or invalid), | ||
don't hesitate to test it on MAS, and consider reporting an issue. | ||
</p> | ||
<p class="text-center text-gray-500"> | ||
Made by | ||
<span class="font-medium text-blue-500"> | ||
<a href="https://github.com/Friends-of-Monika" target="_blank"> Friends of Monika </a> | ||
</span> | ||
❤️ | ||
</p> | ||
</div> | ||
</div> | ||
</div> | ||
</div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,8 @@ | ||
export function load() { | ||
return { | ||
meta: { | ||
title: "Name Checker", | ||
description: "🤬 An online tool to check how Monika will find a name" | ||
} | ||
}; | ||
} |