Add new character addition screen
This commit is contained in:
kwaroran
@@ -4,7 +4,7 @@
|
||||
import { getCharImage } from '../../ts/characters';
|
||||
import { ParseMarkdown } from '../../ts/parser';
|
||||
import BarIcon from '../SideBars/BarIcon.svelte';
|
||||
import { User } from 'lucide-svelte';
|
||||
import { ChevronRightIcon, User } from 'lucide-svelte';
|
||||
import { hubURL } from 'src/ts/characterCards';
|
||||
import TextInput from '../UI/GUI/TextInput.svelte';
|
||||
import { openURL } from 'src/ts/storage/globalApi';
|
||||
@@ -75,7 +75,7 @@
|
||||
<div class="text-textcolor">You should accept RisuRealm's <a class="text-green-600 hover:text-green-500 transition-colors duration-200 cursor-pointer" on:click={() => {
|
||||
openURL('https://sv.risuai.xyz/hub/tos')
|
||||
}}>Terms of Service</a> to continue</div>
|
||||
{:else if $alertStore.type !== 'select' && $alertStore.type !== 'requestdata'}
|
||||
{:else if $alertStore.type !== 'select' && $alertStore.type !== 'requestdata' && $alertStore.type !== 'addchar'}
|
||||
<span class="text-gray-300">{$alertStore.msg}</span>
|
||||
{#if $alertStore.submsg}
|
||||
<span class="text-gray-500 text-sm">{$alertStore.submsg}</span>
|
||||
@@ -225,6 +225,73 @@
|
||||
{/if}
|
||||
{/await}
|
||||
{/if}
|
||||
{:else if $alertStore.type === 'addchar'}
|
||||
<div class="w-2xl flex flex-col max-w-full">
|
||||
|
||||
<button class="border-darkborderc border py-12 px-8 flex rounded-md hover:ring-2 justify-center items-center" on:click={() => {
|
||||
alertStore.set({
|
||||
type: 'none',
|
||||
msg: 'importFromRealm'
|
||||
})
|
||||
}}>
|
||||
<div class="flex flex-col justify-start items-start">
|
||||
<span class="text-2xl font-bold">{language.importFromRealm}</span>
|
||||
<span class="text-textcolor2">{language.importFromRealmDesc}</span>
|
||||
</div>
|
||||
<div class="ml-9 float-right flex-1 flex justify-end">
|
||||
<ChevronRightIcon />
|
||||
</div>
|
||||
</button>
|
||||
<button class="border-darkborderc border py-2 px-8 flex rounded-md hover:ring-2 items-center mt-2" on:click={() => {
|
||||
alertStore.set({
|
||||
type: 'none',
|
||||
msg: 'importCharacter'
|
||||
})
|
||||
}}>
|
||||
<div class="flex flex-col justify-start items-start">
|
||||
<span>{language.importCharacter}</span>
|
||||
</div>
|
||||
<div class="ml-9 float-right flex-1 flex justify-end">
|
||||
<ChevronRightIcon />
|
||||
</div>
|
||||
</button>
|
||||
<button class="border-darkborderc border py-2 px-8 flex rounded-md hover:ring-2 items-center mt-2" on:click={() => {
|
||||
alertStore.set({
|
||||
type: 'none',
|
||||
msg: 'createfromScratch'
|
||||
})
|
||||
}}>
|
||||
<div class="flex flex-col justify-start items-start">
|
||||
<span>{language.createfromScratch}</span>
|
||||
</div>
|
||||
<div class="ml-9 float-right flex-1 flex justify-end">
|
||||
<ChevronRightIcon />
|
||||
</div>
|
||||
</button>
|
||||
<button class="border-darkborderc border py-2 px-8 flex rounded-md hover:ring-2 items-center mt-2" on:click={() => {
|
||||
alertStore.set({
|
||||
type: 'none',
|
||||
msg: 'createGroup'
|
||||
})
|
||||
}}>
|
||||
<div class="flex flex-col justify-start items-start">
|
||||
<span>{language.createGroup}</span>
|
||||
</div>
|
||||
<div class="ml-9 float-right flex-1 flex justify-end">
|
||||
<ChevronRightIcon />
|
||||
</div>
|
||||
</button>
|
||||
<button class="border-darkborderc border py-2 px-8 flex rounded-md hover:ring-2 items-center mt-2" on:click={() => {
|
||||
alertStore.set({
|
||||
type: 'none',
|
||||
msg: 'cancel'
|
||||
})
|
||||
}}>
|
||||
<div class="flex flex-col justify-start items-start">
|
||||
<span>{language.cancel}</span>
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -7,7 +7,10 @@
|
||||
settingsOpen,
|
||||
sideBarClosing,
|
||||
sideBarStore,
|
||||
CurrentCharacter
|
||||
CurrentCharacter,
|
||||
|
||||
OpenRealmStore
|
||||
|
||||
} from "../../ts/stores";
|
||||
import { DataBase, setDatabase, type folder } from "../../ts/storage/database";
|
||||
import BarIcon from "./BarIcon.svelte";
|
||||
@@ -44,7 +47,7 @@
|
||||
import { BotCreator } from "src/ts/creation/creator";
|
||||
import Button from "../UI/GUI/Button.svelte";
|
||||
import { fly } from "svelte/transition";
|
||||
import { alertInput, alertSelect } from "src/ts/alert";
|
||||
import { alertAddCharacter, alertInput, alertSelect } from "src/ts/alert";
|
||||
import SideChatList from "./SideChatList.svelte";
|
||||
import { joinMultiuserRoom } from "src/ts/sync/multiuser";
|
||||
let openPresetList = false;
|
||||
@@ -564,13 +567,22 @@
|
||||
{/each}
|
||||
<div class="flex flex-col items-center space-y-2 px-2">
|
||||
<BaseRoundedButton
|
||||
onClick={() => {
|
||||
if (sideBarMode === 1) {
|
||||
reseter();
|
||||
sideBarMode = 0;
|
||||
} else {
|
||||
reseter();
|
||||
sideBarMode = 1;
|
||||
onClick={async () => {
|
||||
const r = await alertAddCharacter()
|
||||
switch(r){
|
||||
case 'createfromScratch':
|
||||
createScratch()
|
||||
break
|
||||
case 'importCharacter':
|
||||
createImport()
|
||||
break
|
||||
case 'createGroup':
|
||||
createGroup()
|
||||
break
|
||||
case 'importFromRealm':
|
||||
selectedCharID.set(-1)
|
||||
OpenRealmStore.set(true)
|
||||
break
|
||||
}
|
||||
}}
|
||||
><svg viewBox="0 0 24 24" width="1.2em" height="1.2em"
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
import { DataBase, appVer, webAppSubVer } from "src/ts/storage/database";
|
||||
import GithubStars from "../Others/GithubStars.svelte";
|
||||
import Hub from "./Realm/RealmMain.svelte";
|
||||
import { sideBarStore } from "src/ts/stores";
|
||||
import { OpenRealmStore } from "src/ts/stores";
|
||||
import { ArrowLeft } from "lucide-svelte";
|
||||
import { isNodeServer, isTauri, openURL } from "src/ts/storage/globalApi";
|
||||
import { language } from "src/lang";
|
||||
@@ -11,13 +11,12 @@
|
||||
import Title from "./Title.svelte";
|
||||
import { getPatchNote } from "src/etc/patchNote";
|
||||
import { parseMarkdownSafe } from "src/ts/parser";
|
||||
let openHub = false
|
||||
const patch = getPatchNote(appVer)
|
||||
let patchNodeHidden = true
|
||||
|
||||
</script>
|
||||
<div class="h-full w-full flex flex-col overflow-y-auto items-center">
|
||||
{#if !openHub}
|
||||
{#if !$OpenRealmStore}
|
||||
<Title />
|
||||
{#if (!isTauri) && (!isNodeServer)}
|
||||
<h3 class="text-textcolor2 mt-1">Version {appVer}{webAppSubVer}</h3>
|
||||
@@ -46,7 +45,7 @@
|
||||
{/if}
|
||||
{/if}
|
||||
<div class="w-full flex p-4 flex-col text-textcolor max-w-4xl">
|
||||
{#if !openHub}
|
||||
{#if !$OpenRealmStore}
|
||||
<div class="grid grid-cols-1 gap-4 md:grid-cols-2">
|
||||
<button class="bg-darkbg rounded-md p-6 flex flex-col transition-shadow hover:ring-1" on:click={() => {
|
||||
openURL("https://github.com/kwaroran/RisuAI/wiki")
|
||||
@@ -61,7 +60,7 @@
|
||||
</div>
|
||||
<div class="mt-4 mb-4 w-full border-t border-t-selected"></div>
|
||||
<h1 class="text-2xl font-bold">Recently Uploaded<button class="text-base font-medium float-right p-1 bg-darkbg rounded-md hover:ring" on:click={() => {
|
||||
openHub = true
|
||||
$OpenRealmStore = true
|
||||
}}>Get More</button></h1>
|
||||
{#if !$DataBase.hideRealm}
|
||||
{#await getRisuHub({
|
||||
@@ -73,7 +72,7 @@
|
||||
{#if charas.length > 0}
|
||||
<div class="w-full flex gap-4 p-2 flex-wrap justify-center">
|
||||
{#each charas as chara}
|
||||
<RisuHubIcon onClick={() => {openHub = true}} chara={chara} />
|
||||
<RisuHubIcon onClick={() => {$OpenRealmStore = true}} chara={chara} />
|
||||
{/each}
|
||||
</div>
|
||||
{:else}
|
||||
@@ -85,7 +84,7 @@
|
||||
{/if}
|
||||
{:else}
|
||||
<div class="flex items-center mt-4">
|
||||
<button class="mr-2 text-textcolor2 hover:text-green-500" on:click={() => (openHub = false)}>
|
||||
<button class="mr-2 text-textcolor2 hover:text-green-500" on:click={() => ($OpenRealmStore = false)}>
|
||||
<ArrowLeft/>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user