70 lines
1.9 KiB
JavaScript
70 lines
1.9 KiB
JavaScript
window.addEventListener("load", () => main());
|
|
|
|
const main = () => {
|
|
// Video folder
|
|
const videoFolder = "./videos";
|
|
|
|
// Video list, as a list of ["filename", "extension"]
|
|
const videos = {
|
|
1: ["nameOfFirstVideo", "mp4"],
|
|
2: ["nameOfSecondVideo", "mp4"],
|
|
3: ["nameOfThirdVideo", "mp4"],
|
|
4: ["nameOfFourthVideo", "mp4"],
|
|
};
|
|
|
|
/* Add option for each videos
|
|
* For example:
|
|
* {
|
|
* 1: [2],
|
|
* 2: [3, 4]
|
|
* };
|
|
*
|
|
* The video 1 offer the option to redirect to the video 2
|
|
* The video 2 offer the option to redirect to the video 3 and 4 */
|
|
const tree = {
|
|
1: [2],
|
|
2: [3, 4],
|
|
};
|
|
|
|
// TODO: Add custom label for the button redirection
|
|
|
|
// Main Element who will receive the videos
|
|
const mainElement = document.getElementsByTagName("main").item(0);
|
|
|
|
// Current video showed to the user
|
|
let currentVideo;
|
|
|
|
// Buttons showed to the user
|
|
let buttons = [];
|
|
|
|
// Add property to the player
|
|
currentVideo = document.createElement("video");
|
|
currentVideo.controls = true;
|
|
currentVideo.width = window.innerWidth - window.innerWidth / 4;
|
|
currentVideo.style = "\
|
|
display: block; \
|
|
margin: auto;";
|
|
|
|
// Init the page with the first video
|
|
const source = document.createElement("source");
|
|
|
|
source.src = `${videoFolder}/${videos[1][0]}.${videos[1][1]}`;
|
|
source.type = `video/${videos[1][1]}`;
|
|
|
|
currentVideo.appendChild(source);
|
|
mainElement.appendChild(currentVideo);
|
|
|
|
// TODO: Add listener of the buttons
|
|
|
|
// TODO: Remove the current video and the buttons
|
|
|
|
// TODO: Add function who go to the next video (used by the button's listener)
|
|
|
|
/* Help for TODOs:
|
|
*
|
|
* for (let [key, value] of Object.entries(tree)) {
|
|
* // key is the number (0, 1, 2)
|
|
* // value is the [filename, extension]
|
|
* }
|
|
*/
|
|
};
|