mincomk/risuai
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Migrate to svelte 5

Browse Source
This commit is contained in:
kwaroran
2024-10-23 02:31:37 +09:00
parent e434c7ab96
commit c7330719ad
120 changed files with 2398 additions and 2033 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
src/lib/Mobile/MobileBody.svelte
View File

@@ -1,5 +1,5 @@
<script lang="ts">
import { CurrentCharacter, MobileGUIStack, MobileSideBar, selectedCharID } from "src/ts/stores";
import { MobileGUIStack, MobileSideBar, selectedCharID } from "src/ts/stores";
import Settings from "../Setting/Settings.svelte";
import RealmMain from "../UI/Realm/RealmMain.svelte";
import MobileCharacters from "./MobileCharacters.svelte";
@@ -10,21 +10,22 @@
import SideChatList from "../SideBars/SideChatList.svelte";
import DevTool from "../SideBars/DevTool.svelte";
import { isLite } from "src/ts/lite";
import { DataBase } from "src/ts/storage/database";
</script>
{#if $MobileSideBar > 0 && !$isLite}
<div class="w-full px-2 py-1 text-textcolor2 border-b border-b-darkborderc bg-darkbg flex justify-start items-center gap-2">
<button class="flex-1 border-r border-r-darkborderc" class:text-textcolor={$MobileSideBar === 1} on:click={() => {
<button class="flex-1 border-r border-r-darkborderc" class:text-textcolor={$MobileSideBar === 1} onclick={() => {
$MobileSideBar = 1
}}>
{language.Chat}
</button>
<button class="flex-1 border-r border-r-darkborderc" class:text-textcolor={$MobileSideBar === 2} on:click={() => {
<button class="flex-1 border-r border-r-darkborderc" class:text-textcolor={$MobileSideBar === 2} onclick={() => {
$MobileSideBar = 2
}}>
{language.character}
</button>
<button class:text-textcolor={$MobileSideBar === 3} on:click={() => {
<button class:text-textcolor={$MobileSideBar === 3} onclick={() => {
$MobileSideBar = 3
}}>
<WrenchIcon size={18} />
@@ -35,7 +36,7 @@
{#if $MobileSideBar > 0}
<div class="w-full flex flex-col p-2 mt-2 h-full">
{#if $MobileSideBar === 1}
<SideChatList bind:chara={$CurrentCharacter} />
<SideChatList bind:chara={$DataBase.characters[$selectedCharID]} />
{:else if $MobileSideBar === 2}
<CharConfig />
{:else if $MobileSideBar === 3}

4
src/lib/Mobile/MobileCharacters.svelte
View File

@@ -57,7 +57,7 @@
<div class="flex flex-col items-center w-full overflow-y-auto h-full">
{#each sortChar($DataBase.characters) as char, i}
{#if char.name.toLocaleLowerCase().includes($MobileSearch.toLocaleLowerCase())}
<button class="flex p-2 border-t-darkborderc gap-2 w-full" class:border-t={i !== 0} on:click={() => {
<button class="flex p-2 border-t-darkborderc gap-2 w-full" class:border-t={i !== 0} onclick={() => {
changeChar(char.i)
}}>
<BarIcon additionalStyle={getCharImage(char.image, 'css')}></BarIcon>
@@ -75,7 +75,7 @@
{/each}
</div>
<button class="p-4 rounded-full absolute bottom-2 right-2 bg-borderc" on:click={() => {
<button class="p-4 rounded-full absolute bottom-2 right-2 bg-borderc" onclick={() => {
addCharacter()
}}>
<PlusIcon size={24} />

18
src/lib/Mobile/MobileFooter.svelte
View File

@@ -8,19 +8,19 @@
{#if $selectedCharID === -1}
<div class="w-full p-4 text-lg border-t border-t-darkborderc bg-darkbg flex items-center justify-center text-textcolor2">
<button class="flex justify-center items-center flex-col gap-2 w-20" class:text-textcolor={$MobileGUIStack === 0} on:click={() => {
<button class="flex justify-center items-center flex-col gap-2 w-20" class:text-textcolor={$MobileGUIStack === 0} onclick={() => {
MobileGUIStack.set(0)
}}>
<GlobeIcon size={24} />
<span class="text-xs">RisuRealm</span>
</button>
<button class="flex justify-center items-center flex-col gap-2 w-20" class:text-textcolor={$MobileGUIStack === 1} on:click={() => {
<button class="flex justify-center items-center flex-col gap-2 w-20" class:text-textcolor={$MobileGUIStack === 1} onclick={() => {
MobileGUIStack.set(1)
}}>
<HomeIcon size={24} />
<span class="text-xs">{language.character}</span>
</button>
<button class="flex justify-center items-center flex-col gap-2 w-20" class:text-textcolor={$MobileGUIStack === 2} on:click={() => {
<button class="flex justify-center items-center flex-col gap-2 w-20" class:text-textcolor={$MobileGUIStack === 2} onclick={() => {
MobileGUIStack.set(2)
}}>
<SettingsIcon size={24} />
@@ -32,37 +32,37 @@
{#if $selectedCharID !== -1 && $MobileSideBar === 2}
<div class="w-full p-4 text-lg border-t border-t-darkborderc bg-darkbg flex items-center justify-center text-textcolor2 truncate">
<button class="flex justify-center items-center flex-col gap-2 w-16 max-w-16" class:text-textcolor={$CharConfigSubMenu === 0} on:click={() => {
<button class="flex justify-center items-center flex-col gap-2 w-16 max-w-16" class:text-textcolor={$CharConfigSubMenu === 0} onclick={() => {
CharConfigSubMenu.set(0)
}}>
<UserIcon size={24} />
<span class="text-xs truncate max-w-16">{language.basicInfo}</span>
</button>
<button class="flex justify-center items-center flex-col gap-2 w-16 max-w-16" class:text-textcolor={$CharConfigSubMenu === 1} on:click={() => {
<button class="flex justify-center items-center flex-col gap-2 w-16 max-w-16" class:text-textcolor={$CharConfigSubMenu === 1} onclick={() => {
CharConfigSubMenu.set(1)
}}>
<SmileIcon size={24} />
<span class="text-xs truncate max-w-16">{language.characterDisplay}</span>
</button>
<button class="flex justify-center items-center flex-col gap-2 w-16 max-w-16" class:text-textcolor={$CharConfigSubMenu === 3} on:click={() => {
<button class="flex justify-center items-center flex-col gap-2 w-16 max-w-16" class:text-textcolor={$CharConfigSubMenu === 3} onclick={() => {
CharConfigSubMenu.set(3)
}}>
<BookIcon size={24} />
<span class="text-xs truncate max-w-16">{language.loreBook}</span>
</button>
<button class="flex justify-center items-center flex-col gap-2 w-16 max-w-16" class:text-textcolor={$CharConfigSubMenu === 5} on:click={() => {
<button class="flex justify-center items-center flex-col gap-2 w-16 max-w-16" class:text-textcolor={$CharConfigSubMenu === 5} onclick={() => {
CharConfigSubMenu.set(5)
}}>
<Volume2Icon size={24} />
<span class="text-xs truncate max-w-16">TTS</span>
</button>
<button class="flex justify-center items-center flex-col gap-2 w-16 max-w-16" class:text-textcolor={$CharConfigSubMenu === 4} on:click={() => {
<button class="flex justify-center items-center flex-col gap-2 w-16 max-w-16" class:text-textcolor={$CharConfigSubMenu === 4} onclick={() => {
CharConfigSubMenu.set(4)
}}>
<CurlyBraces size={24} />
<span class="text-xs truncate max-w-16">{language.scripts}</span>
</button>
<button class="flex justify-center items-center flex-col gap-2 w-16 max-w-16" class:text-textcolor={$CharConfigSubMenu === 2} on:click={() => {
<button class="flex justify-center items-center flex-col gap-2 w-16 max-w-16" class:text-textcolor={$CharConfigSubMenu === 2} onclick={() => {
CharConfigSubMenu.set(2)
}}>
<ActivityIcon size={24} />

13
src/lib/Mobile/MobileHeader.svelte
View File

@@ -1,33 +1,34 @@
<script lang="ts">
import { ArrowLeft, MenuIcon } from "lucide-svelte";
import { language } from "src/lang";
import { CurrentCharacter, MobileGUIStack, MobileSearch, selectedCharID, SettingsMenuIndex, MobileSideBar } from "src/ts/stores";
import { DataBase } from "src/ts/storage/database";
import { MobileGUIStack, MobileSearch, selectedCharID, SettingsMenuIndex, MobileSideBar } from "src/ts/stores";
</script>
<div class="w-full px-4 h-16 border-b border-b-darkborderc bg-darkbg flex justify-start items-center gap-2">
{#if $selectedCharID !== -1 && $MobileSideBar > 0}
<button on:click={() => {
<button onclick={() => {
MobileSideBar.set(0)
}}>
<ArrowLeft />
</button>
<span class="font-bold text-lg w-2/3 truncate">{language.menu}</span>
{:else if $selectedCharID !== -1}
<button on:click={() => {
<button onclick={() => {
selectedCharID.set(-1)
}}>
<ArrowLeft />
</button>
<span class="font-bold text-lg w-2/3 truncate">{$CurrentCharacter.name}</span>
<span class="font-bold text-lg w-2/3 truncate">{$DataBase.characters[$selectedCharID].name}</span>
<div class="flex-1 flex justify-end">
<button on:click={() => {
<button onclick={() => {
MobileSideBar.set(1)
}}>
<MenuIcon />
</button>
</div>
{:else if $MobileGUIStack === 2 && $SettingsMenuIndex > -1}
<button on:click={() => {
<button onclick={() => {
SettingsMenuIndex.set(-1)
}}>
<ArrowLeft />