plugin 1.0.1
This commit is contained in:
JotaChina committed
1 parent
44fce48bb5
commit
018a8c5403
7 files changed
+2076
-25734
No files matched your search
+457
-25507
File diff suppressed because it is too large.
Load diff
+705
-16
@@ -1,14 +1,20 @@
|
||||
bpm: '140'
|
||||
bpm: '127'
|
||||
file: teste
|
||||
src: /nethome/jotachina/projetos/mmpSearch/mmp/teste.mmp
|
||||
tags:
|
||||
TAG:
|
||||
- plugin
|
||||
- sample
|
||||
- bassline
|
||||
automation: []
|
||||
bassline: []
|
||||
bassline:
|
||||
- Beat/Bassline 0
|
||||
- Batida/Linha de Baixo 1
|
||||
plugin:
|
||||
- tripleoscillator
|
||||
- audiofileprocessor
|
||||
sample: []
|
||||
sample:
|
||||
- latin_guitar02.ogg
|
||||
tracks:
|
||||
- arpeggiator:
|
||||
arp: '0'
|
||||
@@ -20,20 +26,10 @@ tracks:
|
||||
arpmode: '0'
|
||||
arprange: '1'
|
||||
arpskip: '0'
|
||||
arptime: '200'
|
||||
arptime: '100'
|
||||
arptime_denominator: '4'
|
||||
arptime_numerator: '4'
|
||||
arptime_syncmode: '0'
|
||||
audiofileprocessor:
|
||||
amp: '100'
|
||||
eframe: '1'
|
||||
interp: '1'
|
||||
lframe: '0'
|
||||
looped: '0'
|
||||
reversed: '0'
|
||||
sframe: '0'
|
||||
src: drums/clap01.ogg
|
||||
stutter: '0'
|
||||
chordcreator:
|
||||
chord: '0'
|
||||
chord-enabled: '0'
|
||||
@@ -103,6 +99,7 @@ tracks:
|
||||
fxchain:
|
||||
enabled: '0'
|
||||
numofeffects: '0'
|
||||
instrument_name: tripleoscillator
|
||||
instrumenttrack:
|
||||
basenote: '57'
|
||||
fxch: '0'
|
||||
@@ -123,6 +120,698 @@ tracks:
|
||||
outputprogram: '1'
|
||||
readable: '0'
|
||||
writable: '0'
|
||||
plugin_name: audiofileprocessor
|
||||
track_name: clap01.ogg
|
||||
tags: tripleoscillator
|
||||
track_name: TripleOscillator
|
||||
tripleoscillator:
|
||||
coarse0: '0'
|
||||
coarse1: '-12'
|
||||
coarse2: '-24'
|
||||
finel0: '0'
|
||||
finel1: '0'
|
||||
finel2: '0'
|
||||
finer0: '0'
|
||||
finer1: '0'
|
||||
finer2: '0'
|
||||
modalgo1: '2'
|
||||
modalgo2: '2'
|
||||
modalgo3: '2'
|
||||
pan0: '0'
|
||||
pan1: '0'
|
||||
pan2: '0'
|
||||
phoffset0: '0'
|
||||
phoffset1: '0'
|
||||
phoffset2: '0'
|
||||
stphdetun0: '0'
|
||||
stphdetun1: '0'
|
||||
stphdetun2: '0'
|
||||
userwavefile0: ''
|
||||
userwavefile1: ''
|
||||
userwavefile2: ''
|
||||
vol0: '33'
|
||||
vol1: '33'
|
||||
vol2: '33'
|
||||
wavetype0: '0'
|
||||
wavetype1: '0'
|
||||
wavetype2: '0'
|
||||
type: plugin
|
||||
- sample_info:
|
||||
len: '389'
|
||||
muted: '0'
|
||||
pan: '0'
|
||||
pos: '0'
|
||||
sample_rate: '44100'
|
||||
src: latin/latin_guitar02.ogg
|
||||
vol: '100'
|
||||
sample_name: latin_guitar02.ogg
|
||||
track_name: Sample track
|
||||
type: sample
|
||||
- bassline_name: Beat/Bassline 0
|
||||
instruments:
|
||||
- audiofileprocessor:
|
||||
amp: '100'
|
||||
eframe: '1'
|
||||
interp: '1'
|
||||
lframe: '0'
|
||||
looped: '0'
|
||||
reversed: '0'
|
||||
sframe: '0'
|
||||
src: drumsynth/cr8000/Conga_m.ds
|
||||
stutter: '0'
|
||||
basenote: '57'
|
||||
fxch: '0'
|
||||
instrument_name: Conga_m.ds
|
||||
instrument_type: '0'
|
||||
pan: '0'
|
||||
patterns:
|
||||
- name: Conga_m.ds
|
||||
pos: '0'
|
||||
steps:
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- name: Bubble.ds
|
||||
pos: '192'
|
||||
steps:
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
pitch: '0'
|
||||
pitchrange: '1'
|
||||
plugin_name: audiofileprocessor
|
||||
usemasterpitch: '1'
|
||||
vol: '100'
|
||||
- audiofileprocessor:
|
||||
amp: '100'
|
||||
eframe: '1'
|
||||
interp: '1'
|
||||
lframe: '0'
|
||||
looped: '0'
|
||||
reversed: '0'
|
||||
sframe: '0'
|
||||
src: drumsynth/effects/Bubble.ds
|
||||
stutter: '0'
|
||||
basenote: '57'
|
||||
fxch: '0'
|
||||
instrument_name: Bubble.ds
|
||||
instrument_type: '0'
|
||||
pan: '0'
|
||||
patterns:
|
||||
- name: Bubble.ds
|
||||
pos: '0'
|
||||
steps:
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- name: Bubble.ds
|
||||
pos: '192'
|
||||
steps:
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
pitch: '0'
|
||||
pitchrange: '1'
|
||||
plugin_name: audiofileprocessor
|
||||
usemasterpitch: '1'
|
||||
vol: '100'
|
||||
- audiofileprocessor:
|
||||
amp: '100'
|
||||
eframe: '1'
|
||||
interp: '1'
|
||||
lframe: '0'
|
||||
looped: '0'
|
||||
reversed: '0'
|
||||
sframe: '0'
|
||||
src: drumsynth/misc_perc/clav_2.ds
|
||||
stutter: '0'
|
||||
basenote: '57'
|
||||
fxch: '0'
|
||||
instrument_name: clav_2.ds
|
||||
instrument_type: '0'
|
||||
pan: '0'
|
||||
patterns:
|
||||
- name: clav_2.ds
|
||||
pos: '0'
|
||||
steps:
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- name: clav_2.ds
|
||||
pos: '192'
|
||||
steps:
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
pitch: '0'
|
||||
pitchrange: '1'
|
||||
plugin_name: audiofileprocessor
|
||||
usemasterpitch: '1'
|
||||
vol: '100'
|
||||
- audiofileprocessor:
|
||||
amp: '100'
|
||||
eframe: '1'
|
||||
interp: '1'
|
||||
lframe: '0'
|
||||
looped: '0'
|
||||
reversed: '0'
|
||||
sframe: '0'
|
||||
src: gig/DrumKits/drive-download-20230412T011016Z-001/Percs/triangle.wav
|
||||
stutter: '0'
|
||||
basenote: '57'
|
||||
fxch: '0'
|
||||
instrument_name: triangle.wav
|
||||
instrument_type: '0'
|
||||
pan: '0'
|
||||
patterns:
|
||||
- name: triangle.wav
|
||||
pos: '0'
|
||||
steps:
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- name: clav_2.ds
|
||||
pos: '192'
|
||||
steps:
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
pitch: '0'
|
||||
pitchrange: '1'
|
||||
plugin_name: audiofileprocessor
|
||||
usemasterpitch: '1'
|
||||
vol: '100'
|
||||
- audiofileprocessor:
|
||||
amp: '100'
|
||||
eframe: '1'
|
||||
interp: '1'
|
||||
lframe: '0'
|
||||
looped: '0'
|
||||
reversed: '0'
|
||||
sframe: '0'
|
||||
src: gig/DrumKits/drive-download-20230412T011016Z-001/Percs/boombap.wav
|
||||
stutter: '0'
|
||||
basenote: '57'
|
||||
fxch: '0'
|
||||
instrument_name: boombap.wav
|
||||
instrument_type: '0'
|
||||
pan: '0'
|
||||
patterns:
|
||||
- name: boombap.wav
|
||||
pos: '0'
|
||||
steps:
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- name: boombap.wav
|
||||
pos: '192'
|
||||
steps:
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
pitch: '0'
|
||||
pitchrange: '1'
|
||||
plugin_name: audiofileprocessor
|
||||
usemasterpitch: '1'
|
||||
vol: '100'
|
||||
- audiofileprocessor:
|
||||
amp: '100'
|
||||
eframe: '1'
|
||||
interp: '1'
|
||||
lframe: '0'
|
||||
looped: '0'
|
||||
reversed: '0'
|
||||
sframe: '0'
|
||||
src: instruments/flute01.ogg
|
||||
stutter: '0'
|
||||
basenote: '57'
|
||||
fxch: '0'
|
||||
instrument_name: flute01.ogg
|
||||
instrument_type: '0'
|
||||
pan: '0'
|
||||
patterns:
|
||||
- name: flute01.ogg
|
||||
pos: '0'
|
||||
steps:
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- name: flute01.ogg
|
||||
pos: '192'
|
||||
steps:
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
- true
|
||||
- false
|
||||
- false
|
||||
- false
|
||||
pitch: '0'
|
||||
pitchrange: '1'
|
||||
plugin_name: audiofileprocessor
|
||||
usemasterpitch: '1'
|
||||
vol: '100'
|
||||
tags: audiofileprocessor
|
||||
type: bassline
|
||||
- bassline_name: Batida/Linha de Baixo 1
|
||||
instruments: []
|
||||
tags: ''
|
||||
type: bassline
|
||||
+594
-111
@@ -17,7 +17,8 @@
|
||||
/* Esconde elementos não essenciais quando em modo embed */
|
||||
body.embed-mode .sample-browser, /* Navegador de Samples */
|
||||
body.embed-mode .global-toolbar, /* Barra de ferramentas principal */
|
||||
body.embed-mode #sidebar-toggle { /* Botão de toggle da sidebar */
|
||||
body.embed-mode #sidebar-toggle {
|
||||
/* Botão de toggle da sidebar */
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
@@ -68,13 +69,26 @@ body {
|
||||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
|
||||
background-color: var(--bg-body);
|
||||
color: var(--text-light);
|
||||
height: 100vh;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
display: block;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
body.knob-dragging { cursor: ns-resize; }
|
||||
body.slice-tool-active .timeline-container { cursor: crosshair; }
|
||||
.studio-wrapper {
|
||||
display: flex; /* O flex vem para cá */
|
||||
width: 100%;
|
||||
height: 85vh; /* Define uma altura para o app (ajuste conforme necessário) */
|
||||
overflow: hidden; /* O app não deve ter scroll externo */
|
||||
position: relative;
|
||||
background-color: var(--bg-body);
|
||||
border: 1px solid var(--border-color); /* Opcional: borda para separar do site */
|
||||
}
|
||||
|
||||
body.knob-dragging {
|
||||
cursor: ns-resize;
|
||||
}
|
||||
body.slice-tool-active .timeline-container {
|
||||
cursor: crosshair;
|
||||
}
|
||||
|
||||
.app-container {
|
||||
display: flex;
|
||||
@@ -135,8 +149,12 @@ body.slice-tool-active .timeline-container { cursor: crosshair; }
|
||||
}
|
||||
|
||||
/* Cores para as notas no canvas */
|
||||
.piano-key-white { fill: #fff; }
|
||||
.piano-key-black { fill: #000; }
|
||||
.piano-key-white {
|
||||
fill: #fff;
|
||||
}
|
||||
.piano-key-black {
|
||||
fill: #000;
|
||||
}
|
||||
|
||||
/* Container da visualização melódica na lista de trilhas */
|
||||
.track-mini-piano-roll {
|
||||
@@ -188,7 +206,13 @@ body.slice-tool-active .timeline-container { cursor: crosshair; }
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
background: linear-gradient(to right, #222 0%, #222 50%, #252525 50%, #252525 100%);
|
||||
background: linear-gradient(
|
||||
to right,
|
||||
#222 0%,
|
||||
#222 50%,
|
||||
#252525 50%,
|
||||
#252525 100%
|
||||
);
|
||||
background-size: 25% 100%; /* Cria linhas verticais sutis de compasso */
|
||||
}
|
||||
|
||||
@@ -269,7 +293,7 @@ body.sidebar-hidden .sample-browser {
|
||||
transition: transform 0.2s ease-in-out;
|
||||
}
|
||||
.folder-name::before {
|
||||
content: '\f0da';
|
||||
content: "\f0da";
|
||||
font-family: "Font Awesome 6 Free";
|
||||
font-weight: 900;
|
||||
margin-right: 8px;
|
||||
@@ -280,7 +304,7 @@ body.sidebar-hidden .sample-browser {
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
.folder-item.open > .folder-name > .folder-icon::before {
|
||||
content: '\f07c';
|
||||
content: "\f07c";
|
||||
}
|
||||
.browser-content li.file-item {
|
||||
padding: 5px;
|
||||
@@ -311,20 +335,54 @@ body.sidebar-hidden .sample-browser {
|
||||
/* =============================================== */
|
||||
/* ÁREA DE CONTEÚDO E TOOLBARS
|
||||
/* =============================================== */
|
||||
.global-toolbar { display: flex; align-items: center; gap: 20px; padding: 8px 15px; background-color: var(--bg-toolbar); border-bottom: 2px solid var(--border-color); height: 50px; box-sizing: border-box; flex-shrink: 0; }
|
||||
.main-content { flex-grow: 1; padding: 1rem; display: flex; flex-direction: column; gap: 1rem; overflow: hidden; }
|
||||
.global-toolbar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 20px;
|
||||
padding: 8px 15px;
|
||||
background-color: var(--bg-toolbar);
|
||||
border-bottom: 2px solid var(--border-color);
|
||||
height: 50px;
|
||||
box-sizing: border-box;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.main-content {
|
||||
flex-grow: 1;
|
||||
padding: 1rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 1rem;
|
||||
overflow: hidden;
|
||||
}
|
||||
.beat-editor {
|
||||
flex: 1;
|
||||
background-color: var(--bg-editor);
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 5px 15px rgba(0, 0, 0, .3);
|
||||
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.editor-header { background-color: var(--bg-toolbar); padding: 4px 10px; font-size: .8rem; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid var(--border-color); flex-shrink: 0; }
|
||||
.editor-toolbar { background-color: var(--bg-toolbar); padding: 5px 10px; border-bottom: 2px solid var(--border-color); flex-shrink: 0; display: flex; align-items: center; gap: 15px; }
|
||||
.editor-header {
|
||||
background-color: var(--bg-toolbar);
|
||||
padding: 4px 10px;
|
||||
font-size: 0.8rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.editor-toolbar {
|
||||
background-color: var(--bg-toolbar);
|
||||
padding: 5px 10px;
|
||||
border-bottom: 2px solid var(--border-color);
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 15px;
|
||||
}
|
||||
|
||||
/* Estilo para o botão de gravação */
|
||||
#record-btn.active.recording {
|
||||
@@ -419,8 +477,12 @@ body.sidebar-hidden .sample-browser {
|
||||
min-height: 72px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.track-lane.active-track { background-color: #40454d; }
|
||||
.track-lane.drag-over { border: 2px dashed var(--accent-green); }
|
||||
.track-lane.active-track {
|
||||
background-color: #40454d;
|
||||
}
|
||||
.track-lane.drag-over {
|
||||
border: 2px dashed var(--accent-green);
|
||||
}
|
||||
|
||||
.track-lane .track-info {
|
||||
display: flex;
|
||||
@@ -431,11 +493,32 @@ body.sidebar-hidden .sample-browser {
|
||||
padding: 0 10px;
|
||||
border-right: 1px solid var(--bg-toolbar);
|
||||
}
|
||||
.track-mute { width: 25px; height: 12px; background-color: var(--accent-green); border-radius: 6px; cursor: pointer; border: 1px solid var(--border-color); box-shadow: inset 0 0 2px #000; transition: background-color 0.2s, opacity 0.2s; }
|
||||
.track-mute:hover { opacity: 0.8; }
|
||||
.track-mute.active { background-color: var(--text-dark); opacity: 0.7; }
|
||||
.track-mute {
|
||||
width: 25px;
|
||||
height: 12px;
|
||||
background-color: var(--accent-green);
|
||||
border-radius: 6px;
|
||||
cursor: pointer;
|
||||
border: 1px solid var(--border-color);
|
||||
box-shadow: inset 0 0 2px #000;
|
||||
transition: background-color 0.2s, opacity 0.2s;
|
||||
}
|
||||
.track-mute:hover {
|
||||
opacity: 0.8;
|
||||
}
|
||||
.track-mute.active {
|
||||
background-color: var(--text-dark);
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
.track-lane .track-controls { display: flex; gap: 5px; margin: 0 10px; padding-left: 10px; border-left: 1px solid var(--bg-toolbar); flex-shrink: 0; }
|
||||
.track-lane .track-controls {
|
||||
display: flex;
|
||||
gap: 5px;
|
||||
margin: 0 10px;
|
||||
padding-left: 10px;
|
||||
border-left: 1px solid var(--bg-toolbar);
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
/* --- CORREÇÃO DE LARGURA DOS STEPS --- */
|
||||
.step-sequencer-wrapper {
|
||||
@@ -468,7 +551,7 @@ body.sidebar-hidden .sample-browser {
|
||||
left: 0;
|
||||
width: 100%;
|
||||
text-align: center; /* Centraliza o número do compasso */
|
||||
font-size: .6rem;
|
||||
font-size: 0.6rem;
|
||||
color: var(--text-dark);
|
||||
user-select: none;
|
||||
}
|
||||
@@ -480,15 +563,27 @@ body.sidebar-hidden .sample-browser {
|
||||
border: 1px solid #4a4a4a;
|
||||
border-radius: 2px;
|
||||
cursor: pointer;
|
||||
transition: background-color .1s, transform 0.1s;
|
||||
transition: background-color 0.1s, transform 0.1s;
|
||||
box-sizing: border-box; /* Garante que a borda não aumente o tamanho total */
|
||||
}
|
||||
/* --------------------------------------- */
|
||||
|
||||
.step-dark { background-color: #1e1e1e; }
|
||||
.step:hover { background-color: #555; border-color: #888; }
|
||||
.step.active { background-color: var(--accent-green); border: 1px solid #fff; box-shadow: 0 0 8px var(--accent-green); }
|
||||
.step.playing { transform: scale(1.1); box-shadow: inset 0 0 8px rgba(255, 255, 255, 0.8); }
|
||||
.step-dark {
|
||||
background-color: #1e1e1e;
|
||||
}
|
||||
.step:hover {
|
||||
background-color: #555;
|
||||
border-color: #888;
|
||||
}
|
||||
.step.active {
|
||||
background-color: var(--accent-green);
|
||||
border: 1px solid #fff;
|
||||
box-shadow: 0 0 8px var(--accent-green);
|
||||
}
|
||||
.step.playing {
|
||||
transform: scale(1.1);
|
||||
box-shadow: inset 0 0 8px rgba(255, 255, 255, 0.8);
|
||||
}
|
||||
|
||||
/* =================================================================== */
|
||||
/* EDITOR DE ÁUDIO - LAYOUT PRINCIPAL
|
||||
@@ -498,7 +593,7 @@ body.sidebar-hidden .sample-browser {
|
||||
background-color: var(--bg-editor);
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 5px 15px rgba(0, 0, 0, .3);
|
||||
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@@ -517,7 +612,9 @@ body.sidebar-hidden .sample-browser {
|
||||
min-height: 90px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.audio-track-lane.drag-over { background-color: #40454d; }
|
||||
.audio-track-lane.drag-over {
|
||||
background-color: #40454d;
|
||||
}
|
||||
.audio-track-lane .track-info {
|
||||
width: var(--track-info-width);
|
||||
flex-shrink: 0;
|
||||
@@ -527,8 +624,19 @@ body.sidebar-hidden .sample-browser {
|
||||
background-color: #383c42;
|
||||
border-right: 2px solid var(--border-color);
|
||||
}
|
||||
.track-info-header { display: flex; align-items: center; gap: 8px; width: 100%; }
|
||||
.track-name { color: var(--accent-red); font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
|
||||
.track-info-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
width: 100%;
|
||||
}
|
||||
.track-name {
|
||||
color: var(--accent-red);
|
||||
font-weight: 700;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.timeline-container {
|
||||
flex-grow: 1;
|
||||
position: relative;
|
||||
@@ -543,11 +651,29 @@ body.sidebar-hidden .sample-browser {
|
||||
--step-width: 32px;
|
||||
--beat-width: 128px;
|
||||
--bar-width: 512px;
|
||||
background-size: var(--bar-width) 100%, var(--beat-width) 100%, var(--step-width) 100%;
|
||||
background-image:
|
||||
repeating-linear-gradient(to right, #666 0, #666 1px, transparent 1px, transparent 100%),
|
||||
repeating-linear-gradient(to right, #444 0, #444 1px, transparent 1px, transparent 100%),
|
||||
repeating-linear-gradient(to right, #3a3e44 0, #3a3e44 1px, transparent 1px, transparent 100%);
|
||||
background-size: var(--bar-width) 100%, var(--beat-width) 100%,
|
||||
var(--step-width) 100%;
|
||||
background-image: repeating-linear-gradient(
|
||||
to right,
|
||||
#666 0,
|
||||
#666 1px,
|
||||
transparent 1px,
|
||||
transparent 100%
|
||||
),
|
||||
repeating-linear-gradient(
|
||||
to right,
|
||||
#444 0,
|
||||
#444 1px,
|
||||
transparent 1px,
|
||||
transparent 100%
|
||||
),
|
||||
repeating-linear-gradient(
|
||||
to right,
|
||||
#3a3e44 0,
|
||||
#3a3e44 1px,
|
||||
transparent 1px,
|
||||
transparent 100%
|
||||
);
|
||||
}
|
||||
|
||||
/* =============================================== */
|
||||
@@ -606,14 +732,61 @@ body.sidebar-hidden .sample-browser {
|
||||
user-select: none;
|
||||
color: var(--text-light);
|
||||
}
|
||||
.timeline-clip:active, .timeline-clip.dragging { cursor: grabbing; z-index: 1000; border-color: var(--accent-blue); opacity: 0.9; }
|
||||
.clip-name { position: absolute; top: 4px; left: 8px; font-size: 0.75rem; font-weight: bold; background-color: rgba(0,0,0,0.6); padding: 2px 6px; border-radius: 3px; pointer-events: none; }
|
||||
.waveform-canvas-clip { width: 100%; height: 100%; display: block; }
|
||||
.audio-track-lane .track-controls { display: flex; justify-content: flex-start; gap: 15px; border-left: none; padding-left: 0; margin: 0; }
|
||||
.clip-resize-handle { position: absolute; top: 0; bottom: 0; width: 8px; cursor: ew-resize; z-index: 10; }
|
||||
.clip-resize-handle.left { left: 0; }
|
||||
.clip-resize-handle.right { right: 0; }
|
||||
.playhead { position: absolute; top: 0; left: 0; width: 2px; height: 100%; background-color: var(--accent-red); z-index: 50; pointer-events: none; }
|
||||
.timeline-clip:active,
|
||||
.timeline-clip.dragging {
|
||||
cursor: grabbing;
|
||||
z-index: 1000;
|
||||
border-color: var(--accent-blue);
|
||||
opacity: 0.9;
|
||||
}
|
||||
.clip-name {
|
||||
position: absolute;
|
||||
top: 4px;
|
||||
left: 8px;
|
||||
font-size: 0.75rem;
|
||||
font-weight: bold;
|
||||
background-color: rgba(0, 0, 0, 0.6);
|
||||
padding: 2px 6px;
|
||||
border-radius: 3px;
|
||||
pointer-events: none;
|
||||
}
|
||||
.waveform-canvas-clip {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: block;
|
||||
}
|
||||
.audio-track-lane .track-controls {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
gap: 15px;
|
||||
border-left: none;
|
||||
padding-left: 0;
|
||||
margin: 0;
|
||||
}
|
||||
.clip-resize-handle {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
width: 8px;
|
||||
cursor: ew-resize;
|
||||
z-index: 10;
|
||||
}
|
||||
.clip-resize-handle.left {
|
||||
left: 0;
|
||||
}
|
||||
.clip-resize-handle.right {
|
||||
right: 0;
|
||||
}
|
||||
.playhead {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 2px;
|
||||
height: 100%;
|
||||
background-color: var(--accent-red);
|
||||
z-index: 50;
|
||||
pointer-events: none;
|
||||
}
|
||||
#loop-region {
|
||||
display: none; /* Começa escondido por padrão */
|
||||
position: absolute;
|
||||
@@ -634,9 +807,19 @@ body.sidebar-hidden .sample-browser {
|
||||
#loop-region:active {
|
||||
cursor: grabbing;
|
||||
}
|
||||
.loop-handle { position: absolute; top: 0; bottom: 0; width: 10px; cursor: ew-resize; }
|
||||
.loop-handle.left { left: -5px; }
|
||||
.loop-handle.right { right: -5px; }
|
||||
.loop-handle {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
width: 10px;
|
||||
cursor: ew-resize;
|
||||
}
|
||||
.loop-handle.left {
|
||||
left: -5px;
|
||||
}
|
||||
.loop-handle.right {
|
||||
right: -5px;
|
||||
}
|
||||
|
||||
/* --- ESTILOS ADICIONADOS --- */
|
||||
#slice-tool-btn.active,
|
||||
@@ -646,88 +829,388 @@ body.sidebar-hidden .sample-browser {
|
||||
background-color: var(--bg-editor);
|
||||
border-radius: 3px;
|
||||
}
|
||||
#audio-editor-loop-btn.active { color: var(--accent-green); }
|
||||
#audio-editor-loop-btn.active {
|
||||
color: var(--accent-green);
|
||||
}
|
||||
|
||||
/* =============================================== */
|
||||
/* COMPONENTES GERAIS (KNOBS, BOTÕES, INPUTS)
|
||||
/* =============================================== */
|
||||
.knob-container { text-align: center; font-size: .7rem; color: var(--text-dark); }
|
||||
.knob-container { text-align: center; font-size: .7rem; color: var(--text-dark); }
|
||||
.knob { width: 28px; height: 28px; background-color: var(--bg-toolbar); border-radius: 50%; border: 1px solid var(--border-color); margin-bottom: 2px; cursor: grab; box-shadow: inset 0 0 4px #222; position: relative; }
|
||||
.knob:active { cursor: grabbing; }
|
||||
.knob-indicator { width: 2px; height: 8px; background-color: var(--text-light); position: absolute; top: 2px; left: 50%; transform-origin: bottom center; transform: translateX(-50%) rotate(0deg); border-radius: 1px; }
|
||||
.interactive-input-container { display: flex; align-items: center; justify-content: center; gap: 4px; }
|
||||
.compasso-group { display: flex; align-items: center; gap: 4px; }
|
||||
.value-input { background: 0 0; border: 0; outline: 0; color: var(--accent-green); font-weight: 700; font-size: 1.4rem; font-family: Courier New, Courier, monospace; text-align: center; padding: 0; width: 55px; }
|
||||
.compasso-input { width: 25px; }
|
||||
.compasso-separator { color: var(--accent-green); font-weight: 700; font-size: 1.4rem; font-family: Courier New, Courier, monospace; margin: 0 2px; }
|
||||
.value-input::-webkit-outer-spin-button, .value-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
|
||||
.value-input[type=number] { -moz-appearance: textfield; }
|
||||
.adjust-btn { background: 0 0; border: 0; color: var(--text-dark); font-size: 1rem; font-weight: 700; cursor: pointer; padding: 0 5px; transition: color .2s; line-height: 1; }
|
||||
.adjust-btn:hover { color: #fff; }
|
||||
.control-group { display: flex; align-items: center; gap: 15px; padding: 0 10px; }
|
||||
.control-group i { font-size: 1.2rem; cursor: pointer; color: var(--text-light); transition: color .2s; }
|
||||
.control-group i:hover { color: #fff; }
|
||||
.fa-play, .fa-pause { color: var(--accent-green) !important; }
|
||||
.divider { width: 1px; height: 25px; background-color: var(--border-color); }
|
||||
.info-display-group { display: flex; align-items: center; gap: 5px; }
|
||||
.info-display { background-color: #1a1c1e; padding: 5px 8px; border-radius: 3px; text-align: center; }
|
||||
.info-display .label { color: var(--text-dark); font-size: .6rem; text-transform: uppercase; }
|
||||
.spacer { flex-grow: 1; }
|
||||
#metronome-btn { background: 0 0; border: 1px solid var(--text-dark); color: var(--accent-green); font-family: inherit; font-weight: 700; font-size: .8rem; padding: 5px 10px; border-radius: 3px; cursor: pointer; transition: all .2s; }
|
||||
#metronome-btn:hover { border-color: var(--text-light); background-color: var(--bg-editor); }
|
||||
#metronome-btn.active { background-color: var(--accent-green); color: var(--bg-body); border-color: var(--accent-green); }
|
||||
.knob-container {
|
||||
text-align: center;
|
||||
font-size: 0.7rem;
|
||||
color: var(--text-dark);
|
||||
}
|
||||
.knob-container {
|
||||
text-align: center;
|
||||
font-size: 0.7rem;
|
||||
color: var(--text-dark);
|
||||
}
|
||||
.knob {
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
background-color: var(--bg-toolbar);
|
||||
border-radius: 50%;
|
||||
border: 1px solid var(--border-color);
|
||||
margin-bottom: 2px;
|
||||
cursor: grab;
|
||||
box-shadow: inset 0 0 4px #222;
|
||||
position: relative;
|
||||
}
|
||||
.knob:active {
|
||||
cursor: grabbing;
|
||||
}
|
||||
.knob-indicator {
|
||||
width: 2px;
|
||||
height: 8px;
|
||||
background-color: var(--text-light);
|
||||
position: absolute;
|
||||
top: 2px;
|
||||
left: 50%;
|
||||
transform-origin: bottom center;
|
||||
transform: translateX(-50%) rotate(0deg);
|
||||
border-radius: 1px;
|
||||
}
|
||||
.interactive-input-container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 4px;
|
||||
}
|
||||
.compasso-group {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 4px;
|
||||
}
|
||||
.value-input {
|
||||
background: 0 0;
|
||||
border: 0;
|
||||
outline: 0;
|
||||
color: var(--accent-green);
|
||||
font-weight: 700;
|
||||
font-size: 1.4rem;
|
||||
font-family: Courier New, Courier, monospace;
|
||||
text-align: center;
|
||||
padding: 0;
|
||||
width: 55px;
|
||||
}
|
||||
.compasso-input {
|
||||
width: 25px;
|
||||
}
|
||||
.compasso-separator {
|
||||
color: var(--accent-green);
|
||||
font-weight: 700;
|
||||
font-size: 1.4rem;
|
||||
font-family: Courier New, Courier, monospace;
|
||||
margin: 0 2px;
|
||||
}
|
||||
.value-input::-webkit-outer-spin-button,
|
||||
.value-input::-webkit-inner-spin-button {
|
||||
-webkit-appearance: none;
|
||||
margin: 0;
|
||||
}
|
||||
.value-input[type="number"] {
|
||||
-moz-appearance: textfield;
|
||||
}
|
||||
.adjust-btn {
|
||||
background: 0 0;
|
||||
border: 0;
|
||||
color: var(--text-dark);
|
||||
font-size: 1rem;
|
||||
font-weight: 700;
|
||||
cursor: pointer;
|
||||
padding: 0 5px;
|
||||
transition: color 0.2s;
|
||||
line-height: 1;
|
||||
}
|
||||
.adjust-btn:hover {
|
||||
color: #fff;
|
||||
}
|
||||
.control-group {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 15px;
|
||||
padding: 0 10px;
|
||||
}
|
||||
.control-group i {
|
||||
font-size: 1.2rem;
|
||||
cursor: pointer;
|
||||
color: var(--text-light);
|
||||
transition: color 0.2s;
|
||||
}
|
||||
.control-group i:hover {
|
||||
color: #fff;
|
||||
}
|
||||
.fa-play,
|
||||
.fa-pause {
|
||||
color: var(--accent-green) !important;
|
||||
}
|
||||
.divider {
|
||||
width: 1px;
|
||||
height: 25px;
|
||||
background-color: var(--border-color);
|
||||
}
|
||||
.info-display-group {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 5px;
|
||||
}
|
||||
.info-display {
|
||||
background-color: #1a1c1e;
|
||||
padding: 5px 8px;
|
||||
border-radius: 3px;
|
||||
text-align: center;
|
||||
}
|
||||
.info-display .label {
|
||||
color: var(--text-dark);
|
||||
font-size: 0.6rem;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.spacer {
|
||||
flex-grow: 1;
|
||||
}
|
||||
#metronome-btn {
|
||||
background: 0 0;
|
||||
border: 1px solid var(--text-dark);
|
||||
color: var(--accent-green);
|
||||
font-family: inherit;
|
||||
font-weight: 700;
|
||||
font-size: 0.8rem;
|
||||
padding: 5px 10px;
|
||||
border-radius: 3px;
|
||||
cursor: pointer;
|
||||
transition: all 0.2s;
|
||||
}
|
||||
#metronome-btn:hover {
|
||||
border-color: var(--text-light);
|
||||
background-color: var(--bg-editor);
|
||||
}
|
||||
#metronome-btn.active {
|
||||
background-color: var(--accent-green);
|
||||
color: var(--bg-body);
|
||||
border-color: var(--accent-green);
|
||||
}
|
||||
|
||||
/* =============================================== */
|
||||
/* MODAL E MENUS
|
||||
/* =============================================== */
|
||||
.modal-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.7); z-index: 2000; display: flex; justify-content: center; align-items: center; padding: 1rem; visibility: hidden; opacity: 0; transition: visibility 0s 0.3s, opacity 0.3s; }
|
||||
.modal-overlay.visible { visibility: visible; opacity: 1; transition: visibility 0s, opacity 0.3s; }
|
||||
.modal-content { background-color: var(--bg-body); padding: 1.5rem 2rem; border-radius: 6px; border: 1px solid var(--border-color); box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5); width: 100%; max-width: 500px; position: relative; display: flex; flex-direction: column; gap: 1.5rem; max-height: 90vh; }
|
||||
.modal-close { position: absolute; top: 10px; right: 15px; font-size: 1.5rem; color: var(--text-dark); cursor: pointer; border: none; background: none; }
|
||||
.modal-close:hover { color: var(--text-light); }
|
||||
.modal-title { margin: 0; padding-bottom: 0.5rem; border-bottom: 1px solid var(--bg-toolbar); color: var(--text-light); text-align: center; flex-shrink: 0; }
|
||||
.modal-section h3 { margin-top: 0; margin-bottom: 0.8rem; font-size: 1rem; color: var(--text-light); }
|
||||
#server-projects-list { max-height: 250px; overflow-y: auto; background-color: var(--bg-toolbar); border: 1px solid var(--border-color); border-radius: 4px; padding: 0.5rem; min-height: 50px; }
|
||||
#server-projects-list .project-item { background-color: var(--bg-editor); padding: 10px 15px; border-radius: 4px; margin-bottom: 8px; cursor: pointer; transition: background-color 0.2s, color 0.2s; border: 1px solid transparent; }
|
||||
#server-projects-list .project-item:last-child { margin-bottom: 0; }
|
||||
#server-projects-list .project-item:hover { background-color: var(--bg-body); color: #fff; border-color: var(--accent-green); }
|
||||
.modal-button { background-color: var(--bg-toolbar); color: var(--text-light); border: 1px solid var(--border-color); padding: 0.8rem 1.5rem; border-radius: 4px; cursor: pointer; font-size: 1rem; transition: background-color 0.2s, border-color 0.2s; width: 100%; text-align: center; }
|
||||
.modal-button:hover { background-color: #4a4f57; border-color: #333; }
|
||||
#timeline-context-menu { position: fixed; display: none; background-color: var(--bg-toolbar); border: 1px solid var(--border-color-dark); border-radius: 4px; box-shadow: 0 4px 12px rgba(0,0,0,0.5); padding: 5px 0; z-index: 2000; font-size: 0.9rem; }
|
||||
#timeline-context-menu div { padding: 8px 15px; cursor: pointer; white-space: nowrap; }
|
||||
#timeline-context-menu div:hover { background-color: var(--accent-blue); color: white; }
|
||||
.modal-overlay {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: rgba(0, 0, 0, 0.7);
|
||||
z-index: 2000;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 1rem;
|
||||
visibility: hidden;
|
||||
opacity: 0;
|
||||
transition: visibility 0s 0.3s, opacity 0.3s;
|
||||
}
|
||||
.modal-overlay.visible {
|
||||
visibility: visible;
|
||||
opacity: 1;
|
||||
transition: visibility 0s, opacity 0.3s;
|
||||
}
|
||||
.modal-content {
|
||||
background-color: var(--bg-body);
|
||||
padding: 1.5rem 2rem;
|
||||
border-radius: 6px;
|
||||
border: 1px solid var(--border-color);
|
||||
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
|
||||
width: 100%;
|
||||
max-width: 500px;
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 1.5rem;
|
||||
max-height: 90vh;
|
||||
}
|
||||
.modal-close {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
right: 15px;
|
||||
font-size: 1.5rem;
|
||||
color: var(--text-dark);
|
||||
cursor: pointer;
|
||||
border: none;
|
||||
background: none;
|
||||
}
|
||||
.modal-close:hover {
|
||||
color: var(--text-light);
|
||||
}
|
||||
.modal-title {
|
||||
margin: 0;
|
||||
padding-bottom: 0.5rem;
|
||||
border-bottom: 1px solid var(--bg-toolbar);
|
||||
color: var(--text-light);
|
||||
text-align: center;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.modal-section h3 {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0.8rem;
|
||||
font-size: 1rem;
|
||||
color: var(--text-light);
|
||||
}
|
||||
#server-projects-list {
|
||||
max-height: 250px;
|
||||
overflow-y: auto;
|
||||
background-color: var(--bg-toolbar);
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: 4px;
|
||||
padding: 0.5rem;
|
||||
min-height: 50px;
|
||||
}
|
||||
#server-projects-list .project-item {
|
||||
background-color: var(--bg-editor);
|
||||
padding: 10px 15px;
|
||||
border-radius: 4px;
|
||||
margin-bottom: 8px;
|
||||
cursor: pointer;
|
||||
transition: background-color 0.2s, color 0.2s;
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
#server-projects-list .project-item:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
#server-projects-list .project-item:hover {
|
||||
background-color: var(--bg-body);
|
||||
color: #fff;
|
||||
border-color: var(--accent-green);
|
||||
}
|
||||
.modal-button {
|
||||
background-color: var(--bg-toolbar);
|
||||
color: var(--text-light);
|
||||
border: 1px solid var(--border-color);
|
||||
padding: 0.8rem 1.5rem;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
font-size: 1rem;
|
||||
transition: background-color 0.2s, border-color 0.2s;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
}
|
||||
.modal-button:hover {
|
||||
background-color: #4a4f57;
|
||||
border-color: #333;
|
||||
}
|
||||
#timeline-context-menu {
|
||||
position: fixed;
|
||||
display: none;
|
||||
background-color: var(--bg-toolbar);
|
||||
border: 1px solid var(--border-color-dark);
|
||||
border-radius: 4px;
|
||||
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5);
|
||||
padding: 5px 0;
|
||||
z-index: 2000;
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
#timeline-context-menu div {
|
||||
padding: 8px 15px;
|
||||
cursor: pointer;
|
||||
white-space: nowrap;
|
||||
}
|
||||
#timeline-context-menu div:hover {
|
||||
background-color: var(--accent-blue);
|
||||
color: white;
|
||||
}
|
||||
|
||||
/* =============================================== */
|
||||
/* ESTILOS RESPONSIVOS
|
||||
/* =============================================== */
|
||||
@media (max-width: 1200px) {
|
||||
.info-display-group { gap: 2px; }
|
||||
.info-display { padding: 4px 6px; }
|
||||
.value-input { font-size: 1.2rem; width: 45px; }
|
||||
.compasso-input { width: 20px; }
|
||||
.info-display-group {
|
||||
gap: 2px;
|
||||
}
|
||||
.info-display {
|
||||
padding: 4px 6px;
|
||||
}
|
||||
.value-input {
|
||||
font-size: 1.2rem;
|
||||
width: 45px;
|
||||
}
|
||||
.compasso-input {
|
||||
width: 20px;
|
||||
}
|
||||
}
|
||||
@media (max-width: 992px) {
|
||||
.global-toolbar { gap: 10px; flex-wrap: wrap; height: auto; padding-bottom: 10px; }
|
||||
.main-content { padding-top: 100px; }
|
||||
.info-display-group { order: 3; width: 100%; justify-content: space-around; }
|
||||
.spacer { display: none; }
|
||||
.global-toolbar {
|
||||
gap: 10px;
|
||||
flex-wrap: wrap;
|
||||
height: auto;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
.main-content {
|
||||
padding-top: 100px;
|
||||
}
|
||||
.info-display-group {
|
||||
order: 3;
|
||||
width: 100%;
|
||||
justify-content: space-around;
|
||||
}
|
||||
.spacer {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
@media (max-width: 768px) {
|
||||
.sample-browser { transform: translateX(-100%); position: fixed; width: 280px; }
|
||||
body:not(.sidebar-hidden) .sample-browser { transform: translateX(0); }
|
||||
#sidebar-toggle { left: 5px; transform: translateX(0); position: fixed; }
|
||||
.global-toolbar { padding-left: 45px; }
|
||||
.main-content { padding: 10px; }
|
||||
.track-lane, .audio-track-lane { flex-direction: column; align-items: stretch; gap: 15px; padding: 15px; }
|
||||
.track-lane .track-info, .audio-track-lane .track-info, .track-lane .track-controls, .audio-track-lane .track-controls { width: 100%; border: none; padding: 0; }
|
||||
.track-lane .track-controls, .audio-track-lane .track-controls { justify-content: space-around; }
|
||||
.sample-browser {
|
||||
transform: translateX(-100%);
|
||||
position: fixed;
|
||||
width: 280px;
|
||||
}
|
||||
body:not(.sidebar-hidden) .sample-browser {
|
||||
transform: translateX(0);
|
||||
}
|
||||
#sidebar-toggle {
|
||||
left: 5px;
|
||||
transform: translateX(0);
|
||||
position: fixed;
|
||||
}
|
||||
.global-toolbar {
|
||||
padding-left: 45px;
|
||||
}
|
||||
.main-content {
|
||||
padding: 10px;
|
||||
}
|
||||
.track-lane,
|
||||
.audio-track-lane {
|
||||
flex-direction: column;
|
||||
align-items: stretch;
|
||||
gap: 15px;
|
||||
padding: 15px;
|
||||
}
|
||||
.track-lane .track-info,
|
||||
.audio-track-lane .track-info,
|
||||
.track-lane .track-controls,
|
||||
.audio-track-lane .track-controls {
|
||||
width: 100%;
|
||||
border: none;
|
||||
padding: 0;
|
||||
}
|
||||
.track-lane .track-controls,
|
||||
.audio-track-lane .track-controls {
|
||||
justify-content: space-around;
|
||||
}
|
||||
}
|
||||
|
||||
/* =============================================== */
|
||||
/* SCROLLBARS
|
||||
/* =============================================== */
|
||||
::-webkit-scrollbar { height: 10px; width: 10px; }
|
||||
::-webkit-scrollbar-track { background: var(--border-color); }
|
||||
::-webkit-scrollbar-thumb { background: var(--bg-toolbar); border-radius: 5px; }
|
||||
::-webkit-scrollbar-thumb:hover { background: #555; }
|
||||
::-webkit-scrollbar {
|
||||
height: 10px;
|
||||
width: 10px;
|
||||
}
|
||||
::-webkit-scrollbar-track {
|
||||
background: var(--border-color);
|
||||
}
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: var(--bg-toolbar);
|
||||
border-radius: 5px;
|
||||
}
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background: #555;
|
||||
}
|
||||
@@ -6,6 +6,22 @@ import { highlightStep } from "./pattern_ui.js";
|
||||
import { getTotalSteps } from "../utils.js";
|
||||
import { initializeAudioContext } from "../audio.js";
|
||||
|
||||
// Ajuste os caminhos (../plugins/...) conforme a estrutura real das suas pastas
|
||||
import { TripleOscillator } from "../../audio/plugins/TripleOscillator.js";
|
||||
import { Nes } from "../../audio/plugins/Nes.js";
|
||||
import { SuperSaw } from "../../audio/plugins/SuperSaw.js";
|
||||
import { Lb302 } from "../../audio/plugins/Lb302.js";
|
||||
import { Kicker } from "../../audio/plugins/Kicker.js";
|
||||
|
||||
// Mapa para facilitar a criação dinâmica
|
||||
const PLUGIN_CLASSES = {
|
||||
tripleoscillator: TripleOscillator,
|
||||
nes: Nes,
|
||||
supersaw: SuperSaw,
|
||||
lb302: Lb302,
|
||||
kicker: Kicker,
|
||||
};
|
||||
|
||||
const timerDisplay = document.getElementById("timer-display");
|
||||
|
||||
// Variável para armazenar as "Parts" (sequências melódicas) do Tone.js
|
||||
@@ -104,29 +120,34 @@ function tick() {
|
||||
}
|
||||
}
|
||||
|
||||
// Percorre tracks e toca o step atual se ativo
|
||||
// PERCORRE AS TRACKS
|
||||
appState.pattern.tracks.forEach((track) => {
|
||||
if (track.muted) return; // Respeita o Mute
|
||||
if (track.muted) return;
|
||||
if (!track.patterns || track.patterns.length === 0) return;
|
||||
|
||||
const activePattern = track.patterns[track.activePatternIndex];
|
||||
if (!activePattern) return;
|
||||
|
||||
// Verifica se o step atual está ativo
|
||||
if (activePattern && activePattern.steps[appState.global.currentStep]) {
|
||||
|
||||
// CASO 1: SAMPLER (Arquivo de Áudio)
|
||||
if (activePattern.steps[appState.global.currentStep]) {
|
||||
// CASO 1: SAMPLER (Sempre toca no step)
|
||||
if (track.samplePath) {
|
||||
playSample(track.samplePath, track.id);
|
||||
}
|
||||
// CASO 2: PLUGIN (Sintetizador)
|
||||
// Se for plugin e tiver step marcado, toca nota padrão (C5)
|
||||
else if (track.type === 'plugin' && track.instrument) {
|
||||
// "16n" é a duração de uma semicolcheia
|
||||
// Usamos um try/catch para evitar travar o loop se o plugin falhar
|
||||
else if (track.type === "plugin" && track.instrument) {
|
||||
// --- CORREÇÃO DO SOM DUPLICADO ---
|
||||
// Verifica se existem notas no Piano Roll.
|
||||
// Se houver notas (array notes > 0), IGNORA o step sequencer.
|
||||
// O som será gerado APENAS pelo 'schedulePianoRoll'.
|
||||
|
||||
const hasNotes = activePattern.notes && activePattern.notes.length > 0;
|
||||
|
||||
if (!hasNotes) {
|
||||
// Só toca o C5 do step se NÃO houver melodia desenhada
|
||||
try {
|
||||
track.instrument.triggerAttackRelease("C5", "16n", Tone.now());
|
||||
} catch (e) {
|
||||
console.warn("Falha ao tocar step do plugin:", e);
|
||||
} catch (e) {}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -183,14 +204,20 @@ export function stopPlayback() {
|
||||
Tone.Transport.stop();
|
||||
|
||||
// Limpa agendamentos melódicos
|
||||
activeParts.forEach(part => part.dispose());
|
||||
activeParts.forEach((part) => part.dispose());
|
||||
activeParts = [];
|
||||
|
||||
// Solta notas travadas de todos os plugins
|
||||
appState.pattern.tracks.forEach(track => {
|
||||
try { track.player?.stop(); } catch {}
|
||||
try { track.instrument?.releaseAll?.(); } catch {} // Para PolySynths
|
||||
try { track.instrument?.triggerRelease?.(); } catch {} // Para MonoSynths
|
||||
appState.pattern.tracks.forEach((track) => {
|
||||
try {
|
||||
track.player?.stop();
|
||||
} catch {}
|
||||
try {
|
||||
track.instrument?.releaseAll?.();
|
||||
} catch {} // Para PolySynths
|
||||
try {
|
||||
track.instrument?.triggerRelease?.();
|
||||
} catch {} // Para MonoSynths
|
||||
});
|
||||
// --------------------------------------------
|
||||
|
||||
@@ -232,49 +259,60 @@ export function togglePlayback() {
|
||||
}
|
||||
}
|
||||
|
||||
// =========================================================================
|
||||
// AGENDADOR DE PIANO ROLL (NOVA FUNÇÃO)
|
||||
// Agenda as notas melódicas (desenhadas no Piano Roll) para tocar no Tone.Transport
|
||||
// =========================================================================
|
||||
// 2. Agendador de Piano Roll (Melodia)
|
||||
function schedulePianoRoll() {
|
||||
// Limpa anteriores por segurança
|
||||
activeParts.forEach(part => part.dispose());
|
||||
activeParts.forEach((part) => part.dispose());
|
||||
activeParts = [];
|
||||
|
||||
appState.pattern.tracks.forEach(track => {
|
||||
appState.pattern.tracks.forEach((track) => {
|
||||
if (track.muted) return;
|
||||
const pattern = track.patterns[track.activePatternIndex];
|
||||
|
||||
// Só agenda se tiver notas E for um instrumento
|
||||
if (pattern && pattern.notes && pattern.notes.length > 0 && track.instrument) {
|
||||
if (
|
||||
pattern &&
|
||||
pattern.notes &&
|
||||
pattern.notes.length > 0 &&
|
||||
track.instrument
|
||||
) {
|
||||
// Converte notas para eventos Tone.js
|
||||
const events = pattern.notes.map((note) => {
|
||||
// --- CORREÇÃO DE TEMPO (PPQ) ---
|
||||
// LMMS usa 192 ticks por batida. Tone.js também usa 192 por padrão.
|
||||
// Precisamos converter o 'pos' (ticks absolutos) para tempo musical
|
||||
|
||||
// 1 Beat = 192 ticks
|
||||
// Tone.Time("0:0:0").toTicks()
|
||||
|
||||
// Mapeia as notas para o formato de evento do Tone.js
|
||||
const events = pattern.notes.map(note => {
|
||||
return {
|
||||
// Converte Ticks (pos) para Tempo Musical do Tone.js
|
||||
// Assumindo 192 PPQ (padrão LMMS) -> Tone PPQ
|
||||
time: 0 + (note.pos * (Tone.Transport.PPQ / 192) / Tone.Transport.PPQ),
|
||||
// Passamos 'ticks' diretamente. O Tone converte baseado no BPM.
|
||||
time:
|
||||
0 + (note.pos * (Tone.Transport.PPQ / 192)) / Tone.Transport.PPQ,
|
||||
midi: note.key,
|
||||
duration: note.len + "i", // 'i' em Tone.js significa ticks
|
||||
velocity: (note.vol || 100) / 100
|
||||
duration: note.len / 192 + "n", // Converte duração baseada em semínimas (192)
|
||||
velocity: (note.vol || 100) / 100,
|
||||
};
|
||||
});
|
||||
|
||||
// Cria uma Part (sequência)
|
||||
const part = new Tone.Part((time, value) => {
|
||||
if (track.muted) return;
|
||||
|
||||
const freq = Tone.Frequency(value.midi, "midi");
|
||||
// Dispara o método que padronizamos em todos os plugins
|
||||
|
||||
// Dispara nota
|
||||
if (track.instrument.triggerAttackRelease) {
|
||||
track.instrument.triggerAttackRelease(freq, value.duration, time, value.velocity);
|
||||
// Se a duração calculada for muito curta ou inválida, usa 16n
|
||||
const dur = value.duration || "16n";
|
||||
track.instrument.triggerAttackRelease(
|
||||
freq,
|
||||
dur,
|
||||
time,
|
||||
value.velocity
|
||||
);
|
||||
}
|
||||
}, events).start(0);
|
||||
|
||||
// Configura o Loop da Melodia
|
||||
const bars = parseInt(document.getElementById('bars-input')?.value || 1);
|
||||
const bars = parseInt(document.getElementById("bars-input")?.value || 1);
|
||||
part.loop = true;
|
||||
part.loopEnd = bars + "m"; // 'm' = measure (compasso)
|
||||
part.loopEnd = bars + "m";
|
||||
|
||||
activeParts.push(part);
|
||||
}
|
||||
@@ -289,56 +327,149 @@ export async function renderActivePatternToBlob() {
|
||||
initializeAudioContext();
|
||||
|
||||
const bpm = parseInt(document.getElementById("bpm-input").value, 10) || 120;
|
||||
const totalSteps = getTotalSteps();
|
||||
const stepInterval = 60 / (bpm * 4);
|
||||
const duration = totalSteps * stepInterval;
|
||||
|
||||
// =========================================================
|
||||
// 1. CÁLCULO DE DURAÇÃO INTELIGENTE
|
||||
// =========================================================
|
||||
const stepInterval = 60 / (bpm * 4);
|
||||
const activePatternIndex =
|
||||
appState.pattern.tracks[0]?.activePatternIndex || 0;
|
||||
let maxStepFound = getTotalSteps(); // Mínimo: tamanho da tela
|
||||
|
||||
const buffer = await Tone.Offline(async () => {
|
||||
// Varre todas as tracks para achar a última nota ou step
|
||||
appState.pattern.tracks.forEach((track) => {
|
||||
const p = track.patterns[activePatternIndex];
|
||||
if (!p) return;
|
||||
|
||||
// A. Steps (Bateria)
|
||||
if (p.steps && p.steps.includes(true)) {
|
||||
const lastIdx = p.steps.lastIndexOf(true);
|
||||
if (lastIdx + 1 > maxStepFound) maxStepFound = lastIdx + 1;
|
||||
}
|
||||
|
||||
// B. Notas (Piano Roll) - Assumindo 192 ticks/beat e steps de 1/16 (48 ticks)
|
||||
if (p.notes && p.notes.length > 0) {
|
||||
p.notes.forEach((n) => {
|
||||
const endTick = n.pos + n.len;
|
||||
const endStep = Math.ceil(endTick / 48);
|
||||
if (endStep > maxStepFound) maxStepFound = endStep;
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
// Arredonda para o próximo compasso cheio (múltiplo de 16)
|
||||
const stepsPerBar = 16;
|
||||
const totalSteps = Math.ceil(maxStepFound / stepsPerBar) * stepsPerBar;
|
||||
const duration = totalSteps * stepInterval;
|
||||
|
||||
// =========================================================
|
||||
// 2. RENDERIZAÇÃO OFFLINE
|
||||
// =========================================================
|
||||
const buffer = await Tone.Offline(async ({ transport }) => {
|
||||
const masterGain = new Tone.Gain().toDestination();
|
||||
|
||||
const offlineTracksParts = appState.pattern.tracks
|
||||
.map((track) => {
|
||||
// Loop por cada trilha do projeto
|
||||
appState.pattern.tracks.forEach((track) => {
|
||||
const pattern = track.patterns[activePatternIndex];
|
||||
// Se não tem pattern, ou se é uma track muda/vazia, pula
|
||||
if (!pattern || track.muted) return;
|
||||
|
||||
// Nota: O render atual suporta apenas Samplers (buffers carregados)
|
||||
// Para suportar Plugins no futuro, precisaríamos recriar o synth aqui dentro.
|
||||
if (!pattern || !track.buffer || !pattern.steps.includes(true)) {
|
||||
return null;
|
||||
}
|
||||
// Verifica se tem conteúdo (buffer de áudio OU notas MIDI OU steps ativos)
|
||||
const hasAudio = track.buffer;
|
||||
const hasNotes = pattern.notes && pattern.notes.length > 0;
|
||||
const hasSteps = pattern.steps && pattern.steps.includes(true);
|
||||
|
||||
const trackBuffer = track.buffer;
|
||||
const panner = new Tone.Panner(track.pan).connect(masterGain);
|
||||
const volume = new Tone.Volume(Tone.gainToDb(track.volume)).connect(
|
||||
panner
|
||||
);
|
||||
if (!hasAudio && !hasNotes && !hasSteps) return;
|
||||
|
||||
// Cria canal de volume/pan para essa track no mundo Offline
|
||||
const panner = new Tone.Panner(track.pan || 0).connect(masterGain);
|
||||
const volume = new Tone.Volume(
|
||||
track.volume === 0 ? -100 : Tone.gainToDb(track.volume)
|
||||
).connect(panner);
|
||||
|
||||
// --- CENÁRIO A: É um SAMPLE (Áudio gravado) ---
|
||||
if (track.samplePath && track.buffer) {
|
||||
// Lógica original de steps para samples
|
||||
if (pattern.steps) {
|
||||
const events = [];
|
||||
pattern.steps.forEach((isActive, stepIndex) => {
|
||||
if (isActive) {
|
||||
const time = stepIndex * stepInterval;
|
||||
events.push(time);
|
||||
if (isActive) events.push(stepIndex * stepInterval);
|
||||
});
|
||||
|
||||
if (events.length > 0) {
|
||||
new Tone.Part((time) => {
|
||||
new Tone.Player(track.buffer).connect(volume).start(time);
|
||||
}, events).start(0);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// --- CENÁRIO B: É um PLUGIN (Sintetizador) ---
|
||||
else if (track.type === "plugin") {
|
||||
// Normaliza o nome (ex: "TripleOscillator" -> "tripleoscillator")
|
||||
// Tenta pegar o nome da propriedade 'pluginName', 'instrument.name' ou do próprio objeto params
|
||||
const pluginName = (
|
||||
track.pluginName ||
|
||||
track.instrument?.constructor?.name ||
|
||||
""
|
||||
).toLowerCase();
|
||||
|
||||
const PluginClass = PLUGIN_CLASSES[pluginName];
|
||||
|
||||
if (PluginClass) {
|
||||
// INSTANCIA O PLUGIN NO MUNDO OFFLINE
|
||||
// Passamos 'track.params' ou 'track.pluginData' (ajuste conforme seu appState salva os dados)
|
||||
const instrumentInstance = new PluginClass(
|
||||
null,
|
||||
track.params || track.pluginData || {}
|
||||
);
|
||||
|
||||
// Conecta na cadeia de áudio offline
|
||||
instrumentInstance.connect(volume);
|
||||
|
||||
// 1. Agendar Notas do Piano Roll
|
||||
if (hasNotes) {
|
||||
const events = pattern.notes.map((note) => ({
|
||||
time: 0 + note.pos * (48 / 192) * stepInterval, // Conversão aproximada Ticks -> Segundos
|
||||
// Se quiser precisão exata do Tone, use: note.pos * (Tone.Transport.PPQ / 192) / Tone.Transport.PPQ
|
||||
midi: note.key,
|
||||
duration: (note.len / 192) * (60 / bpm), // Duração em segundos
|
||||
velocity: (note.vol || 100) / 100,
|
||||
}));
|
||||
|
||||
new Tone.Part((time, val) => {
|
||||
const freq = Tone.Frequency(val.midi, "midi");
|
||||
instrumentInstance.triggerAttackRelease(freq, val.duration, time);
|
||||
}, events).start(0);
|
||||
}
|
||||
|
||||
// 2. Agendar Steps (Caso use o TripleOscillator como bateria/efeito no step sequencer)
|
||||
else if (hasSteps) {
|
||||
const stepEvents = [];
|
||||
pattern.steps.forEach((isActive, idx) => {
|
||||
if (isActive) stepEvents.push(idx * stepInterval);
|
||||
});
|
||||
|
||||
new Tone.Part((time) => {
|
||||
// Toca um C5 padrão para steps sem nota definida
|
||||
instrumentInstance.triggerAttackRelease(
|
||||
Tone.Frequency("C5"),
|
||||
0.1,
|
||||
time
|
||||
);
|
||||
}, stepEvents).start(0);
|
||||
}
|
||||
} else {
|
||||
console.warn(
|
||||
`Render: Plugin não suportado ou não encontrado: ${pluginName}`
|
||||
);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
const part = new Tone.Part((time) => {
|
||||
new Tone.Player(trackBuffer)
|
||||
.connect(volume)
|
||||
.start(time);
|
||||
}, events);
|
||||
|
||||
return part;
|
||||
})
|
||||
.filter((t) => t !== null);
|
||||
|
||||
offlineTracksParts.forEach((part) => {
|
||||
part.start(0);
|
||||
});
|
||||
|
||||
Tone.Transport.bpm.value = bpm;
|
||||
Tone.Transport.start();
|
||||
// Configura e inicia o Transport Offline
|
||||
transport.bpm.value = bpm;
|
||||
transport.start();
|
||||
}, duration);
|
||||
|
||||
const blob = bufferToWave(buffer);
|
||||
|
||||
@@ -7,6 +7,7 @@ import { playSample, stopPlayback } from "./pattern_audio.js";
|
||||
import { getTotalSteps } from "../utils.js";
|
||||
import { sendAction } from '../socket.js';
|
||||
import { initializeAudioContext } from '../audio.js';
|
||||
import * as Tone from "https://esm.sh/tone";
|
||||
|
||||
// Função principal de renderização para o editor de patterns
|
||||
export function renderPatternEditor() {
|
||||
@@ -105,7 +106,7 @@ export function redrawSequencer() {
|
||||
}
|
||||
|
||||
// ============================================================
|
||||
// LÓGICA DE DECISÃO V2: STEPS OU PIANO ROLL?
|
||||
// LÓGICA DE DECISÃO V2: STEPS OU PIANO ROLL? (MANTIDA)
|
||||
// ============================================================
|
||||
|
||||
const notes = activePattern.notes || [];
|
||||
@@ -117,7 +118,6 @@ export function redrawSequencer() {
|
||||
const isMelodic = notes.some(n => n.key !== firstKey);
|
||||
const hasLongNotes = notes.some(n => n.len > 48);
|
||||
|
||||
// Sobreposição de notas (Acordes)
|
||||
const sortedNotes = [...notes].sort((a, b) => a.pos - b.pos);
|
||||
let hasOverlap = false;
|
||||
for (let i = 0; i < sortedNotes.length - 1; i++) {
|
||||
@@ -153,14 +153,18 @@ export function redrawSequencer() {
|
||||
}
|
||||
});
|
||||
|
||||
// --- CÁLCULO REVERTIDO (VOLTA AO PADRÃO ANTERIOR) ---
|
||||
const barsInput = document.getElementById('bars-input');
|
||||
const barsCount = barsInput ? parseInt(barsInput.value) || 1 : 1;
|
||||
|
||||
// Revertido: Removemos a multiplicação por beatsPerBar que causou o bug visual
|
||||
const totalTicks = 192 * barsCount;
|
||||
// ----------------------------------------------------
|
||||
|
||||
activePattern.notes.forEach(note => {
|
||||
const noteEl = document.createElement('div');
|
||||
noteEl.className = 'mini-note';
|
||||
|
||||
const barsInput = document.getElementById('bars-input');
|
||||
const barsCount = barsInput ? parseInt(barsInput.value) || 1 : 1;
|
||||
const totalTicks = 192 * barsCount;
|
||||
|
||||
const leftPercent = (note.pos / totalTicks) * 100;
|
||||
const widthPercent = (note.len / totalTicks) * 100;
|
||||
|
||||
@@ -200,7 +204,6 @@ export function redrawSequencer() {
|
||||
stepElement.classList.add("active");
|
||||
}
|
||||
|
||||
// --- EVENTO DE CLIQUE (CORRIGIDO PARA PLUGINS) ---
|
||||
stepElement.addEventListener("click", (e) => {
|
||||
e.stopPropagation();
|
||||
initializeAudioContext();
|
||||
@@ -216,18 +219,13 @@ export function redrawSequencer() {
|
||||
isActive: isActive
|
||||
});
|
||||
|
||||
// --- AQUI ESTAVA O PROBLEMA: TOCA O SOM ---
|
||||
if (isActive) {
|
||||
// Caso 1: Sampler (Áudio)
|
||||
if (trackData.type === 'sampler' && trackData.samplePath) {
|
||||
playSample(trackData.samplePath, trackData.id);
|
||||
}
|
||||
// Caso 2: Plugin (Sintetizador)
|
||||
else if (trackData.type === 'plugin' && trackData.instrument) {
|
||||
// Toca um C5 (Dó) curto para feedback visual/sonoro
|
||||
try {
|
||||
// triggerAttackRelease(nota, duração)
|
||||
trackData.instrument.triggerAttackRelease("C5", "16n");
|
||||
trackData.instrument.triggerAttackRelease("C5", "16n", Tone.now());
|
||||
} catch(err) {
|
||||
console.warn("Erro ao tocar preview do synth:", err);
|
||||
}
|
||||
|
||||
+25
-13
@@ -70,12 +70,16 @@
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="studio-wrapper">
|
||||
|
||||
<aside class="sample-browser">
|
||||
<div class="browser-header">Navegador de Samples</div>
|
||||
<div class="browser-content" id="browser-content"></div>
|
||||
</aside>
|
||||
|
||||
<button id="sidebar-toggle"><i class="fa-solid fa-caret-left"></i></button>
|
||||
|
||||
<div class="app-container">
|
||||
<header class="global-toolbar">
|
||||
<div class="control-group">
|
||||
@@ -318,6 +322,7 @@
|
||||
</div>
|
||||
<div id="track-container"></div>
|
||||
</div>
|
||||
|
||||
<div class="piano-roll-editor" id="piano-roll-editor" style="display: none;">
|
||||
<div class="editor-header">
|
||||
<span>Piano Roll - <span id="piano-roll-instrument-name">Instrumento 1</span></span>
|
||||
@@ -351,6 +356,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="audio-editor">
|
||||
<div class="editor-header">
|
||||
<span>Editor de Amostras de Áudio</span>
|
||||
@@ -483,6 +489,7 @@
|
||||
</div>
|
||||
</main>
|
||||
</div>
|
||||
</div>
|
||||
<input
|
||||
type="file"
|
||||
id="mmp-file-input"
|
||||
@@ -529,13 +536,18 @@
|
||||
|
||||
// Variáveis de Controle
|
||||
let currentTrackId = null;
|
||||
// --- Configurações ---
|
||||
const CONSTANTS = {
|
||||
NOTE_HEIGHT: 20,
|
||||
KEY_WIDTH: 60,
|
||||
BEAT_WIDTH: 40,
|
||||
TOTAL_KEYS: 84, // 7 oitavas
|
||||
START_NOTE: 24, // C1
|
||||
TICKS_PER_PIXEL: 0 // Calculado dinamicamente
|
||||
BEAT_WIDTH: 40, // Largura visual de 1 batida (Quarter Note)
|
||||
TOTAL_KEYS: 84,
|
||||
START_NOTE: 24,
|
||||
|
||||
// --- CORREÇÃO DE ESCALA ---
|
||||
// O LMMS usa 192 ticks por batida (Quarter Note).
|
||||
// Se nossa batida tem 40px de largura, a relação é:
|
||||
TICKS_PER_PIXEL: 192 / 40 // = 4.8
|
||||
};
|
||||
|
||||
const pianoRollEditor = document.getElementById('piano-roll-editor');
|
||||
@@ -573,20 +585,20 @@
|
||||
|
||||
function resizeCanvas() {
|
||||
const totalHeight = CONSTANTS.TOTAL_KEYS * CONSTANTS.NOTE_HEIGHT;
|
||||
// 64 compassos * 192 ticks / (ticks por beat) * largura... simplificando:
|
||||
// Vamos fixar uma largura grande por enquanto
|
||||
const totalWidth = 3000;
|
||||
|
||||
// Calcula a largura total baseada nos compassos definidos no input
|
||||
const barsCount = parseInt(document.getElementById('bars-input')?.value || 1);
|
||||
// 1 Compasso = 4 Batidas. Largura = Batidas * Largura da Batida
|
||||
const totalWidth = (barsCount * 4) * CONSTANTS.BEAT_WIDTH;
|
||||
|
||||
keysCanvas.width = CONSTANTS.KEY_WIDTH;
|
||||
keysCanvas.height = totalHeight;
|
||||
gridCanvas.width = totalWidth;
|
||||
|
||||
gridCanvas.width = totalWidth; // Ajusta largura ao tamanho real da música
|
||||
gridCanvas.height = totalHeight;
|
||||
|
||||
// Importante: Sincronizar a conversão de Pixel <-> Tick
|
||||
// 1 Beat = 48 ticks (em 16th) ou 192 ticks por bar?
|
||||
// No seu file.js: ticksPerStep = 12 (1/16).
|
||||
// Então BEAT_WIDTH (40px) = 4 steps = 48 ticks.
|
||||
CONSTANTS.TICKS_PER_PIXEL = 48 / CONSTANTS.BEAT_WIDTH;
|
||||
// REMOVA ESTA LINHA ANTIGA:
|
||||
// CONSTANTS.TICKS_PER_PIXEL = 48 / CONSTANTS.BEAT_WIDTH;
|
||||
|
||||
drawKeys();
|
||||
drawGrid();
|
||||
|
||||
@@ -0,0 +1,79 @@
|
||||
21/11/2025 15:47:35 [INFO] ==============================
|
||||
21/11/2025 15:47:35 [INFO] AUDITORIA DE AMBIENTE (HARDWARE)
|
||||
21/11/2025 15:47:35 [INFO] ==============================
|
||||
21/11/2025 15:47:35 [INFO] Sistema: Linux 6.8.0-87-generic
|
||||
21/11/2025 15:47:35 [INFO] Kernel: #88-Ubuntu SMP PREEMPT_DYNAMIC Sat Oct 11 09:28:41 UTC 2025
|
||||
21/11/2025 15:47:35 [INFO] Node: ubuntu
|
||||
21/11/2025 15:47:35 [INFO] CPU Modelo: Intel(R) Xeon(R) CPU E5-2620 v2 @ 2.10GHz
|
||||
21/11/2025 15:47:35 [INFO] Núcleos (Log): 12
|
||||
21/11/2025 15:47:35 [INFO] Núcleos (Disp): 12 (Alocados para este script)
|
||||
21/11/2025 15:47:35 [INFO] Memória Total: 7.69 GB
|
||||
21/11/2025 15:47:35 [INFO] Disco (Total): 448 GB
|
||||
21/11/2025 15:47:35 [INFO] Disco (Livre): 124 GB
|
||||
21/11/2025 15:47:35 [INFO] ==============================
|
||||
21/11/2025 15:47:35 [INFO] === Iniciando Pipeline de Indexação Paralela ===
|
||||
21/11/2025 15:47:35 [INFO] Log sendo salvo em: /nethome/jotachina/projetos/mmpSearch/scripts/handler/logs/execucao_2025-11-21_15-47-35.log
|
||||
21/11/2025 15:47:35 [INFO] Iniciando processamento de 35 arquivos.
|
||||
21/11/2025 15:47:35 [INFO] Utilizando 12 núcleos de CPU.
|
||||
21/11/2025 15:47:35 [INFO] [PID 3526766] Processando: tp1 - Luiz Filipe Almada.mmp
|
||||
21/11/2025 15:47:35 [INFO] [PID 3526767] Processando: tp1_MarcoAntonio.mmp
|
||||
21/11/2025 15:47:35 [INFO] [PID 3526768] Processando: Ukifune.mmp
|
||||
21/11/2025 15:47:35 [INFO] [PID 3526769] Processando: Tears of Tragedy Classical 2.mmp
|
||||
21/11/2025 15:47:35 [INFO] [PID 3526770] Processando: Relaxing Theme.mmp
|
||||
21/11/2025 15:47:35 [INFO] [PID 3526771] Processando: XpressiveTest10.mmp
|
||||
21/11/2025 15:47:35 [INFO] [PID 3526772] Processando: winddown.mmp
|
||||
21/11/2025 15:47:35 [INFO] [PID 3526773] Processando: Living Joy - don't stop movin 1996 Loop.mmp
|
||||
21/11/2025 15:47:35 [INFO] [PID 3526774] Processando: Hizaki Classical.mmp
|
||||
21/11/2025 15:47:35 [INFO] [PID 3526775] Processando: Relaxing Theme 2.mmp
|
||||
21/11/2025 15:47:35 [INFO] [PID 3526777] Processando: The Drum.mmp
|
||||
21/11/2025 15:47:35 [INFO] [PID 3526776] Processando: Um começo.mmp
|
||||
21/11/2025 15:47:35 [INFO] [PID 3526766] Processando: Syu Classical.mmp
|
||||
21/11/2025 15:47:36 [INFO] [PID 3526767] Processando: Nuttertools.mmp
|
||||
21/11/2025 15:47:36 [INFO] [PID 3526776] Processando: leandro_souza_atvd1.mmp
|
||||
21/11/2025 15:47:36 [INFO] [PID 3526774] Processando: stairs.mmp
|
||||
21/11/2025 15:47:36 [INFO] [PID 3526766] Processando: MPXVM - FUMIX 307 ( Original Mix ).mmp
|
||||
21/11/2025 15:47:36 [INFO] [PID 3526769] Processando: Robin S - Show Me Love 1993 Loop.mmp
|
||||
21/11/2025 15:47:36 [INFO] [PID 3526767] Processando: Mantronix - Got To Have Your Love 1989 Loop.mmp
|
||||
21/11/2025 15:47:36 [INFO] [PID 3526772] Processando: VitorAugusto.mmp
|
||||
21/11/2025 15:47:36 [INFO] [PID 3526768] Processando: Nightcrawlers - Surrender Your Love 1995 Loop.mmp
|
||||
21/11/2025 15:47:36 [INFO] [PID 3526774] Processando: My worst enemy.mmp
|
||||
21/11/2025 15:47:36 [INFO] [PID 3526776] Processando: Introduction.mmp
|
||||
21/11/2025 15:47:36 [INFO] [PID 3526772] Processando: teste.mmp
|
||||
21/11/2025 15:47:36 [INFO] [PID 3526774] Processando: Mighty Dub Katz - Magic Carpet Ride 1995 Loop.mmp
|
||||
21/11/2025 15:47:36 [INFO] [PID 3526772] Processando: JoãoVitorSimão-2023008380-megaMainSong.mmp
|
||||
21/11/2025 15:47:36 [INFO] [PID 3526769] Processando: Iara Rodrigues.mmp
|
||||
21/11/2025 15:47:36 [INFO] [PID 3526776] Processando: space-camel.mmp
|
||||
21/11/2025 15:47:36 [INFO] [PID 3526773] Processando: Shade of separation EXTENDED.mmp
|
||||
21/11/2025 15:47:36 [INFO] [PID 3526772] Processando: Solaris Deep Note.mmp
|
||||
21/11/2025 15:47:36 [INFO] [PID 3526767] Processando: New Exploration 3.mmp
|
||||
21/11/2025 15:47:36 [INFO] [PID 3526768] Processando: Samanta Freire.mmp
|
||||
21/11/2025 15:47:36 [INFO] [PID 3526768] Processando: SonsAlignígenas.mmp
|
||||
21/11/2025 15:47:37 [INFO] [PID 3526776] Processando: Relaxing Theme 3.mmp
|
||||
21/11/2025 15:47:37 [INFO] [PID 3526766] Processando: Wesley_Silva_Guimarães.mmp
|
||||
21/11/2025 15:48:26 [INFO] Arquivos 'all.json' e 'all.yml' gerados com sucesso.
|
||||
21/11/2025 15:48:26 [INFO] === Iniciando Geração de Manifestos (Pós-Processamento) ===
|
||||
21/11/2025 15:48:26 [INFO] Manifesto salvo: /nethome/jotachina/projetos/mmpSearch/metadata/samples-manifest.json
|
||||
21/11/2025 15:48:26 [INFO] Manifesto salvo: /nethome/jotachina/projetos/mmpSearch/metadata/mmp-manifest.json
|
||||
21/11/2025 15:48:26 [INFO] ============================================================
|
||||
21/11/2025 15:48:26 [INFO] RELATÓRIO DE EXECUÇÃO - 21/11/2025 15:48:26
|
||||
21/11/2025 15:48:26 [INFO] ============================================================
|
||||
21/11/2025 15:48:26 [INFO] Tempo Total do Pipeline: 50.89 segundos
|
||||
21/11/2025 15:48:26 [INFO] --------------------
|
||||
21/11/2025 15:48:26 [INFO] [1] Indexação Paralela (Arquivos .mmp/.mmpz)
|
||||
21/11/2025 15:48:26 [INFO] Total Encontrado: 35
|
||||
21/11/2025 15:48:26 [INFO] Sucessos: 35
|
||||
21/11/2025 15:48:26 [INFO] Falhas: 0
|
||||
21/11/2025 15:48:26 [INFO] --------------------
|
||||
21/11/2025 15:48:26 [INFO] [2] Geração de Manifestos (Frontend)
|
||||
21/11/2025 15:48:26 [INFO] [OK] metadata/samples-manifest.json
|
||||
21/11/2025 15:48:26 [INFO] [OK] metadata/mmp-manifest.json
|
||||
21/11/2025 15:48:26 [INFO] ============================================================
|
||||
21/11/2025 15:48:26 [INFO] Pipeline finalizado.
|
||||
21/11/2025 15:48:26 [INFO] === Iniciando Análise Profunda de Dependências ===
|
||||
21/11/2025 15:48:27 [INFO] Relatório salvo: /nethome/jotachina/projetos/mmpSearch/metadata/dependency_report.json
|
||||
21/11/2025 15:48:27 [INFO] Resumo: {
|
||||
"total": 35,
|
||||
"healthy": 35,
|
||||
"recovered": 0,
|
||||
"broken": 0
|
||||
}
|
||||
Reference in new issue
Block a user