00:00/00:00

vol 🐇1.0X
	
const player      = document.getElementById('player');
const btnPlay     = document.getElementById('btnPlay');
const btnStop     = document.getElementById('btnStop');
const seekBar     = document.getElementById('seekBar');
const	curtimeText = document.getElementById("curtimeText");
const durtimeText = document.getElementById("durtimeText");
const speedBar    = document.getElementById('speedBar');
const speed       = document.getElementById('speed');
const plus        = document.getElementById('plus');
const minus       = document.getElementById('minus');
const mute        = document.getElementById('mute');


// player.controls = true;
const videoDuration = player.duration;
btnStop.innerHTML = 'STOP';
btnPlay.innerHTML = 'PLAY';

btnPlay.addEventListener('click', playVideo);
function playVideo(evt){
	if (player.paused) {
		player.play();
		btnPlay.innerText = 'PAUSE';
	}else{
		player.pause();
	  btnPlay.innerText = 'PLAY';
	}
}
btnStop.addEventListener('click', stopVideo);
function stopVideo(evt){
	player.pause();
	player.currentTime = 0;
	btnPlay.innerText = "PLAY";
}
// choix video speed:
speedBar.addEventListener('change', adjustSpeed);
function adjustSpeed(evt){
	// console.log(evt);             // voir methodes change
	console.log(speedBar.value); // or evt.target.value
	const currentPlayBackRate = evt.target.value;
	speed.innerText = currentPlayBackRate + "X";
	player.playbackRate = currentPlayBackRate;
}
// choix du passage video
seekBar.addEventListener('change', seekVideo);
function seekVideo(evt){

	player.currentTime = player.duration * (seekBar.value / 100);

}
// barre dynamique suivant la progression vidéo:
player.addEventListener('timeupdate', updateSeek);
function updateSeek(evt){

	seekBar.value = player.currentTime * (100 / player.duration);

	var curmins = Math.floor(player.currentTime / 60);
	var cursecs = Math.floor(player.currentTime - curmins * 60);
	var durmins = Math.floor(player.duration / 60);
	var dursecs = Math.floor(player.duration - durmins * 60);
	if (cursecs < 10) { cursecs = "0" + cursecs; }
	if (dursecs < 10) { dursecs = "0" + dursecs; }
	if (curmins < 10) { curmins = "0" + curmins; }
	if (durmins < 10) { durmins = "0" + durmins; }
	curtimeText.innerHTML = curmins + ":" + cursecs;
	durtimeText.innerHTML = durmins + ":" + dursecs;
}
// START setup params when video prête à être jouée:
player.addEventListener('canplay', setupPlayer);
function setupPlayer(evt){
	console.log('canplay');
	player.volume = 0.1;
}
// END event à la fin de la video:
player.addEventListener('ended', cleanPlayer);
function cleanPlayer(){
	if(player.paused){
		btnPlay.innerText = 'PLAY';
	}
}

// Volume Here:
plus.addEventListener('click', (evt)=>{
	if(player.volume < 0.9){
		player.volume += 0.1;
	}else{
		player.volume = 0.9;
	}
})
minus.addEventListener('click', (evt)=>{
	if(player.volume > 0){
		player.volume -= 0.1;
	}else{
		player.volume = 0;
	}
})
mute.addEventListener('click', (evt)=>{
	if(player.volume > 0){
		player.volume = 0;
		mute.innerHTML = 'volume-off';
	}else{
		player.volume = 0.1;
		mute.innerHTML = 'volume-up';
	}
})