variablelab/variabletime
variablelab/variabletime
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

add letterDelay audio, fix audio update when playing, misc

Browse source
This commit is contained in:
jrkb 2023-10-12 18:04:48 +02:00
parent 5860343f70
commit e6e705f86f
1 changed files with 40 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

49
bin/web/js/audio.js
View file

@ -14,7 +14,7 @@ const AudioMappingOptions = function() {
this.min_freq = 0.0; this.min_freq = 0.0;
this.max_freq = config.audio.fftBandsUsed; this.max_freq = config.audio.fftBandsUsed;
this.min_in = 0.0; this.min_in = 0.0;
this.max_in = 255.0 / 2; this.max_in = 255.0;
this.min_out = 0.0; this.min_out = 0.0;
this.max_out = 1.0; this.max_out = 1.0;
this.smoothing = config.audio.defaultSmoothing; this.smoothing = config.audio.defaultSmoothing;
@ -217,6 +217,10 @@ const Audio = function(tp, record) {
const createAudioOptions = (layer, propTitle, container) => { const createAudioOptions = (layer, propTitle, container) => {
const mappingOptions = mapping[layer.id()][propTitle]; const mappingOptions = mapping[layer.id()][propTitle];
let hasLetterDelay = config
.layer.letterDelayProps
.indexOf(propTitle.split('.')[0]) >= 0
&& tp.isSequenced([...[layer.id()], ...propTitle.split('.')]);
const panel = tp.getPanel(); const panel = tp.getPanel();
if (!areMutationsObserved) { if (!areMutationsObserved) {
mutationObserver.observe(panel, { childList: true, subtree: true }); mutationObserver.observe(panel, { childList: true, subtree: true });
@ -262,6 +266,10 @@ const Audio = function(tp, record) {
panel.querySelector(`input[name="${toCssClass('audio_sync' + propTitle)}"]:checked`).value; panel.querySelector(`input[name="${toCssClass('audio_sync' + propTitle)}"]:checked`).value;
const s = panel.querySelector(toCssClass(`audio_smoothing${propTitle}`,'#')).value; const s = panel.querySelector(toCssClass(`audio_smoothing${propTitle}`,'#')).value;
mappingOptions.smoothing = parseFloat(s); mappingOptions.smoothing = parseFloat(s);
if (hasLetterDelay) {
const ld = panel.querySelector(toCssClass(`audio_letterDelay${propTitle}`,'#'));
mappingOptions.letterDelay = typeof ld.value === 'number' ? ld.value : parseInt(ld.value);
}
}; };
const min_max_Dom = document.createElement('div'); const min_max_Dom = document.createElement('div');
@ -288,7 +296,7 @@ const Audio = function(tp, record) {
max_inputDom.value = `${mappingOptions.max_out}`; max_inputDom.value = `${mappingOptions.max_out}`;
const smoothing_inputDom_label = document.createElement('label'); const smoothing_inputDom_label = document.createElement('label');
smoothing_inputDom_label.for = 'audio_smoothing'; smoothing_inputDom_label.for = 'audio_smoothing';
smoothing_inputDom_label.innerHTML = 'audio smoothing '; smoothing_inputDom_label.innerHTML = 'audio smoothing';
const smoothing_inputDom = document.createElement('input'); const smoothing_inputDom = document.createElement('input');
smoothing_inputDom.type = 'number'; smoothing_inputDom.type = 'number';
smoothing_inputDom.name = toCssClass(`audio_smoothing${propTitle}`); smoothing_inputDom.name = toCssClass(`audio_smoothing${propTitle}`);
@ -305,6 +313,23 @@ const Audio = function(tp, record) {
min_max_Dom.append(max_Cont); min_max_Dom.append(max_Cont);
max_Cont.append(max_inputDom_label); max_Cont.append(max_inputDom_label);
max_Cont.append(max_inputDom); max_Cont.append(max_inputDom);
if (hasLetterDelay) {
const letterDelayCont = document.createElement('div');
const letterDelay_inputDom_label = document.createElement('label');
letterDelay_inputDom_label.for = 'audio_letterDelay';
letterDelay_inputDom_label.innerHTML = 'letterDelay';
const letterDelay_inputDom = document.createElement('input');
letterDelay_inputDom.type = 'number';
letterDelay_inputDom.name = toCssClass(`audio_letterDelay${propTitle}`);
letterDelay_inputDom.id = toCssClass(`audio_letterDelay${propTitle}`);
letterDelay_inputDom.value = 0;
letterDelay_inputDom.min = 0;
letterDelay_inputDom.step = 1;
letterDelayCont.append(letterDelay_inputDom_label);
letterDelayCont.append(letterDelay_inputDom);
min_max_Dom.append(letterDelayCont);
letterDelay_inputDom.addEventListener('change', updateMappingOptions);
}
audioOptions.append(min_max_Dom); audioOptions.append(min_max_Dom);
const sync_Dom = document.createElement('div'); const sync_Dom = document.createElement('div');
@ -314,7 +339,6 @@ const Audio = function(tp, record) {
sync_titleDom_Cont.classList.add('sync_titleDom_Cont'); sync_titleDom_Cont.classList.add('sync_titleDom_Cont');
sync_titleDom.innerHTML = 'sync with:'; sync_titleDom.innerHTML = 'sync with:';
sync_Dom.append(sync_titleDom); sync_Dom.append(sync_titleDom);
audio_sync_options.forEach((o) => { audio_sync_options.forEach((o) => {
const sync_inputDom_Cont = document.createElement('div'); const sync_inputDom_Cont = document.createElement('div');
@ -530,9 +554,11 @@ const Audio = function(tp, record) {
if (!isMapped(layer, propTitle)) { if (!isMapped(layer, propTitle)) {
addAudioMapping(layer, propTitle); addAudioMapping(layer, propTitle);
addAudioOptions(layer, propTitle); addAudioOptions(layer, propTitle);
layer.updateValuesViaTheatre(false);
} else { } else {
removeAudioMapping(layer, propTitle); removeAudioMapping(layer, propTitle);
removeAudioOptions(layer, propTitle); removeAudioOptions(layer, propTitle);
layer.updateValuesViaTheatre(true);
} }
}); });
if (isActive) { if (isActive) {
@ -884,7 +910,6 @@ const Audio = function(tp, record) {
layer, layer,
id: layer.id(), id: layer.id(),
title: propTitle, title: propTitle,
prop: layer.theatreObject.props[propTitle],
value: m.value, value: m.value,
}); });
break; break;
@ -899,7 +924,6 @@ const Audio = function(tp, record) {
layer, layer,
id: layer.id(), id: layer.id(),
title: propTitle, title: propTitle,
prop: layer.theatreObject.props[propTitle],
value: m.value, value: m.value,
}); });
break; break;
@ -907,13 +931,22 @@ const Audio = function(tp, record) {
default: default:
break; break;
} }
if (m.letterDelay) {
const pt = `letterDelays.${propTitle}`;
propsToSet.push({
layer,
id: layer.id(),
title: pt,
value: m.letterDelay,
});
}
}); });
} }
}); });
if (propsToSet.length > 0 && frameCount % 2 === 0) { if (propsToSet.length > 0 && frameCount % 2 === 0) {
// this is when to monitor live // this is when to monitor live
if (!record.isRecording()) { if (!record.isRecording()) {
if (!tp.core.val(tp.sheet.sequence.pointer.playing)) { //if (!tp.core.val(tp.sheet.sequence.pointer.playing)) {
let values = {}; let values = {};
propsToSet.forEach((p) => { propsToSet.forEach((p) => {
const newValues = { const newValues = {
@ -928,12 +961,10 @@ const Audio = function(tp, record) {
}; };
}); });
Object.keys(values).forEach((layerID) => { Object.keys(values).forEach((layerID) => {
window.debugPreValues = clone(values[layerID]);
deFlattenObject(values[layerID]); deFlattenObject(values[layerID]);
window.debugValues = clone(values[layerID]);
record.liveUpdater.immediateUpdate(getLayer(layerID), values[layerID]); record.liveUpdater.immediateUpdate(getLayer(layerID), values[layerID]);
}); });
} //}
} else { } else {
const position = tp.sheet.sequence.position; const position = tp.sheet.sequence.position;
propsToSet.forEach((p) => { propsToSet.forEach((p) => {