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

[feat] persona import/export

Browse Source
This commit is contained in:
kwaroran
2023-08-17 18:45:34 +09:00
parent 5f7a5386d4
commit 5c83634d25
7 changed files with 226 additions and 62 deletions
Download Patch File Download Diff File Expand all files Collapse all files

37
src/lib/Setting/Pages/PersonaSettings.svelte
View File

@@ -1,12 +1,14 @@
<script lang="ts">
import { language } from "src/lang";
import BaseRoundedButton from "src/lib/UI/BaseRoundedButton.svelte";
import TextAreaInput from "src/lib/UI/GUI/TextAreaInput.svelte";
import TextInput from "src/lib/UI/GUI/TextInput.svelte";
import { alertConfirm, alertError } from "src/ts/alert";
import { changeUserPersona, getCharImage, saveUserPersona, selectUserImg } from "src/ts/characters";
import BaseRoundedButton from "src/lib/UI/BaseRoundedButton.svelte";
import Button from "src/lib/UI/GUI/Button.svelte";
import TextAreaInput from "src/lib/UI/GUI/TextAreaInput.svelte";
import TextInput from "src/lib/UI/GUI/TextInput.svelte";
import { alertConfirm, alertError, alertSelect } from "src/ts/alert";
import { getCharImage } from "src/ts/characters";
import { changeUserPersona, exportUserPersona, importUserPersona, saveUserPersona, selectUserImg } from "src/ts/persona";
import { DataBase, setDatabase } from "src/ts/storage/database";
import { get } from "svelte/store";
import { get } from "svelte/store";
</script>
<h2 class="mb-2 text-2xl font-bold mt-2">{language.persona}</h2>
@@ -29,7 +31,11 @@
{/each}
<div class="flex justify-center items-center ml-2 mr-2">
<BaseRoundedButton
onClick={() => {
onClick={async () => {
const sel = parseInt(await alertSelect([language.createfromScratch, language.importCharacter]))
if(sel === 1){
return
}
let db = get(DataBase)
db.personas.push({
name: 'New Persona',
@@ -57,8 +63,8 @@
<div class="mt-4 mb-4 border-y-1 border-y-selected">
</div>
<div class="flex w-full items-starts rounded-md bg-darkbg p-4">
<div class="flex flex-col mt-4">
<div class="flex w-full items-starts rounded-md bg-darkbg p-4 max-w-full flex-wrap">
<div class="flex flex-col mt-4 mr-4">
<button on:click={() => {selectUserImg()}}>
{#if $DataBase.userIcon === ''}
<div class="rounded-md h-28 w-28 shadow-lg bg-textcolor2 cursor-pointer hover:text-green-500" />
@@ -71,13 +77,16 @@
{/if}
</button>
</div>
<div class="flex flex-grow flex-col p-2 ml-4">
<div class="flex flex-grow flex-col p-2 max-w-full">
<span class="text-sm text-textcolor2">{language.name}</span>
<TextInput marginBottom size="lg" placeholder="User" bind:value={$DataBase.username} />
<span class="text-sm text-textcolor2">{language.description}</span>
<TextAreaInput height="32" autocomplete="off" bind:value={$DataBase.personaPrompt} placeholder={`Put the description of this persona here.\nExample: [<user> is a 20 year old girl.]`} />
<div>
<button class="float-right rounded-md border border-red-700 p-2 hover:bg-red-700 transition-colors mt-4 text-sm" on:click={async () => {
<div class="flex gap-2 mt-4 max-w-full flex-wrap">
<Button on:click={exportUserPersona}>{language.export}</Button>
<Button on:click={importUserPersona}>{language.import}</Button>
<Button styled="danger" on:click={async () => {
if($DataBase.personas.length === 1){
return
}
@@ -89,9 +98,7 @@
$DataBase.personas = personas
changeUserPersona(0, 'noSave')
}
}}>
{language.remove}
</button>
}}>{language.remove}</Button>
</div>
</div>
</div>

9
src/lib/Setting/Pages/UserSettings.svelte
View File

@@ -1,14 +1,13 @@
<script lang="ts">
import { language } from "src/lang";
import { hubURL } from "src/ts/characterCards";
import { getCharImage, selectUserImg } from "src/ts/characters";
import { loadRisuAccountData, saveRisuAccountData } from "src/ts/drive/accounter";
import { DataBase } from "src/ts/storage/database";
import Check from "src/lib/UI/GUI/CheckInput.svelte";
import { alertConfirm, alertSelect } from "src/ts/alert";
import { forageStorage, isNodeServer, isTauri } from "src/ts/storage/globalApi";
import { unMigrationAccount } from "src/ts/storage/accountStorage";
import { checkDriver } from "src/ts/drive/drive";
import { alertConfirm } from "src/ts/alert";
import { forageStorage, isNodeServer, isTauri } from "src/ts/storage/globalApi";
import { unMigrationAccount } from "src/ts/storage/accountStorage";
import { checkDriver } from "src/ts/drive/drive";
let openIframe = false
let openIframeURL = ''
let popup:Window = null

7
src/lib/UI/GUI/Button.svelte
View File

@@ -1,6 +1,10 @@
<button
on:click
class="{selected ? 'bg-borderc' : 'bg-darkbutton'} border border-darkborderc text-textcolor rounded-md shadow-sm hover:bg-borderc focus:outline-none focus:ring-2 focus:ring-borderc transition-colors duration-200{className ? (" " + className) : ""}"
class="{
styled === 'primary' ?
((selected ? 'bg-borderc' : 'bg-darkbutton') + " hover:bg-borderc focus:ring-borderc border-darkborderc")
: ((selected ? 'bg-red-800' : 'bg-red-700') + ' hover:bg-red-500 focus:ring-red-600 border-red-600')
} border text-textcolor rounded-md shadow-sm focus:outline-none focus:ring-2 transition-colors duration-200{className ? (" " + className) : ""}"
class:px-4 = {size == "md"}
class:px-2 = {size == "sm"}
class:px-6 = {size == "lg"}
@@ -14,6 +18,7 @@
</button>
<script lang="ts">
export let selected = false
export let styled:'primary'|'danger' = 'primary'
export let className = ""
export let size: "sm" | "md" | "lg" = "md"
</script>