inserindo server flask de upload e watchdog para verificar alterações em samples

assets/js/creations/main.js

@@ -19,15 +19,16 @@ import {
   loadAndRenderSampleBrowser,
   showOpenProjectModal,
   closeOpenProjectModal,
+  handleSampleUpload, // Importa handleSampleUpload, embora não seja mais usado diretamente
 } from "./ui.js";
 import { adjustValue, enforceNumericInput } from "./utils.js";
 import { DEFAULT_PAN, DEFAULT_VOLUME } from "./config.js";
 
-// --- INICIALIZAÇÃO E EVENTOS FINAIS ---
 document.addEventListener("DOMContentLoaded", () => {
   const newProjectBtn = document.getElementById("new-project-btn");
   const openMmpBtn = document.getElementById("open-mmp-btn");
   const saveMmpBtn = document.getElementById("save-mmp-btn");
+  const uploadSampleBtn = document.getElementById("upload-sample-btn");
   const addInstrumentBtn = document.getElementById("add-instrument-btn");
   const removeInstrumentBtn = document.getElementById("remove-instrument-btn");
   const playBtn = document.getElementById("play-btn");
@@ -35,12 +36,12 @@ document.addEventListener("DOMContentLoaded", () => {
   const rewindBtn = document.getElementById("rewind-btn");
   const metronomeBtn = document.getElementById("metronome-btn");
   const mmpFileInput = document.getElementById("mmp-file-input");
+  const sampleFileInput = document.getElementById("sample-file-input");
   const openProjectModal = document.getElementById("open-project-modal");
   const openModalCloseBtn = document.getElementById("open-modal-close-btn");
   const loadFromComputerBtn = document.getElementById("load-from-computer-btn");
   const sidebarToggle = document.getElementById("sidebar-toggle");
   const addBarBtn = document.getElementById("add-bar-btn");
-  
   const masterVolumeKnob = document.getElementById("master-volume-knob");
   const masterPanKnob = document.getElementById("master-pan-knob");
 
@@ -52,56 +53,53 @@ document.addEventListener("DOMContentLoaded", () => {
       return;
     Object.assign(appState, {
       tracks: [],
+      activeTrackId: null,
       isPlaying: false,
       playbackIntervalId: null,
       currentStep: 0,
       metronomeEnabled: false,
       originalXmlDoc: null,
+      currentBeatBasslineName: 'Novo Projeto',
       masterVolume: DEFAULT_VOLUME,
       masterPan: DEFAULT_PAN
     });
-    // Reseta os inputs para o padrão
     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;
+    const titleElement = document.getElementById('beat-bassline-title');
+    if(titleElement) titleElement.textContent = 'Novo Projeto';
     renderApp();
-    setupMasterKnobs(); // Re-inicializa os knobs master
+    setupMasterKnobs();
   });
 
   addBarBtn.addEventListener("click", () => {
     const barsInput = document.getElementById("bars-input");
-    if (barsInput) {
-      adjustValue(barsInput, 1);
-    }
+    if (barsInput) adjustValue(barsInput, 1);
   });
 
   function setupMasterKnobs() {
     function updateMasterKnobVisual(knobElement, controlType) {
       const indicator = knobElement.querySelector(".knob-indicator");
       if (!indicator) return;
-
       const minAngle = -135;
       const maxAngle = 135;
       let percentage = 0.5;
       let title = "";
-
       if (controlType === "volume") {
         const value = appState.masterVolume;
         percentage = value / 1.5;
         title = `Volume Master: ${Math.round(value * 100)}%`;
-      } else { // pan
+      } else {
         const value = appState.masterPan;
         percentage = (value + 1) / 2;
         const panDisplay = Math.round(value * 100);
         title = `Pan Master: ${ panDisplay === 0 ? "Centro" : panDisplay < 0 ? `${-panDisplay} L` : `${panDisplay} R` }`;
       }
-
       const angle = minAngle + percentage * (maxAngle - minAngle);
       indicator.style.transform = `translateX(-50%) rotate(${angle}deg)`;
       knobElement.title = title;
     }
-
     function addMasterKnobInteraction(knobElement, controlType) {
         knobElement.addEventListener("wheel", (e) => {
             e.preventDefault();
@@ -109,56 +107,45 @@ document.addEventListener("DOMContentLoaded", () => {
             const direction = e.deltaY < 0 ? 1 : -1;
             if (controlType === "volume") {
                 const newValue = appState.masterVolume + direction * step;
-                const clampedValue = Math.max(0, Math.min(1.5, newValue));
-                appState.masterVolume = clampedValue;
-                updateMasterVolume(clampedValue);
+                appState.masterVolume = Math.max(0, Math.min(1.5, newValue));
+                updateMasterVolume(appState.masterVolume);
             } else {
                 const newValue = appState.masterPan + direction * step;
-                const clampedValue = Math.max(-1, Math.min(1, newValue));
-                appState.masterPan = clampedValue;
-                updateMasterPan(clampedValue);
+                appState.masterPan = Math.max(-1, Math.min(1, newValue));
+                updateMasterPan(appState.masterPan);
             }
             updateMasterKnobVisual(knobElement, controlType);
         });
-
         knobElement.addEventListener("mousedown", (e) => {
             if (e.button !== 0) return;
             e.preventDefault();
-            
             const startY = e.clientY;
             const startValue = controlType === "volume" ? appState.masterVolume : appState.masterPan;
             document.body.classList.add("knob-dragging");
-
             function onMouseMove(moveEvent) {
                 const deltaY = startY - moveEvent.clientY;
                 const sensitivity = controlType === "volume" ? 150 : 200;
                 const newValue = startValue + deltaY / sensitivity;
                 if (controlType === "volume") {
-                    const clampedValue = Math.max(0, Math.min(1.5, newValue));
-                    appState.masterVolume = clampedValue;
-                    updateMasterVolume(clampedValue);
+                    appState.masterVolume = Math.max(0, Math.min(1.5, newValue));
+                    updateMasterVolume(appState.masterVolume);
                 } else {
-                    const clampedValue = Math.max(-1, Math.min(1, newValue));
-                    appState.masterPan = clampedValue;
-                    updateMasterPan(clampedValue);
+                    appState.masterPan = Math.max(-1, Math.min(1, newValue));
+                    updateMasterPan(appState.masterPan);
                 }
                 updateMasterKnobVisual(knobElement, controlType);
             }
-
             function onMouseUp() {
                 document.body.classList.remove("knob-dragging");
                 document.removeEventListener("mousemove", onMouseMove);
                 document.removeEventListener("mouseup", onMouseUp);
             }
-
             document.addEventListener("mousemove", onMouseMove);
             document.addEventListener("mouseup", onMouseUp);
         });
     }
-
     addMasterKnobInteraction(masterVolumeKnob, "volume");
     updateMasterKnobVisual(masterVolumeKnob, "volume");
-
     addMasterKnobInteraction(masterPanKnob, "pan");
     updateMasterKnobVisual(masterPanKnob, "pan");
   }
@@ -172,6 +159,44 @@ document.addEventListener("DOMContentLoaded", () => {
       closeOpenProjectModal();
     }
   });
+  
+  uploadSampleBtn.addEventListener("click", () => sampleFileInput.click());
+  
+  // --- INÍCIO DA CORREÇÃO ---
+  // Lógica de upload de sample para o servidor Flask
+  sampleFileInput.addEventListener("change", async (event) => {
+    const file = event.target.files[0];
+    if (!file) return;
+
+    const formData = new FormData();
+    formData.append("sampleFile", file);
+
+    try {
+      // ATENÇÃO: Verifique se a URL e a porta estão corretas para o seu servidor Flask
+      const response = await fetch('http://localhost:5000/upload-sample', {
+        method: 'POST',
+        body: formData,
+      });
+
+      const result = await response.json();
+
+      if (response.ok) {
+        alert("Sample enviado com sucesso!");
+        // Recarrega a lista de samples para exibir o novo arquivo
+        await loadAndRenderSampleBrowser();
+      } else {
+        throw new Error(result.error || "Erro desconhecido no servidor.");
+      }
+
+    } catch (error) {
+      console.error("Erro ao enviar o sample:", error);
+      alert(`Falha no upload: ${error.message}`);
+    }
+
+    event.target.value = null; // Limpa o input para permitir o mesmo arquivo de novo
+  });
+  // --- FIM DA CORREÇÃO ---
+
   saveMmpBtn.addEventListener("click", generateMmpFile);
   addInstrumentBtn.addEventListener("click", addTrackToState);
   removeInstrumentBtn.addEventListener("click", removeLastTrackFromState);
@@ -223,7 +248,6 @@ document.addEventListener("DOMContentLoaded", () => {
     });
   });
 
-  // Inicia a aplicação
   loadAndRenderSampleBrowser();
   renderApp();
   setupMasterKnobs();