Menambahkan login.php

PR-Ojek.sql

+-- Database PR-Ojek
+
+CREATE TABLE IF NOT EXISTS `user` (
+	`user_id`     INT         NOT NULL,
+    `name`        VARCHAR(50) NOT NULL,
+	`email`       VARCHAR(50) NOT NULL,
+	`phone`       VARCHAR(20) NOT NULL,
+    `username`    VARCHAR(50) NOT NULL,
+    `password`    VARCHAR(20) NOT NULL,
+    `status`      VARCHAR(10) NOT NULL,
+	`pict`        MEDIUMBLOB  DEFAULT NULL,
+
+	PRIMARY KEY (`user_id`)
+);
+
+LOCK TABLES `user` WRITE;
+
+INSERT INTO `user` VALUES ('1','Donald Trump','donaldducktrump@gmail.com','08136','donaldduck','123456','Not_Driver',DEFAULT);
+UNLOCK TABLES;
+
+CREATE TABLE IF NOT EXISTS `driver` (
+	`driver_id`     INT             NOT NULL,
+	`total_score`   DOUBLE(50,1)    NOT NULL,
+	`votes`         DOUBLE(50,1)    NOT NULL,
+
+	PRIMARY KEY (`driver_id`),
+	CONSTRAINT `driver_ibfk_1` FOREIGN KEY (`driver_id`) REFERENCES `user` (`user_id`)
+);
+
+CREATE TABLE IF NOT EXISTS `driver_prefloc` (
+	`driver_id`   INT         NOT NULL,
+    `pref_loc`    VARCHAR(50) NOT NULL,
+
+	PRIMARY KEY (`driver_id`),
+	CONSTRAINT `driver_prefloc_ibfk_1` FOREIGN KEY (`driver_id`) REFERENCES `driver` (`driver_id`)
+);
+
+CREATE TABLE IF NOT EXISTS `order` (
+	`order_id`       INT             NOT NULL,
+	`dest_city`     VARCHAR(50)     NOT NULL,
+	`pick_city`     VARCHAR(50)     NOT NULL,
+    `score`         DOUBLE(50,1)    NOT NULL,
+    `comment`       VARCHAR(140)    NOT NULL,
+    `driver_id`     INT             NOT NULL,
+    `cust_id`       INT             NOT NULL,
+    `date`          DATE            NOT NULL,
+
+	PRIMARY KEY (`order_id`),
+	CONSTRAINT `order_ibfk_1` FOREIGN KEY (`cust_id`) REFERENCES `user` (`user_id`),
+    CONSTRAINT `order_ibfk_2` FOREIGN KEY (`driver_id`) REFERENCES `driver` (`driver_id`)
+);

css/default_style.css

+body {
+	background-color: rgb(210,210,210);
+	color: rgb(250,250,250);
+}
+
+.frame {
+	border: 7px solid rgb(65,62,119);
+	border-radius: 25px;
+	background-color: rgb(92,88,138);
+	margin: 50px auto;
+}
+
+.frame h1,h2 {
+	text-align: center;
+}
+
+input{
+	width: 100%;
+	margin: 1px auto 15px;
+}
+
+input[type="checkbox"]{
+	width: 0;
+	margin-right: 10px;
+}
+
+a:link, a:visited {
+	color: rgb(250,250,250);
+	text-decoration: none;
+}
+
+a:hover {
+	color: rgb(167,180,4);
+}

css/login.css

+#login_frame {
+    height: 550px;
+    width: 400px;
+}
+
+#login_frame > div {
+	left: 10%;
+	width: 80%;
+	height: auto;
+	position: relative;
+}
+
+#login_frame input[type="submit"] {
+    border-radius: 40px;
+    background-color: rgb(191,216,255);
+    padding: 5px 3px;
+    display: block;
+    width: 30%;
+    border : none;
+    cursor : pointer;
+    margin: 0 auto 15px;
+}
+
+#login_frame input[type="submit"]:hover {
+    opacity: 0.6;
+}
+
+#sign_up_frame {
+	width: 400px;
+	height: 550px;
+}
+
+#sign_up_frame input[type="submit"] {
+    border-radius: 40px;
+    background-color: rgb(191,216,255);
+    padding: 5px 3px;
+    display: block;
+    width: 30%;
+    border : none;
+    cursor : pointer;
+    margin: 0 auto 15px;
+}
+
+#sign_up_frame input[type="submit"]:hover {
+    opacity : 0.6;
+}
+
+#sign_up_frame > div {
+	left: 10%;
+	width: 80%;
+	height: auto;
+	position: relative;
+}

css/main.css

+body {
+	background-color: rgb(210,210,210);
+	color: rgb(250,250,250);
+}
+
+.frame {
+	border: 7px solid rgb(65,62,119);
+	border-radius: 25px;
+	background-color: rgb(92,88,138);
+	margin: 50px auto;
+}
+
+#login_frame {
+	height: 550px;
+	width: 400px;
+}
+
+.frame > h1 {
+	text-align: center;
+}
+
+#login_frame > div {
+	left: 10%;
+	width: 80%;
+	height: auto;
+	position: relative;
+}
+
+input{
+	width: 100%;
+	margin: 1px auto 15px;
+}
+
+#login_frame input[type="submit"] {
+    border-radius: 40px;
+    background-color: rgb(191,216,255);
+    padding: 5px 3px;
+	display: block;
+	width: 30%;
+    border : none;
+    cursor : pointer;
+	margin: 0 auto 15px;
+}
+
+#login_frame input[type="submit"]:hover {
+    opacity: 0.6;
+}
+
+#sign_up_frame {
+	width: 400px;
+	height: 550px;
+}
+
+input[type="checkbox"]{
+	width: 0;
+	margin-right: 10px;
+}
+
+#sign_up_frame input[type="submit"] {
+    border-radius: 40px;
+    background-color: rgb(191,216,255);
+    padding: 5px 3px;
+    display: block;
+    width: 30%;
+    border : none;
+    cursor : pointer;
+    margin: 0 auto 15px;
+}
+
+#sign_up_frame input[type="submit"]:hover {
+    opacity : 0.6;
+}
+
+#sign_up_frame > div {
+	left: 10%;
+	width: 80%;
+	height: auto;
+	position: relative;
+}
+
+a:link, a:visited {
+	color: rgb(250,250,250);	
+}
+
+a:hover {
+	color: rgb(167,180,4);
+}

index.php

+<?php
+    
+    header( 'Location: login/login.html' ) ;
+    
+?>

login/login.html

+<!DOCTYPE html>
+<html>
+    <head>
+        <title>Login to OneHundred</title>
+        <link rel="stylesheet" type="text/css" href="../css/default_style.css">
+            <link rel="stylesheet" type="text/css" href="../css/login.css">
+    </head>
+    <body>
+        <div id="login_frame" class="frame">
+            <h1>Welcome to PR-Ojek<img src="../img/logo.png" style="width: 70px;height: 50px;float: right"></h1>
+            <p style="text-align: center">"An ojek for anything you need"</p>
+            <br/><br/>
+            <h2>--- Login ---</h2>
+            <p id="error_credential" style="text-align: center;"></p>
+            <div>
+                <form name="login" method="POST" action="login.php" onsubmit="return validate();">
+                    Username
+                    <input type="text" name="user_name"><br/>
+                            
+                    Password
+                    <input type="Password" name="user_password"><br/>
+                                
+                    <input type="submit" value="Login" >
+                </form>
+                    
+                <a href="sign_up.html">Don't have an account?</a><br/>
+            </div>
+        </div>
+        <script>
+            function validate()
+            {
+                var username = document.login.user_name.value;
+                var password = document.login.user_password.value;
+                if (username==null || username=="")
+                {
+                    window.alert("Username can't be blank");
+                    return false;
+                }
+                else if (password==null || password=="")
+                {
+                    window.alert("Password can't be blank");
+                    return false;
+                }
+            }
+        </script>
+        
+    </body>
+</html>

login/login.php

+<?php
+    if ($_SERVER["REQUEST_METHOD"] == "POST") {
+        if (!empty($_POST['user_name']) && !empty($_POST['user_password'])) {
+            $user = $_POST['user_name'];
+            $pass = $_POST['user_password'];
+            
+            $dbhost = '127.0.0.1:3306';
+            $dbuser = 'root';
+            $dbpass = '';
+            $conn = mysql_connect($dbhost, $dbuser, $dbpass) or die(mysql_error());
+            mysql_select_db('PR_Ojek') or die('Could not select database '.mysql_error());
+            $query=mysql_query("SELECT * FROM user WHERE username='".$user."' AND password='".$pass."'") or die(mysql_error());
+            
+            $numrows=mysql_num_rows($query);
+            if($numrows!=0)
+            {
+                while($row=mysql_fetch_assoc($query))
+                {
+                    $dbusername=$row['username'];
+                    $dbpassword=$row['password'];
+                }
+                
+                if($user == $dbusername && $pass == $dbpassword)
+                {
+                    header("Location: ../profile_page/profile.html");
+                }
+            } else {
+                include("login.html");
+                echo "<script>
+                document.getElementById('error_credential').innerHTML = 'Invalid username or password!';
+                </script>";
+                header("Location: login.html");
+            }
+            mysql_close($conn);
+        }
+    }
+    
+    function clean_input($data) {
+        $data = trim($data);
+        $data = stripslashes($data);
+        $data = htmlspecialchars($data);
+        return $data;
+    }
+?>

login/sign_up.html

+<!DOCTYPE html>
+<html>
+<head>
+	<title>Sign Up</title>
+	<link rel="stylesheet" type="text/css" href="../css/main.css">
+</head>
+<body>
+	<div id="sign_up_frame" class="frame">
+		<h1>-- Sign up --</h1>
+
+		<div>
+			<form method="post">
+				Your name
+				<input type="text" name="real_name"><br/>
+				Username
+				<input type="text" name="real_name"><br/>
+				Email
+				<input type="Email" name="real_name"><br/>
+				Password
+				<input type="Password" name="real_name"><br/>
+				Confirm password
+				<input type="Password" name="real_name"><br/>
+				Phone number
+				<input type="text" name="real_name"><br/>
+
+				<input type="checkbox" name="is_driver" value="true">Also sign me up as a driver<br/>
+
+				<input type="submit" value="REGISTER">
+			</form>
+		</div>
+	</div>
+
+</body>
+</html>
\ No newline at end of file