504 lines
19 KiB
JavaScript
Executable File
504 lines
19 KiB
JavaScript
Executable File
// js/creations/file.js
|
|
|
|
//--------------------------------------------------------------
|
|
// IMPORTS NECESSÁRIOS
|
|
//--------------------------------------------------------------
|
|
import {
|
|
appState,
|
|
saveStateToSession,
|
|
resetProjectState,
|
|
loadStateFromSession,
|
|
} 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, getMainGainNode } from "./audio.js";
|
|
import { DEFAULT_PROJECT_XML } from "./utils.js";
|
|
import * as Tone from "https://esm.sh/tone";
|
|
import { sendAction } from "./socket.js";
|
|
|
|
//--------------------------------------------------------------
|
|
// MANIPULAÇÃO DE ARQUIVOS E PARSING
|
|
//--------------------------------------------------------------
|
|
|
|
export function handleLocalProjectReset() {
|
|
console.log("Recebido comando de reset. Limpando estado local...");
|
|
|
|
if (window.ROOM_NAME) {
|
|
try {
|
|
sessionStorage.removeItem(`temp_state_${window.ROOM_NAME}`);
|
|
} catch (e) {
|
|
console.error("Falha ao limpar estado da sessão:", e);
|
|
}
|
|
}
|
|
|
|
resetProjectState();
|
|
|
|
const bpmInput = document.getElementById("bpm-input");
|
|
if(bpmInput) bpmInput.value = 140;
|
|
|
|
["bars-input", "compasso-a-input", "compasso-b-input"].forEach(id => {
|
|
const el = document.getElementById(id);
|
|
if(el) el.value = (id === "bars-input") ? 1 : 4;
|
|
});
|
|
|
|
renderAll();
|
|
}
|
|
|
|
export async function handleFileLoad(file) {
|
|
let xmlContent = "";
|
|
try {
|
|
if (file.name.toLowerCase().endsWith(".mmpz")) {
|
|
// eslint-disable-next-line no-undef
|
|
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();
|
|
}
|
|
|
|
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(`src_mmpSearch/mmp/${fileName}`);
|
|
if (!response.ok)
|
|
throw new Error(`Não foi possível carregar o arquivo ${fileName}`);
|
|
|
|
const xmlContent = await response.text();
|
|
sendAction({ type: "LOAD_PROJECT", xml: xmlContent });
|
|
return true;
|
|
} catch (error) {
|
|
console.error("Erro ao carregar projeto do servidor:", error);
|
|
alert(`Erro ao carregar projeto: ${error.message}`);
|
|
return false;
|
|
}
|
|
}
|
|
|
|
// =================================================================
|
|
// FUNÇÃO AUXILIAR: PARSE DE INSTRUMENTO ÚNICO
|
|
// =================================================================
|
|
function parseInstrumentNode(trackNode, sortedBBTrackNameNodes, pathMap) {
|
|
const instrumentNode = trackNode.querySelector("instrument");
|
|
const instrumentTrackNode = trackNode.querySelector("instrumenttrack");
|
|
|
|
if (!instrumentNode || !instrumentTrackNode) return null;
|
|
|
|
const trackName = trackNode.getAttribute("name");
|
|
const instrumentName = instrumentNode.getAttribute("name");
|
|
|
|
// Identifica e ordena os patterns
|
|
const allPatternsNodeList = trackNode.querySelectorAll("pattern");
|
|
const allPatternsArray = Array.from(allPatternsNodeList).sort((a, b) => {
|
|
return (parseInt(a.getAttribute("pos"), 10) || 0) - (parseInt(b.getAttribute("pos"), 10) || 0);
|
|
});
|
|
|
|
const patternsToCreate = sortedBBTrackNameNodes.length > 0
|
|
? sortedBBTrackNameNodes
|
|
: [{ getAttribute: () => "Pattern 1" }];
|
|
|
|
const patterns = patternsToCreate.map((bbTrack, index) => {
|
|
const patternNode = allPatternsArray[index];
|
|
const bbTrackName = bbTrack.getAttribute("name") || `Pattern ${index + 1}`;
|
|
|
|
if (!patternNode) {
|
|
return { name: bbTrackName, steps: new Array(16).fill(false), notes: [], pos: 0 };
|
|
}
|
|
|
|
const patternSteps = parseInt(patternNode.getAttribute("steps"), 10) || 16;
|
|
const steps = new Array(patternSteps).fill(false);
|
|
const notes = [];
|
|
const ticksPerStep = 12;
|
|
|
|
// Extrai as notas e popula os steps
|
|
patternNode.querySelectorAll("note").forEach((noteNode) => {
|
|
const pos = parseInt(noteNode.getAttribute("pos"), 10);
|
|
notes.push({
|
|
pos: pos,
|
|
len: parseInt(noteNode.getAttribute("len"), 10),
|
|
key: parseInt(noteNode.getAttribute("key"), 10),
|
|
vol: parseInt(noteNode.getAttribute("vol"), 10),
|
|
pan: parseInt(noteNode.getAttribute("pan"), 10),
|
|
});
|
|
|
|
// Converte posição em tick para índice do step (grid)
|
|
const stepIndex = Math.round(pos / ticksPerStep);
|
|
if (stepIndex < patternSteps) steps[stepIndex] = true;
|
|
});
|
|
|
|
return {
|
|
name: bbTrackName,
|
|
steps: steps,
|
|
notes: notes,
|
|
pos: parseInt(patternNode.getAttribute("pos"), 10) || 0,
|
|
};
|
|
});
|
|
|
|
let finalSamplePath = null;
|
|
let trackType = "plugin";
|
|
|
|
if (instrumentName === "audiofileprocessor") {
|
|
trackType = "sampler";
|
|
const afpNode = instrumentNode.querySelector("audiofileprocessor");
|
|
const sampleSrc = afpNode ? afpNode.getAttribute("src") : null;
|
|
if (sampleSrc) {
|
|
const filename = sampleSrc.split("/").pop();
|
|
if (pathMap[filename]) {
|
|
finalSamplePath = pathMap[filename];
|
|
} else {
|
|
let cleanSrc = sampleSrc.startsWith("samples/") ? sampleSrc.substring("samples/".length) : sampleSrc;
|
|
finalSamplePath = `src/samples/${cleanSrc}`;
|
|
}
|
|
}
|
|
}
|
|
|
|
const volFromFile = parseFloat(instrumentTrackNode.getAttribute("vol"));
|
|
const panFromFile = parseFloat(instrumentTrackNode.getAttribute("pan"));
|
|
|
|
return {
|
|
id: Date.now() + Math.random(),
|
|
name: trackName,
|
|
type: trackType,
|
|
samplePath: finalSamplePath,
|
|
patterns: patterns,
|
|
activePatternIndex: 0,
|
|
volume: !isNaN(volFromFile) ? volFromFile / 100 : DEFAULT_VOLUME,
|
|
pan: !isNaN(panFromFile) ? panFromFile / 100 : DEFAULT_PAN,
|
|
instrumentName: instrumentName,
|
|
instrumentXml: instrumentNode.innerHTML,
|
|
};
|
|
}
|
|
|
|
// =================================================================
|
|
// 🔥 FUNÇÃO DE PARSING PRINCIPAL (CORRIGIDA)
|
|
// =================================================================
|
|
export async function parseMmpContent(xmlString) {
|
|
resetProjectState();
|
|
initializeAudioContext();
|
|
appState.global.justReset = xmlString === DEFAULT_PROJECT_XML;
|
|
|
|
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;
|
|
|
|
// Configuração Global (BPM, Compasso)
|
|
const head = xmlDoc.querySelector("head");
|
|
if (head) {
|
|
const setVal = (id, attr, def) => {
|
|
const el = document.getElementById(id);
|
|
if(el) el.value = head.getAttribute(attr) || def;
|
|
};
|
|
setVal("bpm-input", "bpm", 140);
|
|
setVal("compasso-a-input", "timesig_numerator", 4);
|
|
setVal("compasso-b-input", "timesig_denominator", 4);
|
|
}
|
|
|
|
const pathMap = getSamplePathMap();
|
|
|
|
// 1. Identifica colunas de beat/patterns (usado para mapear steps)
|
|
// Normalmente ficam dentro do primeiro container de Bassline
|
|
const bbTrackNodes = Array.from(xmlDoc.querySelectorAll('track[type="1"]'));
|
|
let sortedBBTrackNameNodes = [];
|
|
if (bbTrackNodes.length > 0) {
|
|
sortedBBTrackNameNodes = Array.from(bbTrackNodes[0].querySelectorAll("bbtco")).sort((a, b) => {
|
|
return (parseInt(a.getAttribute("pos"), 10) || 0) - (parseInt(b.getAttribute("pos"), 10) || 0);
|
|
});
|
|
}
|
|
|
|
// -------------------------------------------------------------
|
|
// 2. EXTRAÇÃO DE TODOS OS INSTRUMENTOS (RECURSIVO)
|
|
// -------------------------------------------------------------
|
|
// Aqui está a correção: Vamos buscar TODOS os instrumentos (type="0"),
|
|
// não importa se estão na raiz ou dentro de uma bassline.
|
|
// Isso garante que Kicker, Snare, etc., apareçam no Pattern Editor.
|
|
|
|
const allInstrumentNodes = Array.from(xmlDoc.querySelectorAll('track[type="0"]'));
|
|
|
|
const allInstruments = allInstrumentNodes
|
|
.map(node => parseInstrumentNode(node, sortedBBTrackNameNodes, pathMap))
|
|
.filter(t => t !== null);
|
|
|
|
// -------------------------------------------------------------
|
|
// 3. EXTRAÇÃO DAS TRILHAS DE BASSLINE (CONTAINERS)
|
|
// -------------------------------------------------------------
|
|
// Isso garante que os blocos azuis apareçam na Playlist.
|
|
|
|
const basslineContainers = bbTrackNodes.map(trackNode => {
|
|
const trackName = trackNode.getAttribute("name") || "Beat/Bassline";
|
|
|
|
// Extrai os clipes da timeline (blocos azuis)
|
|
const playlistClips = Array.from(trackNode.querySelectorAll(":scope > bbtco")).map(bbtco => {
|
|
return {
|
|
pos: parseInt(bbtco.getAttribute("pos"), 10) || 0,
|
|
len: parseInt(bbtco.getAttribute("len"), 10) || 192,
|
|
name: trackName
|
|
};
|
|
});
|
|
|
|
// Se não tiver clipes, não cria a trilha visual inútil na playlist
|
|
if (playlistClips.length === 0) return null;
|
|
|
|
// Extrai também os instrumentos internos apenas para referência (opcional)
|
|
// mas não os usamos para renderizar no main list para evitar duplicidade de lógica
|
|
const internalInstrumentNodes = Array.from(trackNode.querySelectorAll('bbtrack > trackcontainer > track[type="0"]'));
|
|
const internalInstruments = internalInstrumentNodes
|
|
.map(node => parseInstrumentNode(node, sortedBBTrackNameNodes, pathMap))
|
|
.filter(t => t !== null);
|
|
|
|
return {
|
|
id: `bassline_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`,
|
|
name: trackName,
|
|
type: "bassline", // Tipo especial para o audio_ui.js
|
|
playlist_clips: playlistClips,
|
|
instruments: internalInstruments, // Mantém para o recurso de Double-Click
|
|
volume: 1,
|
|
pan: 0,
|
|
patterns: [],
|
|
isMuted: trackNode.getAttribute("muted") === "1"
|
|
};
|
|
}).filter(t => t !== null);
|
|
|
|
// -------------------------------------------------------------
|
|
// 4. COMBINAÇÃO E FINALIZAÇÃO
|
|
// -------------------------------------------------------------
|
|
|
|
// A lista final contém:
|
|
// 1. Os Instrumentos (para que os steps apareçam no Pattern Editor)
|
|
// 2. As Basslines (para que os blocos apareçam na Playlist)
|
|
|
|
// Colocamos as Basslines no final ou no início, conforme preferência.
|
|
// Geralmente, instrumentos primeiro é melhor para o Pattern Editor.
|
|
const newTracks = [...allInstruments, ...basslineContainers];
|
|
|
|
// Inicializa áudio apenas para instrumentos reais
|
|
newTracks.forEach((track) => {
|
|
if (track.type !== 'bassline') {
|
|
track.volumeNode = new Tone.Volume(Tone.gainToDb(track.volume));
|
|
track.pannerNode = new Tone.Panner(track.pan);
|
|
track.volumeNode.connect(track.pannerNode);
|
|
track.pannerNode.connect(getMainGainNode());
|
|
}
|
|
});
|
|
|
|
// Configura tamanho da timeline baseado nas notas dos instrumentos
|
|
let isFirstTrackWithNotes = true;
|
|
newTracks.forEach(track => {
|
|
if (track.type !== 'bassline' && isFirstTrackWithNotes) {
|
|
const activePattern = track.patterns[track.activePatternIndex || 0];
|
|
if (activePattern && activePattern.steps && activePattern.steps.length > 0) {
|
|
const bars = Math.ceil(activePattern.steps.length / 16);
|
|
const barsInput = document.getElementById("bars-input");
|
|
if(barsInput) barsInput.value = bars > 0 ? bars : 1;
|
|
isFirstTrackWithNotes = false;
|
|
}
|
|
}
|
|
});
|
|
|
|
// Carrega samples/plugins
|
|
try {
|
|
const promises = newTracks
|
|
.filter(t => t.type !== 'bassline')
|
|
.map(track => loadAudioForTrack(track));
|
|
await Promise.all(promises);
|
|
} catch (error) {
|
|
console.error("Erro ao carregar áudios:", error);
|
|
}
|
|
|
|
// Atualiza estado global
|
|
appState.pattern.tracks = newTracks;
|
|
|
|
// Seleciona o primeiro instrumento real como ativo
|
|
const firstInst = newTracks.find(t => t.type !== 'bassline');
|
|
appState.pattern.activeTrackId = firstInst ? firstInst.id : null;
|
|
appState.pattern.activePatternIndex = 0;
|
|
|
|
loadStateFromSession();
|
|
|
|
await Promise.resolve();
|
|
renderAll();
|
|
}
|
|
|
|
// --------------------------------------------------------------
|
|
// GERAÇÃO DE ARQUIVO (EXPORT)
|
|
// --------------------------------------------------------------
|
|
|
|
export function generateMmpFile() {
|
|
if (appState.global.originalXmlDoc) {
|
|
modifyAndSaveExistingMmp();
|
|
} else {
|
|
generateNewMmp();
|
|
}
|
|
}
|
|
|
|
function generateXmlFromState() {
|
|
if (!appState.global.originalXmlDoc) {
|
|
const parser = new DOMParser();
|
|
appState.global.originalXmlDoc = parser.parseFromString(
|
|
DEFAULT_PROJECT_XML,
|
|
"application/xml"
|
|
);
|
|
}
|
|
|
|
const xmlDoc = appState.global.originalXmlDoc.cloneNode(true);
|
|
const head = xmlDoc.querySelector("head");
|
|
|
|
if (head) {
|
|
head.setAttribute("bpm", document.getElementById("bpm-input").value || 140);
|
|
head.setAttribute("num_bars", document.getElementById("bars-input").value || 1);
|
|
head.setAttribute("timesig_numerator", document.getElementById("compasso-a-input").value || 4);
|
|
head.setAttribute("timesig_denominator", document.getElementById("compasso-b-input").value || 4);
|
|
}
|
|
|
|
// Lógica de exportação simplificada:
|
|
// Remove todos os tracks do container BB e recria com base no estado atual.
|
|
// Nota: Isso coloca TODOS os instrumentos dentro da Bassline 0 na exportação,
|
|
// que é o comportamento padrão simplificado para garantir que tudo seja salvo.
|
|
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
|
|
.filter(t => t.type !== 'bassline') // Ignora container visual
|
|
.map((track) => createTrackXml(track))
|
|
.join("");
|
|
|
|
const tempDoc = new DOMParser().parseFromString(`<root>${tracksXml}</root>`, "application/xml");
|
|
Array.from(tempDoc.documentElement.children).forEach((newTrackNode) => {
|
|
bbTrackContainer.appendChild(newTrackNode);
|
|
});
|
|
}
|
|
|
|
const serializer = new XMLSerializer();
|
|
return serializer.serializeToString(xmlDoc);
|
|
}
|
|
|
|
export function syncPatternStateToServer() {
|
|
if (!window.ROOM_NAME) return;
|
|
const currentXml = generateXmlFromState();
|
|
sendAction({ type: "SYNC_PATTERN_STATE", xml: currentXml });
|
|
saveStateToSession();
|
|
}
|
|
|
|
function createTrackXml(track) {
|
|
if (!track.patterns || track.patterns.length === 0) return "";
|
|
|
|
const ticksPerStep = 12;
|
|
const lmmsVolume = Math.round(track.volume * 100);
|
|
const lmmsPan = Math.round(track.pan * 100);
|
|
|
|
const instrName = track.instrumentName || "kicker";
|
|
const instrXml = track.instrumentXml || `<kicker><env amt="0" attack="0.01" hold="0.1" decay="0.1" release="0.1" sustain="0.5" sync_mode="0"/></kicker>`;
|
|
|
|
const patternsXml = track.patterns
|
|
.map((pattern) => {
|
|
let patternNotesXml = "";
|
|
|
|
if (track.type === "plugin" && pattern.notes && pattern.notes.length > 0) {
|
|
patternNotesXml = pattern.notes
|
|
.map((note) => `<note vol="${note.vol}" len="${note.len}" pos="${note.pos}" pan="${note.pan}" key="${note.key}"/>`)
|
|
.join("\n ");
|
|
} else if (pattern.steps) {
|
|
patternNotesXml = pattern.steps
|
|
.map((isActive, index) => {
|
|
if (isActive) {
|
|
const notePos = Math.round(index * ticksPerStep);
|
|
return `<note vol="100" len="${NOTE_LENGTH}" pos="${notePos}" pan="0" key="57"/>`;
|
|
}
|
|
return "";
|
|
})
|
|
.join("\n ");
|
|
}
|
|
|
|
return `<pattern type="0" pos="${pattern.pos}" muted="0" steps="${pattern.steps ? pattern.steps.length : 16}" name="${pattern.name}">
|
|
${patternNotesXml}
|
|
</pattern>`;
|
|
})
|
|
.join("\n ");
|
|
|
|
return `
|
|
<track type="0" solo="0" muted="0" name="${track.name}">
|
|
<instrumenttrack vol="${lmmsVolume}" pitch="0" fxch="0" pitchrange="1" basenote="57" usemasterpitch="1" pan="${lmmsPan}">
|
|
<instrument name="${instrName}">
|
|
${instrXml}
|
|
</instrument>
|
|
<fxchain enabled="0" numofeffects="0"/>
|
|
</instrumenttrack>
|
|
${patternsXml}
|
|
</track>`;
|
|
}
|
|
|
|
function modifyAndSaveExistingMmp() {
|
|
const content = generateXmlFromState();
|
|
downloadFile(content, "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
|
|
.filter(t => t.type !== 'bassline')
|
|
.map((track) => createTrackXml(track))
|
|
.join("");
|
|
|
|
const mmpContent = `<?xml version="1.0"?>
|
|
<!DOCTYPE lmms-project>
|
|
<lmms-project version="1.0" type="song" creator="MMPCreator" creatorversion="1.0">
|
|
<head mastervol="100" timesig_denominator="${sig_den}" bpm="${bpm}" timesig_numerator="${sig_num}" masterpitch="0" num_bars="${num_bars}"/>
|
|
<song>
|
|
<trackcontainer type="song">
|
|
<track type="1" solo="0" muted="0" name="Beat/Bassline 0">
|
|
<bbtrack>
|
|
<trackcontainer type="bbtrackcontainer">
|
|
${tracksXml}
|
|
</trackcontainer>
|
|
</bbtrack>
|
|
<bbtco color="4286611584" len="192" usestyle="1" pos="0" muted="0" name="Pattern 1"/>
|
|
</track>
|
|
</trackcontainer>
|
|
<timeline lp1pos="192" lp0pos="0" lpstate="0"/>
|
|
<controllers/>
|
|
<projectnotes width="686" y="10" minimized="0" visible="0" x="700" maximized="0" height="400"><![CDATA[<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html40/strict.dtd">
|
|
<html><head><meta name="qrichtext" content="1" /><style type="text/css">
|
|
p, li { white-space: pre-wrap; }
|
|
</style></head><body>
|
|
<p>Feito com MMPCreator</p>
|
|
</body></html>]]></projectnotes>
|
|
</song>
|
|
</lmms-project>`;
|
|
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 { generateXmlFromState as generateXmlFromStateExported }; |