Skip to content
Snippets Groups Projects

Compare revisions

Changes are shown as if the source revision was being merged into the target revision. Learn more about comparing revisions.

Source

Select target project
No results found

Target

Select target project
No results found
Show changes
Hide whitespace changes
Inline Side-by-side
src/view/profil.php 0 → 100644
View file @ 20d8924a
<html>
<head>
<title>DAGO-JEK | Profil</title>
<link rel="stylesheet" type="text/css" href="/style.css">
</head>
<body>
<div class="container">
<div class="row">
<div class="col-3">Logo</div>
<div class="col-3 text-right">
<p>
Hi, <?=$user->username?><br>
Logout
</p>
</div>
</div>
<div class="row">
<div class="col-2 tab text-center">ORDER</div>
<div class="col-2 tab text-center">HISTORY</div>
<div class="col-2 tab text-center active">MY PROFILE</div>
</div>
<div class="row">
<div class="col-5"><h1>MY PROFILE</h1></div>
<div class="col-1 text-right">edit</div>
</div>
<div class="text-center">
<img class="img-circle" src="<?=$user->photo?>"/><br>
<h2>@<?=$user->username?></h2>
<p><?=$user->name?></p>
<?php if ($user->isDriver) : ?>
<p>Driver | <?=$driver_rating?> (<?=$driver_order?> vote<?=($driver_order>1)?'s':''?>)</p>
<?php else : ?>
<p>Non Driver</p>
<?php endif; ?>
<p><?=$user->email?></p>
<p><?=$user->phone?></p>
</div>
<div class="row">
<div class="col-5"><h2>PREFERED LOCATIONS</h2></div>
<div class="col-1 text-right">edit</div>
</div>
<div class="row">
<ul>
<li>Lokasi 1</li>
<li>Lokasi 2</li>
<li>Lokasi 3</li>
<li>Lokasi 4</li>
</ul>
</div>
</div>
</body>
</html>
\ No newline at end of file
src/view/register.html 0 → 100644
View file @ 20d8924a
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Register Page | Dagojek</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body id="register-body">
<div class="container">
<header id="register-header">
<h1>
Dagojek Register<br>
<small>Create New Account</small>
</h1>
</header>
<section id="register-main">
<div id="register-panel">
<form id="register-form" name="registerForm" method="post" action="../controller/RegisterController.php">
<fieldset>
<legend>Sign Up</legend>
<table>
<tr>
<td>
Name:
</td>
<td>
<input type="text" placeholder="Your name" id="name" name="name">
</td>
</tr>
<tr>
<td>
Username:
</td>
<td>
<input id="username" type="text" placeholder="Username" name="username">
</td>
</tr>
<tr>
<td>
Email:
</td>
<td>
<input id="email" type="email" placeholder="Email address" name="email">
</td>
</tr>
<tr>
<td>
Password:
</td>
<td>
<input type="password" placeholder="Password" id="password" name="password">
</td>
</tr>
<tr>
<td>
Confirm Password:
</td>
<td>
<input type="password" placeholder="Confirm password" id="confirm-password" name="confirm-password">
</td>
</tr>
<tr>
<td>
Phone Number:
</td>
<td>
<input type="number" placeholder="Phone number" id="phone" name="phone">
</td>
</tr>
</table>
<input type="checkbox" value="is-driver" name="is_driver"> I want to be a driver as well!
<br>
<input id="sign-up-btn" type="submit" value="Sign up" disabled>
<br>
</fieldset>
</form>
</div>
</section>
<footer>
</footer>
</div>
<!-- Script -->
<script type="application/javascript" src="script.js"></script>
</body>
</html>
\ No newline at end of file
src/view/script.js 0 → 100644
View file @ 20d8924a
function checkAvailability(string, elmtID, dataCollection) {
var field = document.getElementById(elmtID);
if (string.length === 0) {
field.classList.remove("available");
field.classList.remove("unavailable");
return;
} else {
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function () {
if (this.readyState === 4 && this.status === 200) {
if (this.responseText === "available") {
field.classList.remove("unavailable");
field.classList.add("available");
} else {
field.classList.remove("available");
field.classList.add("unavailable");
}
}
};
xmlhttp.open("GET", dataCollection + "?q=" + string, true);
xmlhttp.send();
}
}
function checkRequiredField(elmtID) {
var field = document.getElementById(elmtID);
if (field.value === "") {
field.classList.add("empty-required");
return false;
} else {
field.classList.remove("empty-required");
return true;
}
}
var isNameFilled = false;
var isUsernameFilled = false;
var isPasswordFilled = false;
var isEmailFilled = false;
var isPhoneFilled = false;
var isPasswordMatch = false;
var isUsernameAvailable = false;
var isEmailAvailable = false;
document.getElementById("confirm-password").onkeyup = function () {
var confirmField = document.getElementById("confirm-password");
var passwordField = document.getElementById("password");
if (confirmField.value !== passwordField.value) {
confirmField.classList.add("not-match");
passwordField.classList.add("not-match");
isPasswordMatch = false;
} else {
confirmField.classList.remove("not-match");
passwordField.classList.remove("not-match");
isPasswordMatch = true;
}
};
document.getElementById("name").onkeyup = function () {
isNameFilled = checkRequiredField("name");
};
document.getElementById("username").onkeyup = function () {
isUsernameFilled = checkRequiredField("username");
checkAvailability(this.value, "username", '../controller/UsernameValidationController.php');
isUsernameAvailable = this.classList.contains("available");
};
document.getElementById("password").onkeyup = function () {
isPasswordFilled = checkRequiredField("password");
};
document.getElementById("email").onkeyup = function () {
isEmailFilled = checkRequiredField("email");
checkAvailability(this.value, "email", '../controller/EmailValidationController.php');
isEmailAvailable = this.classList.contains("available");
};
document.getElementById("phone").onkeyup = function () {
isPhoneFilled = checkRequiredField("phone");
};
document.getElementById("register-form").onkeyup = function () {
var submitBtn = document.getElementById("sign-up-btn");
if (isNameFilled &&
isUsernameFilled &&
isPasswordFilled &&
isEmailFilled &&
isPhoneFilled &&
isPasswordMatch &&
isUsernameAvailable &&
isEmailAvailable) {
submitBtn.removeAttribute("disabled");
} else {
submitBtn.setAttribute("disabled", "true");
}
};
\ No newline at end of file
src/view/style.css 0 → 100644
View file @ 20d8924a
#login-body, #register-body {
background-color: #333333;
color: #ffffff;
}
#login-header, #register-header {
text-align: center;
margin-top: 50px;
}
#login-main, #register-main {
horiz-align: center;
width: 25%;
height: 60%;
margin: 0 auto;
}
#register-link {
float: right;
color: #f4df42;
margin-top: 0.3em;
}
.available {
background-color: greenyellow;
}
.unavailable, .empty-required, .not-match {
background-color: orangered;
}
.not-match::-webkit-input-placeholder, .empty-required::-webkit-input-placeholder, .unavailable::-webkit-input-placeholder {
color: whitesmoke;
}
input {
margin-top: 5px;
margin-bottom: 5px;
}
\ No newline at end of file