pushing changes and new content for testing

CityOfBoston · Jun 13, 2024 · 9603e2f · 9603e2f
1 parent 115ce81
commit 9603e2f
Show file tree

Hide file tree

Showing 4 changed files with 39 additions and 10 deletions.
diff --git a/content/FilmBurns2.mp4 b/content/FilmBurns2.mp4
diff --git a/content/Fire1.mp4 b/content/Fire1.mp4
diff --git a/content/Raindrops3.mp4 b/content/Raindrops3.mp4
diff --git a/index.html b/index.html
@@ -5,10 +5,10 @@
 
 <head>
   <link href="https://vjs.zencdn.net/8.10.0/video-js.css" rel="stylesheet" />
-
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <!-- If you'd like to support IE8 (for Video.js versions prior to v7) -->
   <!-- <script src="https://vjs.zencdn.net/ie8/1.1.2/videojs-ie8.min.js"></script> -->
-</head>
 <style>
   body {
       background: #091F2F;
@@ -30,20 +30,49 @@
         }
 
 </style>
+</head>
 
 <div id="video-container">
-  <video id="my_video_1" class="video-js vjs-default-skin" height=100% autoplay muted controls preload="auto" loop></video>
+  <video id="my_video_1" class="video-js vjs-default-skin" autoplay muted controls preload="auto" loop></video>
 </div>
 
 <script src="https://vjs.zencdn.net/8.10.0/video.min.js"></script>
 <script>
     document.addEventListener('DOMContentLoaded', function() {
-        const videoContainer = document.getElementById('my_video_1');
-        const videoSources = [
-            { src: "content/Arnie_Crying.gif", type: "image/gif" },
-            { src: "content/Arnie_Excited_Head_Shake.gif", type: "image/gif" },
-            { src: "content/BasketBall_Rewind.mp4", type: "video/mp4" },
-        ];
+        const videoContainer = 'my_video_1'
+        const repoOwner = 'CityOfBoston';
+        const repoName = 'doit-welcome-board';
+        const folderPath = 'content';
+        let videoSources = [];
+
+        fetch(`https://api.github.com/repos/${repoOwner}/${repoName}/contents/${folderPath}`)
+        .then(response => response.json())
+        .then(data => {
+          // TODO: we can change this but right now it's filtering out things that aren't .mp4 
+          const videoFiles = data.filter(file => file.type === 'file' && (file.name.endsWith('.mp4') || file.name.endsWith('.webm')));
+
+          videoFiles.forEach(file => {
+            const source = {
+              src: file.download_url,
+              type: `video/${file.name.split('.').pop()}`
+            };
+            videoSources.push(source);
+          });
+
+          console.log('Video Sources:', videoSources); 
+
+          playNextVideo();
+        })
+
+        .catch(error => {
+          console.error('Error fetching video files:', error);
+        });
+
+        // const videoSources = [
+        //     // { src: "content/Arnie_Crying.gif", type: "image/gif" },
+        //     // { src: "content/Arnie_Excited_Head_Shake.gif", type: "image/gif" },
+        //     { src: "content/BasketBall_Rewind.mp4", type: "video/mp4" },
+        // ];
 
         function playNextVideo() {
             const randomIndex = Math.floor(Math.random() * videoSources.length);
@@ -58,7 +87,7 @@
             });
         }
 
-        playNextVideo();
+        // playNextVideo();
     });
 </script>
 </body>