Merge branch 'kwaroran:main' into main

2024-12-15 14:13:02 -08:00
parent 69f44c03c6 556e1ea46a
commit cd3294d529
23 changed files with 395 additions and 200 deletions
--- a/src/lib/ChatScreens/DefaultChatScreen.svelte
+++ b/src/lib/ChatScreens/DefaultChatScreen.svelte
@@ -2,7 +2,7 @@

 	import Suggestion from './Suggestion.svelte';
 	import AdvancedChatEditor from './AdvancedChatEditor.svelte';
-    import { CameraIcon, DatabaseIcon, DicesIcon, GlobeIcon, ImagePlusIcon, LanguagesIcon, Laugh, MenuIcon, MicOffIcon, PackageIcon, Plus, RefreshCcwIcon, ReplyIcon, Send, StepForwardIcon } from "lucide-svelte";
+    import { CameraIcon, DatabaseIcon, DicesIcon, GlobeIcon, ImagePlusIcon, LanguagesIcon, Laugh, MenuIcon, MicOffIcon, PackageIcon, Plus, RefreshCcwIcon, ReplyIcon, Send, StepForwardIcon, XIcon } from "lucide-svelte";
    import { selectedCharID, PlaygroundStore, createSimpleCharacter } from "../../ts/stores.svelte";
    import Chat from "./Chat.svelte";
    import { type Message, type character, type groupChat } from "../../ts/storage/database.svelte";
@@ -25,7 +25,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';
+    import { getInlayAsset } from 'src/ts/process/files/inlays';
    import PlaygroundMenu from '../Playground/PlaygroundMenu.svelte';
    import { ConnectionOpenStore } from 'src/ts/sync/multiuser';

@@ -71,7 +71,7 @@

        if(fileInput.length > 0){
            for(const file of fileInput){
-                messageInput += `{{inlay::${file}}}`
+                messageInput += `{{inlayed::${file}}}`
            }
            fileInput = []
        }
@@ -546,8 +546,31 @@
            {#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 getInlayAsset(file) then inlayAsset}
+                            <div class="relative">
+                                {#if inlayAsset.type === 'image'}
+                                    <img src={inlayAsset.data} alt="Inlay" class="max-w-48 max-h-48 border border-darkborderc">
+                                {:else if inlayAsset.type === 'video'}
+                                    <video controls class="max-w-48 max-h-48 border border-darkborderc">
+                                        <source src={inlayAsset.data} type="video/mp4" />
+                                        <track kind="captions" />
+                                        Your browser does not support the video tag.
+                                    </video>
+                                {:else if inlayAsset.type === 'audio'}
+                                    <audio controls class="max-w-48 max-h-24 border border-darkborderc">
+                                        <source src={inlayAsset.data} type="audio/mpeg" />
+                                        Your browser does not support the audio tag.
+                                    </audio>
+                                {:else}
+                                    <div class="max-w-24 max-h-24">{file}</div>
+                                {/if}
+                                <button class="absolute -right-1 -top-1 p-1 bg-darkbg text-textcolor rounded-md transition-colors hover:text-draculared focus:text-draculared" onclick={() => {
+                                    fileInput.splice(i, 1)
+                                    updateInputSizeAll()
+                                }}>
+                                    <XIcon size={18} />
+                                </button>
+                            </div>
                        {/await}
                    {/each}
                </div>
@@ -741,7 +764,7 @@

                    <div class="flex items-center cursor-pointer hover:text-green-500 transition-colors" onclick={async () => {
                        const res = await postChatFile(messageInput)
-                        if(res?.type === 'image'){
+                        if(res?.type === 'asset'){
                            fileInput.push(res.data)
                            updateInputSizeAll()
                        }
--- a/src/lib/Setting/Pages/AdvancedSettings.svelte
+++ b/src/lib/Setting/Pages/AdvancedSettings.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
    import Check from "src/lib/UI/GUI/CheckInput.svelte";
    import { language } from "src/lang";
-    
+    import Button from "src/lib/UI/GUI/Button.svelte";
    import { DBState } from 'src/ts/stores.svelte';
    import { alertMd } from "src/ts/alert";
    import { getRequestLog, isTauri } from "src/ts/globalApi.svelte";
@@ -165,21 +165,23 @@
        <Check bind:check={DBState.db.usePlainFetch} name={language.forcePlainFetch}> <Help key="forcePlainFetch" unrecommended/></Check>
    </div>
 {/if}
-<button
+<Button
+    className="mt-4"
    onclick={async () => {
        alertMd(getRequestLog())
    }}
-    class="drop-shadow-lg p-3 border-darkborderc border-solid mt-6 flex justify-center items-center ml-2 mr-2 border-1 hover:bg-selected text-sm">
+>
    {language.ShowLog}
-</button>
+</Button>
 {#if Capacitor.isNativePlatform()}
-    <button
+    <Button
+        className="mt-4"
        onclick={async () => {
            estaStorage = await capStorageInvestigation()
        }}
-        class="drop-shadow-lg p-3 border-darkborderc border-solid mt-6 flex justify-center items-center ml-2 mr-2 border-1 hover:bg-selected text-sm">
+    >
        Investigate Storage
-    </button>
+    </Button>

    {#if estaStorage.length > 0}
        <div class="mt-4 flex flex-col w-full p-2">
@@ -192,12 +194,17 @@
        </div>
    {/if}
 {/if}
-{#if DBState.db.tpo}
-    <button
-        onclick={async () => {
-            installPython()
-        }}
-        class="drop-shadow-lg p-3 border-darkbutton border-solid mt-6 flex justify-center items-center ml-2 mr-2 border-1 hover:bg-selected text-sm">
-        Test Python
-    </button>
-{/if}
+<Button
+    className="mt-4"
+    onclick={async () => {
+        let mdTable = "| Type | Value |\n| --- | --- |\n"
+        const s = DBState.db.statics
+        for (const key in s) {
+            mdTable += `| ${key} | ${s[key]} |\n`
+        }
+        mdTable += `\n\n<small>${language.staticsDisclaimer}</small>`
+        alertMd(mdTable)
+    }}
+>
+Show Statistics
+</Button>
--- a/src/lib/UI/MainMenu.svelte
+++ b/src/lib/UI/MainMenu.svelte
@@ -31,7 +31,7 @@
                  search: '',
                  page: 0,
                  nsfw: false,
-                  sort: ''
+                  sort: 'recommended'
              }) then charas}
            {#if charas.length > 0}
              {@html hubAdditionalHTML}
--- a/src/lib/UI/Realm/RealmMain.svelte
+++ b/src/lib/UI/Realm/RealmMain.svelte
@@ -12,7 +12,7 @@
    let charas:hubType[] = $state([])

    let page = $state(0)
-    let sort = $state('')
+    let sort = $state('recommended')

    let search = $state('')
    let menuOpen = $state(false)
@@ -27,6 +27,16 @@
        })
    }

+    function changeSort(type:string) {
+        if(sort === type){
+            sort = 'recommended'
+        }else{
+            sort = type
+        }
+        page = 0
+        return getHub()
+    }
+
    getHub()


@@ -36,6 +46,9 @@
        <input bind:value={search} class="peer focus:border-textcolor transition-colors outline-none text-textcolor p-2 min-w-0 border border-r-0 bg-transparent rounded-md rounded-r-none input-text text-xl flex-grow ml-4 border-darkborderc resize-none overflow-y-hidden overflow-x-hidden max-w-full">
            <button
            onclick={() => {
+                if(sort === 'random' || sort === 'recommended'){
+                    sort = ''
+                }
                page = 0
                getHub()
            }}
@@ -81,6 +94,7 @@
            getHub()
        }}>
            {
+                sort === 'recommended' ? language.recommended :
                sort === '' ? language.recent : 
                sort === 'trending' ? language.trending :
                sort === 'downloads' ? language.downloads :
@@ -99,26 +113,22 @@
        </button>
        <div class="ml-2 mr-2 h-full border-r border-r-selected"></div>
        <button class="bg-darkbg p-2 rounded-lg ml-2 flex justify-center items-center hover:bg-selected transition-shadow" class:ring={sort === ''} onclick={() => {
-            sort = ''
-            getHub()
+            changeSort('')
        }}>
            {language.recent}
        </button>
        <button class="bg-darkbg p-2 rounded-lg ml-2 flex justify-center items-center hover:bg-selected transition-shadow" class:ring={sort === 'trending'} onclick={() => {
-            sort = 'trending'
-            getHub()
+            changeSort('trending')
        }}>
            {language.trending}
        </button>
        <button class="bg-darkbg p-2 rounded-lg ml-2 flex justify-center items-center hover:bg-selected transition-shadow" class:ring={sort === 'downloads'} onclick={() => {
-            sort = 'downloads'
-            getHub()
+            changeSort('downloads')
        }}>
            {language.downloads}
        </button>
        <button class="bg-darkbg p-2 rounded-lg ml-2 flex justify-center items-center hover:bg-selected transition-shadow min-w-0 max-w-full" class:ring={sort === 'random'} onclick={() => {
-            sort = 'random'
-            getHub()
+            changeSort('random')
        }}>
            {language.random}
        </button>
@@ -132,7 +142,7 @@
        {/each}
    {/key}
 </div>
-{#if sort !== 'random'}
+{#if sort !== 'random' && sort !== 'recommended'}
    <div class="w-full flex justify-center">
        <div class="flex">
            <button class="bg-darkbg h-14 w-14 min-w-14 rounded-lg flex justify-center items-center hover:ring transition-shadow" onclick={() => {