move retrieval of sprite url from svelte to rust

src/events/active-doll-sprite.ts

@@ -0,0 +1,25 @@
+import { writable } from "svelte/store";
+import onekoGif from "../assets/oneko/oneko.gif";
+import { commands, events } from "$lib/bindings";
+import { createEventSource } from "./listener-utils";
+
+export const activeDollSpriteUrl = writable(onekoGif);
+
+function toSpriteUrl(spriteBase64: string | null): string {
+  return spriteBase64 ? `data:image/gif;base64,${spriteBase64}` : onekoGif;
+}
+
+export const {
+  start: startActiveDollSprite,
+  stop: stopActiveDollSprite,
+} = createEventSource(async (addEventListener) => {
+  activeDollSpriteUrl.set(
+    toSpriteUrl(await commands.getActiveDollSpriteBase64()),
+  );
+
+  addEventListener(
+    await events.activeDollSpriteChanged.listen((event) => {
+      activeDollSpriteUrl.set(toSpriteUrl(event.payload));
+    }),
+  );
+});

src/lib/bindings.ts

@@ -8,8 +8,8 @@ export const commands = {
 async getAppData() : Promise<UserData> {
     return await TAURI_INVOKE("get_app_data");
 },
-async getActiveDollColorScheme() : Promise<DollColorSchemeDto | null> {
-    return await TAURI_INVOKE("get_active_doll_color_scheme");
+async getActiveDollSpriteBase64() : Promise<string | null> {
+    return await TAURI_INVOKE("get_active_doll_sprite_base64");
 },
 async refreshAppData() : Promise<UserData> {
     return await TAURI_INVOKE("refresh_app_data");
@@ -128,6 +128,7 @@ async getModules() : Promise<ModuleMetadata[]> {
 
 
 export const events = __makeEvents__<{
+activeDollSpriteChanged: ActiveDollSpriteChanged,
 appDataRefreshed: AppDataRefreshed,
 createDoll: CreateDoll,
 cursorMoved: CursorMoved,
@@ -146,6 +147,7 @@ setInteractionOverlay: SetInteractionOverlay,
 unfriended: Unfriended,
 userStatusChanged: UserStatusChanged
 }>({
+activeDollSpriteChanged: "active-doll-sprite-changed",
 appDataRefreshed: "app-data-refreshed",
 createDoll: "create-doll",
 cursorMoved: "cursor-moved",
@@ -171,6 +173,7 @@ userStatusChanged: "user-status-changed"
 
 /** user-defined types **/
 
+export type ActiveDollSpriteChanged = string | null
 export type AppConfig = { api_base_url: string | null }
 export type AppDataRefreshed = UserData
 export type CreateDoll = null

src/routes/+layout.svelte

@@ -6,6 +6,10 @@
     startFriendCursorTracking,
     stopFriendCursorTracking,
   } from "../events/friend-cursor";
+  import {
+    startActiveDollSprite,
+    stopActiveDollSprite,
+  } from "../events/active-doll-sprite";
   import { startAppData } from "../events/app-data";
   import { startInteraction, stopInteraction } from "../events/interaction";
   import {
@@ -19,6 +23,7 @@
     onMount(async () => {
       try {
         await startAppData();
+        await startActiveDollSprite();
         await startCursorTracking();
         await startFriendCursorTracking();
         await startSceneInteractive();
@@ -32,6 +37,7 @@
     onDestroy(() => {
       stopCursorTracking();
       stopFriendCursorTracking();
+      stopActiveDollSprite();
       stopSceneInteractive();
       stopInteraction();
       stopUserStatus();

src/routes/scene/+page.svelte

@@ -2,27 +2,15 @@
   import { cursorPositionOnScreen } from "../../events/cursor";
   import { friendsCursorPositions } from "../../events/friend-cursor";
   import { appData } from "../../events/app-data";
+  import { activeDollSpriteUrl } from "../../events/active-doll-sprite";
   import { sceneInteractive } from "../../events/scene-interactive";
   import {
     friendsPresenceStates,
     currentPresenceState,
   } from "../../events/user-status";
   import { commands } from "$lib/bindings";
-  import { getSpriteSheetUrl } from "$lib/utils/sprite-utils";
   import DebugBar from "./components/debug-bar.svelte";
   import Neko from "./components/neko/neko.svelte";
-
-  let spriteUrl = $state("");
-
-  $effect(() => {
-    $appData;
-    if (!$appData) return;
-    commands.getActiveDollColorScheme().then((colorScheme) => {
-      getSpriteSheetUrl(colorScheme ?? undefined).then((url) => {
-        spriteUrl = url;
-      });
-    });
-  });
 </script>
 
 <div class="w-svw h-svh p-4 relative overflow-hidden">
@@ -36,7 +24,7 @@
   <Neko
     targetX={$cursorPositionOnScreen.raw.x}
     targetY={$cursorPositionOnScreen.raw.y}
-    {spriteUrl}
+    spriteUrl={$activeDollSpriteUrl}
   />
   <div id="debug-bar">
     <DebugBar