Fork me on GitHub

Minimal Editor Example

One audio file with combined channel waveform visual and basic cursor selection for start

          
            var tracks = [
              {
                "src":"../media/Legend.mp3",
              }
            ];

            var container = document.getElementById("playlist");

            var config = new WaveformPlaylist.Config({
                resolution: 10000, //audio frames per pixel
                mono: true,
                container: container,
                state: 'cursor'
            });  

            var playlistEditor = Object.create(WaveformPlaylist, {
              config: {
                value: config
              }
            });
            playlistEditor.init(tracks);
          
        
          
            <div id="playlist" class="playlist">
              <div id="top-bar" class="playlist-top-bar">
                <div class="playlist-toolbar">
                  <div class="btn-group">
                    <span class="btn-pause btn btn-warning">
                      <i class="fa fa-pause"></i>
                    </span>
                    <span class="btn-play btn btn-success">
                      <i class="fa fa-play"></i>
                    </span>
                    <span class="btn-stop btn btn-danger">
                      <i class="fa fa-stop"></i>
                    </span>
                  </div>
                </div>
              </div>
              <div class="playlist-tracks"></div>
            </div>