All checks were successful
ci/woodpecker/push/woodpecker Pipeline was successful
23 lines
1.2 KiB
JavaScript
23 lines
1.2 KiB
JavaScript
import 'htmx.org';
|
|
import '/src/htmx_import.js'
|
|
import AudioMotionAnalyzer from 'audiomotion-analyzer';
|
|
|
|
addEventListener("load", (_event) => {
|
|
const container = document.getElementById('audioContainer');
|
|
const audioSource = document.getElementById('player');
|
|
const audioMotion = new AudioMotionAnalyzer(container, { source: audioSource });
|
|
audioMotion.registerGradient('sandwich', {
|
|
dir: 'h', // add this property to create a horizontal gradient (optional)
|
|
colorStops: [ // list your gradient colors in this array (at least one color is required)
|
|
{ color: '#957b09', pos: .0 }, // use `level` to set the max bar amplitude (0 to 1) to use this color
|
|
{ color: '#f8d170', pos: .65 }, // in an object, use `pos` to adjust the offset (0 to 1) of a colorStop
|
|
]
|
|
});
|
|
audioMotion.setOptions({ source: audioSource, height: 256, overlay: true, bgAlpha: 0.0, showScaleX: false, gradient: 'sandwich', ledBars: true, mode: 7, reflexRatio: 0.5, reflexAlpha: 1.0, alphaBars: true, weightingFilter: '468', onCanvasDraw: drawCallback });
|
|
|
|
|
|
function drawCallback(instance, _info) {
|
|
const energy = instance.getEnergy() * 150;
|
|
document.documentElement.style.setProperty('--energy', energy + 'px');
|
|
}
|
|
});
|