Add image input display

This commit is contained in:
kwaroran
2024-03-18 00:25:18 +09:00
parent c4e0404024
commit 2fee3aa70f
2 changed files with 22 additions and 3 deletions

View File

@@ -23,6 +23,7 @@
import { PreUnreroll, Prereroll } from 'src/ts/process/prereroll';
import { processMultiCommand } from 'src/ts/process/command';
import { postChatFile } from 'src/ts/process/files/multisend';
import { getInlayImage } from 'src/ts/process/files/image';
let messageInput:string = ''
let messageInputTranslate:string = ''
@@ -35,6 +36,7 @@
let doingChatInputTranslate = false
let currentCharacter:character|groupChat = $CurrentCharacter
let toggleStickers:boolean = false
let fileInput:string[] = []
export let openModuleList = false
export let openChatList:boolean = false
@@ -65,6 +67,12 @@
}
}
if(fileInput.length > 0){
for(const file of fileInput){
messageInput += `{{inlay::${file}}}`
}
fileInput = []
}
if(messageInput === ''){
if($DataBase.characters[selectedChar].type !== 'group'){
@@ -436,7 +444,7 @@
</div>
</div>
{#if $DataBase.useAutoTranslateInput}
<div class="flex items-center mt-2 mb-2 w-full">
<div class="flex items-center mt-2 mb-2">
<label for='messageInputTranslate' class="text-textcolor ml-4">
<LanguagesIcon />
</label>
@@ -461,6 +469,17 @@
/>
</div>
{/if}
{#if fileInput.length > 0}
<div class="flex items-center ml-4 flex-wrap p-2 m-2 border-darkborderc border rounded-md">
{#each fileInput as file, i}
{#await getInlayImage(file) then inlayImage}
<img src={inlayImage.data} alt="Inlay" class="max-w-24 max-h-24">
{/await}
{/each}
</div>
{/if}
{#if toggleStickers}
<div class="ml-4 flex flex-wrap">
@@ -644,7 +663,7 @@
<div class="flex items-center cursor-pointer hover:text-green-500 transition-colors" on:click={async () => {
const res = await postChatFile(messageInput)
if(res?.type === 'image'){
messageInput += res.data
fileInput.push(res.data)
updateInputSizeAll()
}
if(res?.type === 'text'){