diff --git a/css/default_style.css b/css/default_style.css
index cb3a7d17278c8478e0388e35b364ebb71be185f4..2a94eb99cd98fe79864694d761bdf5c6511ce43d 100755
--- a/css/default_style.css
+++ b/css/default_style.css
@@ -7,6 +7,7 @@ body {
width: 360px;
height: 550px;
margin: 50px auto;
+ padding: 5px 20px;
padding-right: 20px;
padding-left: 20px;
border-top: 0.5px solid black;
@@ -80,14 +81,13 @@ a:hover {
}
.menu_container {
- background-color: red;
width: 360px;
- margin-left: auto;
- margin-right: auto;
+ margin: 15px auto 5px auto;
}
.subheader {
height: 15%;
+ margin-bottom: 10px;
}
.title {
float: left;
@@ -112,3 +112,19 @@ a:hover {
height: 100%;
width: 100%;
}
+
+ul.nav_bar {
+ list-style-type: none;
+ margin: 0;
+ padding: 0;
+ overflow: hidden;
+ display: table;
+ width: inherit;
+}
+
+ul.nav_bar > li {
+ display: table-cell;
+}
+
+#main_nav_bar.nav_bar > li {
+}
\ No newline at end of file
diff --git a/css/header.css b/css/header.css
index 6e015048ce8061bf823ce80b17eafc39df6f882f..d2e6ca954f7d67da60ff9d6143b8044f4f8181b9 100644
--- a/css/header.css
+++ b/css/header.css
@@ -23,3 +23,8 @@
margin: 0 ;
margin-top: 10px;
}
+
+div.greeting a, div.greeting a:link, div.greeting a:visited {
+ color: blue;
+ text-decoration: underline;
+}
diff --git a/css/history.css b/css/history.css
index f54827c6fdfbcd9f1c89eff19daaa8b8f9816154..95ec0a2fd4fc1d2b304cac18488e0b21da4ec653 100755
--- a/css/history.css
+++ b/css/history.css
@@ -1,5 +1,4 @@
.history_container {
- margin-top: 10%;
height: 79%;
}
@@ -11,19 +10,6 @@
}
-.page_menu {
- list-style-type: none;
- margin: 0;
- padding: 0;
- overflow: hidden;
-}
-
-.page_menu > li {
- width: 50%;
- display: inline;
- float: left;
-}
-
.history_menu {
border: 0.5px solid black;
text-align: center;
@@ -52,8 +38,9 @@ table.history_table {
}
table.history_table p {
- margin: 5px 0;
+ margin: 0 0 5px 0;
padding: 0;
+ font-size: 12px;
font-style: "Lucida Console", Monaco, monospace;
}
@@ -61,29 +48,16 @@ td.history_column {
padding: 2px 0 0 8px;
}
-p.history_date {
- font-size: 14px;
+table.history_table p.history_date {
color: grey;
font-weight: bold;
}
-p.history_username {
+table.history_table p.history_username {
font-size: 20px;
font-weight: bold;
}
-p.history_loc {
- font-size: 14px;
-}
-
-p.history_rating {
- font-size: 14px;
-}
-
-p.history_comment {
- font-size: 14px;
-}
-
table.history_table th, td {
padding: 0 5px;
border-collapse: collapse;
@@ -118,4 +92,12 @@ button.hide_hist_button {
font-size: 20px;
color: orange;
vertical-align: middle;
+}
+
+ul#history_nav.nav_bar > li {
+ width: 50%;
+}
+
+ul#history_nav {
+ margin-bottom: 7px;
}
\ No newline at end of file
diff --git a/css/profile.css b/css/profile.css
index 9b23357ebccc65dd8f9a9846ee1d704c6ec78d08..866e0254c6fcbf2c8eaa298c6c4dd80d7faf20e7 100755
--- a/css/profile.css
+++ b/css/profile.css
@@ -1,5 +1,4 @@
.profile_container {
- margin-top: 10%;
height: 50%;
}
diff --git a/history/driver_history.php b/history/driver_history.php
index 16f0e00afdd826ec44d20d2e3ad8f8e86502b31e..2d757f5f8402e863719e6b69ed5bb0e2febb04bc 100644
--- a/history/driver_history.php
+++ b/history/driver_history.php
@@ -5,6 +5,8 @@
<link rel="stylesheet" type="text/css" href="../css/default_style.css">
<link rel="stylesheet" type="text/css" href="../css/history.css">
<link rel="stylesheet" type="text/css" href="../css/header.css">
+
+ <script type="text/javascript" src="format_date.js"></script>
</head>
<body>
<div class="frame">
@@ -34,7 +36,7 @@
<div class="title"><h1>Transaction History</h1></div>
</div>
- <ul class="page_menu">
+ <ul class="nav_bar" id="history_nav">
<li>
<a class="history_menu" href=<?php echo 'transaction_history.php?id='.$user_id; ?>>
<h3>MY PREVIOUS ORDER</h3>
@@ -60,12 +62,18 @@
if(mysqli_num_rows($query_order)!=0)
{
+ $i = 1;
while($row=mysqli_fetch_assoc($query_order)) {
$driver_query=mysqli_query($con,"SELECT username FROM user WHERE user_id='".$row['cust_id']."'") or die(mysqli_error());
$driver_row=mysqli_fetch_assoc($driver_query);
$driver_name=$driver_row['username'];
$given_score=(int)$row['score'];
+ echo
+ '<script>
+ var order_date = new Date("'.$row['date'].'");
+ </script>';
+
echo
"<tr>
<td>
@@ -73,7 +81,10 @@
<button class='hide_hist_button' type='button' value='hide' onclick='hide_row(this)'>Hide</button>
</td>
<td class='order_data'>
- <p class='history_date'>".$row['date']."</p>
+ <p class='history_date' id='row".$i."'></p>
+ <script>
+ document.getElementById('row".$i."').innerHTML=format_date(order_date);
+ </script>
<p class='history_username'>".$driver_name."</p>
<p class='history_loc'>".$row['pick_city']." - ".$row['dest_city']."</p>
<p class='history_rating'>gave <span class='yellow_score'>  ".$given_score." </span> stars for this order</p>
@@ -81,6 +92,8 @@
<p class='history_comment' style='margin-left: 30px;'>".$row['comment']."</p>
</td>
</tr>";
+
+ $i++;
}
}
mysqli_close($con);
@@ -90,7 +103,6 @@
</div>
</div>
</div>
+ <script type="text/javascript" src="hide_history.js"></script>
</body>
</html>
-
-<script type="text/javascript" src="hide_history.js"></script>
\ No newline at end of file
diff --git a/history/format_date.js b/history/format_date.js
new file mode 100644
index 0000000000000000000000000000000000000000..87cf44f0cca2fc11e4a927013ad4cdb2482ddee0
--- /dev/null
+++ b/history/format_date.js
@@ -0,0 +1,126 @@
+function format_date(order_date) {
+ var day;
+ switch (order_date.getDay()) {
+ case 0:
+ day = "Sunday";
+ break;
+
+ case 1:
+ day = "Monday";
+ break;
+
+ case 2:
+ day = "Tuesday";
+ break;
+
+ case 3:
+ day = "Wednesday";
+ break;
+
+ case 4:
+ day = "Thursday";
+ break;
+
+ case 5:
+ day = "Friday";
+ break;
+
+ case 6:
+ day = "Saturday";
+ break;
+
+ default:
+ day = "Error: day out of range";
+ break;
+ }
+
+ var month;
+ switch (order_date.getMonth()) {
+ case 0:
+ month = "January";
+ break;
+
+ case 1:
+ month = "February";
+ break;
+
+ case 2:
+ month = "March";
+ break;
+
+ case 3:
+ month = "April";
+ break;
+
+ case 4:
+ month = "May";
+ break;
+
+ case 5:
+ month = "June";
+ break;
+
+ case 6:
+ month = "July";
+ break;
+
+ case 7:
+ month = "August";
+ break;
+
+ case 8:
+ month = "September";
+ break;
+
+ case 9:
+ month = "October";
+ break;
+
+ case 10:
+ month = "November";
+ break;
+
+ case 11:
+ month = "December";
+ break;
+
+ default:
+ month = "Error: month out of range";
+ break;
+ }
+
+ var dateSuffix;
+ switch (order_date.getDate) {
+ case 1:
+ dateSuffix = "st";
+ break;
+
+ case 2:
+ dateSuffix = "nd";
+
+ case 3:
+ dateSuffix = "rd";
+
+ case 21:
+ dateSuffix = "st";
+
+ case 23:
+ dateSuffix = "nd";
+ break;
+
+ case 23:
+ dateSuffix = "rd";
+ break;
+
+ case 31:
+ dateSuffix = "st";
+ break;
+
+ default:
+ dateSuffix = "th";
+ break;
+ }
+
+
+ return (day + ", " + month + " " + order_date.getDate() + dateSuffix + " " + order_date.getFullYear());
+};
\ No newline at end of file
diff --git a/history/transaction_history.php b/history/transaction_history.php
index 068d2cea11b42bcbcf380a96e1042f1a75738172..7c562460f3e6e6d3bfc5eae3653cf512c1ceb45d 100644
--- a/history/transaction_history.php
+++ b/history/transaction_history.php
@@ -6,9 +6,9 @@
<link rel="stylesheet" type="text/css" href="../css/default_style.css">
<link rel="stylesheet" type="text/css" href="../css/history.css">
<link rel="stylesheet" type="text/css" href="../css/header.css">
- <script type="text/javascript" src="hide_history.js">
+
+ <script type="text/javascript" src="format_date.js"></script>
</script>
-}
</head>
<body>
<div class="frame">
@@ -37,7 +37,7 @@
<div class="subheader">
<div class="title"><h1>Transaction History</h1></div>
</div>
- <ul class="page_menu">
+ <ul id="history_nav" class="nav_bar">
<li>
<a class="history_menu menu_active" href=<?php echo 'transaction_history.php?id='.$user_id; ?>>
<h3>MY PREVIOUS ORDER</h3>
@@ -63,10 +63,17 @@
if(mysqli_num_rows($query_order)!=0)
{
+ $i = 1;
while($row=mysqli_fetch_assoc($query_order)) {
$driver_query=mysqli_query($con,"SELECT username FROM user WHERE user_id='".$row['driver_id']."'") or die(mysqli_error());
$driver_row=mysqli_fetch_assoc($driver_query);
$driver_name=$driver_row['username'];
+
+ echo
+ '<script>
+ var order_date = new Date("'.$row['date'].'");
+ </script>';
+
echo
"<tr>
<td>
@@ -74,7 +81,10 @@
<button class='hide_hist_button' type='button' value='hide' onclick='hide_row(this)'>Hide</button>
</td>
<td class='order_data'>
- <p class='history_date'>".$row['date']."</p>
+ <p class='history_date' id='row".$i."'></p>
+ <script>
+ document.getElementById('row".$i."').innerHTML=format_date(order_date);
+ </script>
<p class='history_username'>".$driver_name."</p>
<p class='history_loc'>".$row['pick_city']." - ".$row['dest_city']."</p>
<p class='history_rating'>You rated: ";
@@ -89,6 +99,8 @@
<p class='history_comment' style='margin-left: 30px;'>".$row['comment']."</p>
</td>
</tr>";
+
+ $i++;
}
}
mysqli_close($con);
diff --git a/template/header.php b/template/header.php
index 7dc0dbded32246764f57c861a6f4d77bdfc9326a..6326dc14c75029d75c85be7215b9c0b3db57b1f4 100644
--- a/template/header.php
+++ b/template/header.php
@@ -1,6 +1,6 @@
<?php
echo '<div class="logo">
- <h1>OneHundred</h1>
+ <h1><span style="color: red;">One</span><span style="color: green;">Hundred</span></h1>
<p>"An ojek for anything you need"</p></br>
</div>
<div class="greeting">
diff --git a/template/menu.php b/template/menu.php
index 88a34fc0e63e9719826afccdeb2e84a735ebb510..8cfc8e474f2174cbab591725e4cf97626e60068b 100644
--- a/template/menu.php
+++ b/template/menu.php
@@ -1,19 +1,20 @@
<?php
- echo '
- <a href="../order/select_location.php?id='. $user_id .'" name="order_link">
- <div class="menu" id="order_link">
- <h3>ORDER</h3>
- </div>
- </a>
- <a href="../history/transaction_history.php?id='. $user_id .'" name="history_link">
- <div class="menu" id="history_link">
- <h3>HISTORY</h3>
- </div>
- </a>
- <a href="../profile/profile.php?id='. $user_id .'" name="profile_link">
- <div class="menu" id="profile_link">
- <h3>MY PROFILE</h3>
- </div>
- </a>
- ';
-?>
+ echo '
+ <ul id="main_nav_bar" class="nav_bar">
+ <li>
+ <a class="menu" id="order_link" href="../order/select_location.php?id='. $user_id .'" name="order_link">
+ <h3>ORDER</h3>
+ </a>
+ </li>
+ <li>
+ <a class="menu" id="history_link" href="../history/transaction_history.php?id='. $user_id .'" name="history_link">
+ <h3>HISTORY</h3>
+ </a>
+ </li>
+ <li>
+ <a class="menu" id = "profile_link" href="../profile/profile.php?id='. $user_id .'" name="profile_link">
+ <h3>MY PROFILE</h3>
+ </a>
+ </li>
+ </ul>';
+?>
\ No newline at end of file