010524 Login and Signup Pages done, with the API routes in the server…

… created. Pending improvements
XieKaiwen · May 1, 2024 · ff7b254 · ff7b254
commit ff7b254
Show file tree

Hide file tree

Showing 31 changed files with 11,077 additions and 0 deletions.
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,24 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
diff --git a/helperfunctions.js b/helperfunctions.js
@@ -0,0 +1,61 @@
+export function validateInputs(purpose, valStatus , email, password, confirmPassword, username, level){
+    // 1. validate email
+    const emailRegex = new RegExp(/^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/);
+    if(!emailRegex.test(email) || email.length > 320){ 
+        //if email does not follow the regex pattern, or longer than 320 characters (maximum length of an email)
+        valStatus = {
+            ...valStatus,
+            error: true,
+            emailError: "Email entered is not valid."
+        }
+    }     
+
+    if(purpose === "register"){
+        // 2. validate password
+        if(password != confirmPassword){
+            valStatus = {
+                ...valStatus,
+                error: true,
+                passwordError: "Passwords entered should be the same."
+            }
+        } else if(password.length < 8){
+            valStatus = {
+                ...valStatus,
+                error: true,
+                passwordError: "Password needs to be at least 8 characters."
+            }
+        }
+        // 3. validate username
+        if(username.length > 50){
+            valStatus = {
+                ...valStatus,
+                error: true,
+                usernameError: "Username cannot be longer than 50 characters."
+            }
+        } 
+        // 4. validate level input
+        if(level == ""){
+            // Tests if the level string only contains numbers
+            valStatus = {
+                ...valStatus,
+                error: true,
+                levelError: "Please choose a level for your account"
+            }
+        } else if (!(/^\d+$/.test(level))){
+            valStatus = {
+                ...valStatus,
+                error: true,
+                levelError: "Invalid level. Level should be numeric"
+            }
+        } else if (parseInt(level) < 1 || parseInt(level) > 12){
+            valStatus = {
+                ...valStatus,
+                error: true,
+                levelError: "Invalid level. Level cannot be less than 1 or more than 12"
+            }
+        }   
+    }
+
+    // 5. Return the valStatus
+    return valStatus;
+}
diff --git a/index.html b/index.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/penLogo.svg" />
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Merriweather:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400;1,700;1,900&family=Montserrat:ital,wght@0,100..900;1,100..900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap" rel="stylesheet">
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap" rel="stylesheet">
+    <link rel="stylesheet" href="/src/index.css">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>PaperDB</title>
+    <!--app-head-->
+  </head>
+  <body class="bg-gray-200 dark:bg-gray-800 font-sans">
+    <div id="root"><!--app-html--></div>
+    <script type="module" src="/src/entry-client.jsx"></script>
+  </body>
+</html>