Add News & Credits

js/ui.js

@@ -103,44 +103,57 @@ window.addEventListener('load', () => {
 window.addEventListener('load', () => {
     let modal = document.querySelector('#mod-vid');
     let vidLinks = Array.from(document.querySelectorAll('a[href="#open-vid"]'));
-    let source = document.querySelector('source');
-    let video = source.parentNode;
     /**
      * Dynamically change video source
      * Note naming convention...
      */
-    vidLinks.forEach(a => {
-        let aNodes = a.childNodes;
-        // Hacky??
-        let title = a.parentElement
-            .nextElementSibling
-            .firstElementChild
-            .innerHTML
-            .trim();
+    if (vidLinks.length) {
+        let source = document.querySelector('source');
+        let video = source.parentNode;
+        let overlay = document.querySelector('.modal-overlay');
 
-        a.addEventListener('click', () => {
-            aNodes.forEach(n => {
-
-                if (n.src) {
-                    let vStr = n.src
-                    .substr(n.src.lastIndexOf('/')+1, n.src.length)
-                    .replace(/thumb_(.*)\.\w+$/, 'vid_$1.mp4');
-                    
-                    source.src = `assets/video/${vStr}`;
-                    
-                    video.load();
-                }
+        vidLinks.forEach(a => {
+            let aNodes = a.childNodes;
+            // Hacky??
+            let title = a.parentElement
+                .nextElementSibling
+                .firstElementChild
+                .innerHTML
+                .trim();
+    
+            a.addEventListener('click', () => {
+                aNodes.forEach(n => {
+    
+                    if (n.src) {
+                        let vStr = n.src
+                        .substr(n.src.lastIndexOf('/')+1, n.src.length)
+                        .replace(/thumb_(.*)\.\w+$/, 'vid_$1.mp4');
+                        
+                        source.src = `assets/video/${vStr}`;
+                        
+                        video.load();
+                    }
+                });
+                
+                modal.classList.add('active');
+                document.querySelector('.modal-title').classList.add('roboto');
+                document.querySelector('.modal-title').innerHTML = title;
             });
-            
-            modal.classList.add('active');
-            document.querySelector('.modal-title').classList.add('roboto');
-            document.querySelector('.modal-title').innerHTML = title;
         });
-    });
+    
+        let close = document.querySelectorAll('#mod-vid a[href="#close"]')[1];
+    
+        close.addEventListener('click', () => {
+            modal.classList.remove('active');
+        });
 
-    let close = document.querySelectorAll('#mod-vid a[href="#close"]')[1];
+        /* Close the modal when clicking on the
+        *  overlay
+        */
+       overlay.addEventListener('click', () => {
+            modal.classList.remove('active');
+       })
 
-    close.addEventListener('click', () => {
-        modal.classList.remove('active');
-    });
-})
+    }
+
+});