From eb487dea0a8b948db0cfc7c756381d8ca8b083c7 Mon Sep 17 00:00:00 2001
From: Keyemail <hatsunepatrick@gmail.com>
Date: Thu, 6 Jun 2024 15:16:55 -0700
Subject: [PATCH] Starting 404 for videos

---
 src/router/index.js      |  5 ++++-
 src/views/VideosPage.vue | 19 +++++++++++++++----
 2 files changed, 19 insertions(+), 5 deletions(-)

diff --git a/src/router/index.js b/src/router/index.js
index 6b48d1f..c48d193 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -25,15 +25,18 @@ const routes = [
   },
   {
     path: '/:pathMatch(.*)',
+    name: '404',
     component: notFoundPage
   },
   {
     path: '/videos',
+    name: 'video',
     component: videoView
   },
   {
     path: '/videos/:id',
-    component: videosView 
+    name: 'videos',
+    component: videosView
   }
 ]
 
diff --git a/src/views/VideosPage.vue b/src/views/VideosPage.vue
index 1ae5988..7d69f6a 100644
--- a/src/views/VideosPage.vue
+++ b/src/views/VideosPage.vue
@@ -1,8 +1,17 @@
 <template>
-  <h1>{{ video.videoName }}</h1>
-  <video controls>
-    <source :src="require('@/assets/' + video.path)" type="video/mp4">
-  </video>
+  <template v-if="notFound">
+    <div class="notFound">
+      <h1>404 Page</h1>
+      <p>This page has not been found, <router-link to="/">click here</router-link> to return back home.</p>
+    </div>
+  </template>
+  
+  <template v-else>
+    <h1>{{ video.videoName }}</h1>
+    <video controls>
+      <source :src="require('@/assets/' + video.path)" type="video/mp4">
+    </video>
+  </template>
 </template>
 
 <script>
@@ -12,11 +21,13 @@
     data () {
       return {
         video: null,
+        notFound: false
       }
     },
     created() {
       let videoID = this.$route.params.id;
       this.video = videoData.find(v => v.videoID === videoID);
+      console.log(this.notFound);
     }
   }
 </script>