if (this.Player == null) {
	this.Player = WaveSurfer.create({
		container: "#waveSurferPlayer", // this is a div
		waveColor: "red",
		progressColor: "blue",
		height: "22",
		barWidth: "2",
		barGap: "3",
		barRadius: "2",
		fillParent: true,
		responsive: true,
		normalize: true,
		hideScrollbar: true,
		cursorColor: "rgba(0,0,0,0)",
		backend: "MediaElement",
		mediaType: "audio",
		autoCenter: false,
	});
}

this.Player.unAll();

// play
this.Player.on("play", function (event) {
	console.log("wavesurfer.core.js", "play event triggered");
});

// pause
this.Player.on("pause", function (event) {
	console.log("wavesurfer.core.js", "pause event triggered");
});

// timeupdate
this.Player.on("audioprocess", function (e) {
	console.log("wavesurfer.core.js", "audioprocess event triggered " + e);
});

// ended
this.Player.on("finish", function (event) {
	console.log("wavesurfer.core.js", "finish event triggered");
});

// error
this.Player.on("error", function (event) {
	console.log("wavesurfer.core.js", "error event triggered");
});

this.Player.setOptions({
	barWidth: 0,
	barGap: 0,
	height: 0,
});
this.Player.load(this.TrackDetails.sampleUrl);

try {
	var waveSurferCoreReference = this;
	$.getJSON(this.TrackDetails.waveFormJSONUrl, function (data) {
		waveSurferCoreReference.TrackDetails.peaks = data.data;

		waveSurferCoreReference.Player.setOptions({
			height: "22",
			barWidth: "2",
			barGap: "3",
			peaks: waveSurferCoreReference.TrackDetails.peaks,
			duration: waveSurferCoreReference.GetDuration() // this uses my own duration if it exists, else fallback to wavesurfer duration
		});
	});
}
catch (err) { console.log("wavesurfer.core.js", "caught on render"); }

// some other stuff happens but eventually:

this.Player.on("ready", function (event) {
	console.log("wavesurfer.core.js", "ready event triggered");
	
	waveSurferCoreReference.Player.play();
});