From 59f00564dda261d370b70480c52c3c06d412f011 Mon Sep 17 00:00:00 2001
From: mrschnei <mrschnei@umich.edu>
Date: Fri, 31 Jul 2020 17:20:42 -0400
Subject: [PATCH] Added UI for profile and manage org webpages. Updated
deleting account and org functions.
---
servicePoints/templates/create.html | 2 +-
servicePoints/templates/createOrg.html | 2 +-
servicePoints/templates/manageOrg.html | 184 +++++++++++++------
servicePoints/templates/userProfile.html | 214 ++++++++++++++++-------
servicePoints/views/accounts.py | 60 ++++---
5 files changed, 320 insertions(+), 142 deletions(-)
diff --git a/servicePoints/templates/create.html b/servicePoints/templates/create.html
index 0efc5bf..848c206 100644
--- a/servicePoints/templates/create.html
+++ b/servicePoints/templates/create.html
@@ -69,7 +69,7 @@
</div>
<div class="form-group">
<b>Email: </b>
- <input type="email" placeholder="Enter Email" name="email" class="form-control" required />
+ <input type="email" placeholder="Enter Email" name="email" class="form-control" required maxlength="40" />
</div>
<div class="form-group">
<b>Password: </b>
diff --git a/servicePoints/templates/createOrg.html b/servicePoints/templates/createOrg.html
index a97b40d..7ccbe03 100644
--- a/servicePoints/templates/createOrg.html
+++ b/servicePoints/templates/createOrg.html
@@ -74,7 +74,7 @@
</div>
<div class="form-group">
<b>Email: </b>
- <input type="email" placeholder="Enter Email" name="email" class="form-control" required />
+ <input type="email" placeholder="Enter Email" name="email" class="form-control" required maxlength="40" />
</div>
<div class="form-group">
<b>Password: </b>
diff --git a/servicePoints/templates/manageOrg.html b/servicePoints/templates/manageOrg.html
index a74df24..25eb2ac 100644
--- a/servicePoints/templates/manageOrg.html
+++ b/servicePoints/templates/manageOrg.html
@@ -1,53 +1,139 @@
<!DOCTYPE html>
<html>
- <head>
- <a href="/">Home</a>
- </head>
- <head>
- <link rel="stylesheet" type="text/css" href="/css/style.css">
- <title>ServicePoints</title>
- </head>
-
- <body>
- <p>
- <form action="/accounts/manageOrg/" method="post" enctype="multipart/form-data">
- {{org}}
- <input type="hidden" name="org" value="{{org}}"/>
- <input type="submit" name="delete" value="delete your student org"/>
- </form>
- </p>
- <p>
- Pending Member Requests:
- </p>
- {% for member in pending %}
- <p>
- <form action="/accounts/manageOrg/" method="post" enctype="multipart/form-data">
- Name: {{member.fullname}}
- <br>Username: {{member.username}}
- <br>Email: {{member.email}}
- <br>Pre-Existing Hours: {{member.hours}}
- <input type="hidden" name="user" value="{{member.username}}"/>
- <input type="submit" name="add" value="Add Member"/>
- <input type="submit" name="deny" value="Deny Member"/>
- </form>
- </p>
- {% endfor %}
-
- <p>
- Current Members:
- </p>
- {% for member in members %}
- {% if username == member.username %}
- {{member.fullname}} ({{member.username}})
- {% else %}
- <p>
- <form action="/accounts/manageOrg/" method="post" enctype="multipart/form-data">
+<head>
+ <!-- Required meta tags -->
+ <meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+
+ <!-- Bootstrap CSS -->
+ <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
+
+ <title>Manage Org</title>
+</head>
+
+<body>
+
+ <div class="jumbotron text-center" style="margin-bottom:0; ">
+ <h1>ServicePoints!</h1>
+ <p>Connect with your Org</p>
+ </div>
+
+ <nav class="navbar navbar-expand-sm navbar-dark" style="background-color:#7952b3;">
+ <a class="navbar-brand" href="/">Home</a>
+ <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#collapsibleNavbar">
+ <span class="navbar-toggler-icon"></span>
+ </button>
+ <div class="collapse navbar-collapse" id="collapsibleNavbar">
+ <ul class="navbar-nav mr-auto">
+ <li class="nav-item">
+ <a class="nav-link" href="/accounts/blood/">Blood Drives</a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link" href="/accounts/food/">Food Drives</a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link" href="/accounts/mask/">Mask Making</a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link" href="/accounts/tutorsu/">Tutoring</a>
+ </li>
+ </ul>
+ <ul class="navbar-nav">
+ <li class="nav-item dropdown">
+ <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+ Settings
+ </a>
+ <div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdown">
+ <a class="dropdown-item" href="/accounts/profile/">View Profile</a>
+ <a class="dropdown-item" href="/accounts/manageOrg/">Manage Org</a>
+ <div class="dropdown-divider"></div>
+ <a class="dropdown-item" href="/accounts/logout/">Logout</a>
+ </div>
+ </li>
+ </ul>
+ </div>
+ </nav>
+
+
+ <div class="container" style="margin-top:30px">
+ <div class="row">
+ <div class="col-sm-8">
+ <h2>Manage Your Organization: {{org}} </h2>
+ <h4>Pending Member Requests:</h4>
+
+ {% for member in pending %}
+ <form action="/accounts/manageOrg/" method="post" enctype="multipart/form-data">
+ Name: {{member.fullname}}
+ <br>Username: {{member.username}}
+ <br>Email: {{member.email}}
+ <br>Pre-Existing Hours: {{member.hours}}
+ <input type="hidden" name="user" value="{{member.username}}" />
+ <input type="submit" name="add" value="Add Member" />
+ <input type="submit" name="deny" value="Deny Member" />
+ </form>
+ {% endfor %}
+ {% if not pending %}
+ No pending memberships
+ {% endif %}
+
+ <h4 style="margin-top:25px;">Current Members:</h4>
+
+ {% for member in members %}
+ {% if username == member.username %}
{{member.fullname}} ({{member.username}})
- <input type="hidden" name="user" value="{{member.username}}"/>
- <input type="submit" name="remove" value="remove from org"/>
- </form>
- </p>
- {% endif %}
- {% endfor %}
- </body>
+ {% else %}
+
+ <form action="/accounts/manageOrg/" method="post" enctype="multipart/form-data">
+ {{member.fullname}} ({{member.username}})
+ <input type="hidden" name="user" value="{{member.username}}" />
+ <input type="submit" name="remove" value="remove from org" />
+ </form>
+ {% endif %}
+ {% endfor %}
+
+ </div>
+ <div class="col-sm-4">
+ <div>
+ <h2>Your Info: </h2>
+ <p>Full Name: {{fullname}}</p>
+ <p>Username: {{username}}</p>
+ <p>Organization: {{org}}</p>
+ <p>Email: {{email}}</p>
+ <p>Hours: {{hours}}</p>
+ <hr class="d-sm-none">
+ </div>
+ <p>
+ <a class="btn btn-default btn-lg btn-block" href="" data-toggle="modal" data-target="#deleteModal" style="background-color:#03DAC6;">Delete Your Organization</a>
+ </p>
+ </div>
+ </div>
+ </div>
+
+ <div class="modal fade" id="deleteModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
+ <div class="modal-dialog" role="document">
+ <div class="modal-content">
+ <div class="modal-header">
+ <h4 class="modal-title" id="myModalLabel" style="text-align:center;">Are you sure you want to delete your student organization?</h4>
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+ <span aria-hidden="true">×</span>
+ </button>
+ </div>
+
+ <div class="modal-footer">
+ <button type="button" class="btn btn-secondary" data-dismiss="modal">No</button>
+ <a class="btn btn-primary" href="/accounts/deleteOrg/" role="button">Yes</a>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="jumbotron text-center" style="margin-bottom:0; ">
+ </div>
+ <!-- Optional JavaScript -->
+ <!-- jQuery first, then Popper.js, then Bootstrap JS -->
+ <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
+ <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
+ <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></script>
+
+</body>
</html>
diff --git a/servicePoints/templates/userProfile.html b/servicePoints/templates/userProfile.html
index fc2eae6..23e12e1 100644
--- a/servicePoints/templates/userProfile.html
+++ b/servicePoints/templates/userProfile.html
@@ -1,73 +1,161 @@
<!DOCTYPE html>
<html>
<head>
- <link rel="stylesheet" type="text/css" href="/css/style.css">
- <title>Profile</title>
+ <!-- Required meta tags -->
+ <meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+
+ <!-- Bootstrap CSS -->
+ <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
- <a href="/">Home</a>
- <a href="/accounts/logout/" style="float: right;">logout</a>
+ <title>Profile</title>
</head>
<body>
- <h1 style="text-align:center">Profile</h1>
-
-
- <p>
- Full Name: {{fullname}}
- </p>
- {% if pending == 0 %}
- <p>
- Student Organization: {{org}}
- </p>
- {%endif%}
- {% if pending == 1 %}
- <p>
- Student Organization: Your request is pending. Requesting to join another organization while your request is pending will cancel your original request.
- </p>
- {%endif%}
- </p>
- <p>
- Email: {{email}}
- </p>
- <a href="/accounts/delete/">delete account</a>
-
- {% if leader == 0 %}
- <form action="/accounts/profile/" method="post">
- <p>
- <label for="orgName">Select an Organization:</label>
- <select name="orgName" id="orgName">
- {% for org in orgs %}
- {% if org.orgName != 'NONE' %}
- <option value="{{org.orgName}}">{{org.orgName}}</option>
+
+ <div class="jumbotron text-center" style="margin-bottom:0; ">
+ <h1>ServicePoints!</h1>
+ <p>Connect with your Org</p>
+ </div>
+
+ <nav class="navbar navbar-expand-sm navbar-dark" style="background-color:#7952b3;">
+ <a class="navbar-brand" href="/">Home</a>
+ <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#collapsibleNavbar">
+ <span class="navbar-toggler-icon"></span>
+ </button>
+ <div class="collapse navbar-collapse" id="collapsibleNavbar">
+ <ul class="navbar-nav mr-auto">
+ <li class="nav-item">
+ <a class="nav-link" href="/accounts/blood/">Blood Drives</a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link" href="/accounts/food/">Food Drives</a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link" href="/accounts/mask/">Mask Making</a>
+ </li>
+ <li class="nav-item">
+ <a class="nav-link" href="/accounts/tutorsu/">Tutoring</a>
+ </li>
+ </ul>
+ <ul class="navbar-nav">
+ <li class="nav-item dropdown">
+ <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+ Settings
+ </a>
+ <div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdown">
+ <a class="dropdown-item" href="/accounts/profile/">View Profile</a>
+ {% if leader == 1 %}
+ <a class="dropdown-item" href="/accounts/manageOrg/">Manage Org</a>
+ {% endif %}
+ <div class="dropdown-divider"></div>
+ <a class="dropdown-item" href="/accounts/logout/">Logout</a>
+ </div>
+ </li>
+ </ul>
+ </div>
+ </nav>
+
+
+ <div class="container" style="margin-top:30px">
+ <div class="row">
+ <div class="col-sm-8">
+ <h2>Profile</h2>
+ {% if pending == 0 %}
+ <p>
+ Student Organization: {{org}}
+ </p>
{%endif%}
- {% endfor %}
- </select>
- <input type="submit" name="signup" value="Update Org" />
- </p>
- </form>
- <form action="/accounts/profile/" method="post">
- <p>
- <input type="submit" name="noOrg" value="Leave Organization Without Joining Another" />
- </p>
-</form>
- {% endif %}
-
- <form action="/accounts/profile/" method="post">
- <p>
- Change your full name:
- <input type="text" name="fullname" />
- <input type="submit" name="fullname" value="Change Full Name" />
- </p>
-
- </form>
-
- <form action="/accounts/profile/" method="post">
- <p>
- Change your email:
- <input type="text" name="email" />
- <input type="submit" name="email" value="Change Email" />
- </p>
-
- </form>
+ {% if pending == 1 %}
+ <p>
+ Student Organization: Your request is pending. Requesting to join another organization while your request is pending will cancel your original request.
+ </p>
+ {%endif%}
+
+ {% if leader == 0 %}
+ <form action="/accounts/profile/" method="post">
+ <p>
+ <label for="orgName">Select an Organization:</label>
+ <select name="orgName" id="orgName">
+ {% for org in orgs %}
+ {% if org.orgName != 'NONE' %}
+ <option value="{{org.orgName}}">{{org.orgName}}</option>
+ {%endif%}
+ {% endfor %}
+ </select>
+ <input type="submit" name="signup" value="Update Org" />
+ </p>
+ </form>
+ {% if org != 'NONE' %}
+ <form action="/accounts/profile/" method="post">
+ <p>
+ <input type="submit" name="noOrg" value="Leave Organization Without Joining Another" />
+ </p>
+ </form>
+ {% endif %}
+ {% endif %}
+
+ <form action="/accounts/profile/" method="post">
+ <p>
+ Change your full name:
+ <input type="text" name="fullname" required maxlength="30" />
+ <input type="submit" name="fullname" value="Change Full Name" />
+ </p>
+
+ </form>
+
+ <form action="/accounts/profile/" method="post">
+ <p>
+ Change your email:
+ <input type="email" name="email" required maxlength="40" />
+ <input type="submit" name="email" value="Change Email" />
+ </p>
+
+ </form>
+ </div>
+ <div class="col-sm-4">
+ <div>
+ <h2>Your Info: </h2>
+ <p>Full Name: {{fullname}}</p>
+ <p>Username: {{username}}</p>
+ <p>Organization: {{org}}</p>
+ <p>Email: {{email}}</p>
+ <p>Hours: {{hours}}</p>
+ <hr class="d-sm-none">
+ <p>
+ <a class="btn btn-default btn-lg btn-block" href="" data-toggle="modal" data-target="#deleteModal" style="background-color:#03DAC6;">Delete Account</a>
+ </p>
+ </div>
+ </div>
+ </div>
+ </div>
+
+
+ <div class="modal fade" id="deleteModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
+ <div class="modal-dialog" role="document">
+ <div class="modal-content">
+ <div class="modal-header">
+ <h4 class="modal-title" id="myModalLabel" style="text-align:center;">Are you sure you want to delete your account?</h4>
+ <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+ <span aria-hidden="true">×</span>
+ </button>
+ </div>
+
+ <div class="modal-footer">
+ <button type="button" class="btn btn-secondary" data-dismiss="modal">No</button>
+ <a class="btn btn-primary" href="/accounts/delete/" role="button">Yes</a>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <div class="jumbotron text-center" style="margin-bottom:0; ">
+ </div>
+ <!-- Optional JavaScript -->
+ <!-- jQuery first, then Popper.js, then Bootstrap JS -->
+ <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
+ <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
+ <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></script>
+
</body>
diff --git a/servicePoints/views/accounts.py b/servicePoints/views/accounts.py
index 38afb1d..7a90133 100644
--- a/servicePoints/views/accounts.py
+++ b/servicePoints/views/accounts.py
@@ -80,16 +80,17 @@ def create():
flask.session['password'] = flask.request.form['password']
pw = hash_pass(flask.session['password'])
+ cur = servicePoints.model.get_db()
data = (flask.session['username'], flask.session['fullname'],
flask.session['email'], 'NONE',
pw, 0)
- pendingData = (flask.session['username'], flask.session['fullname'],
- flask.session['email'], flask.session['orgName'], 0)
- cur = servicePoints.model.get_db()
cur.execute("INSERT INTO users(username, fullname, email, orgName, "
"password, hours) VALUES (?, ?, ?, ?, ?, ?)", data)
- cur.execute("INSERT INTO pendingOrgs(username, fullname, email, orgName, "
- "hours) VALUES (?, ?, ?, ?, ?)", pendingData)
+ if flask.session['orgName'] != 'NONE':
+ pendingData = (flask.session['username'], flask.session['fullname'],
+ flask.session['email'], flask.session['orgName'], 0)
+ cur.execute("INSERT INTO pendingOrgs(username, fullname, email, orgName, "
+ "hours) VALUES (?, ?, ?, ?, ?)", pendingData)
return flask.redirect(flask.url_for('index'))
@@ -242,16 +243,29 @@ def hash_pass(password_in):
@servicePoints.app.route('/accounts/delete/', methods=['GET', 'POST'])
def delete():
"""Render delete page."""
- if flask.request.method == 'POST':
- name = (flask.session['username'])
- to_add = (name,)
- cur = servicePoints.model.get_db()
+ name = (flask.session['username'])
+ to_add = (name,)
+ cur = servicePoints.model.get_db()
- flask.session.clear()
- cur.execute('DELETE FROM users WHERE username=?', to_add)
- return flask.redirect(flask.url_for('login'))
- context = {'username': flask.session['username']}
- return render_template('delete.html', **context)
+ flask.session.clear()
+ cur.execute('DELETE FROM users WHERE username=?', to_add)
+ return flask.redirect(flask.url_for('login'))
+
+@servicePoints.app.route('/accounts/deleteOrg/', methods=['GET', 'POST'])
+def deleteOrg():
+ """Render delete page."""
+ username = flask.session["username"]
+ cursor = servicePoints.model.get_db()
+ leaderCur = cursor.execute('SELECT orgName FROM orgs WHERE '
+ 'username =:who',
+ {"who": username})
+ results = leaderCur.fetchone()
+ orgName = results["orgName"]
+ cursor.execute("DELETE from orgs WHERE orgName = ?", (orgName,))
+ cursor.execute("UPDATE users SET orgName = 'NONE' WHERE orgName = ?", (orgName,))
+ cursor.execute("UPDATE requests SET leader = 'pending' WHERE leader = ?",
+ (username,))
+ return flask.redirect(flask.url_for('index'))
@servicePoints.app.route('/accounts/hourError/', methods=['GET', 'POST'])
def hourError():
@@ -381,7 +395,7 @@ def profile():
cur = cursor.execute("SELECT * FROM orgs")
username = flask.session['username']
orgs = cur.fetchall()
- cur = cursor.execute("SELECT fullname, email, orgName from users WHERE username = ?", (username,))
+ cur = cursor.execute("SELECT fullname, email, orgName, hours from users WHERE username = ?", (username,))
user = cur.fetchone()
studentOrgCur = cursor.execute('SELECT orgName, hours FROM users WHERE '
'username =:who',
@@ -395,13 +409,15 @@ def profile():
leader = 0
else:
leader = 1
+
cur = cursor.execute('SELECT * FROM pendingOrgs WHERE username =:who', {"who": username})
tryfetch = cur.fetchone()
if tryfetch is None:
pending = 0
else:
pending = 1
- context = {"orgs": orgs, "fullname": user["fullname"], "email": user["email"],
+
+ context = {"orgs": orgs, "fullname": user["fullname"], "email": user["email"], "username": username, "hours": results["hours"],
"org": user["orgName"], "leader": leader, "pending": pending}
return render_template('userProfile.html', **context)
@@ -567,18 +583,6 @@ def manageOrg():
if 'username' in flask.session:
username = flask.session["username"]
if flask.request.method == 'POST':
- if 'delete' in flask.request.form:
- cursor = servicePoints.model.get_db()
- leaderCur = cursor.execute('SELECT orgName FROM orgs WHERE '
- 'username =:who',
- {"who": username})
- results = leaderCur.fetchone()
- orgName = results["orgName"]
- cursor.execute("DELETE from orgs WHERE orgName = ?", (orgName,))
- cursor.execute("UPDATE users SET orgName = 'NONE' WHERE orgName = ?", (orgName,))
- cursor.execute("UPDATE requests SET leader = 'pending' WHERE leader = ?",
- (username,))
- return flask.redirect(flask.url_for('index'))
if 'add' in flask.request.form:
cursor = servicePoints.model.get_db()
leaderCur = cursor.execute('SELECT orgName FROM orgs WHERE '
--
GitLab