add some todo and logic

js/main.js

@@ -1,13 +1,69 @@
 window.addEventListener("load", () => main());
 
 const main = () => {
-    const videoTree = {
-        1: "",
+    // 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);
 
-    const newElement = document.createElement("p");
-    newElement.textContent = "Hello world!";
-    mainElement.appendChild(newElement);
+    // 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 (let [key, value] of Object.entries(tree)) {
+    // key is the number (0, 1, 2)
+    // value is the [filename, extension]
+}
+*/