From 47904544d781fa9d647114d8cb22b69c5f7f4cf6 Mon Sep 17 00:00:00 2001
From: "fariz.tumbuan" <13515050@std.stei.itb.ac.id>
Date: Sat, 7 Oct 2017 13:15:56 +0800
Subject: [PATCH] Menformat tanggal agar menampilkan 'Hari, bulan tanggal
tahun'
---
css/history.css | 42 +++--------
history/driver_history.php | 20 ++++-
history/format_date.js | 126 ++++++++++++++++++++++++++++++++
history/transaction_history.php | 20 ++++-
4 files changed, 170 insertions(+), 38 deletions(-)
create mode 100644 history/format_date.js
diff --git a/css/history.css b/css/history.css
index f54827c6..95ec0a2f 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/history/driver_history.php b/history/driver_history.php
index 16f0e00a..2d757f5f 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 00000000..87cf44f0
--- /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 068d2cea..7c562460 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);
--
GitLab