Ok i know it’s not the begining but when i started this blog i already begin the challenge, so… i continue from this point.

The challenge is about a custom video player (thanks captain obvious…) and the custom control of it. We have the style already made and the objective is to add the JS.

This is the first time during the challenge that the JS is separate from the HTML.

It was the first time i have to deal with the video element so i learn a lot about it! Like the different event and methods associated with it.

const method = video.paused ? ‘play’ : ‘pause’; videomethod; The ternary operator give the method name for the video object (i like a lot!). Reminder : use the object as an array.

video.currentTime += parseFloat(this.dataset.skip); this.dataset.skip is a string so it has to be converted in a string.

video[this.name] = this.value; With the name corresponding to the video’s method we can simply use it for change the value.

progress.addEventListener(‘mousemove’, (e) => mousedown && scrub(e)); If the variable mousedown is true then the function scrub run.

PS : https://www.w3schools.com/tags/ref_av_dom.asp is (for me) a good reference if i want to have the Methods, Properties and Events for the video element.