diff --git a/.lovable/plan.md b/.lovable/plan.md index c6bdee8..649cb92 100644 --- a/.lovable/plan.md +++ b/.lovable/plan.md @@ -1,118 +1,62 @@ -# Plano — Compartilhar tela do Quest 3 via link público +## Resposta curta -Permitir que o inspetor no Quest gere um link tipo `tracksteelxr.lovable.app/watch/AB12CD`, mande no WhatsApp/email, e até 3 espectadores assistam ao vivo (vídeo + áudio do Quest) em qualquer celular ou PC. +Sim, é totalmente possível — hoje o app só carrega 1 modelo por vez (`model: ModelInfo | null` no store), mas a arquitetura (Three.js + R3F) suporta naturalmente múltiplas peças em uma mesma cena. Precisa migrar de "modelo único" para "lista de modelos", cada um com seu próprio transform (posição/rotação/escala) e seleção ativa. -## Como vai funcionar para o usuário +## O que muda -**No Quest (broadcaster):** -1. No HUD do `/xr` aparece novo botão **"Compartilhar"** (ícone Share/Cast) -2. Ao clicar: app gera código de 6 caracteres, mostra QR + link encurtado -3. Botões "Copiar link" e "Compartilhar" (Web Share API → abre WhatsApp/email do sistema) -4. Indicador vermelho 🔴 LIVE fica visível enquanto transmite, com contador de viewers -5. Botão "Encerrar" para parar +### 1. Store (`useModelStore.ts`) +- Substituir `model: ModelInfo | null` por `models: SceneModel[]` (até 5 simultâneos para manter 72 FPS no Quest 3). +- Cada `SceneModel` tem: `id`, `fileName`, `url`, `fineTuning` próprio, `visible`, `color` (cor de identificação), `locked`. +- Adicionar `activeModelId: string | null` — o "modelo selecionado" recebe os controles de fine-tuning, escala e medição. +- Ações: `addModel`, `removeModel`, `duplicateModel`, `setActiveModel`, `updateModelTransform`, `toggleVisibility`. +- Compatibilidade: `model` (singular) continua exposto como getter derivado do `activeModelId` para não quebrar telas legadas. -**No celular/PC (viewer):** -1. Abre o link → tela cheia com vídeo da sessão XR -2. Sem login, sem instalar nada -3. Mostra "Aguardando inspetor…" se a sala não estiver ativa -4. Read-only: só assiste +### 2. Cena 3D (`ModelViewer.tsx`) +- Renderizar `models.map(m => )`. +- Cada `` aplica seu próprio transform (já existe a lógica, só vira por-instância). +- Outline/halo sutil no modelo ativo para feedback visual. +- Click em um modelo → torna-o ativo (raycaster identifica qual instância foi clicada). -## Arquitetura técnica +### 3. UI Desktop (`Viewer.tsx`) +- Novo painel **"Cena"** lateral listando os modelos carregados: + - Nome do arquivo, cor, ícones de visibilidade (olho), trava (cadeado), duplicar, remover. + - Item destacado = ativo. Click seleciona. +- Botão **"+ Adicionar modelo"** abre o mesmo fluxo de upload/cloud já existente, mas em modo "append" em vez de "replace". +- `FineTuningControls`, `ScaleSelector` passam a operar sobre o modelo ativo. -```text - Quest 3 (broadcaster) Lovable Cloud Viewers (celular/PC) - ┌──────────────────┐ ┌─────────────────────┐ ┌──────────────────┐ - │ /xr │ │ Supabase Realtime │ │ /watch/AB12CD │ - │ - canvas WebXR │ ──SDP──▶│ (signaling channel) │◀──SDP── │ -