Big changes

3 files changed, 54 insertions, 1 deletions

diff --git a/public/css/style.css b/public/css/style.css
index 1067840..386343b 100644
--- a/public/css/style.css
+++ b/public/css/style.css
@@ -2,5 +2,14 @@ body {
     font-family: Play, sans-serif;
     background-color: #212121;
     color: #ffffff;
-    margin-bottom: 100px;
+}
+
+ul.yt {
+    margin: 0 auto;
+    text-align: center;
+}
+
+li.yt-vid-list {
+    display: inline-block;
+    vertical-align: top;
 }
\ No newline at end of file
diff --git a/public/img/carousel/unicity.png b/public/img/carousel/unicity.png
new file mode 100644
index 0000000..de29b53
--- /dev/null
+++ b/public/img/carousel/unicity.png
diff --git a/public/js/yt-list-videos.js b/public/js/yt-list-videos.js
new file mode 100644
index 0000000..42deb0c
--- /dev/null
+++ b/public/js/yt-list-videos.js
@@ -0,0 +1,44 @@
+
+
+let channelID = 'UCNRn4YDPCCWSEl3CT7eWorA';
+let apiKey = ""; // Note to hide this
+let vidHeight = 400;
+let vidWidth = 500;
+let vidMaxResult = 5; // Maximum can be 50
+
+$(document).ready(function () {
+    $.get("https://www.googleapis.com/youtube/v3/channels", {
+            part: 'contentDetails',
+            id: channelID,
+            key: apiKey //Browser API Key
+        },
+        function (data) {
+            $.each(data.items, function (i, item) {
+                console.log(item); // See in Browser Console
+                pid = item.contentDetails.relatedPlaylists.uploads;
+                getVideos(pid);
+            })
+        }
+    );
+    function getVideos(pid)
+    {
+        $.get("https://www.googleapis.com/youtube/v3/playlistItems", {
+                part: 'snippet',
+                maxResults: vidMaxResult,
+                playlistId: pid,
+                key: apiKey //Browser API Key
+            },
+            function (data) {
+                let outputVideo;
+                $.each(data.items, function (i, item) {
+                    console.log(item); // See in Browser Console
+                    vidId = item.snippet.resourceId.videoId;
+                    outputVideo = '<li class="yt-vid-list"><iframe height="' + vidHeight + '" width="' + vidWidth + '" src=\"//www.youtube.com/embed/' + vidId + '"> </iframe></li>';
+
+                    //Append to result list
+                    $('#yt-results').append(outputVideo);
+                })
+            }
+        );
+    }
+});
\ No newline at end of file