Starting with the Web Audio API

Created a web Audio analyser

by nedudi

HTML

<button id="play">play</button>

CSS

#play{
    display:none;
}

#play.ready{
    display: block;
}

JavaScript

var playButton = document.getElementById('play');

var url = 'https://api.soundcloud.com/tracks/119678644/stream?consumer_key=T8Yki6U2061gLUkWvLA';

// создаем аудио контекст
var context = new window.AudioContext(); //
// переменные для буфера, источника и получателя
var buffer, source, destination; 

// функция для подгрузки файла в буфер
var loadSoundFile = function(url) {
  // делаем XMLHttpRequest (AJAX) на сервер
  var xhr = new XMLHttpRequest();
  xhr.open('GET', url, true);
  xhr.responseType = 'arraybuffer'; // важно
  xhr.onload = function(e) {
    // декодируем бинарный ответ
    context.decodeAudioData(this.response,
    function(decodedArrayBuffer) {
      // получаем декодированный буфер
      buffer = decodedArrayBuffer;
      playButton.classList.add('ready');
    }, function(e) {
      console.log('Error decoding file', e);
    });
  };
  xhr.send();
}

// функция начала воспроизведения
var play = function(){
  // создаем источник
  source = context.createBufferSource();
  // подключаем буфер к источнику
  source.buffer = buffer;
  // дефолтный получатель звука
  destination = context.destination;
  // подключаем источник к получателю
  source.connect(destination);
  // воспроизводим
  source.start(0);
}

// функция остановки воспроизведения
var stop = function(){
  source.stop(0);
}

loadSoundFile(url);
playButton.addEventListener('click', play)