Compare commits

..

2 commits

2 changed files with 54 additions and 22 deletions

View file

@ -424,12 +424,12 @@ const Audio = function(tp, record) {
// otherwise the ui is not there // otherwise the ui is not there
if (layer.isSelected()) { if (layer.isSelected()) {
if (config.audio.colorSeparateRGBA && propTitle === 'color') { if (config.audio.colorSeparateRGBA && propTitle === 'color') {
delete canvasCombos[layer.id()]['color.r']; delete canvasCombos['color.r'];
delete canvasCombos[layer.id()]['color.g']; delete canvasCombos['color.g'];
delete canvasCombos[layer.id()]['color.b']; delete canvasCombos['color.b'];
delete canvasCombos[layer.id()]['color.a']; delete canvasCombos['color.a'];
} else { } else {
delete canvasCombos[layer.id()][propTitle]; delete canvasCombos[propTitle];
} }
const audioOptions = panel.querySelectorAll(toCssClass(`audioOptions${propTitle}`,'.')); const audioOptions = panel.querySelectorAll(toCssClass(`audioOptions${propTitle}`,'.'));
if (audioOptions.length > 0) { if (audioOptions.length > 0) {
@ -749,21 +749,41 @@ const Audio = function(tp, record) {
let x = 0; let x = 0;
let max_i = 0; let max_i = 0;
let max_ri = 0;
let total_v = 0;
let max_v = 0; let max_v = 0;
let min_v = 9999999; for (let k = 0; k < canvasKeys.length; k++) {
const layerID = canvasCombos[canvasKeys[k]][2];
const m = mapping[layerID][canvasKeys[k]];
m.max_v = max_v;
m.max_i = max_i;
m.max_ri = max_ri;
m.total_v = total_v;
}
for (let i = 0; i < w; i++) { for (let i = 0; i < w; i++) {
barHeight = dataArrayAlt[i]; barHeight = dataArrayAlt[i];
total_v += barHeight;
max_ri = barHeight * i;
if (barHeight > max_v) { if (barHeight > max_v) {
max_v = barHeight; max_v = barHeight;
max_i = i; max_i = i;
} }
if (barHeight < min_v) { for (let k = 0; k < canvasKeys.length; k++) {
min_v = barHeight; const layerID = canvasCombos[canvasKeys[k]][2];
const m = mapping[layerID][canvasKeys[k]];
let fillStyle = "rgb(200,200,200)"; // AUDIO COLOR
if (m.min_freq <= i && m.max_freq >= i) {
m.total_v += barHeight;
if (barHeight > m.max_v) {
m.max_v = barHeight;
m.max_i = i;
m.max_ri = barHeight * i;
} }
for (let i = 0; i < canvasKeys.length; i++) { fillStyle = "rgb(255,255,255)"; // AUDIO COLOR
canvasCombos[canvasKeys[i]][1].fillStyle = "rgb(200,200,200)"; // AUDIO COLOR }
canvasCombos[canvasKeys[i]][1].fillRect( canvasCombos[canvasKeys[k]][1].fillStyle = fillStyle;
canvasCombos[canvasKeys[k]][1].fillRect(
x, x,
h - (barHeight * verticalFactor), h - (barHeight * verticalFactor),
barWidth, barWidth,
@ -773,24 +793,28 @@ const Audio = function(tp, record) {
x += barWidth; x += barWidth;
} }
for (let i = 0; i < canvasKeys.length; i++) { max_ri /= total_v;
const layerID = canvasCombos[canvasKeys[i]][2]; for (let k = 0; k < canvasKeys.length; k++) {
const m = mapping[layerID][canvasKeys[i]]; const layerID = canvasCombos[canvasKeys[k]][2];
const m = mapping[layerID][canvasKeys[k]];
m.max_ri /= m.total_v;
if (m.sync === 'volume') { if (m.sync === 'volume') {
const sx = m.min_freq; const sx = m.min_freq;
const sw = m.max_freq - m.min_freq; const sw = m.max_freq - m.min_freq;
const sy = h - (m.max_in * verticalFactor); const sy = h - (m.max_in * verticalFactor);
const sh = (m.max_in - m.min_in) * verticalFactor; const sh = (m.max_in - m.min_in) * verticalFactor;
canvasCombos[canvasKeys[i]][1].strokeStyle = "rgb(255, 255, 255)"; // AUDIO COLOR canvasCombos[canvasKeys[k]][1].lineWidth = 1; // AUDIO COLOR
canvasCombos[canvasKeys[i]][1].strokeRect(sx, sy, sw, sh); canvasCombos[canvasKeys[k]][1].strokeStyle = "rgb(255,255,255)"; // AUDIO COLOR
canvasCombos[canvasKeys[k]][1].strokeRect(sx, sy, sw, sh);
} else if (m.sync === 'pitch') { } else if (m.sync === 'pitch') {
const m = mapping[layerID][canvasKeys[i]]; const m = mapping[layerID][canvasKeys[k]];
const sx = m.min_freq; const sx = m.min_freq;
const sw = m.max_freq - m.min_freq; const sw = m.max_freq - m.min_freq;
const sy = 0; const sy = 0;
const sh = h; const sh = h;
canvasCombos[canvasKeys[i]][1].strokeStyle = "rgb(255, 255, 255)"; // AUDIO COLOR canvasCombos[canvasKeys[k]][1].lineWidth = 1; // AUDIO COLOR
canvasCombos[canvasKeys[i]][1].strokeRect(sx, sy, sw, sh); canvasCombos[canvasKeys[k]][1].strokeStyle = "rgb(255,255,255)"; // AUDIO COLOR
canvasCombos[canvasKeys[k]][1].strokeRect(sx, sy, sw, sh);
} }
} }
const propsToSet = []; const propsToSet = [];
@ -800,7 +824,7 @@ const Audio = function(tp, record) {
const m = mapping[layer.id()][propTitle]; const m = mapping[layer.id()][propTitle];
switch (m.sync) { switch (m.sync) {
case 'volume': { case 'volume': {
let a = mapValue(max_v, m.min_in, m.max_in, m.min_out, m.max_out, true); let a = mapValue(m.max_v, m.min_in, m.max_in, m.min_out, m.max_out, true);
m.value = m.value * m.smoothing + (1.0 - m.smoothing) * a; m.value = m.value * m.smoothing + (1.0 - m.smoothing) * a;
propsToSet.push({ propsToSet.push({
layer, layer,
@ -812,7 +836,10 @@ const Audio = function(tp, record) {
break; break;
} }
case 'pitch': { case 'pitch': {
let a = mapValue(max_i, m.min_freq, m.max_freq, m.min_out, m.max_out, true); const mi = config.audio.ignoreOutboundFrequencies ? m.max_i : max_i;
const ri = config.audio.ignoreOutboundFrequencies ? m.max_ri : max_ri;
const fi = config.audio.pitchCombineFrequencies ? ri : mi;
let a = mapValue(fi, m.min_freq, m.max_freq, m.min_out, m.max_out, true);
m.value = m.value * m.smoothing + (1.0 - m.smoothing) * a; m.value = m.value * m.smoothing + (1.0 - m.smoothing) * a;
propsToSet.push({ propsToSet.push({
layer, layer,
@ -1012,6 +1039,9 @@ const Audio = function(tp, record) {
this.addAudioOptions = addAudioOptions; this.addAudioOptions = addAudioOptions;
this.removeAudioOptions = removeAudioOptions; this.removeAudioOptions = removeAudioOptions;
this.AudioMappingOptions = AudioMappingOptions; this.AudioMappingOptions = AudioMappingOptions;
// debug
this.canvasCombos = canvasCombos;
}; };
export { export {

View file

@ -89,6 +89,8 @@ const config = {
fftBandsUsed: 256 / 2, fftBandsUsed: 256 / 2,
fftHeight: 256 / 4, fftHeight: 256 / 4,
colorSeparateRGBA: true, colorSeparateRGBA: true,
ignoreOutboundFrequencies: true,
pitchCombineFrequencies: false,
}, },
record: { record: {
ignoreProps: ['transformOrigin', 'fontFamily', 'text', 'mirror_x', 'mirror_y', 'mirror_xy'], ignoreProps: ['transformOrigin', 'fontFamily', 'text', 'mirror_x', 'mirror_y', 'mirror_xy'],