'use strict';
let audio = document.getElementById('audio');
let file_path = audio.src;

var wavesurfer;

// Init & load
document.addEventListener('DOMContentLoaded', function() {
    // Create an instance
    var options = {
        container: '#waveform',
        waveColor: 'violet',
        progressColor: 'purple',
        loaderColor: 'purple',
        cursorColor: 'navy',
        plugins: [
            WaveSurfer.spectrogram.create({
                container: '#wave-spectrogram'
            })
        ]
    };

    wavesurfer = WaveSurfer.create(options);
    wavesurfer.load(file_path);
});

let play = document.getElementById('play').addEventListener('click', function() {
    wavesurfer.play();
});
let pause = document.getElementById('pause').addEventListener('click', function() {
    wavesurfer.pause();
});
let restart = document.getElementById('restart').addEventListener('click', function() {
    wavesurfer.play(0);
});