#2 Added functionality for user to signup as a Seller

controllers/web/user.py

@@ -3,6 +3,7 @@ from flask import Blueprint
 from flask import render_template, redirect, request, session, flash
 from controllers.database.user import UserController
 from models.users.customer import Customer
+from models.users.seller import Seller
 from hashlib import sha512
 
 # Blueprint to append user endpoints to
@@ -54,14 +55,27 @@ def signup():
         flash(error)
         return redirect("/signup")
 
-    database.create(Customer(
+    # Signup as seller or Customer
-        request.form['username'],
+    if request.form.get('seller'):
-        sha512(request.form['password'].encode()).hexdigest(), # Hashed as soon as it is recieved on the backend
+        user = Seller(
-        request.form['firstname'],
+            request.form['username'],
-        request.form['lastname'],
+            sha512(request.form['password'].encode()).hexdigest(), # Hashed as soon as it is recieved on the backend
-        request.form['email'],
+            request.form['firstname'],
-        "123"
+            request.form['lastname'],
-    ))
+            request.form['email'],
+            "123"
+        )
+    else:
+        user = Customer(
+            request.form['username'],
+            sha512(request.form['password'].encode()).hexdigest(), # Hashed as soon as it is recieved on the backend
+            request.form['firstname'],
+            request.form['lastname'],
+            request.form['email'],
+            "123"
+        )
+        
+    database.create(user)
 
     # Code 307 Preserves the original request (POST)
     return redirect("/login", code=307)

models/users/seller.py

@@ -9,6 +9,6 @@ class Seller(User):
     def __init__(self, username: str, password: str, firstname: str, 
                  lastname: str, email: str, phone: str):
         super().__init__(
-            id, username, password, firstname, lastname, email, phone, "Seller"
+            username, password, firstname, lastname, email, phone, "Seller"
         )
         self.store = ""

static/css/loginform.css

@@ -74,4 +74,69 @@ h2 {
     width:100%;
     padding:10px 0;
     border-radius: 0 0 4px 4px;
+}
+
+.checkbox {
+    display: block;
+    position: relative;
+    padding-left: 35px;
+    margin-bottom: 12px;
+    cursor: pointer;
+    font-size: 22px;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+}
+  
+/* Hide the browser's default checkbox */
+.checkbox input {
+    position: absolute;
+    opacity: 0;
+    cursor: pointer;
+    height: 0;
+    width: 0;
+}
+  
+/* Create a custom checkbox */
+.checkmark {
+    position: absolute;
+    height: 25px;
+    width: 25px;
+    background-color: #808080;
+}
+  
+/* On mouse-over, add a grey background color */
+.checkbox:hover input ~ .checkmark {
+    background-color: #ccc;
+}
+  
+/* When the checkbox is checked, add a blue background */
+.checkbox input:checked ~ .checkmark {
+    background-color: #2196F3;
+}
+  
+/* Create the checkmark/indicator (hidden when not checked) */
+.checkmark:after {
+    content: "";
+    position: absolute;
+    display: none;
+}
+
+/* Show the checkmark when checked */
+.checkbox input:checked ~ .checkmark:after {
+    display: block;
+}
+  
+/* Style the checkmark/indicator */
+.checkbox .checkmark:after {
+    left: 9px;
+    top: 5px;
+    width: 5px;
+    height: 10px;
+    border: solid white;
+    border-width: 0 3px 3px 0;
+    -webkit-transform: rotate(45deg);
+    -ms-transform: rotate(45deg);
+    transform: rotate(45deg);
 }

templates/signup.html

@@ -6,6 +6,10 @@
         <input type="text" id="username" name="username" placeholder="Username" required>
         <input type="email" id="email" name="email" placeholder="Email Address" required>
         <input type="password" id="password" name="password" minlength=8 placeholder="Password" required>
+        <label class="checkbox">Signup as a Seller?
+            <input type="checkbox" id="seller" name="seller"/>
+            <span class="checkmark"></span>
+        </label>
         <input type="submit" id="Sign Up" value="Sign Up">
     </form>