I want to build a video player on the html5 canvas here is my code

it is implelemented with promises i just do not know why it is not working.

```html






VideoPlayer





var player = new VideoPlayer(document.getElementById('player'));
player.load('video.mp4').then(function () {
player.play();
}).catch(console.error);
console.log(player)





```



VideoPlayer






var player = new VideoPlayer(document.getElementById('player'));

player.load('video.mp4').then(function () {

player.play();

}).catch(console.error);

console.log(player)






```

```js

function VideoPlayer(canvas) {
this._canvas = canvas;
this._player = null;
this._promise = null;
}

VideoPlayer.prototype.load = function (videoUrl) {
this._player = document.createElement('video');
this._player.src = videoUrl;
this._promise = new Promise(function (resolve, reject) {
this._player.onloadeddata = resolve;
this._player.onerror = reject;
}.bind(this));
return this._promise;
};

VideoPlayer.prototype.play = function () {
if (this._promise) {
this._promise.then(function () {
this._player.play();
}.bind(this));
}
};

VideoPlayer.prototype.pause = function () {
this._player.pause();
};

VideoPlayer.prototype.stop = function () {
this._player.pause();
this._player.currentTime = 0;
};

VideoPlayer.prototype.seekTo = function (time) {
this._player.currentTime = time;
};

VideoPlayer.prototype.getCurrentTime = function () {
return this._player.currentTime;
};

VideoPlayer.prototype.getDuration = function () {
return this._player.duration;
};

VideoPlayer.prototype.isPaused = function () {
return this._player.paused;
};

VideoPlayer.prototype.isEnded = function () {
return this._player.ended;
};

VideoPlayer.prototype.getVolume = function () {
return this._player.volume;
};

VideoPlayer.prototype.setVolume = function (volume) {
this._player.volume = volume;
};

VideoPlayer.prototype.mute = function () {
this._player.muted = true;
};

VideoPlayer.prototype.unmute = function () {
this._player.muted = false;
};

VideoPlayer.prototype.isMuted = function () {
return this._player.muted;
};

VideoPlayer.prototype.onPlay = function (callback) {
this._player.addEventListener('play', callback);
};

VideoPlayer.prototype.onPause = function (callback) {
this._player.addEventListener('pause', callback);
};

VideoPlayer.prototype.onStop = function (callback) {
this._player.addEventListener('pause', callback);
this._player.addEventListener('ended', callback);
};

VideoPlayer.prototype.onEnded = function (callback) {
this._player.addEventListener('ended', callback);
};

VideoPlayer.prototype.onSeeking = function (callback) {
this._player.addEventListener('seeking', callback);
};

VideoPlayer.prototype.onSeeked = function (callback) {
this._player.addEventListener('seeked', callback);
};

VideoPlayer.prototype.onError = function (callback) {
this._player.addEventListener('error', callback);
};

````