295 lines
10 KiB
PHP
295 lines
10 KiB
PHP
<html>
|
|
<head>
|
|
<title>Taste@RoamEase</title>
|
|
<link rel="shortcut icon" href="../../icon/favicon/favicon.ico" type="image/x-icon" />
|
|
<link rel="icon" href="../../icon/favicon/favicon.ico" type="image/x-icon" />
|
|
<link rel="stylesheet" href="home.css?version=1" type="text/css" />
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
|
<style>
|
|
.pagebutton{
|
|
background-color: #ADD8FF;
|
|
border: none;
|
|
color: white;
|
|
text-decoration: none;
|
|
display: inline-block;
|
|
font-size: 13px;
|
|
width:5%;
|
|
border-radius: 10px;
|
|
font-size:17px;
|
|
transition:background-color 0.3s ease;
|
|
}
|
|
.hotel{
|
|
background-color:rgba(355,355,355,0.7);
|
|
width:45%;
|
|
margin:0 auto;
|
|
cursor:pointer;
|
|
}
|
|
.searchBox{
|
|
padding: 5%;
|
|
font-size: 16px;
|
|
border: none;
|
|
border-radius: 20px;
|
|
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
|
|
width: auto;
|
|
|
|
}
|
|
.searchB{
|
|
padding: 2% 5%;
|
|
font-size: 120%;
|
|
background-color: #003b94;;
|
|
color: white;
|
|
border: none;
|
|
border-radius: 20px;
|
|
cursor: pointer;
|
|
font-weight: bold;
|
|
}
|
|
.searchB:hover {
|
|
cursor: pointer;
|
|
text-decoration: underline;
|
|
}
|
|
.buttonDiv{
|
|
text-align:center;
|
|
}
|
|
.back{
|
|
margin-top:10%;
|
|
height:90%;
|
|
width:100%;
|
|
}
|
|
table tr td:first-child {
|
|
width: 120px;
|
|
}
|
|
</STYLE>
|
|
</head>
|
|
|
|
<body>
|
|
|
|
|
|
<?php
|
|
include "../ConnectDB.php";
|
|
// Start the session
|
|
session_start();
|
|
// Check if the user is already logged in
|
|
if (isset($_SESSION['loggedin']) && $_SESSION['loggedin'] === true) {
|
|
if(isset($_SESSION['user_type']) && $_SESSION['user_type'] === 'staff'){
|
|
echo "<script type='text/javascript'>
|
|
window.top.location.href = './staff/home.php';
|
|
</script>";
|
|
}
|
|
if(isset($_SESSION['user_type']) && $_SESSION['user_type'] === 'admin'){
|
|
echo "<script type='text/javascript'>
|
|
window.top.location.href = './admin/home.php';
|
|
</script>";
|
|
}
|
|
}
|
|
?>
|
|
|
|
<header>
|
|
<div class="logo">
|
|
<a href="../../index.php"><img src="../../icon/favicon/logo_white.svg" alt="RoamEase"></a>
|
|
</div>
|
|
|
|
<div class="nav-links">
|
|
<a><input class="searchBox" type="text" id="myInput" placeholder="search restaurant"></a>
|
|
<button class="searchB" onclick="myFunction()">Search</button>
|
|
<?php
|
|
if (isset($_SESSION['loggedin'])) {
|
|
echo '<a href="./process/cart.php">Cart</a>
|
|
<a href="../../login/login.php">Account</a>';
|
|
}
|
|
else {
|
|
echo '<a href="../../login/register.php">Sign up</a>
|
|
<a href="../../login/username.php">Log in</a>';
|
|
}
|
|
?>
|
|
</div>
|
|
</header>
|
|
|
|
<header>
|
|
<nav>
|
|
<a href="stays.php">
|
|
<img src="../../icon/header/stays.svg" alt="Stays">
|
|
</a>
|
|
<a href="transport.php">
|
|
<img src="../../icon/header/transportations.svg" alt="Transportations">
|
|
</a>
|
|
<a href="#" style="border-color: white;">
|
|
<img src="../../icon/header/foods.svg" alt="Foods">
|
|
</a>
|
|
<a href="attractions.php">
|
|
<img src="../../icon/header/attractions.svg" alt="Attractions">
|
|
</a>
|
|
<a href="guiding.php">
|
|
<img src="../../icon/header/guiding.svg" alt="Guiding">
|
|
</a>
|
|
<a href="plans.php">
|
|
<img src="../../icon/header/plans.svg" alt="Plans">
|
|
</a>
|
|
</nav>
|
|
</header>
|
|
|
|
<div id="pageContainer" style="display: block;">
|
|
<div style="color:blue;font-size:40px;text-align:center; margin-top:1%; font-family:'Apple Chancery', cursive;"><i>RECOMMEND</i></div>
|
|
<div>
|
|
<div class="hotel" style="text-align:center; cursor:default; color:white; background-image:url(../../img/restaurant/2.jpg); " >
|
|
<p style="margin-top:40%;">Vargas Ltd Bakery
|
|
</div><br>
|
|
<div class="hotel" style="text-align:center; cursor:default; color:white; background-image:url(../../img/restaurant/4.jpg);">
|
|
<p style="margin-top:40%;">Gomez-Baker Joint
|
|
</div>
|
|
</div><br><br>
|
|
<div style="text-align:center;"><button class="pagebutton" onclick="myFunction()" style="font-size:20px; width:40%;font-family: Times New Roman, Times, serif; color:red; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); cursor:pointer;">Click here to get the full list of restaurant</button></div>
|
|
</div>
|
|
<div id="pageButtons" class="buttonDiv"></div>
|
|
|
|
|
|
<br><br><br>
|
|
|
|
<footer>
|
|
<div class="logo">
|
|
<a href="../../index.php"><img src="../../icon/favicon/textlogo.svg" alt="RoamEase" height="50px"></a>
|
|
<p style="font-size:10%;">©2023 COMP3013 Group10</p>
|
|
</div>
|
|
|
|
<div class="nav-links" style="font-size: 80%;">
|
|
<a href="#" style="color: white; margin: 0 10px;">About us</a>
|
|
<a href="#" style="color: white; margin: 0 10px;">Privacy Policy</a>
|
|
<a href="#" style="color: white; margin: 0 10px;">Terms For Usage</a>
|
|
</div>
|
|
|
|
</footer>
|
|
|
|
<script>
|
|
var currentPage = 1;
|
|
var totalPages = 1;
|
|
var judge=1;
|
|
function changePage(pageNumber) {
|
|
currentPage = pageNumber;
|
|
myFunction();
|
|
}
|
|
|
|
function myFunction() {
|
|
var input = document.getElementById('myInput');
|
|
var filter = input.value.toUpperCase();
|
|
var xmlhttp = new XMLHttpRequest();
|
|
xmlhttp.onreadystatechange = function() {
|
|
if (this.readyState == 4 && this.status == 200) {
|
|
var response = JSON.parse(this.responseText);
|
|
var data = response.data;
|
|
totalPages = response.total_pages;
|
|
var time=response.time;
|
|
time=time.toFixed(6);
|
|
var html = '';
|
|
if (data[0]=="No result"){
|
|
html="<p style='text-align:center; font-size:40px;'>Sorry, we didn't find what you were looking for.</p>";
|
|
judge=0;
|
|
}else{
|
|
html+='<div style="font-size: 40px; color: black;text-align: center;">Here is the restaurant information you are looking for.</div><br><br>';
|
|
html+='Running time: '+time+'s';
|
|
for (var i = 0; i < data.length; i++) {
|
|
html += '<div class="hotel" style="cursor:default;">';
|
|
html += '<table style="border: none; cursor:pointer;" onclick="window.open(\'./getInfo/FoInfo.php?id=' + data[i].restaurant_id + '\', \'_blank\');">';
|
|
html += '<tr><td rowspan="5"><img width=130; height=100; src="data:image/jpeg;base64,'+data[i].image+'" alt="Hotel Image"></td>';
|
|
html += '<td>Name</td><td><p style="font-size:20px; font-family: Times New Roman, Times, serif;">' + data[i].rname + '</p></td></tr>';
|
|
html += '<tr><td>City</td><td>' + data[i].cname + '</td></tr>';
|
|
html += '<tr><td>Rating</td><td>';
|
|
for (var j = 0; j < 5; j++) {
|
|
if (j < Math.floor(data[i].rating)) {
|
|
html += '<img width="30" height="30" src="../../icon/filled_star.svg" alt="Filled Star">';
|
|
} else if (j < data[i].rating && data[i].rating - j < 1) {
|
|
html += '<img width="30" height="30" src="../../icon/half_star.svg" alt="Half Star">';
|
|
} else {
|
|
html += '<img width="30" height="30" src="../../icon/empty_star.svg" alt="Empty Star">';
|
|
}
|
|
}
|
|
html += '</td></tr>';
|
|
html += '<tr><td>Ticket</td><td>' + data[i].fee + 'RMB</td></tr>';
|
|
html += '<tr><td style="vertical-align:top">Characteristics</td><td style="vertical-align:top">' + data[i].descrip + '</td></tr>';
|
|
html += '</table>';
|
|
html += '<button style="width: 10%; height: 40px;" onclick="addToPlan(\'' + data[i].restaurant_id + '\')" >ADD</button>';
|
|
html += '</div><br>';
|
|
}
|
|
|
|
html += '<p style="text-align:center; font-size:30px;">Current page:' + currentPage+'</p>';
|
|
|
|
}
|
|
document.getElementById("pageContainer").innerHTML = html;
|
|
generatePageButtons();
|
|
}
|
|
};
|
|
xmlhttp.open("GET", "getFood.php?q="+filter+"&page="+currentPage, true);
|
|
xmlhttp.send();
|
|
}
|
|
|
|
|
|
function addToPlan(restaurantId) {
|
|
var startDate = prompt("Select visit_date:", formatDate(new Date()));
|
|
if (startDate) {
|
|
var url = `./plans_do.php?restaurant_id=${restaurantId}&visit_date=${startDate}`;
|
|
|
|
fetch(url)
|
|
.then(response => {
|
|
if (!response.ok) {
|
|
throw new Error(`Error adding to the plan. Status code: ${response.status}`);
|
|
}
|
|
return response.json();
|
|
})
|
|
.then(data => {
|
|
if (data.code === 0) {
|
|
alert(data.msg)
|
|
} else {
|
|
console.error(`Error adding to the plan. Message: ${data.message}`);
|
|
}
|
|
})
|
|
.catch(error => {
|
|
console.error("Fetch error:", error);
|
|
});
|
|
}
|
|
}
|
|
|
|
function formatDate(date) {
|
|
var year = date.getFullYear();
|
|
var month = (date.getMonth() + 1).toString().padStart(2, '0');
|
|
var day = date.getDate().toString().padStart(2, '0');
|
|
return year + '-' + month + '-' + day;
|
|
}
|
|
|
|
function generatePageButtons() {
|
|
var html = '';
|
|
var startPage = Math.max(currentPage - 2, 1);
|
|
var endPage = Math.min(currentPage + 2, totalPages);
|
|
var html2='';
|
|
|
|
|
|
// Always add the first page button
|
|
if ((currentPage != 1||currentPage != 2||currentPage == 3)&&endPage!=0) {
|
|
html += '<button class="pagebutton" onclick="changePage(1)">1</button>';
|
|
}
|
|
|
|
// Add "..." before current pages
|
|
if (startPage > 2&&endPage!=0) {
|
|
html += '.............';
|
|
}
|
|
|
|
// Add buttons for current pages
|
|
for (var i = startPage+1; i <= endPage; i++) {
|
|
html += '<button class="pagebutton" onclick="changePage(' + i + ')">' + i + '</button>';
|
|
}
|
|
|
|
// Add "..." after current pages
|
|
if (endPage < totalPages - 1&&endPage!=0) {
|
|
html += '.............';
|
|
}
|
|
|
|
// Always add the last page button
|
|
if (currentPage != totalPages && totalPages != 2&& totalPages != 3&& totalPages != 4&& totalPages != 5) {
|
|
html += '<button class="pagebutton" onclick="changePage(' + totalPages + ')">' + totalPages + '</button>';
|
|
}
|
|
|
|
document.getElementById("pageButtons").innerHTML = html;
|
|
}
|
|
|
|
</script>
|
|
|
|
</html>
|