v1.txt

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Audio Spectrum Analyzer</title>
  <style>
    canvas {
      width: 100%;
      height: 200px;
      background-color: #f2f2f2;
    }
  </style>
</head>
<body>
  <input type="file" id="audioFileInput" accept="audio/*" />
  <canvas id="spectrumAnalyzer"></canvas>
  <button id="exportButton" disabled>Export Sound Data</button>

  <script>
    
    let capturedData = [];

   
    function convertToText(soundData) {
      let text = '';
      for (let i = 0; i < soundData.length; i++) {
        text += soundData[i] + '\n';
      }
      return text;
    }

    
    document.getElementById('audioFileInput').addEventListener('change', function(event) {
      const file = event.target.files[0];
      const reader = new FileReader();

      reader.onload = function(e) {
        const audioContext = new (window.AudioContext || window.webkitAudioContext)();
        const audioData = e.target.result;

        audioContext.decodeAudioData(audioData, function(buffer) {
          const source = audioContext.createBufferSource();
          source.buffer = buffer;

          
          const analyser = audioContext.createAnalyser();
          analyser.fftSize = 64; 

         
          source.connect(analyser);
          analyser.connect(audioContext.destination);

          
          const canvas = document.getElementById('spectrumAnalyzer');
          const canvasCtx = canvas.getContext('2d');
          const bufferLength = 32;
          const dataArray = new Uint8Array(bufferLength);

          
          function captureData() {
  analyser.getByteFrequencyData(dataArray);
  capturedData.push(...dataArray);
}

          
          function draw() {
            canvasCtx.clearRect(0, 0, canvas.width, canvas.height);

            analyser.getByteFrequencyData(dataArray);

            const barWidth = (canvas.width / bufferLength) * 2.5;
            let barHeight;
            let x = 0;

            for (let i = 0; i < bufferLength; i++) {
              barHeight = dataArray[i];

              canvasCtx.fillStyle = 'rgb(' + (barHeight + 100) + ',50,50)';
              canvasCtx.fillRect(x, canvas.height - barHeight / 2, barWidth, barHeight / 2);

              x += barWidth + 1;
            }

            setTimeout(function() {
              requestAnimationFrame(draw);
            }, 1000 / 30); // 30 FPS

          }

          
          source.start(0);
          setInterval(captureData, 1000 / 30); // 30 FPS
          draw();

          setTimeout(function() {
  document.getElementById('exportButton').disabled = false;
}, bufferLength / audioContext.sampleRate * 1000);


          document.getElementById('exportButton').addEventListener('click', function() {
            const textData = convertToText(capturedData);
            const blob = new Blob([textData], { type: 'text/plain' });
            const url = URL.createObjectURL(blob);
            const link = document.createElement('a');
            link.href = url;
            link.download = 'sound_data.txt';
            link.click();
          });
        });
      };

      reader.readAsArrayBuffer(file);
    });
  </script>
</body>
</html>