Skip to content
Snippets Groups Projects
Commit f895bd8a authored by Gustav Elmqvist's avatar Gustav Elmqvist
Browse files

merge

parents 3f61e860 1b5acb7b
No related branches found
No related tags found
No related merge requests found
......@@ -20,4 +20,8 @@
display: flex;
justify-content: space-between;
gap: 10px;
}
input[type=text]:focus {
background-color: white;
}
\ No newline at end of file
......@@ -8,7 +8,7 @@
<div class="welcome">
<img src="wimage.png" alt="logo and slogan">
<div class="form-elements" id="login">
<form id="loginform" onsubmit="return inputValidation()">
<form id="loginform">
<h2>Login</h2>
<div class="form-input">
<label for="email">Email</label>
......@@ -16,11 +16,12 @@
</div>
<div class="form-input">
<label for="password">Password</label>
<input type="text" id="password" name="password" size="18">
<input type="password" id="password" name="password" size="18">
</div>
<input type="submit" value="Login">
<div id="message"></div>
</form>
<form id="signupform" onsubmit="return inputValidation()">
<form id="signupform">
<h2>Sign up here</h2>
<div class="form-input">
<label for="fname">First name</label>
......@@ -53,19 +54,23 @@
</div>
<div class="form-input">
<label for="password">Password</label>
<input type="text" id="password" name="password" size="18">
<input type="password" id="password" name="password" size="18">
</div>
<div class="form-input">
<label for="password2">Repeat PSW</label>
<input type="text" id="password2" name="password2" size="18">
<input type="password" id="password2" name="password2" size="18">
</div>
<div class="form-input">
<input type="submit" value="Sign Up">
</div>
<div id="message"></div>
</form>
</div>
</div>
</script>
<script type="text/view" id="profileview">
<h1>lOGIN SIDA</h1>
</script>
</head>
<body style="background-color: antiquewhite;">
<div id="pagecontent">
......
class SignUp {
constructor(email, password, fname, lname, gender, city, country) {
this.email = email;
this.password = password;
this.firstname = fname;
this.familyname = lname;
this.gender = gender;
this.city = city;
this.country = country;
}
}
displayView = function() {
// the code required to display a view
};
......@@ -7,38 +20,95 @@ window.onload = function() {
// window alert() is not allowed to be used in your implementation.
//window.alert("Hello TDDD97!");
document.getElementById("pagecontent").innerHTML = document.getElementById("welcomeview").innerText;
var signupform = document.forms["signupform"]
var loginform = document.forms["loginform"];
var signupform = document.forms["signupform"];
signupform.addEventListener("submit", function(event) {
event.preventDefault();
inputValidation(event);
if(inputValidation("signupform")) {
var signupObject = new SignUp(signupform["email"].value,
signupform["password"].value,
signupform["fname"].value,
signupform["lname"].value,
signupform["gender"].value,
signupform["city"].value,
signupform["country"].value);
var message = serverstub.signUp(signupObject);
console.log(message);
if (!message.success) {
signupform["email"].value = "";
signupform["email"].setAttribute("placeholder", message.message);
} else {
document.getElementById("pagecontent").innerHTML = "";
document.getElementById("pagecontent").innerText = "";
document.getElementById("pagecontent").innerHTML = document.getElementById("profileview").innerText;
}
}
})
};
inputValidation = function(event) {
let allInputs = document.forms["signupform"].elements;
for(elem in allInputs) {
if(element.type === "text" && element.value === "") {
console.log("hejejeheh");
return false;
loginform.addEventListener("submit", function(event) {
event.preventDefault();
if (inputValidation("loginform")) {
var message = serverstub.signIn(loginform["email"].value, loginform["password"].value);
console.log(message);
if(!message.success) {
loginform["email"].value = "";
loginform["password"].value = "";
loginform["email"].setAttribute("placeholder", message.message);
} else {
document.getElementById("pagecontent").innerHTML = "";
document.getElementById("pagecontent").innerText = "";
document.getElementById("pagecontent").innerHTML = document.getElementById("profileview").innerText;
}
}
}
let emailText = document.forms["loginform"]["email"].value;
if (!validateEmail(emailText)) {
return false;
}
})
};
inputValidation = function(formID) {
var form = document.forms[formID];
let allInputs = form.querySelectorAll("input");
var valid = true;
allInputs.forEach(function(elem) {
if(elem.type === "text" && elem.value === "") {
elem.setAttribute("placeholder", "Don't leave blank");
valid = false;
} })
if (!validateEmail(form)) {
valid = false;
}
valid = validatePassword(form, formID);
return valid;
}
function validateEmail(input) {
function validateEmail(form) {
var validRegex = /\w+@\w+\.\w+/
if (input.value.match(validRegex)) {
alert("Valid email address!");
document.form1.text1.focus();
return true;
} else {
alert("Invalid email address!");
document.form1.text1.focus();
var email = form["email"];
if (!email.value.match(validRegex)) {
email.value = "";
email.setAttribute("placeholder", "Invalid email");
return false;
}
}
return true;
}
function validatePassword(form, formID) {
if(formID == "signupform" && form["password"].value != form["password2"].value) {
form["password"].value = "";
form["password2"].value = "";
form["password"].setAttribute("placeholder", "Passwords must match");
form["password2"].setAttribute("placeholder", "Passwords must match");
return false;
}
if(formID == "signupform" && form["password"].value.length < 8) {
form["password"].value = "";
form["password2"].value = "";
form["password"].setAttribute("placeholder", "Password must be 8 characters or longer");
return false;
}
if(formID == "loginform" && form["password"].value.length < 8) {
form["password"].value = "";
form["password"].setAttribute("placeholder", "Wrong password");
return false;
}
return true;
}
\ No newline at end of file
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment