From 29dc190d52f7da4bb8eb3944f6610e44055acb0f Mon Sep 17 00:00:00 2001
From: Lawrence Zawahri <louza078@student.liu.se>
Date: Tue, 8 Mar 2022 17:48:21 +0100
Subject: [PATCH] step 1 done
---
Lab_3/Twidder/database | 0
Lab_3/Twidder/database.db | Bin 16384 -> 16384 bytes
Lab_3/Twidder/server.py | 10 +-
Lab_3/Twidder/static/client.css | 2 +-
Lab_3/Twidder/static/client.js | 319 +++++++++++++++++------------
Lab_3/Twidder/static/serverstub.js | 2 +
6 files changed, 197 insertions(+), 136 deletions(-)
create mode 100644 Lab_3/Twidder/database
diff --git a/Lab_3/Twidder/database b/Lab_3/Twidder/database
new file mode 100644
index 0000000..e69de29
diff --git a/Lab_3/Twidder/database.db b/Lab_3/Twidder/database.db
index 8fe4ebebb2292c96f53f6a2c93251177c70eb068..b8863ccbb4f1c57137f8f44aa97d3cac6c1560e4 100644
GIT binary patch
delta 1012
zcmZo@U~Fh$oFL5@GEv5vHH1Mg+-qaX0)7cDzE=$VFZnO=@8+M#U&<fP@5wL4&%pO;
zv!K8>J{JC$3=$I^Me0SkID`fH`GxuUD;+99z&A0kvQmPRLtIc$kY7-+sK}uR3UooV
zE(eFOpt!uSykwR`Nmhwhenw(mNJf59UQ$keu5V(VPi9_renDnldT@DaN@|`6JIwe(
zhe8nWP0TAS6k&sjYGgTNfq-vfURIVAE7(?HLBW(1hZHFAP0RzaCQp<vmf+%F%fSDU
z|0Vx*{`36%`5*HC<Uh{8m4EGKL4}F@ChW|@jFk?RT%63}j9_PTf<&?$N;p7tp+g}%
zh|Y4zVgsoFTfsW{p}w+@3hxpI{^$JH_>c4N;9tr=oxg>@ls}C>lHZ-*f?t_mgrAk~
z8{ad&(|o)6*742fo4{Acm(Lf?=gMcsr@|-3$HDuH_ciYg-V?k#d6#S!6bRw17gk{r
z7M9O<$j^7k&q&QGIJ`6^Go4qNMOauEF36|EA}lPL=#U6jlaVE;$RaE(UFlE>=4Yj5
zWu)>dAao=;B=X3!2n!1)IV2@IBo?Re$f59LLA*qVM37v4ihvA@u&^YAn^>HZSe(Ku
z4KfQNQe0dtBE=#stO&Oa;zC6sNfu#Y*+PfHM2EzT^s=ms%Ccl$36Ms(N&#_@$q*&k
z8ENUsS-fH>3V20X>V<`cAs$O~NaPk_5f<i$TFfU5^)$$tDa9$0LM+0<+7L;IJK-ds
zAXF(NJc@Y*K-NHv%}CAS<%e=Xnu}9-`9NG~;MS*R3G+f@03r=Bm6r#k2qXduz%&7F
zkXN84Cg$WEUdqh{ax2snUQUo|C?_kOmjlFwsLo4I7GwuS7eux=F)gt;C5?v-6bJbZ
z`3d<B`Ne61tRNK-+cHwK6hMw<ftmpd-_$H#W)L^uAs@o!XJQc+7Kduc$Vx00XJio;
VR)@%Yq-H4;9A2uBl9{ex1OTE(6b=9Y
delta 119
zcmZo@U~Fh$oFL7}IZ?)$m6JiwL}6pf0)8GA{)r6yFZnO=@8+MlSy3UApN0PtgTzEf
zk;xO~i+Nc1A2RTN<bTQkkpJgqMTH*zi4$BWKh#%dW8{C%!2cX76euaq$RaGPp6`&K
U=#c1<nx#;1c&S24X1anA08vyV>Hq)$
diff --git a/Lab_3/Twidder/server.py b/Lab_3/Twidder/server.py
index c167af9..c345c92 100644
--- a/Lab_3/Twidder/server.py
+++ b/Lab_3/Twidder/server.py
@@ -9,9 +9,12 @@ import database_helper
# source "/Users/lorenzo/OneDrive - Linköpings universitet/Skola/DI3B/TDDD97/virtualenv/bin/activate"
# python3 server.py
-# http://127.0.0.1:5000/myServer'
+# http://127.0.0.1:5000/myServer
# sqlite3 database.db ".read schema.sql"
+#Questions:
+#Why does localhost in URL not work?
+
app = Flask(__name__, static_url_path = '/static')#in case flask does not recognize folder
app.debug = True
session = {'token':'email'}
@@ -92,6 +95,7 @@ def sign_up():
tmp = input_has_error('email')
if tmp[0]:
+ print(tmp[1])
return jsonify({}), tmp[1]
email = tmp[2]
@@ -156,17 +160,20 @@ def change_password():
# Validate Token
tmp = token_has_error(token)
if tmp[0]:
+ print("validate token")
return jsonify({}), tmp[1]
# Validate Old Password
tmp = input_has_error('old_password')
if tmp[0]:
+ print("validate old password")
return jsonify({}), tmp[1]
old_password = tmp[2]
# Validate New Password
tmp = input_has_error('new_password')
if tmp[0]:
+ print("validate new password")
return jsonify({}), tmp[1]
new_password = tmp[2]
@@ -177,6 +184,7 @@ def change_password():
if old_password == database_helper.find_user(email)[1]: #checks if old_password is correct
status = database_helper.update_user(new_password, email)
if status:
+ print("Password changed")
return jsonify({}), 204 # "Password has been changed!"
else:
return jsonify({}), 500 # "Password has not been changed"
diff --git a/Lab_3/Twidder/static/client.css b/Lab_3/Twidder/static/client.css
index 2dc5da1..ed4d8f6 100644
--- a/Lab_3/Twidder/static/client.css
+++ b/Lab_3/Twidder/static/client.css
@@ -109,7 +109,7 @@ h1, h3{
#error{
bottom: 20px;
- left:30px;
+ left: 4px;
color: rgb(252, 6, 170);
position: relative;
font-size: 12px;
diff --git a/Lab_3/Twidder/static/client.js b/Lab_3/Twidder/static/client.js
index 18db399..0a5fad9 100644
--- a/Lab_3/Twidder/static/client.js
+++ b/Lab_3/Twidder/static/client.js
@@ -4,22 +4,13 @@ var windowDiv;
var welcomeDiv;
var profileDiv;
var url = 'http://127.0.0.1:5000/myServer/';
+var curr_page = "";
// source "/Users/lorenzo/OneDrive - Linköpings universitet/Skola/DI3B/TDDD97/virtualenv/bin/activate"
-// - - - - - Init Request Objects - - - - - //
-
-//Todo (Lawrence)
-/*
- Sign up
- change password
- post message (+ updateWall)
- get message by token (+ kommentera fram stycke i reloadWall)
-*/
-// Todo - implement
-// Sign Up Request Object
+// - - - - - Init Request Objects - - - - - //
// Sign In Request Object
var signInRequest = new XMLHttpRequest();
@@ -32,28 +23,21 @@ signInRequest.onreadystatechange = function() {
let token = this.getResponseHeader("Authorization")
localStorage.setItem("currentUser", token);
- // Changes the view to profile view an loads user info
+ // Changes the view to profile view and loads user info
displayView();
-
setUserDetails("home");
- // Todo - kommentera fram när den är klar
- // reloadWall("home");
}
else if (this.status == 400) {
- // Todo - implement
- console.log('got this: 400')
+ errorMessage.innerHTML = "Error 400: Incorrect format";
}
else if (this.status == 404) {
- // Todo - implement
- console.log('got this: 404')
+ errorMessage.innerHTML = "Error 404: No user with that email exists";
}
else if (this.status == 401) {
- // Todo - implement
- console.log('got this: 401')
+ errorMessage.innerHTML = "Error 401: Incorrect password";
}
else {
- // Todo - implement
- console.log('unknown error -_-')
+ errorMessage.innerHTML = "Unknown error";
}
}
};
@@ -73,56 +57,79 @@ signOutRequest.onreadystatechange = function() {
displayView();
}
else if (this.status == 401) {
- // Todo - implement
- console.log('got this: 401')
+ console.log("Error 401: You are not loged in");
}
else {
- // Todo - implement
- console.log('unknown error -_-')
+ console.log("Unknown error");
}
}
};
+// Sign Up Request Object
var signUpRequest = new XMLHttpRequest();
-signInRequest.onreadystatechange = function () {
+signUpRequest.onreadystatechange = function () {
if (this.readyState == 4) {
let errorMessage = document.getElementById("error");
if (this.status == 204) {
- errorMessage.innerHTML = "You are signed in";
- let token = this.getResponseHeader("Authorization")
- localStorage.setItem("currentUser", token);
-
- // Changes the view to profile view an loads user info
- displayView();
-
- setUserDetails("home");
- // Todo - kommentera fram när den är klar
- // reloadWall("home");
+ errorMessage.innerHTML = "You have signed up";
}
else if (this.status == 400) {
// Todo - implement
- console.log('got this: 400')
+ errorMessage.innerHTML = "Enter the data in the correct format";
}
- else if (this.status == 404) {
+ else if (this.status == 401) {
// Todo - implement
- console.log('got this: 404')
+ errorMessage.innerHTML = "Enter the data in the correct format";
+ console.log('got this: 401');
}
- else if (this.status == 401) {
+ else if (this.status == 409) {
// Todo - implement
- console.log('got this: 401')
+ console.log('got this: 409');
}
+ else if (this.status == 500) {
+ // Todo - implement
+ console.log('got this: 500');
+ }
else {
// Todo - implement
- console.log('unknown error -_-')
+ console.log('unknown error -_-');
}
}
};
-// Todo - implement
// Change Password Request Object
+var ChangePassRequest = new XMLHttpRequest();
+ChangePassRequest.onreadystatechange = function () {
+ if (this.readyState == 4) {
+
+ let errorMessage = document.getElementById("match_error");
+ if (this.status == 204) {
+ console.log("inside 204 statement");
+ errorMessage.innerHTML = "Password has been changed!";
+ console.log('Password has been changed!');
+ }
+ else if (this.status == 400) {
+ // Todo - implement
+ console.log('got this: 400');
+ }
+ else if (this.status == 401) {
+ // Todo - implement
+ console.log('got this: 401');
+ }
+ else if (this.status == 500) {
+ // Todo - implement
+ console.log('got this: 500');
+ }
+ else {
+ // Todo - implement
+ console.log('unknown error -_-');
+ }
+ errorMessage.style.display = "block";
+ }
+};
-// Get use data by token
+// Get user data by token Request Object
var dataByTokenRequest = new XMLHttpRequest();
dataByTokenRequest.onreadystatechange = function() {
if (this.readyState == 4) {
@@ -140,27 +147,24 @@ dataByTokenRequest.onreadystatechange = function() {
userTable.rows[5].cells[1].innerHTML = userDataArray["data"].country;
localStorage.setItem("homeEmail", userDataArray["data"].email);
+ reloadWall("home");
}
else if (this.status == 401) {
- // Todo - implement
- console.log('got this: 401')
+ console.log("Error 401: You are not loged in");
}
else if (this.status == 400) {
- // Todo - implement
- console.log('got this: 400')
+ console.log("Error 400: Incorrect format");
}
else if (this.status == 404) {
- // Todo - implement
- console.log('got this: 404')
+ console.log("Error 404: No user with that email exists");
}
else {
- // Todo - implement
- console.log('unknown error -_-')
- }
+ console.log("Unknown error");
+ }
}
};
-// Get use data by email
+// Get user data by email Request Object
var dataByEmailRequest = new XMLHttpRequest();
dataByEmailRequest.onreadystatechange = function() {
if (this.readyState == 4) {
@@ -180,42 +184,67 @@ dataByEmailRequest.onreadystatechange = function() {
userTable.rows[5].cells[1].innerHTML = userDataArray["data"].country;
localStorage.setItem("browseEmail", userDataArray["data"].email);
+ errorMessage.iinnerHTML = ""
+ reloadWall("browse");
}
- else if (this.status == 401) {
- // Todo - implement
- console.log('got this: 401')
- //errorMessage.innerHTML = "something";
+ else {
+ if (this.status == 401) {
+ errorMessage.innerHTML = "Error 401: You are not loged in";
+ }
+ else if (this.status == 400) {
+ errorMessage.innerHTML = "Error 400: Incorrect format";
+ }
+ else if (this.status == 404) {
+ errorMessage.innerHTML = "Error 404: No user with that email exists";
+ }
+ else {
+ errorMessage.innerHTML = "Unknown error";
+ }
localStorage.setItem("browseEmail", "");
}
+ }
+};
+
+// Get Messages By Token Request Object
+var messagesByTokenRequest = new XMLHttpRequest();
+messagesByTokenRequest.onreadystatechange = function() {
+ if (this.readyState == 4) {
+
+ if (this.status == 200) {
+
+ let currentWall = JSON.parse(this.responseText);
+
+ // Fromating the text before putting to wall
+ let complete = "";
+ for (let i = 0; i < currentWall.data.length; i++) {
+ complete += currentWall.data[i].person_who_posted + ': ' + currentWall.data[i].message + "</br>";
+ }
+ document.getElementById('homePostedMessagesDiv').innerHTML = complete;
+ }
+ else if (this.status == 204) {
+ console.log("Success, but no messages to receive");
+ }
+ else if (this.status == 401) {
+ console.log("Error 401: You are not loged in");
+ }
else if (this.status == 400) {
- // Todo - implement
- console.log('got this: 400')
- localStorage.setItem("browseEmail", "");
+ console.log("Error 400: Incorrect format");
}
else if (this.status == 404) {
- // Todo - implement
- console.log('got this: 404')
- localStorage.setItem("browseEmail", "");
+ console.log("Error 404: No user with that email exists");
}
else {
- // Todo - implement
- console.log('unknown error -_-')
- localStorage.setItem("browseEmail", "");
+ console.log("Unknown error");
}
}
};
-// Todo - implement
-// Get Messages By Token Request Object
-
-
-
// Get Messages By Email Request Object
var messagesByEmailRequest = new XMLHttpRequest();
messagesByEmailRequest.onreadystatechange = function() {
if (this.readyState == 4) {
- if (this.status == 200 || this.status == 204) {
+ if (this.status == 200) {
let currentWall = JSON.parse(this.responseText);
@@ -225,30 +254,56 @@ messagesByEmailRequest.onreadystatechange = function() {
complete += currentWall.data[i].person_who_posted + ': ' + currentWall.data[i].message + "</br>";
}
document.getElementById('browsePostedMessagesDiv').innerHTML = complete;
- // Todo - implement
-
+
+ }
+ else if (this.status == 204) {
+ console.log("Success, but no messages to receive");
}
else if (this.status == 401) {
- // Todo - implement
- console.log('got this: 401')
+ console.log("Error 401: You are not loged in");
}
else if (this.status == 400) {
- // Todo - implement
- console.log('got this: 400')
+ console.log("Error 400: Incorrect format");
}
else if (this.status == 404) {
- // Todo - implement
- console.log('got this: 404')
+ console.log("Error 404: No user with that email exists");
}
else {
- // Todo - implement
- console.log('unknown error -_-')
+ console.log("Unknown error");
}
}
};
-// Todo - implement
// Post Message Request Object
+var postMessageRequest = new XMLHttpRequest();
+postMessageRequest.onreadystatechange = function () {
+ if (this.readyState == 4) {
+
+ let errorMessage = document.getElementById('searchMessage');
+ if (this.status == 204) {
+ console.log('Message posted!')
+ errorMessage.innerHTML = "";
+ if (curr_page != null && curr_page != "")
+ reloadWall(curr_page);
+ }
+ else if (this.status == 400) {
+ errorMessage.innerHTML = "Error 400: Incorrect format";
+ }
+ else if (this.status == 404) {
+ errorMessage.innerHTML = "Error 404: No user selected to write to";
+ }
+ else if (this.status == 401) {
+ errorMessage.innerHTML = "Error 401: You are not loged in";
+ }
+ else if (this.status == 500) {
+ errorMessage.innerHTML = "Error 500: Error at server side";
+ }
+ else {
+ errorMessage.innerHTML = "Unknown error";
+ }
+ }
+};
+
// - - - - - Init functions - - - - - //
@@ -260,12 +315,15 @@ displayView = function(){
windowDiv.innerHTML = profileDiv.innerHTML;
};
+
// - - - - - The function when page loads - - - - - //
window.onload = function () {
- // Todo - Delete when done - används för att hoppa tillbaka till rtt view under utveckling
- localStorage.setItem("currentUser", "");
+ // Delete when done - används för att hoppa tillbaka till rtt view under utveckling
+ // localStorage.setItem("currentUser", "");
+ // localStorage.setItem("homeEmail", "");
+ // localStorage.setItem("browseEmail", "");
// All key/value pairs stored in out localStorage
// If first time? check this:
@@ -285,7 +343,6 @@ window.onload = function () {
displayView();
// Load user details to home page and browse page
- // Todo - kan bli problem om dess inte innehåller giltig email
setUserDetails("home");
setUserDetails("browse");
};
@@ -317,9 +374,9 @@ function setUserDetails(who) {
dataByEmailRequest.send();
}
}
+ return false;
}
-
// - - - - - Sign Up/In/Out - - - - - //
function sign_up() {
@@ -337,6 +394,7 @@ function sign_up() {
repeat_password: form[7].value
};
+
// Error checks
if (user.password.length < minPassLength)
errorMess.innerHTML = "Password's length is too short";
@@ -344,28 +402,10 @@ function sign_up() {
errorMess.innerHTML = "Passwords does not match";
else {
- // // Todo
- // // Submission to "server"
- // let signUpObj = serverstub.signUp(user);
- // // Set message to user
- // errorMess.innerHTML = signUpObj["message"];
-
- //xhttp.addEventListener("load", reqListener);
- xhttp.open("POST", url + "sign_up", true);
- signInRequest.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
- xhttp.send(JSON.stringify({
- email: email,
- password: password,
- firstname: firstname,
- familyname: familyname,
- gender: gender,
- city: city,
- country: country
- }));
- // obj = JSON.parse(xhttp.responseText);
- // alert(obj.alert)
-//----------------//----------------//----------------//----------------
-
+ // Sending sign_ou request to "server"
+ signUpRequest.open("POST", url + "sign_up", true);
+ signUpRequest.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
+ signUpRequest.send(JSON.stringify(user));
}
return false;
}
@@ -397,6 +437,8 @@ function sign_out(){
signOutRequest.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
signOutRequest.setRequestHeader("Authorization", token)
signOutRequest.send();
+
+ return false;
}
@@ -425,6 +467,8 @@ function showPage(ourEvent, name) {
// Select only the one we want
let selected_tab = document.getElementById(name);
selected_tab.style.display = "block";
+
+ return false;
}
@@ -447,15 +491,12 @@ function change_password(ourEvent){
error_text.innerHTML = "New password and confirm password does not match";
}
else {
-
- // Todo
- // Success
- let message = serverstub.changePassword(token, old_pass, new_pass);
-
- // Set error text
- error_text.innerHTML = message["message"];
+ ChangePassRequest.open("PUT", url + "change_password", true);
+ ChangePassRequest.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
+ ChangePassRequest.setRequestHeader("Authorization", token)
+ ChangePassRequest.send(JSON.stringify({old_password:old_pass, new_password:new_pass}));
}
- error_text.style.display = "block";
+ return false;
}
// - - - - - Changing the wall - - - - - //
@@ -464,15 +505,27 @@ function change_password(ourEvent){
function updateWall(who){
// "who" could be either home or browse, this way know which wall to write on
let messageToWall = document.getElementById(who + 'Textarea').value;
+ let errorMessage = document.getElementById('searchMessage');
let token = localStorage.getItem("currentUser");
let email = localStorage.getItem(who + "Email");
+ curr_page = who;
- // Todo
- // Send user's message to the server
- serverstub.postMessage(token, messageToWall, email);
+ if (email != null && email != "" && token != null && token != "") {
+ // Send user's message to the server
+ postMessageRequest.open("POST", url + "post", true);
+ postMessageRequest.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
+ postMessageRequest.setRequestHeader("Authorization", token)
+ postMessageRequest.send(JSON.stringify({ email: email, message: messageToWall }));
+
+ errorMessage.innerHTML = "";
+ }
+ else{
+ errorMessage.innerHTML = "No user selected to write to";
+ }
+
+ // Clear the text area the user just wrote in
document.getElementById(who + 'Textarea').value = "";
-
return false;
}
@@ -482,18 +535,16 @@ function reloadWall(who) {
let token = localStorage.getItem("currentUser");
let email = localStorage.getItem(who + "Email");
- // Get messages from my own wall
+ // If wanting messages from my own wall
if (who == 'home') {
// Send request to server about receiving the info
-
- // Comment
- // messagesByTokenRequest.open("GET", url + "getUserMessageByToken/" + email, true);
- // messagesByTokenRequest.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
- // messagesByTokenRequest.setRequestHeader("Authorization", token)
- // messagesByTokenRequest.send();
+ messagesByTokenRequest.open("GET", url + "getUserMessageByToken", true);
+ messagesByTokenRequest.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
+ messagesByTokenRequest.setRequestHeader("Authorization", token)
+ messagesByTokenRequest.send();
}
- // Get messages from another's wall
+ // If wanting messages from another's wall
else if (who == 'browse' && email != null && email != "") {
// Send request to server about receiving the info
messagesByEmailRequest.open("GET", url + "getMessagesByEmail/" + email, true);
@@ -509,8 +560,8 @@ function reloadWall(who) {
function searchAnotherUser(event){
let token = localStorage.getItem("currentUser");
- // Todo - download the wall of the user we searched for ?
- // let user_obj = serverstub.getUserMessagesByEmail(token, email);
+ // Reseting the error messages
+ document.getElementById('searchMessage').innerHTML = "";
if(token != "") {
diff --git a/Lab_3/Twidder/static/serverstub.js b/Lab_3/Twidder/static/serverstub.js
index ad5c722..949405c 100644
--- a/Lab_3/Twidder/static/serverstub.js
+++ b/Lab_3/Twidder/static/serverstub.js
@@ -6,6 +6,8 @@
* If you're a student, you shouldn't need to look through this file,
* the description of how it works is in the lab instructions.
**/
+
+
var serverstub = (function() {
'use strict';
--
GitLab