hotkey to activate neko interactions

This commit is contained in:
2026-01-05 16:40:27 +08:00
parent 96ba44613d
commit ca995899fe
5 changed files with 196 additions and 31 deletions

View File

@@ -5,12 +5,15 @@
friendsActiveDolls,
} from "../../events/cursor";
import { appData } from "../../events/app-data";
import { sceneInteractive } from "../../events/scene-interactive";
import DesktopPet from "./DesktopPet.svelte";
let innerWidth = 0;
let innerHeight = 0;
$: isInteractive = $sceneInteractive;
function getFriendName(userId: string) {
const friend = $appData?.friends?.find((f) => f.friend.id === userId);
return friend ? friend.friend.name : userId.slice(0, 8) + "...";
@@ -30,39 +33,34 @@
<div class="w-svw h-svh p-4 relative overflow-hidden">
<div
class="size-max mx-auto bg-base-100 border-base-200 border px-4 py-3 rounded-xl"
class="size-max mx-auto bg-base-100 border-base-200 border p-1 rounded-lg shadow-md"
>
<div class="flex flex-col text-center">
<p class="text-xl">Friendolls</p>
<p class="text-sm opacity-50">Scene Screen</p>
<div class="mt-4 flex flex-col gap-1">
<span class="font-mono text-sm">
Raw: ({$cursorPositionOnScreen.raw.x}, {$cursorPositionOnScreen.raw
.y})
</span>
<span class="font-mono text-sm">
Mapped: ({$cursorPositionOnScreen.mapped.x.toFixed(3)}, {$cursorPositionOnScreen.mapped.y.toFixed(
3,
)})
<div class="flex flex-row gap-1 items-center text-center">
<div>
<span class="py-3 text-xs items-center gap-2 badge">
<span
class={`size-2 rounded-full ${isInteractive ? "bg-success" : "bg-base-300"}`}
></span>
Intercepting cursor events
</span>
</div>
<span class="font-mono text-xs badge py-3">
({$cursorPositionOnScreen.mapped.x.toFixed(3)}, {$cursorPositionOnScreen.mapped.y.toFixed(
3,
)})
</span>
{#if Object.keys($friendsCursorPositions).length > 0}
<div class="mt-4 flex flex-col gap-2">
<p class="text-sm font-semibold opacity-75">Friends Online</p>
<div class="flex flex-col gap-2">
<div>
{#each Object.entries($friendsCursorPositions) as [userId, position]}
{@const dollConfig = getFriendDollConfig(userId)}
<div
class="bg-base-200/50 p-2 rounded text-xs text-left flex gap-2 flex-col"
>
<div class="badge py-3 text-xs text-left flex flex-row gap-2">
<span class="font-bold">{getFriendName(userId)}</span>
<div class="flex flex-col font-mono">
<span>
Raw: ({position.raw.x}, {position.raw.y})
</span>
<span>
Mapped: ({position.mapped.x.toFixed(3)}, {position.mapped.y.toFixed(
({position.mapped.x.toFixed(3)}, {position.mapped.y.toFixed(
3,
)})
</span>
@@ -74,6 +72,7 @@
{/if}
</div>
</div>
<div class="absolute inset-0 size-full">
{#if Object.keys($friendsCursorPositions).length > 0}
{#each Object.entries($friendsCursorPositions) as [userId, position]}
@@ -85,6 +84,7 @@
name={getFriendName(userId)}
bodyColor={config?.colorScheme?.body}
outlineColor={config?.colorScheme?.outline}
{isInteractive}
/>
{/if}
{/each}