7 files changed, 213 insertions, 0 deletions
diff --git a/webui/website/templates/404.html b/webui/website/templates/404.html
new file mode 100644
index 0000000..e207e9e
--- /dev/null
+++ b/webui/website/templates/404.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <title>Page Not Found</title>
+  <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='style.css') }}">
+</head>
+<body>
+  <div class="error-container">
+    <h1>404 - Page Not Found</h1>
+    <p>This feature will soon be added!</p>
+  </div>
+</body>
+</html>
+\ No newline at end of file
diff --git a/webui/website/templates/base.html b/webui/website/templates/base.html
new file mode 100644
index 0000000..ed37c38
--- /dev/null
+++ b/webui/website/templates/base.html
@@ -0,0 +1,70 @@
+<!DOCTYPE html>
+<html lang="en-us">
+    <head>
+        <meta charset="UTF-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <meta itemprop="name" content="Raspberry Pi Face Recognition">
+        <meta itemprop="description" content="My Mini Project">
+        <link rel="icon" type="image/png" sizes="32x32" href="{{ url_for('static', filename='favicon-32x32.png') }}">
+        <link rel="icon" type="image/png" sizes="16x16" href="{{ url_for('static', filename='favicon-16x16.png') }}">
+        <link rel="shortcut icon" type="image/x-icon" href="{{ url_for('static', filename='favicon.ico') }}">
+        <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='style.css') }}">
+        <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='style2.css') }}">
+        <link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='navbar.css') }}">
+        <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" crossorigin="anonymous">
+
+        <title>{% block title %}Raspberry Pi Face Recognition{% endblock %}</title>
+    </head>
+    <body>
+
+        <div class="topnav" id="myTopnav">
+            <a href="/" class="active">Home</a>
+            <a href="/live">Live-feed</a>
+            <a href="/login">Login</a>
+            <!-- <a href="/logout">Logout</a> -->
+            <a href="javascript:void(0);" class="icon" onclick="myFunction()">
+                <i class="fa fa-bars"></i>
+            </a>
+        </div>
+
+        <div class="container">{% block content %} {% endblock %}</div>
+        <div id="home-social">
+          <a href="https://github.com/justsaumit/opencv-face-recognition" target="_blank" rel="noopener">
+              <svg xmlns="http://www.w3.org/2000/svg" class="feather" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                <path d="M9 19c-5 1.5-5-2.5-7-3m14 6v-3.87a3.37 3.37 0 0 0-.94-2.61c3.14-.35 6.44-1.54 6.44-7A5.44 5.44 0 0 0 20 4.77 5.07 5.07 0 0 0 19.91 1S18.73.65 16 2.48a13.38 13.38 0 0 0-7 0C6.27.65 5.09 1 5.09 1A5.07 5.07 0 0 0 5 4.77a5.44 5.44 0 0 0-1.5 3.78c0 5.42 3.3 6.61 6.44 7A3.37 3.37 0 0 0 9 18.13V22"></path>
+              </svg>
+            </a>
+    </div>
+    <div id="home-footer">
+      <p>&copy; 2023
+        <a>TEAM 3 - Meer Junaid, Bikram Kumar Poddar, Saumit Dinesan</a>
+      </p>
+    </div>
+        <script
+          src="https://code.jquery.com/jquery-3.2.1.slim.min.js"
+          integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN"
+          crossorigin="anonymous"
+        ></script>
+        <script
+          src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"
+          integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q"
+          crossorigin="anonymous"
+        ></script>
+        <script
+          src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"
+          integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl"
+          crossorigin="anonymous"
+        ></script>
+        <script>
+          function myFunction() {
+            var x = document.getElementById("myTopnav");
+            if (x.className === "topnav") {
+              x.className += " responsive";
+            } else {
+              x.className = "topnav";
+            }
+          }
+        </script>
+        <script src="{{ url_for('static', filename='main.js') }}"></script>
+    </body>
+</html>
diff --git a/webui/website/templates/home.html b/webui/website/templates/home.html
new file mode 100644
index 0000000..a2c4191
--- /dev/null
+++ b/webui/website/templates/home.html
@@ -0,0 +1,19 @@
+{% extends "base.html" %}
+{% block title %}Raspberry Pi Face Recognition{% endblock %}
+
+{% block content %}
+<body id="page">
+
+    <div id="spotlight" class="animated fadeIn">
+        <div id="home-center">
+          <h1 id="home-title">Raspberry Pi Face Recognition</h1>
+          <p id="home-subtitle">This project aims to develop a portable and wireless Face Recognition System (FRS) using Raspberry Pi with a Camera Module attachment.</p>
+              <nav id="home-nav" class="site-nav">
+                  <a href="/live">Live-feed</a>
+                  <a href="/login">Login</a>
+              </nav>
+      </div>
+
+      
+
+{% endblock %}
+\ No newline at end of file
diff --git a/webui/website/templates/html.html b/webui/website/templates/html.html
new file mode 100644
index 0000000..8387ebb
--- /dev/null
+++ b/webui/website/templates/html.html
@@ -0,0 +1,44 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+    <link rel="stylesheet" href="css.css">
+</head>
+<body>
+    <div class="nav">
+        <input type="checkbox" id="nav-check">
+        <div class="nav-header">
+          <div class="nav-title">
+            MysteryCode
+          </div>
+        </div>
+        <div class="nav-btn">
+          <label for="nav-check">
+            <span></span>
+            <span></span>
+            <span></span>
+          </label>
+        </div>
+        
+        <div class="nav-links">
+            <ul>
+          <li><a href="#" target="_blank">Home</a></li>
+          <li><a href="#" target="_blank">About</a></li>
+          <li><a href="#" target="_blank">Services</a></li>
+          <li><a href="#" target="_blank">Portfolio</a></li>
+          <li><a href="#" target="_blank">Contact</a></li>
+          <a class="icon">
+            <i class="fa fa-twitter"></i>
+            <i class="fa fa-linkedin"></i>
+            <i class="fa fa-youtube"></i>
+
+          </a>
+            </ul>
+        </div>
+      </div>
+</body>
+</html>
+\ No newline at end of file
diff --git a/webui/website/templates/index2.html b/webui/website/templates/index2.html
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/webui/website/templates/index2.html
diff --git a/webui/website/templates/index3.html b/webui/website/templates/index3.html
new file mode 100644
index 0000000..1c33be9
--- /dev/null
+++ b/webui/website/templates/index3.html
@@ -0,0 +1,58 @@
+<!DOCTYPE html>
+<html lang="en-us">
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <meta http-equiv="X-UA-Compatible" content="ie=edge">
+  <meta itemprop="name" content="Raspberry Pi Face Recognition">
+  <meta itemprop="description" content="My Mini Project">
+
+  <link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png" />
+  <link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png" />
+  <link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
+  <link rel="stylesheet" type="text/css" href="style.css">
+  <link rel="stylesheet" type="text/css" href="style2.css">
+  <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
+  <title>Raspberry Pi Face Recognition</title>
+
+  <body id="page">
+      <div id="spotlight" class="animated fadeIn">
+          <div id="home-center">
+            <h1 id="home-title">Raspberry Pi Face Recognition</h1>
+            <p id="home-subtitle">This project aims to develop a portable and wireless Face Recognition System (FRS) using Raspberry Pi with a Camera Module attachment.</p>
+                <nav id="home-nav" class="site-nav">
+                    <a href="/live">Live-feed</a>
+                    <a href="/login">Login</a>
+                </nav>
+            <button id="button1" class="buttonclick" role="button">1.Input Face</button>
+            <button id="button2" class="buttonclick" role="button">2.Train Model</button>
+            <button id="button2" class="buttonclick" role="button">3.Face Recognizer</button>
+        </div>
+
+        <div id="home-social">
+            <a href="https://github.com/justsaumit/opencv-face-recognition" target="_blank" rel="noopener me" title="github">
+                <svg xmlns="http://www.w3.org/2000/svg" class="feather" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M9 19c-5 1.5-5-2.5-7-3m14 6v-3.87a3.37 3.37 0 0 0-.94-2.61c3.14-.35 6.44-1.54 6.44-7A5.44 5.44 0 0 0 20 4.77 5.07 5.07 0 0 0 19.91 1S18.73.65 16 2.48a13.38 13.38 0 0 0-7 0C6.27.65 5.09 1 5.09 1A5.07 5.07 0 0 0 5 4.77a5.44 5.44 0 0 0-1.5 3.78c0 5.42 3.3 6.61 6.44 7A3.37 3.37 0 0 0 9 18.13V22"></path></svg>
+            </a>
+	</div>
+
+         <div id="home-footer">
+            <p>&copy; 2023
+               <a href="https:&#x2F;&#x2F;draconyan.xyz&#x2F">TEAM 3- Meer Junaid, Bikram Kumar Poddar, Saumit Dinesan</a>
+               </a>
+            </p>
+         </div>
+	
+	<script src="main.js"></script>
+
+	<!-- Math rendering -->
+	<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/katex.min.css" integrity="sha384-zB1R0rpPzHqg7Kpt0Aljp8JPLqbXI3bhnPWROx27a9N0Ll6ZP/+DiW/UqRcLbRjq" crossorigin="anonymous">
+        <script defer src="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/katex.min.js" integrity="sha384-y23I5Q6l+B6vatafAwxRu/0oK/79VlbSz7Q9aiSZUvyWYIYsd+qj+o24G5ZU2zJz" crossorigin="anonymous"></script>
+        <script defer src="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/contrib/auto-render.min.js" integrity="sha384-kWPLUVMOks5AQFrykwIup5lo0m3iMkkHrD0uJ4H5cjeGihAutqP0yW0J6dpFiVkI" crossorigin="anonymous" onload="renderMathInElement(document.body, { delimiters: [ {left: '$$', right: '$$', display: true}, {left: '$', right: '$', display: false}, {left: '\\[', right: '\\]', display: true}, {left: '\\(', right: '\\)', display: false}]});"></script>
+        <link href="https://unpkg.com/highlightjs-badge/highlightjs/styles/railscasts.css" rel="stylesheet">
+	<script src="https://unpkg.com/highlightjs-badge/highlightjs/highlight.pack.js"></script>
+	<script src="https://unpkg.com/highlightjs-badge/highlightjs-badge.min.js"></script>
+	<script> var pres = document.querySelectorAll("pre>code"); for (var i = 0; i < pres.length; i++) { hljs.highlightBlock(pres[i]);}</script>
+	<script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.6/clipboard.min.js"></script>
+        <script>var options = {copyIconClass: "gg-clipboard",checkIconClass: "gg-check"};window.highlightJsBadge(options);</script>
+
+  </body>
+</html>
+\ No newline at end of file
diff --git a/webui/website/templates/live.html b/webui/website/templates/live.html
new file mode 100644
index 0000000..5d7d62f
--- /dev/null
+++ b/webui/website/templates/live.html
@@ -0,0 +1,9 @@
+{% extends "base.html" %}
+{% block title %}Live feed{% endblock %}
+{% block content %}
+<body id="page">
+    <div id="spotlight" class="animated fadeIn">
+        <h1>Hi<h1>
+      </div>
+
+{% endblock %}
+\ No newline at end of file