// js/file.js import { appState, saveStateToSession, resetProjectState } from "./state.js"; import { loadAudioForTrack } from "./pattern/pattern_state.js"; import { renderAll, getSamplePathMap } from "./ui.js"; import { DEFAULT_PAN, DEFAULT_VOLUME, NOTE_LENGTH } from "./config.js"; import { initializeAudioContext, getAudioContext, getMainGainNode, } from "./audio.js"; import * as Tone from "https://esm.sh/tone"; // --- NOVA IMPORTAÇÃO --- import { sendAction } from "./socket.js"; // --- NOVA ADIÇÃO --- // Conteúdo do 'teste.mmp' (projeto em branco) const BLANK_PROJECT_XML = ` `; /** * Executa um reset completo do estado local do projeto. * Limpa o backup da sessão, reseta o appState e renderiza a UI. */ export function handleLocalProjectReset() { console.log("Recebido comando de reset. Limpando estado local..."); // 1. Limpa o backup da sessão if (window.ROOM_NAME) { try { sessionStorage.removeItem(`temp_state_${window.ROOM_NAME}`); console.log("Estado da sessão local limpo."); } catch (e) { console.error("Falha ao limpar estado da sessão:", e); } } // 2. Reseta o estado da memória (appState) // (Isso deve zerar o appState.pattern.tracks, etc) resetProjectState(); // 3. Reseta a UI global para os padrões document.getElementById("bpm-input").value = 140; document.getElementById("bars-input").value = 1; document.getElementById("compasso-a-input").value = 4; document.getElementById("compasso-b-input").value = 4; // 4. Renderiza a UI vazia renderAll(); // Isso deve redesenhar o editor de patterns vazio console.log("Reset local concluído."); } export async function handleFileLoad(file) { let xmlContent = ""; try { if (file.name.toLowerCase().endsWith(".mmpz")) { const jszip = new JSZip(); const zip = await jszip.loadAsync(file); const projectFile = Object.keys(zip.files).find((name) => name.toLowerCase().endsWith(".mmp") ); if (!projectFile) throw new Error( "Não foi possível encontrar um arquivo .mmp dentro do .mmpz" ); xmlContent = await zip.files[projectFile].async("string"); } else { xmlContent = await file.text(); } // ANTES: await parseMmpContent(xmlContent); // DEPOIS: // Envia o XML para o servidor, que o transmitirá para todos (incluindo nós) sendAction({ type: "LOAD_PROJECT", xml: xmlContent }); } catch (error) { console.error("Erro ao carregar o projeto:", error); alert(`Erro ao carregar projeto: ${error.message}`); } } export async function loadProjectFromServer(fileName) { try { const response = await fetch(`mmp/${fileName}`); if (!response.ok) throw new Error(`Não foi possível carregar o arquivo ${fileName}`); const xmlContent = await response.text(); // ANTES: // await parseMmpContent(xmlContent); // return true; // DEPOIS: // Envia o XML para o servidor sendAction({ type: "LOAD_PROJECT", xml: xmlContent }); return true; // Retorna true para que o modal de UI feche } catch (error) { console.error("Erro ao carregar projeto do servidor:", error); console.error(error); alert(`Erro ao carregar projeto: ${error.message}`); return false; } } // 'parseMmpContent' agora é chamado pelo 'socket.js' // quando ele recebe a ação 'LOAD_PROJECT' ou 'load_project_state'. export async function parseMmpContent(xmlString) { resetProjectState(); initializeAudioContext(); appState.global.justReset = xmlString === BLANK_PROJECT_XML; // Limpa manualmente a UI de áudio, pois resetProjectState() // só limpa os *dados* (appState.audio.clips). const audioContainer = document.getElementById("audio-track-container"); if (audioContainer) { audioContainer.innerHTML = ""; } const parser = new DOMParser(); const xmlDoc = parser.parseFromString(xmlString, "application/xml"); appState.global.originalXmlDoc = xmlDoc; let newTracks = []; const head = xmlDoc.querySelector("head"); if (head) { document.getElementById("bpm-input").value = head.getAttribute("bpm") || 140; document.getElementById("compasso-a-input").value = head.getAttribute("timesig_numerator") || 4; document.getElementById("compasso-b-input").value = head.getAttribute("timesig_denominator") || 4; } const allBBTrackNodes = Array.from( xmlDoc.querySelectorAll( 'song > trackcontainer[type="song"] > track[type="1"]' ) ); if (allBBTrackNodes.length === 0) { const allBBTrackNodes = Array.from( xmlDoc.querySelectorAll( 'song > trackcontainer[type="song"] > track[type="1"]' ) ); if (allBBTrackNodes.length === 0) { appState.pattern.tracks = []; // --- INÍCIO DA CORREÇÃO --- // O resetProjectState() [na linha 105] já limpou o appState.audio. // No entanto, a UI (DOM) do editor de áudio não foi limpa. // Vamos forçar a limpeza do container aqui: const audioContainer = document.getElementById("audio-track-container"); if (audioContainer) { audioContainer.innerHTML = ""; // Limpa a UI de áudio } // --- FIM DA CORREÇÃO --- renderAll(); // return; // } } const sortedBBTrackNameNodes = [...allBBTrackNodes].sort((a, b) => { const bbtcoA = a.querySelector("bbtco"); const bbtcoB = a.querySelector("bbtco"); const posA = bbtcoA ? parseInt(bbtcoA.getAttribute("pos"), 10) : Infinity; const posB = bbtcoB ? parseInt(bbtcoB.getAttribute("pos"), 10) : Infinity; return posA - posB; }); // --- INÍCIO DA CORREÇÃO 1: Lendo TODAS as Basslines (Tracks type="1") --- // O bug anterior era que o código só lia os instrumentos (tracks type="0") // da PRIMEIRA bassline encontrada (allBBTrackNodes[0]). // A correção abaixo itera em TODAS as basslines (allBBTrackNodes.forEach) // e coleta os instrumentos de CADA UMA delas. // Define um nome global (pode usar o da primeira track, se existir) appState.global.currentBeatBasslineName = allBBTrackNodes[0]?.getAttribute("name") || "Beat/Bassline"; // Cria um array para guardar TODOS os instrumentos de TODAS as basslines const allInstrumentTrackNodes = []; // Loop em CADA bassline (allBBTrackNodes) em vez de apenas na [0] allBBTrackNodes.forEach((bbTrackNode) => { const bbTrackContainer = bbTrackNode.querySelector( "bbtrack > trackcontainer" ); if (bbTrackContainer) { // Encontra os instrumentos (type="0") DENTRO desta bassline const instrumentTracks = bbTrackContainer.querySelectorAll('track[type="0"]'); // Adiciona os instrumentos encontrados ao array principal allInstrumentTrackNodes.push(...Array.from(instrumentTracks)); } }); // Se não achou NENHUM instrumento em NENHUMA bassline, encerra if (allInstrumentTrackNodes.length === 0) { appState.pattern.tracks = []; renderAll(); return; } // --- FIM DA CORREÇÃO 1 --- const pathMap = getSamplePathMap(); // Agora o map usa o array corrigido (allInstrumentTrackNodes) newTracks = Array.from(allInstrumentTrackNodes) .map((trackNode) => { const instrumentNode = trackNode.querySelector("instrument"); const instrumentTrackNode = trackNode.querySelector("instrumenttrack"); if (!instrumentNode || !instrumentTrackNode) return null; const trackName = trackNode.getAttribute("name"); if (instrumentNode.getAttribute("name") === "tripleoscillator") { return null; } const allPatternsNodeList = trackNode.querySelectorAll("pattern"); const allPatternsArray = Array.from(allPatternsNodeList).sort((a, b) => { const posA = parseInt(a.getAttribute("pos"), 10) || 0; const posB = parseInt(b.getAttribute("pos"), 10) || 0; // --- CORREÇÃO 2: Ordenação dos Patterns --- // O bug aqui era `posB - posA`, que invertia a ordem dos patterns // (o "Pattern 1" recebia as notas do "Pattern 8", etc.) // `posA - posB` garante a ordem correta (crescente: P1, P2, P3...). return posA - posB; }); const patterns = sortedBBTrackNameNodes.map((bbTrack, index) => { const patternNode = allPatternsArray[index]; const bbTrackName = bbTrack.getAttribute("name") || `Pattern ${index + 1}`; if (!patternNode) { const firstPattern = allPatternsArray[0]; const stepsLength = firstPattern ? parseInt(firstPattern.getAttribute("steps"), 10) || 16 : 16; return { name: bbTrackName, steps: new Array(stepsLength).fill(false), pos: 0, }; } const patternSteps = parseInt(patternNode.getAttribute("steps"), 10) || 16; const steps = new Array(patternSteps).fill(false); const ticksPerStep = 12; patternNode.querySelectorAll("note").forEach((noteNode) => { const noteLocalPos = parseInt(noteNode.getAttribute("pos"), 10); const stepIndex = Math.round(noteLocalPos / ticksPerStep); if (stepIndex < patternSteps) { steps[stepIndex] = true; } }); return { name: bbTrackName, steps: steps, pos: parseInt(patternNode.getAttribute("pos"), 10) || 0, }; }); const hasNotes = patterns.some((p) => p.steps.includes(true)); if (!hasNotes) return null; const afpNode = instrumentNode.querySelector("audiofileprocessor"); const sampleSrc = afpNode ? afpNode.getAttribute("src") : null; let finalSamplePath = null; if (sampleSrc) { const filename = sampleSrc.split("/").pop(); if (pathMap[filename]) { finalSamplePath = pathMap[filename]; } else { let cleanSrc = sampleSrc; if (cleanSrc.startsWith("samples/")) { cleanSrc = cleanSrc.substring("samples/".length); } finalSamplePath = `src/samples/${cleanSrc}`; } } const volFromFile = parseFloat(instrumentTrackNode.getAttribute("vol")); const panFromFile = parseFloat(instrumentTrackNode.getAttribute("pan")); const firstPatternWithNotesIndex = patterns.findIndex((p) => p.steps.includes(true) ); return { id: Date.now() + Math.random(), name: trackName, samplePath: finalSamplePath, patterns: patterns, // --- INÍCIO DA CORREÇÃO --- // ANTES: // activePatternIndex: // firstPatternWithNotesIndex !== -1 ? firstPatternWithNotesIndex : 0, // // DEPOIS (force o Padrão 1): activePatternIndex: 0, // --- FIM DA CORREÇÃO --- volume: !isNaN(volFromFile) ? volFromFile / 100 : DEFAULT_VOLUME, pan: !isNaN(panFromFile) ? panFromFile / 100 : DEFAULT_PAN, instrumentName: instrumentNode.getAttribute("name"), instrumentXml: instrumentNode.innerHTML, }; }) .filter((track) => track !== null); let isFirstTrackWithNotes = true; newTracks.forEach((track) => { // --- INÍCIO DA CORREÇÃO --- // (Esta parte já existia no seu arquivo, mantida) // Agora usando Volume em dB (Opção B) track.volumeNode = new Tone.Volume(Tone.gainToDb(track.volume)); track.pannerNode = new Tone.Panner(track.pan); // Cadeia de áudio: Volume(dB) -> Panner -> Saída Principal track.volumeNode.connect(track.pannerNode); track.pannerNode.connect(getMainGainNode()); // --- FIM DA CORREÇÃO --- if (isFirstTrackWithNotes) { const activeIdx = track.activePatternIndex || 0; const activePattern = track.patterns[activeIdx]; if (activePattern) { const firstPatternSteps = activePattern.steps.length; const stepsPerBar = 16; const requiredBars = Math.ceil(firstPatternSteps / stepsPerBar); document.getElementById("bars-input").value = requiredBars > 0 ? requiredBars : 1; isFirstTrackWithNotes = false; } } }); try { const trackLoadPromises = newTracks.map((track) => loadAudioForTrack(track) ); await Promise.all(trackLoadPromises); } catch (error) { console.error("Ocorreu um erro ao carregar os áudios do projeto:", error); } appState.pattern.tracks = newTracks; appState.pattern.activeTrackId = appState.pattern.tracks[0]?.id || null; // --- INÍCIO DA CORREÇÃO --- // Define o estado global para também ser o Padrão 1 (índice 0) appState.pattern.activePatternIndex = 0; // --- FIM DA CORREÇÃO --- // --- A MÁGICA DO F5 (Versão 2.0 - Corrigida) --- try { const roomName = window.ROOM_NAME || "default_room"; const tempStateJSON = sessionStorage.getItem(`temp_state_${roomName}`); if (tempStateJSON) { console.log("Restaurando estado temporário da sessão (pós-F5)..."); const tempState = JSON.parse(tempStateJSON); // NÃO FAÇA: appState.pattern = tempState.pattern; (Isso apaga os Tone.js nodes) // EM VEZ DISSO, FAÇA O "MERGE" (MESCLAGEM): // 1. Mescla os 'tracks' // Itera nos tracks "vivos" (com nós de áudio) que acabamos de criar appState.pattern.tracks.forEach((liveTrack) => { // Encontra o track salvo correspondente const savedTrack = tempState.pattern.tracks.find( (t) => t.id === liveTrack.id ); if (savedTrack) { // Copia os dados do 'savedTrack' para o 'liveTrack' liveTrack.name = savedTrack.name; liveTrack.patterns = savedTrack.patterns; liveTrack.activePatternIndex = savedTrack.activePatternIndex; liveTrack.volume = savedTrack.volume; liveTrack.pan = savedTrack.pan; // ATUALIZA OS NÓS DO TONE.JS com os valores salvos! if (liveTrack.volumeNode) { liveTrack.volumeNode.volume.value = Tone.gainToDb( savedTrack.volume ); } if (liveTrack.pannerNode) { liveTrack.pannerNode.pan.value = savedTrack.pan; } } }); // 2. Remove tracks "vivos" que não existem mais no estado salvo // (Ex: se o usuário deletou um track antes de dar F5) appState.pattern.tracks = appState.pattern.tracks.filter((liveTrack) => tempState.pattern.tracks.some((t) => t.id === liveTrack.id) ); // 3. Restaura valores globais da UI document.getElementById("bpm-input").value = tempState.global.bpm; document.getElementById("compasso-a-input").value = tempState.global.compassoA; document.getElementById("compasso-b-input").value = tempState.global.compassoB; document.getElementById("bars-input").value = tempState.global.bars; // 4. Restaura o ID do track ativo appState.pattern.activeTrackId = tempState.pattern.activeTrackId; console.log("Estado da sessão restaurado com sucesso."); } } catch (e) { console.error( "Erro ao restaurar estado da sessão (pode estar corrompido)", e ); if (window.ROOM_NAME) { sessionStorage.removeItem(`temp_state_${window.ROOM_NAME}`); } } // --- FIM DA MÁGICA (V2.0) --- // Agora sim, renderiza com o estado CORRIGIDO E MESCLADO await Promise.resolve(); renderAll(); console.log("[UI] Projeto renderizado após parseMmpContent"); } export function generateMmpFile() { if (appState.global.originalXmlDoc) { modifyAndSaveExistingMmp(); } else { generateNewMmp(); } } // Função auxiliar (pode ser movida para cá) que gera o XML a partir do appState // Copiada de generateMmpFile/modifyAndSaveExistingMmp function generateXmlFromState() { if (!appState.global.originalXmlDoc) { // Se não houver XML original, precisamos gerar um novo // Por simplicidade, para este fix, vamos retornar o estado atual do LMMS // mas o ideal seria gerar o XML completo (como generateNewMmp) console.warn( "Não há XML original para modificar. Usando a base atual do appState." ); // No seu caso, use o conteúdo de generateNewMmp() return ""; } const xmlDoc = appState.global.originalXmlDoc.cloneNode(true); const head = xmlDoc.querySelector("head"); if (head) { head.setAttribute("bpm", document.getElementById("bpm-input").value); head.setAttribute("num_bars", document.getElementById("bars-input").value); head.setAttribute( "timesig_numerator", document.getElementById("compasso-a-input").value ); head.setAttribute( "timesig_denominator", document.getElementById("compasso-b-input").value ); } const bbTrackContainer = xmlDoc.querySelector( 'track[type="1"] > bbtrack > trackcontainer' ); if (bbTrackContainer) { bbTrackContainer .querySelectorAll('track[type="0"]') .forEach((node) => node.remove()); const tracksXml = appState.pattern.tracks .map((track) => createTrackXml(track)) .join(""); const tempDoc = new DOMParser().parseFromString( `${tracksXml}`, "application/xml" ); Array.from(tempDoc.documentElement.children).forEach((newTrackNode) => { bbTrackContainer.appendChild(newTrackNode); }); } const serializer = new XMLSerializer(); return serializer.serializeToString(xmlDoc); } /** * Envia o estado ATUAL do projeto (XML dos padrões) para o servidor * para que ele persista a "cópia temporária" em disco/memória. * Deve ser chamado APÓS alterações significativas no padrão (steps, tracks). */ export function syncPatternStateToServer() { if (!window.ROOM_NAME) return; const currentXml = generateXmlFromState(); sendAction({ type: "SYNC_PATTERN_STATE", xml: currentXml, }); // Salva o estado localmente também! saveStateToSession(); // <-- ADICIONE ISSO } function createTrackXml(track) { if (track.patterns.length === 0) return ""; const ticksPerStep = 12; const lmmsVolume = Math.round(track.volume * 100); const lmmsPan = Math.round(track.pan * 100); const patternsXml = track.patterns .map((pattern) => { const patternNotes = pattern.steps .map((isActive, index) => { if (isActive) { const notePos = Math.round(index * ticksPerStep); return ``; } return ""; }) .join("\n "); return ` ${patternNotes} `; }) .join("\n "); return ` ${track.instrumentXml} ${patternsXml} `; } function modifyAndSaveExistingMmp() { console.log("Modificando arquivo .mmp existente..."); const xmlDoc = appState.global.originalXmlDoc.cloneNode(true); const head = xmlDoc.querySelector("head"); if (head) { head.setAttribute("bpm", document.getElementById("bpm-input").value); head.setAttribute("num_bars", document.getElementById("bars-input").value); head.setAttribute( "timesig_numerator", document.getElementById("compasso-a-input").value ); head.setAttribute( "timesig_denominator", document.getElementById("compasso-b-input").value ); } const bbTrackContainer = xmlDoc.querySelector( 'track[type="1"] > bbtrack > trackcontainer' ); if (bbTrackContainer) { bbTrackContainer .querySelectorAll('track[type="0"]') .forEach((node) => node.remove()); const tracksXml = appState.pattern.tracks .map((track) => createTrackXml(track)) .join(""); const tempDoc = new DOMParser().parseFromString( `${tracksXml}`, "application/xml" ); Array.from(tempDoc.documentElement.children).forEach((newTrackNode) => { bbTrackContainer.appendChild(newTrackNode); }); } const serializer = new XMLSerializer(); const mmpContent = serializer.serializeToString(xmlDoc); downloadFile(mmpContent, "projeto_editado.mmp"); } function generateNewMmp() { const bpm = document.getElementById("bpm-input").value; const sig_num = document.getElementById("compasso-a-input").value; const sig_den = document.getElementById("compasso-b-input").value; const num_bars = document.getElementById("bars-input").value; const tracksXml = appState.pattern.tracks .map((track) => createTrackXml(track)) .join(""); const mmpContent = ` ${tracksXml}

Feito com MMPCreator

]]>
`; downloadFile(mmpContent, "novo_projeto.mmp"); } function downloadFile(content, fileName) { const blob = new Blob([content], { type: "application/xml;charset=utf-8" }); const url = URL.createObjectURL(blob); const a = document.createElement("a"); a.href = url; a.download = fileName; document.body.appendChild(a); a.click(); document.body.removeChild(a); URL.revokeObjectURL(url); } export { BLANK_PROJECT_XML };