editando e enviando patterns na playlist
Deploy / Deploy (push) Successful in 2m2s
Details
Deploy / Deploy (push) Successful in 2m2s
Details
This commit is contained in:
parent
17e07c5838
commit
6bb8cb8dad
|
|
@ -188,14 +188,9 @@ export function renderAudioEditor() {
|
||||||
|
|
||||||
if (!audioEditor || !existingTrackContainer) return;
|
if (!audioEditor || !existingTrackContainer) return;
|
||||||
|
|
||||||
// ✅ preserva a posição de scroll mesmo recriando o container
|
// ✅ Salva o scroll atual (senão toda edição “pula” pro início)
|
||||||
const prevScrollLeft =
|
const prevScrollLeft = existingTrackContainer.scrollLeft || 0;
|
||||||
(existingTrackContainer?.scrollLeft ?? 0) ||
|
const prevScrollTop = existingTrackContainer.scrollTop || 0;
|
||||||
(appState.audio?.editorScrollLeft ?? 0);
|
|
||||||
|
|
||||||
const prevScrollTop =
|
|
||||||
(existingTrackContainer?.scrollTop ?? 0) ||
|
|
||||||
(appState.audio?.editorScrollTop ?? 0);
|
|
||||||
|
|
||||||
_ensureGlobalPlaylistSelectionFields();
|
_ensureGlobalPlaylistSelectionFields();
|
||||||
_installPlaylistKeybindOnce();
|
_installPlaylistKeybindOnce();
|
||||||
|
|
@ -203,13 +198,6 @@ export function renderAudioEditor() {
|
||||||
// --- Identifica o pai real do container ---
|
// --- Identifica o pai real do container ---
|
||||||
const tracksParent = existingTrackContainer.parentElement;
|
const tracksParent = existingTrackContainer.parentElement;
|
||||||
|
|
||||||
// ✅ NÃO recria o container (preserva scroll e evita “voltar pro início”)
|
|
||||||
const newTrackContainer = existingTrackContainer;
|
|
||||||
const scrollEl = newTrackContainer;
|
|
||||||
|
|
||||||
// ✅ limpa apenas as lanes antigas (mantém o scroller)
|
|
||||||
newTrackContainer.innerHTML = "";
|
|
||||||
|
|
||||||
// --- CRIAÇÃO E RENDERIZAÇÃO DA RÉGUA ---
|
// --- CRIAÇÃO E RENDERIZAÇÃO DA RÉGUA ---
|
||||||
let rulerWrapper = tracksParent.querySelector(".ruler-wrapper");
|
let rulerWrapper = tracksParent.querySelector(".ruler-wrapper");
|
||||||
|
|
||||||
|
|
@ -438,6 +426,12 @@ export function renderAudioEditor() {
|
||||||
menu.style.top = `${e.clientY}px`;
|
menu.style.top = `${e.clientY}px`;
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// Recriação Container Pistas
|
||||||
|
const newTrackContainer = existingTrackContainer.cloneNode(false);
|
||||||
|
tracksParent.replaceChild(newTrackContainer, existingTrackContainer);
|
||||||
|
// ✅ único scroller horizontal/vertical do editor
|
||||||
|
const scrollEl = newTrackContainer; // #audio-track-container
|
||||||
|
|
||||||
// === RENDERIZAÇÃO DAS PISTAS (LANES) ===
|
// === RENDERIZAÇÃO DAS PISTAS (LANES) ===
|
||||||
|
|
||||||
// CORREÇÃO: Junta as pistas de áudio com as Basslines (que estão no Pattern State)
|
// CORREÇÃO: Junta as pistas de áudio com as Basslines (que estão no Pattern State)
|
||||||
|
|
@ -783,19 +777,10 @@ export function renderAudioEditor() {
|
||||||
.forEach((g) => (g.style.width = `${widthPx}px`));
|
.forEach((g) => (g.style.width = `${widthPx}px`));
|
||||||
}
|
}
|
||||||
|
|
||||||
// Sync Scroll (rebinding para não acumular listeners a cada render)
|
// Sync Scroll
|
||||||
newTrackContainer.addEventListener("scroll", () => {
|
newTrackContainer.addEventListener("scroll", () => {
|
||||||
if (newTrackContainer.__onScroll) {
|
|
||||||
newTrackContainer.removeEventListener("scroll", newTrackContainer.__onScroll);
|
|
||||||
}
|
|
||||||
|
|
||||||
newTrackContainer.__onScroll = () => {
|
|
||||||
const scrollPos = scrollEl.scrollLeft;
|
const scrollPos = scrollEl.scrollLeft;
|
||||||
|
|
||||||
// guarda no estado
|
|
||||||
appState.audio.editorScrollLeft = scrollPos;
|
|
||||||
appState.audio.editorScrollTop = scrollEl.scrollTop || 0;
|
|
||||||
|
|
||||||
// sincroniza régua com o container
|
// sincroniza régua com o container
|
||||||
const mainRuler = tracksParent.querySelector(".timeline-ruler");
|
const mainRuler = tracksParent.querySelector(".timeline-ruler");
|
||||||
if (mainRuler && mainRuler.scrollLeft !== scrollPos) {
|
if (mainRuler && mainRuler.scrollLeft !== scrollPos) {
|
||||||
|
|
@ -815,17 +800,12 @@ export function renderAudioEditor() {
|
||||||
const rulerEl = tracksParent.querySelector(".timeline-ruler");
|
const rulerEl = tracksParent.querySelector(".timeline-ruler");
|
||||||
appendRulerMarkers(rulerEl, currentWidth, newWidth, barWidthPx);
|
appendRulerMarkers(rulerEl, currentWidth, newWidth, barWidthPx);
|
||||||
}
|
}
|
||||||
};
|
|
||||||
newTrackContainer.addEventListener("scroll", newTrackContainer.__onScroll);
|
|
||||||
});
|
});
|
||||||
|
|
||||||
// Event Listener Principal (mousedown) - rebinding
|
|
||||||
if (newTrackContainer.__onMouseDown) {
|
|
||||||
newTrackContainer.removeEventListener("mousedown", newTrackContainer.__onMouseDown);
|
|
||||||
}
|
|
||||||
|
|
||||||
// Event Listener Principal (mousedown)
|
// Event Listener Principal (mousedown)
|
||||||
newTrackContainer.__onMouseDown = (e) => {
|
newTrackContainer.addEventListener("mousedown", (e) => {
|
||||||
document.getElementById("timeline-context-menu").style.display = "none";
|
document.getElementById("timeline-context-menu").style.display = "none";
|
||||||
document.getElementById("ruler-context-menu").style.display = "none";
|
document.getElementById("ruler-context-menu").style.display = "none";
|
||||||
|
|
||||||
|
|
@ -1318,16 +1298,10 @@ export function renderAudioEditor() {
|
||||||
document.addEventListener("mousemove", onMouseMoveSeek);
|
document.addEventListener("mousemove", onMouseMoveSeek);
|
||||||
document.addEventListener("mouseup", onMouseUpSeek);
|
document.addEventListener("mouseup", onMouseUpSeek);
|
||||||
}
|
}
|
||||||
};
|
});
|
||||||
|
|
||||||
newTrackContainer.addEventListener("mousedown", newTrackContainer.__onMouseDown);
|
|
||||||
|
|
||||||
// Menu Contexto Pista
|
// Menu Contexto Pista
|
||||||
if (newTrackContainer.__onContextMenu) {
|
newTrackContainer.addEventListener("contextmenu", (e) => {
|
||||||
newTrackContainer.removeEventListener("contextmenu", newTrackContainer.__onContextMenu);
|
|
||||||
}
|
|
||||||
|
|
||||||
newTrackContainer.__onContextMenu = (e) => {
|
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
document.getElementById("ruler-context-menu").style.display = "none";
|
document.getElementById("ruler-context-menu").style.display = "none";
|
||||||
const menu = document.getElementById("timeline-context-menu");
|
const menu = document.getElementById("timeline-context-menu");
|
||||||
|
|
@ -1399,22 +1373,23 @@ export function renderAudioEditor() {
|
||||||
menu.style.display = "none";
|
menu.style.display = "none";
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
};
|
});
|
||||||
|
|
||||||
newTrackContainer.addEventListener("contextmenu", newTrackContainer.__onContextMenu);
|
// ✅ Restaura o scroll anterior após reconstruir o container
|
||||||
|
// (evita “voltar pro início” depois de mover/redimensionar/deletar)
|
||||||
// ✅ restaura scroll após reconstruir a DOM (precisa ser após tudo estar no DOM)
|
|
||||||
requestAnimationFrame(() => {
|
|
||||||
try {
|
try {
|
||||||
newTrackContainer.scrollLeft = prevScrollLeft;
|
newTrackContainer.scrollLeft = prevScrollLeft;
|
||||||
newTrackContainer.scrollTop = prevScrollTop;
|
newTrackContainer.scrollTop = prevScrollTop;
|
||||||
|
|
||||||
// mantém régua alinhada na mesma posição
|
// mantém régua alinhada (caso ela suporte scrollLeft)
|
||||||
const mainRuler = tracksParent.querySelector(".timeline-ruler");
|
const mainRuler = tracksParent.querySelector(".timeline-ruler");
|
||||||
if (mainRuler) mainRuler.scrollLeft = prevScrollLeft;
|
if (mainRuler) mainRuler.scrollLeft = prevScrollLeft;
|
||||||
} catch {}
|
} catch (err) {
|
||||||
});
|
// silencioso: não pode quebrar a DAW
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
export function updateAudioEditorUI() {
|
export function updateAudioEditorUI() {
|
||||||
const playBtn = document.getElementById("audio-editor-play-btn");
|
const playBtn = document.getElementById("audio-editor-play-btn");
|
||||||
if (!playBtn) return;
|
if (!playBtn) return;
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue