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');
  }
});