diff --git a/bin/web/js/audio.js b/bin/web/js/audio.js index fe3af98..f39c8b0 100644 --- a/bin/web/js/audio.js +++ b/bin/web/js/audio.js @@ -448,18 +448,24 @@ const Audio = function(tp, record) { max_inputDom.addEventListener('change', updateMappingOptions); smoothing_inputDom.addEventListener('change', updateMappingOptions); let setFrequency = false; + let wasMoved = false; let freq_down = 0; let freq_up = 0; let xy_start; fft_Dom.addEventListener('mousedown', (e) => { setFrequency = true; + wasMoved = false; const bb = fft_imgDom.getBoundingClientRect(); const x = e.clientX - bb.x; const y = e.clientY - bb.y; - xy_start = {x, y}; + xy_start = { + x, + y + }; }); fft_Dom.addEventListener('mousemove', (e) => { if (setFrequency) { + wasMoved = true; const bb = fft_imgDom.getBoundingClientRect(); const x_factor = config.audio.fftBandsUsed / bb.width; const y_factor = 256.0 / bb.height; @@ -488,6 +494,20 @@ const Audio = function(tp, record) { }); const unset = (e) => { setFrequency = false; + if (!wasMoved) { + const bb = fft_imgDom.getBoundingClientRect(); + const x_factor = config.audio.fftBandsUsed / bb.width; + const y_factor = 256.0 / bb.height; + let min_x, max_x, min_y, max_y; + min_x = 0; + min_y = 0; + max_x = bb.width; + max_y = bb.height; + mappingOptions.min_freq = min_x * x_factor; + mappingOptions.max_freq = max_x * x_factor; + mappingOptions.min_in = (bb.height - max_y) * y_factor; + mappingOptions.max_in = (bb.height - min_y) * y_factor; + } }; const unsetFromOutside = (e) => { document.removeEventListener('mouseup', unsetFromOutside);