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

[feat] basic risuhub

Browse Source
This commit is contained in:
kwaroran
2023-06-03 06:10:26 +09:00
parent 009a3b6ae5
commit 02878958b6
10 changed files with 301 additions and 89 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/lang/en.ts
View File

@@ -65,7 +65,7 @@ export const languageEnglish = {
+ "\n\n- $(name)\n\n - inserts the named group"
+ "\n\nIf OUT starts with **@@**, it doesn't replaces the string, but instead does a special effect if matching string founds."
+ "\n\n- @@emo (emotion name)\n\n - if character is Emotion Images mode, sets (emotion name) as emotion and prevents default.",
experimental: "This is a experimental setting. it might be unstable.",
experimental: "This is a experimental feature. it might be unstable.",
oogaboogaURL: "If your WebUI supports older version of api, your url should look *like https:.../run/textgen*\n\n"
+ "If your WebUI supports newVersion of api, your url should look like *https://.../api/v1/generate* and use the api server as host, and add --api to arguments.",
exampleMessage: "Example conversations that effects output of the character. it dosen't uses tokens permanently."

12
src/lib/ChatScreens/DefaultChatScreen.svelte
View File

@@ -3,9 +3,9 @@
import { DatabaseIcon, DicesIcon, LanguagesIcon, MenuIcon, MicOffIcon, PowerIcon, RefreshCcwIcon, ReplyIcon, Send } from "lucide-svelte";
import { selectedCharID } from "../../ts/stores";
import Chat from "./Chat.svelte";
import { DataBase, appVer, type Message, type character } from "../../ts/storage/database";
import { DataBase, type Message } from "../../ts/storage/database";
import { getCharImage } from "../../ts/characters";
import { doingChat, sendChat, type OpenAIChat } from "../../ts/process/index";
import { doingChat, sendChat } from "../../ts/process/index";
import { findCharacterbyId, messageForm, sleep } from "../../ts/util";
import { language } from "../../lang";
import { translate } from "../../ts/translator/translator";
@@ -13,9 +13,9 @@
import sendSound from '../../etc/send.mp3'
import {cloneDeep} from 'lodash'
import { processScript } from "src/ts/process/scripts";
import GithubStars from "../Others/GithubStars.svelte";
import CreatorQuote from "./CreatorQuote.svelte";
import { stopTTS } from "src/ts/process/tts";
import MainMenu from '../UI/MainMenu.svelte';
let messageInput = ''
let openMenu = false
@@ -186,11 +186,7 @@
openMenu = false
}}>
{#if $selectedCharID < 0}
<div class="h-full w-full flex flex-col overflow-y-auto items-center">
<h2 class="text-4xl text-white mb-0 mt-6 font-black">RisuAI</h2>
<h3 class="text-gray-500 mt-1">Version {appVer}</h3>
<GithubStars />
</div>
<MainMenu />
{:else}
<div class="h-full w-full flex flex-col-reverse overflow-y-auto relative" on:scroll={(e) => {
//@ts-ignore

4
src/lib/Others/Help.svelte
View File

@@ -4,7 +4,9 @@
alertMd(language.help[key])
}}>
{#if key === "experimental"}
<FlaskConicalIcon size={14} />
<div class="text-red-500 hover:text-green-500">
<FlaskConicalIcon size={16} />
</div>
{:else if unrecommended}
<div class="text-red-500 hover:text-green-500">
<AlertTriangle size={14} />

10
src/lib/SideBars/CharConfig.svelte
View File

@@ -14,7 +14,7 @@
import {isEqual, cloneDeep} from 'lodash'
import Help from "../Others/Help.svelte";
import RegexData from "./RegexData.svelte";
import { exportChar } from "src/ts/characterCards";
import { exportChar, shareRisuHub } from "src/ts/characterCards";
import { getElevenTTSVoices, getWebSpeechTTSVoices, getVOICEVOXVoices } from "src/ts/process/tts";
import { checkCharOrder } from "src/ts/storage/globalApi";
import { addGroupChar, rmCharFromGroup } from "src/ts/process/group";
@@ -664,6 +664,14 @@
exportChar($selectedCharID)
}} class="text-neutral-200 mt-6 text-lg bg-transparent border-solid border-1 border-borderc p-4 hover:bg-green-500 transition-colors cursor-pointer">{language.exportCharacter}</button>
{#if $DataBase.useExperimental}
<button on:click={async () => {
const cha = $DataBase.characters[$selectedCharID]
if(cha.type !== 'group'){
shareRisuHub(cha)
}
}} class="text-neutral-200 mt-2 text-lg bg-transparent border-solid border-1 border-borderc p-4 hover:bg-green-500 transition-colors cursor-pointer">Upload Hub (experimental)</button>
{/if}
{:else}
{#if currentChar.data.chats[currentChar.data.chatPage].supaMemoryData && currentChar.data.chats[currentChar.data.chatPage].supaMemoryData.length > 4}
<span class="text-neutral-200">{language.SuperMemory}</span>

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

@@ -51,18 +51,27 @@
function createScratch() {
reseter();
const cid = createNewCharacter();
selectedCharID.set(-1);
createNewCharacter();
let db = get(DataBase)
if(db.characters[db.characters.length-1]){
changeChar(db.characters.length-1)
}
}
function createGroup() {
reseter();
const cid = createNewGroup();
selectedCharID.set(-1);
createNewGroup();
let db = get(DataBase)
if(db.characters[db.characters.length-1]){
changeChar(db.characters.length-1)
}
}
async function createImport() {
reseter();
await importCharacter();
selectedCharID.set(-1);
let db = get(DataBase)
if(db.characters[db.characters.length-1]){
changeChar(db.characters.length-1)
}
}
function changeChar(index: number) {

60
src/lib/UI/Hub.svelte Normal file
View File

@@ -0,0 +1,60 @@
<script lang="ts">
import { downloadRisuHub, getRisuHub, hubURL } from "src/ts/characterCards";
import Help from "../Others/Help.svelte";
import { DownloadIcon, FlagIcon } from "lucide-svelte";
let openedData:null|{
name:string
desc: string
download: number,
id: string,
img: string
} = null
</script>
<h1 class="text-3xl font-bold mt-4">Shared Characters <Help key="experimental" /> </h1>
<div class="w-full flex gap-4 p-2 flex-wrap">
{#await getRisuHub() then charas}
{#each charas as chara}
<button class="bg-darkbg rounded-lg p-4 flex flex-col hover:bg-selected transition-colors relative sm:w-44 w-full items-center" on:click={() => {
openedData = chara
}}>
<div class="flex flex-col">
<img class="h-36 w-36 rounded-md" alt={chara.name} src={`${hubURL}/resource/` + chara.img}>
<span class="text-white text-lg max-w-36 text-ellipsis whitespace-nowrap overflow-hidden">{chara.name}</span>
<span class="text-gray-400 text-xs max-w-36 text-ellipsis break-words max-h-8 whitespace-nowrap overflow-hidden">{chara.desc}</span>
</div>
</button>
{/each}
{/await}
</div>
{#if openedData}
<!-- svelte-ignore a11y-click-events-have-key-events -->
<div class="top-0 left-0 z-50 fixed w-full h-full bg-black bg-opacity-50 flex justify-center items-center" on:click={() => {
openedData = null
}}>
<div class="p-6 max-w-full bg-darkbg rounded-md flex flex-col gap-4 w-2xl overflow-y-auto">
<div class="w-full flex flex-wrap gap-4">
<div class="flex flex-col">
<img class="h-36 w-36 rounded-md" alt={openedData.name} src={`${hubURL}/resource/` + openedData.img}>
<h1 class="text-2xl font-bold max-w-full overflow-hidden whitespace-nowrap text-ellipsis mt-4">{openedData.name}</h1>
</div>
<span class="text-gray-400 break-words text-base">{openedData.desc}</span>
</div>
<div class="flex flex-row-reverse gap-2">
<button class="text-gray-400 hover:text-red-500">
<FlagIcon />
</button>
<button class="text-gray-400 hover:text-green-500" on:click={() => {
downloadRisuHub(openedData.id ,openedData.img)
openedData = null
}}>
<DownloadIcon />
</button>
</div>
</div>
</div>
{/if}

14
src/lib/UI/MainMenu.svelte Normal file
View File

@@ -0,0 +1,14 @@
<script lang="ts">
import { appVer } from "src/ts/storage/database";
import GithubStars from "../Others/GithubStars.svelte";
import Hub from "./Hub.svelte";
</script>
<div class="h-full w-full flex flex-col overflow-y-auto items-center">
<h2 class="text-4xl text-white mb-0 mt-6 font-black">RisuAI</h2>
<h3 class="text-gray-500 mt-1">Version {appVer}</h3>
<GithubStars />
<div class="w-full flex p-4 flex-col text-2xl text-white">
<Hub />
</div>
</div>

141
src/ts/characterCards.ts
View File

@@ -10,7 +10,9 @@ import { PngMetadata } from "./exif"
import { characterFormatUpdate } from "./characters"
import { checkCharOrder, downloadFile, readImage, saveAsset } from "./storage/globalApi"
import { cloneDeep } from "lodash"
import { selectedCharID } from "./stores"
export const hubURL = import.meta.env.DEV ? "http://127.0.0.1:8787" : "https://sv.risuai.xyz"
export async function importCharacter() {
try {
@@ -200,7 +202,7 @@ function convertOldTavernAndJSON(charaData:OldTavernChar, imgp:string|undefined
alternateGreetings:[],
tags:[],
creator:"",
characterVersion: 0,
characterVersion: '',
personality: charaData.personality ?? '',
scenario:charaData.scenario ?? '',
firstMsgIndex: -1,
@@ -307,10 +309,13 @@ export async function exportChar(charaID:number) {
}
async function importSpecv2(card:CharacterCardV2, img?:Uint8Array):Promise<boolean>{
async function importSpecv2(card:CharacterCardV2, img?:Uint8Array, mode?:'hub'|'normal'):Promise<boolean>{
if(!card ||card.spec !== 'chara_card_v2'){
return false
}
if(!mode){
mode = 'normal'
}
const data = card.data
const im = img ? await saveAsset(PngMetadata.filter(img)) : undefined
@@ -333,7 +338,7 @@ async function importSpecv2(card:CharacterCardV2, img?:Uint8Array):Promise<boole
msg: `Loading... (Getting Emotions ${i} / ${risuext.emotions.length})`
})
await sleep(10)
const imgp = await saveAsset(Buffer.from(risuext.emotions[i][1], 'base64'))
const imgp = await saveAsset(mode === 'hub' ? (await getHubResources(risuext.emotions[i][1])) : Buffer.from(risuext.emotions[i][1], 'base64'))
emotions.push([risuext.emotions[i][0],imgp])
}
}
@@ -344,7 +349,7 @@ async function importSpecv2(card:CharacterCardV2, img?:Uint8Array):Promise<boole
msg: `Loading... (Getting Assets ${i} / ${risuext.additionalAssets.length})`
})
await sleep(10)
const imgp = await saveAsset(Buffer.from(risuext.additionalAssets[i][1], 'base64'))
const imgp = await saveAsset(mode === 'hub' ? (await getHubResources(risuext.additionalAssets[i][1])) :Buffer.from(risuext.additionalAssets[i][1], 'base64'))
extAssets.push([risuext.additionalAssets[i][0],imgp])
}
}
@@ -418,7 +423,7 @@ async function importSpecv2(card:CharacterCardV2, img?:Uint8Array):Promise<boole
alternateGreetings:data.alternate_greetings ?? [],
tags:data.tags ?? [],
creator:data.creator ?? '',
characterVersion: data.character_version ?? 0,
characterVersion: `${data.character_version}` ?? '',
personality:data.personality ?? '',
scenario:data.scenario ?? '',
firstMsgIndex: -1,
@@ -444,10 +449,8 @@ async function importSpecv2(card:CharacterCardV2, img?:Uint8Array):Promise<boole
}
export async function exportSpecV2(char:character) {
let img = await readImage(char.image)
try{
async function createBaseV2(char:character) {
let charBook:charBookEntry[] = []
for(const lore of char.globalLore){
@@ -497,7 +500,7 @@ export async function exportSpecV2(char:character) {
},
tags: char.additionalData?.tag ?? [],
creator: char.additionalData?.creator ?? '',
character_version: char.additionalData?.character_version ?? 0,
character_version: `${char.additionalData?.character_version}` ?? '',
extensions: {
risuai: {
emotions: char.emotionImages,
@@ -511,8 +514,17 @@ export async function exportSpecV2(char:character) {
}
}
}
console.log(card)
return card
}
export async function exportSpecV2(char:character) {
let img = await readImage(char.image)
try{
const card = await createBaseV2(char)
if(card.data.extensions.risuai.emotions && card.data.extensions.risuai.emotions.length > 0){
for(let i=0;i<card.data.extensions.risuai.emotions.length;i++){
alertStore.set({
@@ -563,6 +575,115 @@ export async function exportSpecV2(char:character) {
}
}
export async function shareRisuHub(char:character) {
let img = await readImage(char.image)
try{
const card = await createBaseV2(char)
let resources:[string,string][] = []
if(card.data.extensions.risuai.emotions && card.data.extensions.risuai.emotions.length > 0){
for(let i=0;i<card.data.extensions.risuai.emotions.length;i++){
alertStore.set({
type: 'wait',
msg: `Loading... (Adding Emotions ${i} / ${card.data.extensions.risuai.emotions.length})`
})
const data = card.data.extensions.risuai.emotions[i][1]
const rData = await readImage(data)
resources.push([data, Buffer.from(rData).toString('base64')])
}
}
if(card.data.extensions.risuai.additionalAssets && card.data.extensions.risuai.additionalAssets.length > 0){
for(let i=0;i<card.data.extensions.risuai.additionalAssets.length;i++){
alertStore.set({
type: 'wait',
msg: `Loading... (Adding Additional Assets ${i} / ${card.data.extensions.risuai.additionalAssets.length})`
})
const data = card.data.extensions.risuai.additionalAssets[i][1]
const rData = await readImage(data)
resources.push([data, Buffer.from(rData).toString('base64')])
}
}
const da = await fetch(hubURL + '/hub/upload', {
method: "POST",
body: JSON.stringify({
card: card,
img: Buffer.from(img).toString('base64'),
resources: resources
})
})
if(da.status !== 200){
alertError(await da.text())
}
else{
alertNormal("Successfuly Uploaded")
}
}
catch(e){
alertError(`${e}`)
}
}
export async function getRisuHub():Promise<{
name:string
desc: string
download: number,
id: string,
img: string
}[]> {
const da = await fetch(hubURL + '/hub/list', {
method: "POST",
body: JSON.stringify({
})
})
if(da.status !== 200){
return []
}
return da.json()
}
export async function downloadRisuHub(id:string, img:string) {
alertStore.set({
type: "wait",
msg: "Downloading..."
})
const res = await fetch(hubURL + '/hub/get', {
method: "POST",
body: JSON.stringify({
id: id
})
})
if(res.status !== 200){
alertError(await res.text())
}
const data:CharacterCardV2 = await res.json()
await importSpecv2(data, await getHubResources(img), 'hub')
checkCharOrder()
let db = get(DataBase)
if(db.characters[db.characters.length-1]){
const index = db.characters.length-1
characterFormatUpdate(index);
selectedCharID.set(index);
}
}
export async function getHubResources(id:string) {
const res = await fetch(`${hubURL}/resource/${id}`)
if(res.status !== 200){
throw (await res.text())
}
return Buffer.from(await (res).arrayBuffer())
}
type CharacterCardV2 = {
spec: 'chara_card_v2'
@@ -581,7 +702,7 @@ type CharacterCardV2 = {
character_book?: CharacterBook
tags: string[]
creator: string
character_version: number
character_version: string
extensions: {
risuai?:{
emotions?:[string, string][]

4
src/ts/storage/database.ts
View File

@@ -311,7 +311,7 @@ export interface character{
alternateGreetings:string[]
tags:string[]
creator:string
characterVersion: number
characterVersion: string
personality:string
scenario:string
firstMsgIndex:number
@@ -320,7 +320,7 @@ export interface character{
additionalData?: {
tag?:string[]
creator?:string
character_version?:number
character_version?:string
}
ttsMode?:string
ttsSpeech?:string

2
tailwind.config.js
View File

@@ -23,6 +23,8 @@ export default {
'80p': '80%',
'80vw': '80vw',
'14': '3.5rem',
'24': '6rem',
'36': '9rem',
'100vw': '100vw'
},
borderWidth: {