connected frontend to backend

MSU-AI · Feb 27, 2023 · a98ac7a · a98ac7a
1 parent 8ad7c8b
commit a98ac7a
Show file tree

Hide file tree

Showing 24 changed files with 87 additions and 675 deletions.
diff --git a/Frontend/assets/output.json b/Frontend/assets/output.json
diff --git a/Frontend/assets/video.mp4 b/Frontend/assets/video.mp4
diff --git a/Frontend/background.js b/Frontend/background.js
diff --git a/Frontend/home.css b/Frontend/home.css
diff --git a/Frontend/images/Extended-logo.png b/Frontend/images/Extended-logo.png
diff --git a/Frontend/images/Logo-16.png b/Frontend/images/Logo-16.png
diff --git a/Frontend/images/Logo-32.png b/Frontend/images/Logo-32.png
diff --git a/Frontend/images/Logo.png b/Frontend/images/Logo.png
diff --git a/Frontend/images/OldSchoolCamera.png b/Frontend/images/OldSchoolCamera.png
diff --git a/Frontend/images/camera-light.png b/Frontend/images/camera-light.png
diff --git a/Frontend/images/menu.png b/Frontend/images/menu.png
diff --git a/Frontend/Home.html → Frontend/templates/Frontend/Home.html b/Frontend/Home.html → Frontend/templates/Frontend/Home.html
@@ -1,17 +1,19 @@
+{% load static %}
+
 <!DOCTYPE html>
 <html>
 <head>
-  <link rel="icon" type="image/png" href="images/Logo-32.png" sizes="32x32" />
-  <link rel="icon" type="image/png" href="images/Logo-16.png" sizes="16x16" />
+  <link rel="icon" type="image/png" href="{% static 'images/Logo-32.png' %}" sizes="32x32" />
+  <link rel="icon" type="image/png" href="{% static 'images/Logo-16.png' %}" sizes="16x16" />
 
-  <link href="https://cdn.quilljs.com/1.3.6/quill.snow.css" rel="stylesheet">
-  <link rel="stylesheet" href="home.css">
+  <link href="{% static 'https://cdn.quilljs.com/1.3.6/quill.snow.css' %}" rel="stylesheet">
+  <link rel="stylesheet" href="{% static 'css/home.css'%}">
   <title>Transcript-Home</title>
 </head>
 <body>
   <div id="navbar">
     <nav>
-        <img src="images/Extended-logo.png" class="logo">
+        <img src="{% static 'images/Extended-logo.png'%}" class="logo">
         <ul>
             <li><a href="">About</a></li> 
             <!-- <div class="login">
@@ -24,9 +26,10 @@
     </nav>
   </div>
 
+
   <div class="camera-container">
-    <img src="images/OldSchoolCamera.png" class="camera">
-    <img src="images/camera-light.png" class="light">
+    <img src= "{% static 'images/OldSchoolCamera.png' %}" class="camera">
+    <img src="{% static 'images/camera-light.png' %}" class="light">
   </div>
 
 
@@ -35,12 +38,14 @@
     <div class="text-container">
       <h1>Revolutionizing <br> Video Editing</h1>
       <p>Using the latest AI technology we provide a new and improved way to edit your videos.</p>
-      <a href="video-editing.html">Upload your video</a>
+      <a href={% url 'index2' %}>Upload your video</a>
     </div>
 
     <!-- <button id="center-button">Click Me</button> -->
     <div id="editor"></div>
   </div>
+
+
 
   <!-- <script src="https://cdn.quilljs.com/1.3.6/quill.js"></script>
   <script>

diff --git a/Frontend/video-editing.html → ...end/templates/Frontend/video-editing.html b/Frontend/video-editing.html → ...end/templates/Frontend/video-editing.html
@@ -1,10 +1,12 @@
+{% load static%}
+
 <html>
   <head>
-    <link rel="icon" type="image/png" href="images/Logo-32.png" sizes="32x32" />
-    <link rel="icon" type="image/png" href="images/Logo-16.png" sizes="16x16" />
+    <link rel="icon" type="image/png" href="{% static 'images/Logo-32.png'%}" sizes="32x32" />
+    <link rel="icon" type="image/png" href="{% static 'images/Logo-16.png'%}" sizes="16x16" />
 
-    <link rel="stylesheet" href="video-editing.css">
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css"/>
+    <link rel="stylesheet" href="{% static 'css/video-editing.css'%}">
+    <link rel="stylesheet" href="{% static 'https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css'%}"/>
 
     <title>Transcript-Editing</title>
   </head>
@@ -13,8 +15,8 @@
     <div id="wrapper">
       <header>Upload A Video File</header>
       <form method ="POST" enctype = "multipart/form-data">
-        <!-- {% csrf_token %} -->
-        <!-- {{ form.as_p }} -->
+         {% csrf_token %} 
+         {{ new_form.as_p }} 
         <input class="file-input" type="file" name="file" hidden>
         <i class="fas fa-cloud-upload-alt"></i>
         <p>Browse File to Upload</p>
@@ -85,8 +87,8 @@
 
       </div>
       </div>
-      <script src="upload-video.js"></script>
-      <script src="video-editing.js"></script>
+      <script src="{% static 'js/upload-video.js' %}"></script>
+      <script src="{% static 'js/video-editing.js' %}"></script>
 
 
 

diff --git a/Frontend/upload-video.js b/Frontend/upload-video.js