com a classe 'pattern-clip-view'
+ */
+function createPatternViewElement(patternData) {
+ const view = document.createElement("div");
+ view.className = "pattern-clip-view"; // (do creation.html)
+
+ // Filtra trilhas que possam ser vazias ou inválidas no array
+ const validTracksData = patternData.filter(
+ (steps) => Array.isArray(steps) && steps.length > 0
+ );
+
+ // Encontra o total de steps (usando a trilha mais longa como referência)
+ const totalSteps = validTracksData.reduce(
+ (max, steps) => Math.max(max, steps.length),
+ 0
+ );
+ if (totalSteps === 0) return view; // Retorna view vazia se não houver steps
+
+ validTracksData.forEach((trackSteps) => {
+ const row = document.createElement("div");
+ row.className = "pattern-clip-track-row"; // (do creation.html)
+
+ // Calcula a largura de cada step como porcentagem
+ const stepWidthPercent = (1 / totalSteps) * 100;
+
+ for (let i = 0; i < totalSteps; i++) {
+ // Se o step[i] for true, desenha a nota
+ if (trackSteps[i] === true) {
+ const note = document.createElement("div");
+ note.className = "pattern-step-note"; // (do creation.html)
+
+ // Define a posição (left) e a largura (width) em porcentagem
+ // Isso permite que o clip seja redimensionado (stretch)
+ // e as notas se ajustem.
+ note.style.left = `${(i / totalSteps) * 100}%`;
+ note.style.width = `${stepWidthPercent}%`;
+
+ row.appendChild(note);
+ }
+ }
+ view.appendChild(row);
+ });
+
+ return view;
+}
+// --- FIM DA NOVA FUNÇÃO ---
diff --git a/assets/js/creations/file.js b/assets/js/creations/file.js
index 1c2ded85..75739adf 100644
--- a/assets/js/creations/file.js
+++ b/assets/js/creations/file.js
@@ -1,14 +1,65 @@
// js/file.js
-import { appState, resetProjectState } from "./state.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 {
+ 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 {
@@ -19,17 +70,18 @@ export async function handleFileLoad(file) {
name.toLowerCase().endsWith(".mmp")
);
if (!projectFile)
- throw new Error("Não foi possível encontrar um arquivo .mmp dentro do .mmpz");
+ 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 });
-
+ sendAction({ type: "LOAD_PROJECT", xml: xmlContent });
} catch (error) {
console.error("Erro ao carregar o projeto:", error);
alert(`Erro ao carregar projeto: ${error.message}`);
@@ -41,21 +93,20 @@ export async function loadProjectFromServer(fileName) {
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:
+ // ANTES:
// await parseMmpContent(xmlContent);
// return true;
// DEPOIS:
// Envia o XML para o servidor
- sendAction({ type: 'LOAD_PROJECT', xml: xmlContent });
+ 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);
+ console.error(error);
alert(`Erro ao carregar projeto: ${error.message}`);
return false;
}
@@ -67,6 +118,13 @@ export async function loadProjectFromServer(fileName) {
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");
@@ -76,125 +134,202 @@ export async function parseMmpContent(xmlString) {
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;
+ 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"]'));
+ const allBBTrackNodes = Array.from(
+ xmlDoc.querySelectorAll(
+ 'song > trackcontainer[type="song"] > track[type="1"]'
+ )
+ );
if (allBBTrackNodes.length === 0) {
- appState.pattern.tracks = [];
- renderAll();
- return;
+ 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 = b.querySelector('bbtco');
- const posA = bbtcoA ? parseInt(bbtcoA.getAttribute('pos'), 10) : Infinity;
- const posB = bbtcoB ? parseInt(bbtcoB.getAttribute('pos'), 10) : Infinity;
+ 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;
});
-
- const dataSourceTrack = allBBTrackNodes[0];
- appState.global.currentBeatBasslineName = dataSourceTrack.getAttribute("name") || "Beat/Bassline";
- const bbTrackContainer = dataSourceTrack.querySelector('bbtrack > trackcontainer');
- if (!bbTrackContainer) {
- appState.pattern.tracks = [];
- renderAll();
+ // --- 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 instrumentTracks = bbTrackContainer.querySelectorAll('track[type="0"]');
const pathMap = getSamplePathMap();
-
- newTracks = Array.from(instrumentTracks).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;
- return posB - posA;
- });
-
- const patterns = sortedBBTrackNameNodes.map((bbTrack, index) => {
+ // 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}`;
+ 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 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 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;
- }
+ 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
+ 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 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 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];
+ finalSamplePath = pathMap[filename];
} else {
- let cleanSrc = sampleSrc;
- if (cleanSrc.startsWith('samples/')) {
- cleanSrc = cleanSrc.substring('samples/'.length);
- }
- finalSamplePath = `src/samples/${cleanSrc}`;
+ 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,
- activePatternIndex: firstPatternWithNotesIndex !== -1 ? firstPatternWithNotesIndex : 0,
- 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);
+ 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 => {
+ 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);
@@ -211,14 +346,17 @@ export async function parseMmpContent(xmlString) {
const firstPatternSteps = activePattern.steps.length;
const stepsPerBar = 16;
const requiredBars = Math.ceil(firstPatternSteps / stepsPerBar);
- document.getElementById("bars-input").value = requiredBars > 0 ? requiredBars : 1;
+ document.getElementById("bars-input").value =
+ requiredBars > 0 ? requiredBars : 1;
isFirstTrackWithNotes = false;
}
}
});
try {
- const trackLoadPromises = newTracks.map(track => loadAudioForTrack(track));
+ 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);
@@ -226,13 +364,87 @@ export async function parseMmpContent(xmlString) {
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 ---
- // força atualização total da UI e dos editores de pattern
- await Promise.resolve(); // garante que os tracks estejam no estado
+ // --- 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');
-
+ console.log("[UI] Projeto renderizado após parseMmpContent");
}
export function generateMmpFile() {
@@ -247,12 +459,14 @@ export function generateMmpFile() {
// 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 "";
+ // 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);
@@ -260,14 +474,29 @@ function generateXmlFromState() {
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);
+ 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');
+ 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");
+ 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);
});
@@ -282,34 +511,39 @@ function generateXmlFromState() {
* Deve ser chamado APÓS alterações significativas no padrão (steps, tracks).
*/
export function syncPatternStateToServer() {
- if (!window.ROOM_NAME) return; // Não faz nada se não estiver em sala
+ if (!window.ROOM_NAME) return;
+ const currentXml = generateXmlFromState();
- const currentXml = generateXmlFromState();
-
- // NOTA: Usamos um novo tipo de ação para não confundir com o carregamento de arquivo
- sendAction({
- type: 'SYNC_PATTERN_STATE',
- xml: currentXml
- });
+ 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 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 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 `
+ }
+ return "";
+ })
+ .join("\n ");
+ return `
${patternNotes}
`;
- }).join('\n ');
+ })
+ .join("\n ");
return `