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

Refactor character creation

Browse Source
This commit is contained in:
kwaroran
2024-09-11 09:50:54 +09:00
parent f66ae59d70
commit b37e70a6a5
6 changed files with 77 additions and 116 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -30,7 +30,7 @@
</button>
</div>
{/if}
<div class="w-full flex-1 overflow-y-auto bg-bgcolor">
<div class="w-full flex-1 overflow-y-auto bg-bgcolor relative">
{#if $MobileSideBar > 0}
<div class="w-full flex flex-col p-2 mt-2 h-full">
{#if $MobileSideBar === 1}

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

@@ -1,20 +1,9 @@
<script lang="ts">
import { type character, DataBase, type groupChat } from "src/ts/storage/database";
import BarIcon from "../SideBars/BarIcon.svelte";
import { characterFormatUpdate, getCharImage } from "src/ts/characters";
import { MobileSearch, selectedCharID } from "src/ts/stores";
import { doingChat } from "src/ts/process";
import { language } from "src/lang";
import { MessageSquareIcon } from "lucide-svelte";
function changeChar(index: number) {
if($doingChat){
return
}
characterFormatUpdate(index, {
updateInteraction: true,
});
selectedCharID.set(index);
}
import { addCharacter, changeChar, getCharImage } from "src/ts/characters";
import { MobileSearch } from "src/ts/stores";
import { MessageSquareIcon, PlusIcon } from "lucide-svelte";
const agoFormatter = new Intl.RelativeTimeFormat(navigator.languages, { style: 'short' });
@@ -65,7 +54,7 @@
});
}
</script>
<div class="flex flex-col items-center w-full">
<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={() => {
@@ -85,3 +74,9 @@
{/if}
{/each}
</div>
<button class="p-4 rounded-full absolute bottom-2 right-2 bg-borderc" on:click={() => {
addCharacter()
}}>
<PlusIcon size={24} />
</button>

10
src/lib/Others/AlertComp.svelte
View File

@@ -305,7 +305,7 @@
{: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={() => {
<button class="border-darkborderc border py-12 px-8 flex rounded-md hover:ring-2 justify-center items-center" on:click|stopPropagation|preventDefault={(e) => {
alertStore.set({
type: 'none',
msg: 'importFromRealm'
@@ -319,7 +319,7 @@
<ChevronRightIcon />
</div>
</button>
<button class="border-darkborderc border py-2 px-8 flex rounded-md hover:ring-2 items-center mt-2" on:click={() => {
<button class="border-darkborderc border py-2 px-8 flex rounded-md hover:ring-2 items-center mt-2" on:click|stopPropagation|preventDefault={() => {
alertStore.set({
type: 'none',
msg: 'importCharacter'
@@ -332,7 +332,7 @@
<ChevronRightIcon />
</div>
</button>
<button class="border-darkborderc border py-2 px-8 flex rounded-md hover:ring-2 items-center mt-2" on:click={() => {
<button class="border-darkborderc border py-2 px-8 flex rounded-md hover:ring-2 items-center mt-2" on:click|stopPropagation|preventDefault={() => {
alertStore.set({
type: 'none',
msg: 'createfromScratch'
@@ -345,7 +345,7 @@
<ChevronRightIcon />
</div>
</button>
<button class="border-darkborderc border py-2 px-8 flex rounded-md hover:ring-2 items-center mt-2" on:click={() => {
<button class="border-darkborderc border py-2 px-8 flex rounded-md hover:ring-2 items-center mt-2" on:click|stopPropagation|preventDefault={() => {
alertStore.set({
type: 'none',
msg: 'createGroup'
@@ -358,7 +358,7 @@
<ChevronRightIcon />
</div>
</button>
<button class="border-darkborderc border py-2 px-8 flex rounded-md hover:ring-2 items-center mt-2" on:click={() => {
<button class="border-darkborderc border py-2 px-8 flex rounded-md hover:ring-2 items-center mt-2" on:click|stopPropagation|preventDefault={() => {
alertStore.set({
type: 'none',
msg: 'cancel'

98
src/lib/SideBars/Sidebar.svelte
View File

@@ -29,9 +29,8 @@
WrenchIcon,
} from "lucide-svelte";
import {
characterFormatUpdate,
createNewCharacter,
createNewGroup,
addCharacter,
changeChar,
getCharImage,
} from "../../ts/characters";
import { importCharacter } from "src/ts/characterCards";
@@ -60,42 +59,6 @@
let devTool = false
export let openGrid = () => {};
function createScratch() {
reseter();
createNewCharacter();
let db = get(DataBase)
if(db.characters[db.characters.length-1]){
changeChar(db.characters.length-1)
}
}
function createGroup() {
reseter();
createNewGroup();
let db = get(DataBase)
if(db.characters[db.characters.length-1]){
changeChar(db.characters.length-1)
}
}
async function createImport() {
reseter();
await importCharacter();
let db = get(DataBase)
if(db.characters[db.characters.length-1]){
changeChar(db.characters.length-1)
}
}
function changeChar(index: number) {
if($doingChat){
return
}
reseter();
characterFormatUpdate(index, {
updateInteraction: true,
});
selectedCharID.set(index);
}
function reseter() {
menuMode = 0;
sideBarMode = 0;
@@ -426,13 +389,13 @@
<div
on:click={() => {
if(char.type === "normal"){
changeChar(char.index);
changeChar(char.index, {reseter});
}
}}
on:keydown={(e) => {
if (e.key === "Enter") {
if(char.type === "normal"){
changeChar(char.index);
changeChar(char.index, {reseter});
}
}
}}
@@ -537,13 +500,13 @@
<div
on:click={() => {
if(char2.type === "normal"){
changeChar(char2.index);
changeChar(char2.index, {reseter});
}
}}
on:keydown={(e) => {
if (e.key === "Enter") {
if(char2.type === "normal"){
changeChar(char2.index);
changeChar(char2.index, {reseter});
}
}
}}
@@ -587,22 +550,7 @@
<div class="flex flex-col items-center space-y-2 px-2">
<BaseRoundedButton
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
}
addCharacter({reseter})
}}
><svg viewBox="0 0 24 24" width="1.2em" height="1.2em"
><path
@@ -703,38 +651,6 @@
<SideChatList bind:chara={ $CurrentCharacter} />
{/if}
{/if}
{:else if sideBarMode === 1}
<Button
on:click={createScratch}
className="mt-2"
>
{language.createfromScratch}
</Button>
<Button
on:click={createImport}
className="mt-2"
>
{language.importCharacter}
</Button>
<Button
on:click={createGroup}
className="mt-2"
>
{language.createGroup}
</Button>
<Button
on:click={BotCreator.createBotFromWeb}
className="mt-2"
>
{language.createBotwithAI}
</Button>
{:else if sideBarMode === 2}
<Button
on:click={joinMultiuserRoom}
className="mt-2"
>
{language.joinMultiUserRoom}
</Button>
{/if}
</div>

54
src/ts/characters.ts
View File

@@ -1,17 +1,19 @@
import { get, writable } from "svelte/store";
import { DataBase, saveImage, setDatabase, type character, type Chat, defaultSdDataFunc, type loreBook } from "./storage/database";
import { alertConfirm, alertError, alertNormal, alertSelect, alertStore, alertWait } from "./alert";
import { alertAddCharacter, alertConfirm, alertError, alertNormal, alertSelect, alertStore, alertWait } from "./alert";
import { language } from "../lang";
import { decode as decodeMsgpack } from "msgpackr";
import { checkNullish, findCharacterbyId, getUserName, selectMultipleFile, selectSingleFile, sleep } from "./util";
import { v4 as uuidv4 } from 'uuid';
import { selectedCharID } from "./stores";
import { MobileGUIStack, OpenRealmStore, selectedCharID } from "./stores";
import { checkCharOrder, downloadFile, getFileSrc } from "./storage/globalApi";
import { reencodeImage } from "./process/files/image";
import { updateInlayScreen } from "./process/inlayScreen";
import { PngChunk } from "./pngChunk";
import { parseMarkdownSafe } from "./parser";
import { translateHTML } from "./translator/translator";
import { doingChat } from "./process";
import { importCharacter } from "./characterCards";
export function createNewCharacter() {
let db = get(DataBase)
@@ -735,3 +737,51 @@ export async function removeChar(index:number,name:string, type:'normal'|'perman
setDatabase(db)
selectedCharID.set(-1)
}
export async function addCharacter(arg:{
reseter?:()=>any,
} = {}){
MobileGUIStack.set(100)
const reseter = arg.reseter ?? (() => {})
const r = await alertAddCharacter()
if(r === 'importFromRealm'){
selectedCharID.set(-1)
OpenRealmStore.set(true)
MobileGUIStack.set(0)
return
}
reseter();
switch(r){
case 'createfromScratch':
createNewCharacter()
break
case 'createGroup':
createNewGroup()
break
case 'importCharacter':
await importCharacter()
break
default:
MobileGUIStack.set(1)
return
}
let db = get(DataBase)
if(db.characters[db.characters.length-1]){
changeChar(db.characters.length-1)
}
MobileGUIStack.set(1)
}
export function changeChar(index: number, arg:{
reseter?:()=>any,
} = {}) {
const reseter = arg.reseter ?? (() => {})
if(get(doingChat)){
return
}
reseter();
characterFormatUpdate(index, {
updateInteraction: true,
});
selectedCharID.set(index);
}

2
src/ts/storage/globalApi.ts
View File

@@ -543,7 +543,7 @@ export async function loadData() {
if(db.botSettingAtStart){
botMakerMode.set(true)
}
if((db.betaMobileGUI && window.innerWidth <= 800) || import.meta.env.VITE_RISU_LITE){
if((db.betaMobileGUI && window.innerWidth <= 800) || import.meta.env.VITE_RISU_LITE === 'TRUE'){
initMobileGesture()
MobileGUI.set(true)
}