update,
This commit is contained in:
louiscklaw
157
it114105/itp4506/Assignment/19-20/Info.html
Normal file
157
it114105/itp4506/Assignment/19-20/Info.html
Normal file
@@ -0,0 +1,157 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>Yummy Everywhere</title>
|
||||
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
|
||||
<link href="css/materialize.css" type="text/css" rel="stylesheet" media="screen,projection" />
|
||||
<link href="css/style.css" type="text/css" rel="stylesheet" />
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
|
||||
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
|
||||
<script src="js/materialize.js"></script>
|
||||
<script src="js/init.js"></script>
|
||||
</head>
|
||||
<script>
|
||||
$(document).ready(function(){
|
||||
$.getUserInf();
|
||||
});
|
||||
</script>
|
||||
<body>
|
||||
<nav>
|
||||
<div class="nav-wrapper container">
|
||||
<a id="logo-container" href="index.html" class="brand-logo ">Yummy Everywhere</a>
|
||||
|
||||
<ul class="right">
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
<ul id="slide-out" class="sidenav">
|
||||
</ul>
|
||||
<div id="warningModal" class="modal" style="width: 400px; margin-top: 150px">
|
||||
<div class="modal-content">
|
||||
<h4 class="red-text">Warning!</h4>
|
||||
<p id="wraningAlert"></p>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<a href="#!" class="modal-close waves-effect waves-green btn-flat">Close</a>
|
||||
<a href="#!" id="closeMenu" class="modal-close waves-effect waves-green btn-flat red-text">Yes</a>
|
||||
</div>
|
||||
</div>
|
||||
<!--- Fav Box -->
|
||||
<div id="modal_box" class="bottom-sheet"></div>
|
||||
|
||||
|
||||
|
||||
<div id="index-banner" class="parallax-container">
|
||||
<div class="">
|
||||
<div class="container" style="margin-top: 200px;">
|
||||
<h2 class="center">Update Personal Information</h2>
|
||||
</div>
|
||||
</div>
|
||||
<div class="parallax"><img src="images/background1.jpg"></div>
|
||||
</div>
|
||||
<div class="container">
|
||||
<div class="row center">
|
||||
<div style="padding:100px;">
|
||||
<div id="pwdAlert"></div>
|
||||
<div class="col s12">
|
||||
icon <br><img src="images/icon/yuna.jpg">
|
||||
</div>
|
||||
<div class="input-field col s6">
|
||||
<input id="first_name" type="text" class="validate" required>
|
||||
<label for="first_name" id="first_namelable">First Name</label>
|
||||
</div>
|
||||
<div class="input-field col s6">
|
||||
<input id="last_name" type="text" class="validate" required>
|
||||
<label for="last_name" id="last_namelable">Last Name</label>
|
||||
</div>
|
||||
<div class="input-field col s12">
|
||||
<input id="regEmail" type="email" class="validate" required>
|
||||
<label for="regEmail" id="regEmaillable">Email</label>
|
||||
</div>
|
||||
<div class="input-field col s12">
|
||||
<input id="oldPassword" type="password" class="validate" required>
|
||||
<label for="oldPassword">Old Password</label>
|
||||
</div>
|
||||
<div class="input-field col s12">
|
||||
<input id="regPassword" type="password" class="validate" required>
|
||||
<label for="regPassword">New Password</label>
|
||||
</div>
|
||||
<div class="input-field col s12">
|
||||
<input id="checkPassword" type="password" class="validate" required>
|
||||
<label for="checkPassword">Confirm Password</label>
|
||||
</div>
|
||||
<div class="file-field input-field col s12">
|
||||
<div class="btn">
|
||||
<span>File</span>
|
||||
<input type="file">
|
||||
</div>
|
||||
<div class="file-path-wrapper">
|
||||
<input class="file-path validate" placeholder="Upload Your Icon" type="text">
|
||||
</div>
|
||||
</div>
|
||||
<a class="waves-effect waves-light btn col s10 offset-s1" style="margin-top: 50px" id="btnSubmitUpdate">Update</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Modal Structure -->
|
||||
<div id="modal1" class="modal loginModal" style="width: 400px;">
|
||||
<div class="row center-align">
|
||||
<div class="col s12 modal-content">
|
||||
<span class="flow-text" id="loginInfo">
|
||||
<div id="loginAlert"></div>
|
||||
<h4 style="border-bottom: 1px solid #ebebeb; height: 50px;">LOGIN</h4>
|
||||
<div class="input-field col s12">
|
||||
<i class="material-icons prefix">account_circle</i>
|
||||
<input id="loginEmail" type="text" class="validate" required>
|
||||
<label for="loginEmail">Email</label>
|
||||
</div><br>
|
||||
<div class="input-field col s12">
|
||||
<i class="material-icons prefix">vpn_key</i>
|
||||
<input id="loginPwd" type="password" class="validate" required>
|
||||
<label for="loginPwd">Password</label>
|
||||
</div>
|
||||
|
||||
<a class="waves-effect waves-light btn col s10 offset-s1" style="margin-top: 50px" id="btnSubmitLogin">LOGIN</a>
|
||||
<h6 class=" col s12">Don"t have an account? <a href="#" id="createAccount">Sign up here</a></h6>
|
||||
</span>
|
||||
<span class="flow-text" id="createInfo">
|
||||
<div id="pwdAlert"></div>
|
||||
<h4 style='border-bottom: 1px solid #ebebeb; height: 50px;'>REGISTER</h4><div class='input-field col s6'><input id='first_name' type='text' class='validate' required><label for='first_name'>First Name</label></div><div class='input-field col s6'><input id='last_name' type='text' class='validate' required><label for='last_name'>Last Name</label></div><div class='input-field col s12'><input id='regEmail' type='email' class='validate' required><label for='regEmail'>Email</label></div><div class='input-field col s12'><input id='regPassword' type='password' class='validate' required><label for='regPassword'>Password</label></div><div class='input-field col s12'><input id='checkPassword' type='password' class='validate' required><label for='checkPassword'>Confirm Password</label></div><a class='waves-effect waves-light btn col s10 offset-s1' style='margin-top: 50px' id='btnSubmitRegister'>REGISTER</a><h6 class='col s12' id="changeLogin">You have an account? <a href='#' id='loginAccount'>Login</a></h6>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal-footer">
|
||||
<a href="#!" class=" modal-action modal-close waves-effect waves-green btn-flat">Close</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer class="page-footer teal">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
|
||||
<div class="col l3 s12">
|
||||
<h5 class="white-text">Connect</h5>
|
||||
<ul>
|
||||
<li><a class="white-text" href="aboutus.html">About Us</a></li>
|
||||
<li><a class="white-text" href="userGuide.html">User Guide</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-copyright">
|
||||
<div class="container">Copyright © 2019 InnoTech HK Inc. All rights reserved</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<!-- Scripts-->
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
42
it114105/itp4506/Assignment/19-20/README.md.original
Normal file
42
it114105/itp4506/Assignment/19-20/README.md.original
Normal file
@@ -0,0 +1,42 @@
|
||||
|
||||
# ITP4506-Assignment
|
||||
Human Computer Interaction & GUI Programming
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
#### Requirement:
|
||||
|
||||
1. Restaurant Information Management:
|
||||
• Operator
|
||||
• Input information of restaurant (including branches)
|
||||
• Update take-away menu
|
||||
• Allow showing/hiding special / temporary / seasonal menu according to the pre-set date or period
|
||||
• Hide/remove uploaded menu
|
||||
|
||||
2. Search & Browsing:
|
||||
• Normal_user
|
||||
• Search take-away menu or restaurant by tags or keywords
|
||||
• View restaurant information and related take-away menu
|
||||
• Add/Remove take-away menu or restaurant to/from favorite
|
||||
• Leave like or comment on a particular restaurant
|
||||
(Public without registered, can only view/search restaurant information, but cannot view the menu.)
|
||||
|
||||
3. Account Management:
|
||||
Normal_user could create an account by self-registration. While Operator accounts is created by Administrator
|
||||
manually.
|
||||
• Administrator
|
||||
• Show existing users
|
||||
• Create and delete users
|
||||
• Manage the user role
|
||||
• Normal_user:
|
||||
• Registration
|
||||
• Normal_user, Operator and Administrator
|
||||
• Edit personal detail including change password
|
||||
|
||||
4. Additional Function:
|
||||
You are required to design and add the fourth function to the system which should be of the similar scope
|
||||
size of the above mentioned functions.
|
||||
11
it114105/itp4506/Assignment/19-20/USERS.TXT.txt
Normal file
11
it114105/itp4506/Assignment/19-20/USERS.TXT.txt
Normal file
@@ -0,0 +1,11 @@
|
||||
Normal User:
|
||||
Account: jerry@gmail.com
|
||||
Password: admin
|
||||
|
||||
Operator:
|
||||
Account: stephy@gmail.com
|
||||
Password: admin
|
||||
|
||||
Admin:
|
||||
Account: alex@gmail.com
|
||||
Password: admin
|
||||
116
it114105/itp4506/Assignment/19-20/aboutus.html
Normal file
116
it114105/itp4506/Assignment/19-20/aboutus.html
Normal file
@@ -0,0 +1,116 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>Yummy Everywhere</title>
|
||||
|
||||
<!-- CSS -->
|
||||
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
|
||||
<link href="css/materialize.css" type="text/css" rel="stylesheet" media="screen,projection" />
|
||||
<link href="css/style.css" type="text/css" rel="stylesheet" />
|
||||
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
|
||||
<script src="js/materialize.js"></script>
|
||||
<script src="js/init.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<nav>
|
||||
<div class="nav-wrapper container">
|
||||
<a id="logo-container" href="index.html" class="brand-logo ">Yummy Everywhere</a>
|
||||
<ul class="right">
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
<ul id="slide-out" class="sidenav">
|
||||
</ul>
|
||||
<!--- Fav Box -->
|
||||
<div id="modal_box" class="bottom-sheet">
|
||||
</div>
|
||||
|
||||
<div class="container" style="min-height:400px; margin-top: 150px;">
|
||||
|
||||
<div class="row center">
|
||||
<div class="row">
|
||||
<div class="col s12">
|
||||
<div class="card grey darken-1">
|
||||
<div class="card-content white-text">
|
||||
<h4 class="card-title">About Us</h4>
|
||||
<p>InnoTech HK Inc provide a service called “Yummy Everywhere” that provides an online portal for customers to browse takeaway menus of various restaurants in Hong Kong.</p>
|
||||
<br>
|
||||
<p>Through Yummy Everywhere's webpage, you can bring an unforgettable culinary feast to your mobile phone, tablet or computer. hurry up!</p>
|
||||
<br>
|
||||
<p class="row">
|
||||
Service coverage throughout Hong Kong
|
||||
<img class="col s12" src="images/map.jpg">
|
||||
</p>
|
||||
</div>
|
||||
<div class="card-action">
|
||||
<a class="waves-effect waves-light btn" href="index.html" class=""> Start to view the MENU</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- Modal Structure -->
|
||||
<div id="modal1" class="modal" style="width: 400px;">
|
||||
<div class="row center-align">
|
||||
<div class="col s12 modal-content">
|
||||
<span class="flow-text" id="loginInfo">
|
||||
<div id="loginAlert"></div>
|
||||
<h4 style="border-bottom: 1px solid #ebebeb; height: 50px;">LOGIN</h4>
|
||||
<div class="input-field col s12">
|
||||
<i class="material-icons prefix">account_circle</i>
|
||||
<input id="loginEmail" type="text" class="validate" required>
|
||||
<label for="loginEmail">Email</label>
|
||||
</div><br>
|
||||
<div class="input-field col s12">
|
||||
<i class="material-icons prefix">vpn_key</i>
|
||||
<input id="loginPwd" type="password" class="validate" required>
|
||||
<label for="loginPwd">Password</label>
|
||||
</div>
|
||||
|
||||
<a class="waves-effect waves-light btn col s10 offset-s1" style="margin-top: 50px" id="btnSubmitLogin">LOGIN</a>
|
||||
<h6 class=" col s12">Don"t have an account? <a href="#" id="createAccount">Sign up here</a></h6>
|
||||
</span>
|
||||
|
||||
<span class="flow-text" id="createInfo">
|
||||
<div id="pwdAlert"></div>
|
||||
<h4 style='border-bottom: 1px solid #ebebeb; height: 50px;'>REGISTER</h4><div class='input-field col s6'><input id='first_name' type='text' class='validate' required><label for='first_name'>First Name</label></div><div class='input-field col s6'><input id='last_name' type='text' class='validate' required><label for='last_name'>Last Name</label></div><div class='input-field col s12'><input id='regEmail' type='email' class='validate' required><label for='regEmail'>Email</label></div><div class='input-field col s12'><input id='regPassword' type='password' class='validate' required><label for='regPassword'>Password</label></div><div class='input-field col s12'><input id='checkPassword' type='password' class='validate' required><label for='checkPassword'>Confirm Password</label></div><a class='waves-effect waves-light btn col s10 offset-s1' style='margin-top: 50px' id='btnSubmitRegister'>REGISTER</a><h6 class='col s12' id="changeLogin">You have an account? <a href='#' id='loginAccount'>Login</a></h6>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal-footer">
|
||||
<a href="#!" class=" modal-action modal-close waves-effect waves-green btn-flat">Close</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer class="page-footer teal">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
|
||||
<div class="col l3 s12">
|
||||
<h5 class="white-text">Connect</h5>
|
||||
<ul>
|
||||
<li><a class="white-text" href="index.html">Search Menu</a></li>
|
||||
<li><a class="white-text" href="userGuide.html">User Guide</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-copyright">
|
||||
<div class="container">Copyright © 2019 InnoTech HK Inc. All rights reserved</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<!-- Scripts-->
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
150
it114105/itp4506/Assignment/19-20/admin.html
Normal file
150
it114105/itp4506/Assignment/19-20/admin.html
Normal file
@@ -0,0 +1,150 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>Yummy Everywhere</title>
|
||||
|
||||
<!-- CSS -->
|
||||
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
|
||||
<link href="css/materialize.css" type="text/css" rel="stylesheet" media="screen,projection" />
|
||||
<link href="css/style.css" type="text/css" rel="stylesheet" />
|
||||
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
|
||||
<script src="js/materialize.js"></script>
|
||||
<script src="js/init.js"></script>
|
||||
</head>
|
||||
<script>
|
||||
$(document).ready(function(){
|
||||
$.getAdminUserInf();
|
||||
if(sessionStorage.getItem("rule")=="admin"){
|
||||
$("#adminWellcomMesg").html("<div class='card-panel green lighten-3' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text' >Wellcome, " + sessionStorage.getItem("username")+"</font></div></div>");
|
||||
$("#adminWellcomMesg").effect("slide");
|
||||
}
|
||||
|
||||
|
||||
});
|
||||
</script>
|
||||
<body>
|
||||
<nav>
|
||||
<div class="nav-wrapper container">
|
||||
<a id="logo-container" href="index.html" class="brand-logo ">Yummy Everywhere</a>
|
||||
<ul class="right">
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
<ul id="slide-out" class="sidenav">
|
||||
</ul>
|
||||
<!--- Fav Box -->
|
||||
<div id="modal_box" class="bottom-sheet">
|
||||
</div>
|
||||
|
||||
<div class="container" style="min-height:400px; margin-top: 80px;">
|
||||
<div class='row'>
|
||||
<div class='col s12' id="adminWellcomMesg">
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<h5>Users</h5>
|
||||
<div class="row">
|
||||
<div class="col s4">
|
||||
<button class="btn waves-effect waves-light small" type="submit" style="margin-top:25px" name="action" id="adminAddUser">Add Users
|
||||
<i class="material-icons right">add</i>
|
||||
</button>
|
||||
</div>
|
||||
<div class="input-field col s5 offset-s3">
|
||||
<i class="material-icons prefix">search</i><input id="adminSearch" type="text" class="validate">
|
||||
</div>
|
||||
</div>
|
||||
<table class="highlight" style="margin-top:-20px">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>ID</th>
|
||||
<th>Email</th>
|
||||
<th>Role</th>
|
||||
<th>Action</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="adminUserTable">
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal" id="adminReg" style="width: 420px">
|
||||
<div class="row center-align">
|
||||
<div class="container col s12 modal-content">
|
||||
<div id="pwdAlert"></div>
|
||||
<h4 style='border-bottom: 1px solid #ebebeb; height: 50px;'>Add User</h4><div class='input-field col s6'><input id='first_name' type='text' class='validate' required><label for='first_name'>First Name</label></div><div class='input-field col s6'><input id='last_name' type='text' class='validate' required><label for='last_name'>Last Name</label></div><div class='input-field col s12'><input id='regEmail' type='email' class='validate' required><label for='regEmail'>Email</label></div><div class='input-field col s12'><input id='regPassword' type='password' class='validate' required><label for='regPassword'>Password</label></div><div class='input-field col s12'><input id='checkPassword' type='password' class='validate' required><label for='checkPassword'>Confirm Password</label></div><a class='waves-effect waves-light btn col s10 offset-s1' style='margin-top: 50px' id='btnSubmitRegister'>Add User</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<a href="#!" class="modal-close waves-effect waves-green btn-flat">Close</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Modal Structure -->
|
||||
<div id="modal1" class="modal" style="width: 400px;">
|
||||
<div class="row center-align">
|
||||
<div class="col s12 modal-content">
|
||||
<span class="flow-text" id="loginInfo">
|
||||
<div id="loginAlert"></div>
|
||||
<h4 style="border-bottom: 1px solid #ebebeb; height: 50px;">LOGIN</h4>
|
||||
<div class="input-field col s12">
|
||||
<i class="material-icons prefix">account_circle</i>
|
||||
<input id="loginEmail" type="text" class="validate" required>
|
||||
<label for="loginEmail">Email</label>
|
||||
</div><br>
|
||||
<div class="input-field col s12">
|
||||
<i class="material-icons prefix">vpn_key</i>
|
||||
<input id="loginPwd" type="password" class="validate" required>
|
||||
<label for="loginPwd">Password</label>
|
||||
</div>
|
||||
|
||||
<a class="waves-effect waves-light btn col s10 offset-s1" style="margin-top: 50px" id="btnSubmitLogin">LOGIN</a>
|
||||
</span>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal-footer">
|
||||
<a href="#!" class=" modal-action modal-close waves-effect waves-green btn-flat">Close</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="modalDelAlert" class="modal" style="width: 400px;">
|
||||
<div class="modal-content" id="modalDelAlertContent">
|
||||
<h4>Warning</h4>
|
||||
<p id="modalDelAlertContentMsg"></p>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<a class="modal-close waves-effect waves-green btn-flat modalDelconfirm">Confirm</a>
|
||||
<a class="modal-close waves-effect waves-green btn-flat modalDelClose">Close</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer class="page-footer teal">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
|
||||
<div class="col l3 s12">
|
||||
<h5 class="white-text">Connect</h5>
|
||||
<ul>
|
||||
<li><a class="white-text" href="aboutus.html">About Us</a></li>
|
||||
<li><a class="white-text" href="userGuide.html">User Guide</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-copyright">
|
||||
<div class="container">Copyright © 2019 InnoTech HK Inc. All rights reserved</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<!-- Scripts-->
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
9078
it114105/itp4506/Assignment/19-20/css/materialize.css
vendored
Normal file
9078
it114105/itp4506/Assignment/19-20/css/materialize.css
vendored
Normal file
File diff suppressed because it is too large
Load Diff
90
it114105/itp4506/Assignment/19-20/css/style.css
Normal file
90
it114105/itp4506/Assignment/19-20/css/style.css
Normal file
@@ -0,0 +1,90 @@
|
||||
/* Custom Stylesheet */
|
||||
/**
|
||||
* Use this file to override Materialize files so you can update
|
||||
* the core Materialize files in the future
|
||||
*
|
||||
* Made By MaterializeCSS.com
|
||||
*/
|
||||
|
||||
nav ul a{
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
i.icon-brand, nav .brand-logo{
|
||||
color: #26a69a;;
|
||||
}
|
||||
|
||||
p {
|
||||
line-height: 2rem;
|
||||
}
|
||||
|
||||
.sidenav-trigger {
|
||||
color: #26a69a;
|
||||
}
|
||||
|
||||
|
||||
.parallax-container {
|
||||
min-height: 380px;
|
||||
line-height: 0;
|
||||
height: auto;
|
||||
color: rgba(255,255,255,.9);
|
||||
}
|
||||
.parallax-container .section {
|
||||
width: 100%;
|
||||
}
|
||||
.icon-block {
|
||||
padding: 0 15px;
|
||||
}
|
||||
.icon-block .material-icons {
|
||||
font-size: inherit;
|
||||
}
|
||||
.btn-large{
|
||||
margin-top: 6px;
|
||||
}
|
||||
.page{
|
||||
height: 20px;
|
||||
}
|
||||
|
||||
footer.page-footer {
|
||||
margin-top: 100px;
|
||||
}
|
||||
|
||||
|
||||
@media only screen and (max-width : 992px) {
|
||||
.parallax-container .section {
|
||||
position: absolute;
|
||||
top: 40%;
|
||||
}
|
||||
#index-banner .section {
|
||||
top: 1%;
|
||||
}
|
||||
}
|
||||
.nav-moblie{
|
||||
color: #fff;
|
||||
background-color: #FFF;
|
||||
width: 100%;
|
||||
height: 70px;
|
||||
line-height: 70px;
|
||||
}
|
||||
|
||||
@media only screen and (max-width : 959px) {
|
||||
nav{
|
||||
color: #fff;
|
||||
background-color: #FFF;
|
||||
width: 100%;
|
||||
height: 70px;
|
||||
line-height: 70px;
|
||||
}
|
||||
nav .brand-logo{
|
||||
font-size: 160%;
|
||||
color: #80cbc4 ;
|
||||
}
|
||||
nav #btnLogin{
|
||||
color: black;
|
||||
}
|
||||
|
||||
}
|
||||
input{
|
||||
z-index: 10000000;
|
||||
}
|
||||
|
||||
BIN
it114105/itp4506/Assignment/19-20/demo/demo-image1.jpg
(Stored with Git LFS)
Normal file
BIN
it114105/itp4506/Assignment/19-20/demo/demo-image1.jpg
(Stored with Git LFS)
Normal file
Binary file not shown.
BIN
it114105/itp4506/Assignment/19-20/demo/demo-image2.jpg
(Stored with Git LFS)
Normal file
BIN
it114105/itp4506/Assignment/19-20/demo/demo-image2.jpg
(Stored with Git LFS)
Normal file
Binary file not shown.
BIN
it114105/itp4506/Assignment/19-20/demo/demo-image3.jpg
(Stored with Git LFS)
Normal file
BIN
it114105/itp4506/Assignment/19-20/demo/demo-image3.jpg
(Stored with Git LFS)
Normal file
Binary file not shown.
BIN
it114105/itp4506/Assignment/19-20/images/Dimsum-1.jpg
(Stored with Git LFS)
Normal file
BIN
it114105/itp4506/Assignment/19-20/images/Dimsum-1.jpg
(Stored with Git LFS)
Normal file
Binary file not shown.
BIN
it114105/itp4506/Assignment/19-20/images/Dimsum.jpg
(Stored with Git LFS)
Normal file
BIN
it114105/itp4506/Assignment/19-20/images/Dimsum.jpg
(Stored with Git LFS)
Normal file
Binary file not shown.
BIN
it114105/itp4506/Assignment/19-20/images/NeNeChickenTKO.jpeg
Normal file
BIN
it114105/itp4506/Assignment/19-20/images/NeNeChickenTKO.jpeg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 532 KiB |
BIN
it114105/itp4506/Assignment/19-20/images/NeNeChickenTst-1.jpg
(Stored with Git LFS)
Normal file
BIN
it114105/itp4506/Assignment/19-20/images/NeNeChickenTst-1.jpg
(Stored with Git LFS)
Normal file
Binary file not shown.
BIN
it114105/itp4506/Assignment/19-20/images/NeNeChickenTst.jpg
(Stored with Git LFS)
Normal file
BIN
it114105/itp4506/Assignment/19-20/images/NeNeChickenTst.jpg
(Stored with Git LFS)
Normal file
Binary file not shown.
BIN
it114105/itp4506/Assignment/19-20/images/Satay-1.jpg
(Stored with Git LFS)
Normal file
BIN
it114105/itp4506/Assignment/19-20/images/Satay-1.jpg
(Stored with Git LFS)
Normal file
Binary file not shown.
BIN
it114105/itp4506/Assignment/19-20/images/Satay.jpg
(Stored with Git LFS)
Normal file
BIN
it114105/itp4506/Assignment/19-20/images/Satay.jpg
(Stored with Git LFS)
Normal file
Binary file not shown.
BIN
it114105/itp4506/Assignment/19-20/images/TamJai-1.jpg
(Stored with Git LFS)
Normal file
BIN
it114105/itp4506/Assignment/19-20/images/TamJai-1.jpg
(Stored with Git LFS)
Normal file
Binary file not shown.
BIN
it114105/itp4506/Assignment/19-20/images/TamJai.jpg
(Stored with Git LFS)
Normal file
BIN
it114105/itp4506/Assignment/19-20/images/TamJai.jpg
(Stored with Git LFS)
Normal file
Binary file not shown.
BIN
it114105/itp4506/Assignment/19-20/images/TeaWood-1.jpg
(Stored with Git LFS)
Normal file
BIN
it114105/itp4506/Assignment/19-20/images/TeaWood-1.jpg
(Stored with Git LFS)
Normal file
Binary file not shown.
BIN
it114105/itp4506/Assignment/19-20/images/TeaWood.jpg
(Stored with Git LFS)
Normal file
BIN
it114105/itp4506/Assignment/19-20/images/TeaWood.jpg
(Stored with Git LFS)
Normal file
Binary file not shown.
BIN
it114105/itp4506/Assignment/19-20/images/background1.jpg
(Stored with Git LFS)
Normal file
BIN
it114105/itp4506/Assignment/19-20/images/background1.jpg
(Stored with Git LFS)
Normal file
Binary file not shown.
BIN
it114105/itp4506/Assignment/19-20/images/default.jpg
(Stored with Git LFS)
Normal file
BIN
it114105/itp4506/Assignment/19-20/images/default.jpg
(Stored with Git LFS)
Normal file
Binary file not shown.
BIN
it114105/itp4506/Assignment/19-20/images/map.JPG
Normal file
BIN
it114105/itp4506/Assignment/19-20/images/map.JPG
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 107 KiB |
BIN
it114105/itp4506/Assignment/19-20/images/office-1.jpg
(Stored with Git LFS)
Normal file
BIN
it114105/itp4506/Assignment/19-20/images/office-1.jpg
(Stored with Git LFS)
Normal file
Binary file not shown.
BIN
it114105/itp4506/Assignment/19-20/images/office.jpg
(Stored with Git LFS)
Normal file
BIN
it114105/itp4506/Assignment/19-20/images/office.jpg
(Stored with Git LFS)
Normal file
Binary file not shown.
156
it114105/itp4506/Assignment/19-20/index.html
Normal file
156
it114105/itp4506/Assignment/19-20/index.html
Normal file
@@ -0,0 +1,156 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>Yummy Everywhere</title>
|
||||
|
||||
<!-- CSS -->
|
||||
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
|
||||
<link href="css/materialize.css" type="text/css" rel="stylesheet" media="screen,projection" />
|
||||
<link href="css/style.css" type="text/css" rel="stylesheet" />
|
||||
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
|
||||
<script src="js/materialize.js"></script>
|
||||
<script src="js/init.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<nav>
|
||||
<div class="nav-wrapper container">
|
||||
<a id="logo-container" href="index.html" class="brand-logo ">Yummy Everywhere</a>
|
||||
<ul class="right">
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
<ul id="slide-out" class="sidenav">
|
||||
</ul>
|
||||
<!--- Fav Box -->
|
||||
<div id="modal_box" class="bottom-sheet">
|
||||
</div>
|
||||
|
||||
<div id="index-banner" class="parallax-container">
|
||||
<div class="">
|
||||
<div class="container" style="margin-top: 200px;">
|
||||
<div class="row center">
|
||||
<div class="col s12 m8 l7 offset-l2 offset-m1 ">
|
||||
<div class="card-panel grey lighten-5 ">
|
||||
<form action="search.html" method="get">
|
||||
<div class="row">
|
||||
<div class="col s12">
|
||||
<input placeholder="Input the Restaurant name or you want to eat" id="food" type="text" name="food" class="validate">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row center">
|
||||
<div class="col s12 m1 l1">
|
||||
<button type="submit" class="btn-large">Search</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<!-- <div class="row center">
|
||||
<a href="http://materializecss.com/getting-started.html" id="download-button" class="btn-large waves-effect waves-light teal lighten-1">Get Started</a>
|
||||
</div>-->
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="parallax"><img src="images/background1.jpg"></div>
|
||||
</div>
|
||||
|
||||
<div class="container" style="min-height:400px">
|
||||
<div class="section">
|
||||
|
||||
<!-- Icon Section -->
|
||||
<div class="row">
|
||||
<div class="col s12 m4">
|
||||
<div class="icon-block">
|
||||
<h2 class="center brown-text"><i class="material-icons">search</i></h2>
|
||||
<h5 class="center">Step 1</h5>
|
||||
|
||||
<p class="light center">Input You want to eat in Search Box</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col s12 m4">
|
||||
<div class="icon-block">
|
||||
<h2 class="center brown-text"><i class="material-icons">devices</i></h2>
|
||||
<h5 class="center">Step 2</h5>
|
||||
|
||||
<p class="light center">Choice the Restaurant</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col s12 m4">
|
||||
<div class="icon-block">
|
||||
<h2 class="center brown-text"><i class="material-icons">menu</i></h2>
|
||||
<h5 class="center">Step 3</h5>
|
||||
|
||||
<p class="light center">Watch the Restaurant menu</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Modal Structure -->
|
||||
<div id="modal1" class="modal" style="width: 400px;">
|
||||
<div class="row center-align">
|
||||
<div class="col s12 modal-content">
|
||||
<span class="flow-text" id="loginInfo">
|
||||
<div id="loginAlert"></div>
|
||||
<h4 style="border-bottom: 1px solid #ebebeb; height: 50px;">LOGIN</h4>
|
||||
<div class="input-field col s12">
|
||||
<i class="material-icons prefix">account_circle</i>
|
||||
<input id="loginEmail" type="text" class="validate" required>
|
||||
<label for="loginEmail">Email</label>
|
||||
</div><br>
|
||||
<div class="input-field col s12">
|
||||
<i class="material-icons prefix">vpn_key</i>
|
||||
<input id="loginPwd" type="password" class="validate" required>
|
||||
<label for="loginPwd">Password</label>
|
||||
</div>
|
||||
|
||||
<a class="waves-effect waves-light btn col s10 offset-s1" style="margin-top: 50px" id="btnSubmitLogin">LOGIN</a>
|
||||
<h6 class=" col s12">Don"t have an account? <a href="#" id="createAccount">Sign up here</a></h6>
|
||||
</span>
|
||||
|
||||
<span class="flow-text" id="createInfo">
|
||||
<div id="pwdAlert"></div>
|
||||
<h4 style='border-bottom: 1px solid #ebebeb; height: 50px;'>REGISTER</h4><div class='input-field col s6'><input id='first_name' type='text' class='validate' required><label for='first_name'>First Name</label></div><div class='input-field col s6'><input id='last_name' type='text' class='validate' required><label for='last_name'>Last Name</label></div><div class='input-field col s12'><input id='regEmail' type='email' class='validate' required><label for='regEmail'>Email</label></div><div class='input-field col s12'><input id='regPassword' type='password' class='validate' required><label for='regPassword'>Password</label></div><div class='input-field col s12'><input id='checkPassword' type='password' class='validate' required><label for='checkPassword'>Confirm Password</label></div><a class='waves-effect waves-light btn col s10 offset-s1' style='margin-top: 50px' id='btnSubmitRegister'>REGISTER</a><h6 class='col s12' id="changeLogin">You have an account? <a href='#' id='loginAccount'>Login</a></h6>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal-footer">
|
||||
<a href="#!" class=" modal-action modal-close waves-effect waves-green btn-flat">Close</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer class="page-footer teal">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
|
||||
<div class="col l3 s12">
|
||||
<h5 class="white-text">Connect</h5>
|
||||
<ul>
|
||||
<li><a class="white-text" href="aboutus.html">About Us</a></li>
|
||||
<li><a class="white-text" href="userGuide.html">User Guide</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-copyright">
|
||||
<div class="container">Copyright © 2019 InnoTech HK Inc. All rights reserved</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<!-- Scripts-->
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
777
it114105/itp4506/Assignment/19-20/js/init.js
Normal file
777
it114105/itp4506/Assignment/19-20/js/init.js
Normal file
@@ -0,0 +1,777 @@
|
||||
$(document).ready(function() {
|
||||
$.ajaxSetup({ cache: false });
|
||||
var time =4;
|
||||
$.LoadFav = function(){
|
||||
$("#navBookMark").click(function(){
|
||||
$("#favModal").html("");
|
||||
$("#modal_box").html("");
|
||||
$("#modal_box").html("<div class='modal-content' id='favModal'><h4>Favorite Restaurant</h4></div><div class='modal-footer'><a href='#!' class='modal-action modal-close waves-effect waves-red btn'>Close</a></div>");
|
||||
$.getJSON("jsonDB/"+sessionStorage.getItem("username")+".json", function(obj){
|
||||
try{
|
||||
$.getJSON("jsonDB/restaurants.json", function(result){
|
||||
for(var i=0; i<obj.favorite.length; i++)
|
||||
$.each(result.restaurants, function(index,name){
|
||||
if(obj.favorite[i] == name.id){
|
||||
$("#favModal").append("<ul class='collection' id='delcollFav"+name.id+"'><li class='collection-item avatar'><img src='"+name.image+"' id='favImg'class='circle'><span class='title' id='favTitle'>"+name.name+"</span><p id='favTag"+obj.favorite[i] +"'></p><a href='#' class='secondary-content deleteFav' id='Delfav"+name.id+"' ><i class='material-icons red-text' >delete</i></a></li></ul>");
|
||||
$.deleteFav();
|
||||
$.each(name.tag, function(tagIndex, tagName){
|
||||
$("#favTag"+obj.favorite[i]).append("<div class='chip'>" + tagName + "</div>");
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
//});
|
||||
}catch(err){
|
||||
console.log("NOT Thing here");
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
$.deleteFav = function(){
|
||||
$(".deleteFav").click(function(){
|
||||
var favVal = $(this).attr("id").substring(6,7);
|
||||
$.getJSON("jsonDB/"+sessionStorage.getItem("username")+".json", function(obj){
|
||||
$.each(obj.favorite, function(favIndex, favName){
|
||||
if(favVal == favName){
|
||||
|
||||
obj.favorite.splice(favIndex, 1);
|
||||
console.log(obj);
|
||||
$.ajax({
|
||||
url: "jsonDB/update.php",
|
||||
type: "POST",
|
||||
async: false,
|
||||
cache: false,
|
||||
dataType: "json",
|
||||
data: {dataCus: JSON.stringify(obj), dataEmail: sessionStorage.getItem("username"), fav: 1}
|
||||
});
|
||||
$("#delcollFav"+favVal).effect("slide");
|
||||
$("#delcollFav"+favVal).html("");
|
||||
|
||||
}
|
||||
console.log()
|
||||
|
||||
$("#fav"+favVal).html("<i class='material-icons'>favorite</i></a>");
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
$.windowsChecksize = function() {
|
||||
var winWidth = $(window).width();
|
||||
console.log(sessionStorage.getItem("rule"));
|
||||
if (winWidth < 943) {
|
||||
if(sessionStorage.getItem("username")){
|
||||
$("nav .right").html("<li><a id='btnLoginNav' data-target='slide-out' class='sidenav-trigger'><i class='material-icons lighten-3 icon-brand' >account_circle</i></a></li>");
|
||||
}else{
|
||||
$("nav .right").html("<li id='btnLoginNavli'><a id='btnLogin'><i class='material-icons lighten-3 icon-brand' >account_circle</i></a></li>");
|
||||
}
|
||||
} else {
|
||||
if(sessionStorage.getItem("username")){
|
||||
$("nav .right").html("<li><div id='btnLoginNav' data-target='slide-out' class='sidenav-trigger'><a class='waves-effect waves-light btn'><i class='material-icons left' >menu</i>Menu</a></div></li>");
|
||||
}else{
|
||||
$("nav .right").html("<li id='btnLoginNavli'><a class='waves-effect waves-light btn' id='btnLogin'><i class='material-icons left center' >account_circle</i>Login</a></li>");
|
||||
}
|
||||
}
|
||||
if(sessionStorage.getItem("username")){
|
||||
$("#slide-out").html("");
|
||||
$("#modal_box").addClass("modal");
|
||||
$("#modal_box").html("");
|
||||
$("#favModal").html("");
|
||||
$('.sidenav').sidenav();
|
||||
if(sessionStorage.getItem("rule")=="operator"){
|
||||
$("#slide-out").append("<li><div class='user-view'><div class='background'><img src='images/office-1.jpg'></div><a href='#user'><img class='circle' id='navIcon' src='images/icon/yuna.jpg'></a><a href='#name'><span class='white-text name' id='navName'></span></a><a href='#email'><span class='white-text email' id='navEmail'></span></a> </div></li><li><a href='operatorIndex.html'><i class='material-icons'>people</i>Restaurant Management</a></li><li><a href='Info.html'><i class='material-icons'>settings</i>Personal Information</a></li><li><a href='#!' id='navLogout'>Log Out</a></li>");
|
||||
}else if (sessionStorage.getItem("rule")=="admin"){
|
||||
$("#slide-out").append("<li><div class='user-view'><div class='background'><img src='images/office-1.jpg'></div><a href='#user'><img class='circle' id='navIcon' src='images/icon/yuna.jpg'></a><a href='#name'><span class='white-text name' id='navName'></span></a><a href='#email'><span class='white-text email' id='navEmail'></span></a> </div></li><li><a href='admin.html'><i class='material-icons'>people</i>User Management</a></li><li><a href='Info.html'><i class='material-icons'>settings</i>Personal Information</a></li><li><a href='#!' id='navLogout'>Log Out</a></li>");
|
||||
}else{
|
||||
$("#slide-out").append("<li><div class='user-view'><div class='background'><img src='images/office-1.jpg'></div><a href='#user'><img class='circle' id='navIcon' src='images/icon/yuna.jpg'></a><a href='#name'><span class='white-text name' id='navName'></span></a><a href='#email'><span class='white-text email' id='navEmail'></span></a> </div></li><li><a href='#modal_box' id='navBookMark' class='modal-trigger'><i class='material-icons'>bookmark</i>favorite restaurant</a></li><li><a href='Info.html'><i class='material-icons'>settings</i>Personal Information</a></li><li><a href='#!' id='navLogout'>Log Out</a></li>");
|
||||
}
|
||||
|
||||
$("#navName").append(sessionStorage.getItem("name"));
|
||||
$("#navEmail").append(sessionStorage.getItem("username"));
|
||||
$("#navLogout").click(function(){
|
||||
sessionStorage.removeItem("username");
|
||||
sessionStorage.removeItem("name");
|
||||
window.location.replace("index.html");
|
||||
});
|
||||
$("#modal_box").html("<div class='modal-content' id='favModal'><h4>Favorite Restaurant</h4></div><div class='modal-footer'><a href='#!' class='modal-action modal-close waves-effect waves-red btn'>Close</a></div>");
|
||||
$.LoadFav();
|
||||
|
||||
}
|
||||
|
||||
|
||||
$("#btnLogin").click(function() {
|
||||
$('#modal1').modal('open');
|
||||
});
|
||||
}
|
||||
|
||||
$.getRestanauent = function(){
|
||||
$.getJSON("jsonDB/restaurants.json", function(result) {
|
||||
$.each(result.restaurants, function(index, name) {
|
||||
var count = 0,
|
||||
rate = 0;
|
||||
$.each(result.commRestaurants, function(comIndex, comName) {
|
||||
if (name.id == comName.resID) {
|
||||
rate += comName.rate;
|
||||
count++;
|
||||
}
|
||||
});
|
||||
rate /= count;
|
||||
if (isNaN(rate))
|
||||
rate = "Not a comment";
|
||||
else
|
||||
rate = "Rate: " + rate + "/5.0";
|
||||
$("#menu").append("<a href='menu/foodRestaurant"+name.id+".html'><div class='col s12 m4 searchRest'><div class='card'><div class='card-image'><img src='" + name.image + "'><a class='btn-floating halfway-fab waves-effect waves-light red fav' id='fav" + name.id + "'></a></div><div class='card-content'><span class='card-title'>" + name.name + "</span><p>" + rate + "</p></div><div class='card-action' id='" + name.id + "'></a>");
|
||||
$.each(name.tag, function(tagIndex, tagName) {
|
||||
$("#" + name.id).append("<div class='chip'>" + tagName + "</div></div></div></div>");
|
||||
});
|
||||
if(sessionStorage.getItem("username")){
|
||||
$.getJSON("jsonDB/"+sessionStorage.getItem("username")+".json", function(obj){
|
||||
var seaVaild = false;
|
||||
$.each(obj.favorite, function(seaFavIndex, seaFavName){
|
||||
|
||||
if(seaFavName == name.id){
|
||||
seaVaild = true;
|
||||
$("#fav"+name.id).append("<i class='material-icons'>delete</i></a>");
|
||||
}
|
||||
});
|
||||
if(!seaVaild)
|
||||
$("#fav"+name.id).append("<i class='material-icons'>favorite</i></a>");
|
||||
});
|
||||
}else{
|
||||
$("#fav"+name.id).append("<i class='material-icons'>favorite</i></a>");
|
||||
}
|
||||
|
||||
});
|
||||
var foodText = GetURLParameter('food');
|
||||
if(typeof foodText!="undefined"){
|
||||
$(".searchRest").hide().filter(":contains('" + foodText + "')").show();
|
||||
if($(".searchRest:hidden").length >= $(".searchRest").length){
|
||||
$("#searchMessage").html("<h4>Sorry, not found about "+ foodText+ " Restanauent. <a href='search.html'>Click Here to see All Restanauent</a></h4>'");
|
||||
}
|
||||
}
|
||||
if(!sessionStorage.getItem("username")){
|
||||
$(".searchRest a").attr("href", "#");
|
||||
$(".searchRest a").click(function(){
|
||||
$("#btnLoginNavli a").click();
|
||||
});
|
||||
}else{
|
||||
$.clickFav();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
$.clickFav = function(){
|
||||
$(".fav").click(function(){
|
||||
if(sessionStorage.getItem("username")){
|
||||
var favVal = $(this).attr("id").substring(3,4);
|
||||
var vaild = false;
|
||||
$.getJSON("jsonDB/"+sessionStorage.getItem("username")+".json", function(obj){
|
||||
$.each(obj.favorite, function(favIndex, favName){
|
||||
if(favVal == favName){
|
||||
vaild = true;
|
||||
obj.favorite.splice(favIndex, 1);
|
||||
$("#fav"+favVal).html("<i class='material-icons'>favorite</i>");
|
||||
}
|
||||
});
|
||||
if(!vaild){
|
||||
obj.favorite.push(favVal);
|
||||
console.log(obj);
|
||||
$("#fav"+favVal).html("<i class='material-icons'>delete</i>");
|
||||
}
|
||||
$.ajax({
|
||||
url: "jsonDB/update.php",
|
||||
type: "POST",
|
||||
async: false,
|
||||
cache: false,
|
||||
dataType: "json",
|
||||
data: {dataCus: JSON.stringify(obj), dataEmail: sessionStorage.getItem("username"), fav: 1},
|
||||
});
|
||||
});
|
||||
}else{
|
||||
$("#btnLoginNavli a").click();
|
||||
}
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
|
||||
$("#createInfo").hide();
|
||||
$("#createAccount").click(function() {
|
||||
$("#loginInfo").hide();
|
||||
$("#createInfo").show();
|
||||
});
|
||||
$("#loginAccount").click(function() {
|
||||
$("#createInfo").hide();
|
||||
$("#loginInfo").show();
|
||||
});
|
||||
|
||||
$(window).resize(function() {
|
||||
$.windowsChecksize();
|
||||
});
|
||||
|
||||
//$("#btnFBLogin").click(function(){
|
||||
//
|
||||
//});
|
||||
|
||||
$("#btnSubmitLogin").click(function() {
|
||||
$("#loginAlert").html("");
|
||||
var loginPwd = $("#loginPwd").val();
|
||||
var loginEmail = $("#loginEmail").val();
|
||||
if(loginEmail=="" && loginPwd==""){
|
||||
$("#loginAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>The Email and password is required!</font></div></div></div>");
|
||||
}else if(loginEmail==""){
|
||||
$("#loginAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Missing the Email Address</font></div></div></div>");
|
||||
}else if(loginPwd==""){
|
||||
$("#loginAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Missing the Password</font></div></div></div>");
|
||||
}else{
|
||||
var valid = true;
|
||||
$.getJSON("jsonDB/adminCustomer.json",function(result){
|
||||
$.each(result.customers, function(index, name){
|
||||
|
||||
if(name.email==loginEmail && name.pwd!=loginPwd){
|
||||
valid = false;
|
||||
$("#loginAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Your Password is Worng.</font></div></div></div>");
|
||||
}else if(name.email==loginEmail && name.pwd==loginPwd){
|
||||
//$("#navIcon").attr("src", name.icon);
|
||||
$("#loginAlert").html("");
|
||||
valid = false;
|
||||
sessionStorage.setItem("username", name.email);
|
||||
sessionStorage.setItem("name", name.fname+ " " + name.lname);
|
||||
sessionStorage.setItem("rule", name.rule);
|
||||
|
||||
if(sessionStorage.getItem("rule")=="operator")
|
||||
window.location.replace("operatorIndex.html");
|
||||
else if(sessionStorage.getItem("rule")=="admin")
|
||||
window.location.replace("admin.html");
|
||||
else{
|
||||
location.reload();
|
||||
}
|
||||
valid = false;
|
||||
}
|
||||
});
|
||||
if(valid)
|
||||
$("#loginAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Your Email or Password is Worng!</font></div></div></div>");
|
||||
$("#loginAlert").effect("shake");
|
||||
});
|
||||
}
|
||||
});
|
||||
$("#btnSubmitRegister").click(function(){
|
||||
$("#pwdAlert").html("");
|
||||
var pwd = $("#regPassword").val();
|
||||
var pwdCheck = $("#checkPassword").val();
|
||||
var email = $("#regEmail").val();
|
||||
var fname = $("#first_name").val();
|
||||
var lname = $("#last_name").val();
|
||||
var btnVal = $("#btnSubmitRegister").text();
|
||||
var valid = false;
|
||||
if(pwd=="" && pwdCheck=="" && email=="" && fname=="" && lname==""){
|
||||
$("#pwdAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>You need input the all field!</font></div></div></div>");
|
||||
valid = true;
|
||||
$("#pwdAlert").effect("shake");
|
||||
return 0;
|
||||
}
|
||||
if(email==""){
|
||||
$("#pwdAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>You need input the Email address</font></div></div></div>");
|
||||
valid = true;
|
||||
$("#pwdAlert").effect("shake");
|
||||
} else if(!IsEmail(email)){
|
||||
$("#pwdAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Please check your email format</font></div></div></div>");
|
||||
valid = true;
|
||||
$("#pwdAlert").effect("shake");
|
||||
}
|
||||
if(pwd==""||pwdCheck==""){
|
||||
$("#pwdAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Missing Password</font></div></div></div>");
|
||||
valid = true;
|
||||
$("#pwdAlert").effect("shake");
|
||||
}
|
||||
if(fname=="" || lname==""){
|
||||
$("#pwdAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Name is required</font></div></div></div>");
|
||||
valid = true;
|
||||
$("#pwdAlert").effect("shake");
|
||||
}
|
||||
$.getJSON("jsonDB/adminCustomer.json", function(obj){
|
||||
$.each(obj.customers, function(index,name){
|
||||
if(name.email == email){
|
||||
$("#pwdAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Your Email Registed!</font></div></div></div>");
|
||||
valid = true;
|
||||
$("#pwdAlert").effect("shake");
|
||||
}
|
||||
});
|
||||
});
|
||||
if(pwd != pwdCheck){
|
||||
$("#pwdAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Your Comfirm Password Not Match!</font></div></div></div>");
|
||||
$("#pwdAlert").effect("shake");
|
||||
valid = true;
|
||||
}
|
||||
if(!valid){
|
||||
$.getJSON("jsonDB/adminCustomer.json", function(obj){
|
||||
var getID = 0;
|
||||
$.each(obj.customers, function(index, name){
|
||||
if(getID<name.userID)
|
||||
getID = name.userID;
|
||||
});
|
||||
getID++;
|
||||
var customer = {
|
||||
userID: getID,
|
||||
email: email,
|
||||
fname: fname,
|
||||
lname: lname,
|
||||
pwd: pwd,
|
||||
rule: "user",
|
||||
favorite:[]
|
||||
}
|
||||
obj.customers.push(customer);
|
||||
$.ajax({
|
||||
url: "jsonDB/update.php",
|
||||
type: "POST",
|
||||
async: false,
|
||||
cache: false,
|
||||
dataType: "json",
|
||||
data: {dataAdmin: JSON.stringify(obj), dataCus: JSON.stringify(customer), dataEmail: email}
|
||||
});
|
||||
$("#regPassword").val("");
|
||||
$("#checkPassword").val("");
|
||||
$("#regEmail").val("");
|
||||
$("#first_name").val("");
|
||||
$("#last_name").val("");
|
||||
$("#changeLogin a").click();
|
||||
$("#loginAlert").append("<div class='row'><div class='col s12'><div class='card-panel green lighten-1' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Your Account Created.</font></div></div></div>");
|
||||
$("#loginAlert").effect("slide");
|
||||
if(btnVal == "Add User"){
|
||||
$(".modal").modal("close");
|
||||
$("#adminUserTable").html("");
|
||||
$.getAdminUserInf();
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
$.checkRestaurantInf = function(){
|
||||
var name = $("#createRestaurantName").val();
|
||||
var tel = $("#createRestaureantTel").val();
|
||||
var address = $("#createRestaureantAdde").val();
|
||||
var area = $("#createRestaurantSelect").val();
|
||||
var opTime = $("#createRestaureantOPTime").val();
|
||||
var clTime = $("#createRestaureantCLTime").val();
|
||||
var valid = true;
|
||||
$("#stepOneAlert").html("");
|
||||
if(name=="" && tel=="" && address=="" && area=="" && opTime=="" && clTime==""){
|
||||
$("#stepOneAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>You need input the all field!</font></div></div></div>");
|
||||
valid=false;
|
||||
}
|
||||
if(name==""){
|
||||
$("#stepOneAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Missing the Restaurant Name</font></div></div></div>");
|
||||
valid=false;
|
||||
}
|
||||
if(tel==""){
|
||||
$("#stepOneAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Missing the Restaurant Name</font></div></div></div>");
|
||||
valid=false;
|
||||
}
|
||||
if(address==""){
|
||||
$("#stepOneAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Missing the Restaurant Address</font></div></div></div>");
|
||||
valid=false;
|
||||
}
|
||||
|
||||
|
||||
if(clTime==""||opTime==""){
|
||||
$("#stepOneAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Missing the Restaurant opening hours</font></div></div></div>");
|
||||
valid=false;
|
||||
}
|
||||
if(!valid){
|
||||
$("#firstStep").addClass("red-text");
|
||||
}else{
|
||||
$("#firstStep").removeClass("red-text");
|
||||
}
|
||||
}
|
||||
|
||||
$("#btnSubmitUpdate").click(function(){
|
||||
$("#pwdAlert").html("");
|
||||
var pwd = $("#regPassword").val();
|
||||
var pwdCheck = $("#checkPassword").val();
|
||||
var oldPassword = $("#oldPassword").val();
|
||||
var email = $("#regEmail").val();
|
||||
var fname = $("#first_name").val();
|
||||
var lname = $("#last_name").val();
|
||||
var btnVal = $("#btnSubmitRegister").text();
|
||||
var valid = false;
|
||||
|
||||
if(pwd=="" && pwdCheck=="" && email=="" && fname=="" && lname==""){
|
||||
$("#pwdAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>You need input the all field!</font></div></div></div>");
|
||||
valid = true;
|
||||
$("#pwdAlert").effect("shake");
|
||||
return 0;
|
||||
}
|
||||
if(email==""){
|
||||
$("#pwdAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>You need input the Email address</font></div></div></div>");
|
||||
valid = true;
|
||||
$("#pwdAlert").effect("shake");
|
||||
} else if(!IsEmail(email)){
|
||||
$("#pwdAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Please check your email format</font></div></div></div>");
|
||||
valid = true;
|
||||
$("#pwdAlert").effect("shake");
|
||||
}
|
||||
|
||||
|
||||
if(fname=="" || lname==""){
|
||||
$("#pwdAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Name is required</font></div></div></div>");
|
||||
valid = true;
|
||||
$("#pwdAlert").effect("shake");
|
||||
}
|
||||
|
||||
if(pwd==""||pwdCheck==""){
|
||||
$("#pwdAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Missing Password</font></div></div></div>");
|
||||
valid = true;
|
||||
$("#pwdAlert").effect("shake");
|
||||
}
|
||||
if(pwd==pwdCheck){
|
||||
$.getJSON("jsonDB/"+sessionStorage.getItem("username")+".json", function(obj){
|
||||
|
||||
if(obj.pwd!=oldPassword){
|
||||
console.log(obj.pwd+ " "+ oldPassword);
|
||||
$("#pwdAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Old password not match</font></div></div></div>");
|
||||
valid = true;
|
||||
$("#pwdAlert").effect("shake");
|
||||
}
|
||||
});
|
||||
}else{
|
||||
$("#pwdAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Password not match</font></div></div></div>");
|
||||
valid = true;
|
||||
$("#pwdAlert").effect("shake");
|
||||
}
|
||||
if(!valid){
|
||||
$.getJSON("jsonDB/"+sessionStorage.getItem("username")+".json", function(obj){
|
||||
var info = {
|
||||
"userID": obj.userID,
|
||||
"email": email,
|
||||
"fname": fname,
|
||||
"lname": lname,
|
||||
"pwd": pwdCheck,
|
||||
"user": obj.rule,
|
||||
"favorite":[]
|
||||
}
|
||||
$.each(obj.favorite, function(index, name){
|
||||
info.favorite.push(name);
|
||||
});
|
||||
|
||||
console.log(info);
|
||||
$.ajax({
|
||||
url: "jsonDB/update.php",
|
||||
type: "POST",
|
||||
async: false,
|
||||
cache: false,
|
||||
dataType: "json",
|
||||
data: {dataCus: JSON.stringify(info), dataEmail: sessionStorage.getItem("username"), fav: 1}
|
||||
});
|
||||
$("#pwdAlert").html("<div class='row'><div class='col s12'><div class='card-panel green lighten-1' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Your Information updated.</font></div></div></div>");
|
||||
$("#pwdAlert").effect("slide");
|
||||
$("#regPassword").val("");
|
||||
$("#checkPassword").val("");
|
||||
$("#oldPassword").val("");
|
||||
});
|
||||
}
|
||||
$("#regPassword").val("");
|
||||
$("#checkPassword").val("");
|
||||
$("#oldPassword").val("");
|
||||
|
||||
|
||||
});
|
||||
|
||||
$("#btnAddCatalog").click(function(){
|
||||
$("#menuCatAlert").html("");
|
||||
var cataHidd = $("#catalogHidden").prop("checked");
|
||||
var catalog = $("#catalog").val();
|
||||
var cataAllDay = $("#catalogAllDay").prop("checked");
|
||||
var invalid = true;
|
||||
if(!cataAllDay){
|
||||
var startTime = $("#catalogTo").val();
|
||||
var closeTime = $("#catalogCl").val();
|
||||
|
||||
}else{
|
||||
var startTime = "NA";
|
||||
var closeTime = "NA";
|
||||
}
|
||||
|
||||
if(catalog==""){
|
||||
$("#menuCatAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Please input your catalog</font></div></div></div>");
|
||||
invalid=false;
|
||||
}
|
||||
if(!cataAllDay && startTime=="" && closeTime==""){
|
||||
$("#menuCatAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Missing the Catalog Time</font></div></div></div>");
|
||||
invalid=false;
|
||||
}
|
||||
if(!invalid){
|
||||
$("#secondStep i").addClass("red-text");
|
||||
}
|
||||
if(invalid){
|
||||
$("#catalogTable").append("<tr><td>"+catalog+"</td><td>"+cataAllDay+"</td><td>"+startTime+"</td><td>"+closeTime+"</td><td class='catalogHide'>"+cataHidd+"</td><td><a class='btn-floating btn-small waves-effect waves-light red btnCataDelete'><i class='material-icons'>delete</i></a> <a class='btn-floating btn-small waves-effect waves-light teal lighten-2 btnCataChange'><i class='material-icons'>repeat</i></a></td></tr>");
|
||||
$("#catalog").val("");
|
||||
$("#secondStep i").removeClass("red-text");
|
||||
$(".btnCataChange").click(function(){
|
||||
var disVal = $(this).parents("tr").children("td:eq(4)").html();
|
||||
if(disVal=="false"){
|
||||
$(this).parents("tr").children("td:eq(4)").html("true") ;
|
||||
}else{
|
||||
$(this).parents("tr").children("td:eq(4)").html("false") ;
|
||||
}
|
||||
});
|
||||
$(".btnCataDelete").click(function(){
|
||||
$(this).parents("tr").remove();
|
||||
});
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
$("#secondStep").click(function(){
|
||||
$.checkRestaurantInf();
|
||||
});
|
||||
|
||||
$("#adminAddUser").click(function(){
|
||||
$("#adminReg").modal("open");
|
||||
});
|
||||
|
||||
$("#filterApply").click(function(){
|
||||
var filterArray = []
|
||||
if($("#filterNoodles").prop("checked")){
|
||||
filterArray.push($("#filterNoodles").val());
|
||||
}
|
||||
if($("#filterKoeran").prop("checked")){
|
||||
filterArray.push($("#filterKoeran").val());
|
||||
}
|
||||
if($("#filterTaiwanese").prop("checked")){
|
||||
filterArray.push($("#filterTaiwanese").val());
|
||||
}
|
||||
if($("#filterRice").prop("checked")){
|
||||
filterArray.push($("#filterRice").val());
|
||||
}
|
||||
if($("#filterChinese").prop("checked")){
|
||||
filterArray.push($("#filterChinese").val());
|
||||
}
|
||||
if($("#filterWestern").prop("checked")){
|
||||
filterArray.push($("#filterWestern").val());
|
||||
}
|
||||
if($("#filterDimSum").prop("checked")){
|
||||
filterArray.push($("#filterDimSum").val());
|
||||
}
|
||||
if(filterArray.length>0){
|
||||
var filterText = ":contains('";
|
||||
for (var i = filterArray.length; i >0; i--) {
|
||||
filterText += filterArray.pop()+"')";
|
||||
if(filterArray.length>0)
|
||||
filterText+=", :contains('";
|
||||
}
|
||||
$(".searchRest").hide().filter(filterText).show();
|
||||
}else{
|
||||
$(".searchRest").show();
|
||||
}
|
||||
});
|
||||
|
||||
$("#filterClear").click(function(){
|
||||
var checkboxes = document.getElementsByTagName('input');
|
||||
|
||||
for (var i=0; i<checkboxes.length; i++) {
|
||||
if (checkboxes[i].type == 'checkbox') {
|
||||
checkboxes[i].checked = false;
|
||||
}
|
||||
}
|
||||
$(".searchRest").show();
|
||||
});
|
||||
|
||||
|
||||
|
||||
$.getAdminUserInf = function(){
|
||||
if(sessionStorage.getItem("rule")=="admin"){
|
||||
$.getJSON("jsonDB/adminCustomer.json", function(obj){
|
||||
$.each(obj.customers, function(index, name){
|
||||
if(name.rule == "user")
|
||||
$("#adminUserTable").append("<tr><td>"+name.userID+"</td><td>"+name.email+"</td><td>"+name.rule+"</td><td><a class='btn-floating btn-small waves-effect waves-light red btnAdminDelete'><i class='material-icons'>delete</i></a> <a class='btn-floating btn-small waves-effect waves-light teal lighten-2 btnAdminRest'><i class='material-icons'>restaurant</i></a></td></tr>");
|
||||
else if(name.rule == "operator"){
|
||||
$("#adminUserTable").append("<tr><td>"+name.userID+"</td><td>"+name.email+"</td><td>"+name.rule+"</td><td><a class='btn-floating btn-small waves-effect waves-light red btnAdminDelete'><i class='material-icons'>delete</i></a> <a class='btn-floating btn-small waves-effect waves-light green lighten-3 btnAdminRest'><i class='material-icons'>person</i></a></td></tr>");
|
||||
}else if(name.rule == "admin"){
|
||||
$("#adminUserTable").append("<tr><td>"+name.userID+"</td><td>"+name.email+"</td><td>"+name.rule+"</td><td><a class='btn-floating btn-small waves-effect waves-light red btnAdminDelete'><i class='material-icons'>delete</i></a></tr>");
|
||||
}
|
||||
});
|
||||
$(".btnAdminDelete").click(function(){
|
||||
var valThis = $(this);
|
||||
$("#modalDelAlertContentMsg").html("<p>Do you want to delete <b>"+ valThis.parents("tr").children("td:eq(1)").text() +"</b></p>")
|
||||
$('#modalDelAlert').modal('open');
|
||||
$(".modalDelconfirm").click(function(){
|
||||
valThis.parents("tr").hide();
|
||||
$("#adminWellcomMesg").html("<div class='card-panel red' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text' >Account deleted</font></div></div>");
|
||||
$("#adminWellcomMesg").effect("slide");
|
||||
});
|
||||
$(".modalDelClose").click(function(){
|
||||
$('#modalDelAlert').modal('close');
|
||||
});
|
||||
});
|
||||
|
||||
$(".btnAdminRest").click(function(){
|
||||
var value = $(this).parents().children("td:eq(2)").text();
|
||||
if(value == "user"){
|
||||
$(this).html("<i class='material-icons'>person</i></a>");
|
||||
$(this).removeClass("lighten-2");
|
||||
$(this).removeClass("teal");
|
||||
$(this).addClass("green");
|
||||
$(this).addClass("lighten-3");
|
||||
$(this).parents().children("td:eq(2)").html("operator");
|
||||
$("#adminWellcomMesg").html("<div class='card-panel green lighten-2' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text' >Updated the "+$(this).parents().children("td:eq(1)").text()+" to Operator.</font></div></div>");
|
||||
$("#adminWellcomMesg").effect("slide");
|
||||
}else if(value== "operator"){
|
||||
$(this).html("<i class='material-icons'>restaurant</i></a>");
|
||||
$(this).addClass("lighten-2");
|
||||
$(this).addClass("teal");
|
||||
$(this).removeClass("green");
|
||||
$(this).removeClass("lighten-3");
|
||||
$(this).parents().children("td:eq(2)").html("user");
|
||||
$("#adminWellcomMesg").html("<div class='card-panel lighten-2 teal' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text' >Updated the "+$(this).parents().children("td:eq(1)").text()+" to User.</font></div></div>");
|
||||
$("#adminWellcomMesg").effect("slide");
|
||||
}
|
||||
|
||||
});
|
||||
$("#adminSearch").keyup(function(){
|
||||
var adminSearch = $("#adminSearch").val();
|
||||
$("tr:gt(0)").hide().filter(":contains('" + adminSearch + "')").show();
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
$.getUserInf = function(){
|
||||
$.getJSON("jsonDB/"+sessionStorage.getItem("username")+".json", function(obj){
|
||||
$("#regEmaillable").addClass("active");
|
||||
$("#last_namelable").addClass("active");
|
||||
$("#first_namelable").addClass("active");
|
||||
$("#regEmail").val(obj.email);
|
||||
$("#first_name").val(obj.fname);
|
||||
$("#last_name").val(obj.lname);
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
function btnSave(){
|
||||
$("#btnMenuSave").click(function(){
|
||||
var name = $("#createRestaurantName").val();
|
||||
var tel = $("#createRestaureantTel").val();
|
||||
var address = $("#createRestaureantAdde").val();
|
||||
var opTime = $("#createRestaureantOPTime").val();
|
||||
var clTime = $("#createRestaureantCLTime").val();
|
||||
var btnMenuSave = $("#btnMenuSave").text();
|
||||
$("#menuMissing").html("");
|
||||
console.log(btnMenuSave);
|
||||
var valid = true;
|
||||
if(name==""){
|
||||
$("#menuMissing").append("Section 1: Restaurant name<br>");
|
||||
valid=false;
|
||||
}
|
||||
if(tel==""){
|
||||
$("#menuMissing").append("Section 1: Restaurant Telphone<br>");
|
||||
}
|
||||
if(address==""){
|
||||
$("#menuMissing").append("Section 1: Restaurant Address<br>");
|
||||
valid=false;
|
||||
}
|
||||
|
||||
if(clTime==""||opTime==""){
|
||||
$("#menuMissing").append("Section 1: Restaurant Open and close time<br>");
|
||||
valid=false;
|
||||
}
|
||||
if(address=="" || tel=="" || name=="" || clTime==""||opTime==""){
|
||||
$("#firstStep").addClass("red-text");
|
||||
}
|
||||
if($("#catalogTable tr").length<2){
|
||||
$("#menuMissing").append("Section 2: The Restaurant catalog<br>");
|
||||
valid=false;
|
||||
$("#secondStep").addClass("red-text");
|
||||
}
|
||||
if($("#resturantMenu tr").length<2){
|
||||
$("#menuMissing").append("Section 3: The Restaurant food<br>");
|
||||
valid=false;
|
||||
$("#stepThrid").addClass("red-text");
|
||||
}
|
||||
console.log(valid+" && " + btnMenuSave);
|
||||
if(valid && btnMenuSave=="Create"){
|
||||
var restName = $("#createRestaurantName").val();
|
||||
$("#restaurantMenu").append("<a href='#'><div class='col s12 m3 searchOPRest'><div class='card'><div class='card-image waves-effect waves-block waves-light'><img class='activator' src='images/default.jpg'></div><div class='card-content'><span class='card-title activator grey-text text-darken-4'>"+restName+"</span><a class='dropdown-trigger' href='#' data-target='dropdown"+time+"'><p>Modify</p></a></div><ul id='dropdown"+time+"' class='dropdown-content'><li><a href='#createRest' class='restEdit modal-trigger' id='"+time+"'>Edit</a></li><li><a href='#warningModal' class='red-text restDel'>Delete</a></li></ul></div></div></div></a>");
|
||||
time++;
|
||||
$('.dropdown-trigger').dropdown();
|
||||
$("#menuAlert").html("");
|
||||
$("#menuMissing").siblings().html("System Message:");
|
||||
$("#menuMissing").html("<h5>Saved</h5>");
|
||||
$("#stepOneAlert").html("");
|
||||
$("#menuCatAlert").html("");
|
||||
$("#secondStep").removeClass("red-text");
|
||||
$("#firstStep").removeClass("red-text");
|
||||
$("#stepThrid").removeClass("red-text");
|
||||
$("#createRestaurantName").val("");
|
||||
$("#createRestaureantTel").val("");
|
||||
$("#createRestaureantAdde").val("");
|
||||
$("#createRestaurantSelect").val("");
|
||||
$("#createRestaureantOPTime").val("");
|
||||
$("#createRestaureantCLTime").val("");
|
||||
$("#menuFoodName").val("");
|
||||
$("#menuFoodPrice").val("");
|
||||
if( $("#menuMissing").text()=="Saved"){
|
||||
$("#alertClose").click(function(){
|
||||
$('.modal').modal('close');
|
||||
});
|
||||
}
|
||||
$("#menuCatalog").html("<option value='' disabled selected>Choose your catalog</option>");
|
||||
$("#catalogTable").html("<tr><th>Catalog Name</th><th>All Day</th><th>Start Time</th><th>Close Time</th><th>Hidden</th><th>Action</th></tr>");
|
||||
$("#resturantMenu").html("<tr><th>Food Name</th><th>Catalog</th><th>Price</th><th>Display</th><th>Action</th></tr>");
|
||||
$(".restDel").click(function(){
|
||||
var restDel = $(this).parents(".col");
|
||||
$(this).addClass("modal-trigger");
|
||||
$("#wraningAlert").html('Do you want to delete " '+$(this).parents(".card-content").children().first().text()+'", you cannot recovery deleted menu.');
|
||||
$("#closeMenu").click(function(){
|
||||
restDel.hide();
|
||||
});
|
||||
});
|
||||
}else if(valid && btnMenuSave =="SAVE"){
|
||||
$("#menuMissing").siblings().html("System Message:");
|
||||
$("#menuMissing").html("<h5>Saved</h5>");
|
||||
if( $("#menuMissing").text()=="Saved"){
|
||||
$("#alertClose").click(function(){
|
||||
$('#createRest').modal('close');
|
||||
$("#alert").modal("close");
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
function GetURLParameter(sParam) {
|
||||
var sPageURL = window.location.search.substring(1);
|
||||
var sURLVariables = sPageURL.split('&');
|
||||
for (var i = 0; i < sURLVariables.length; i++) {
|
||||
var sParameterName = sURLVariables[i].split('=');
|
||||
if (sParameterName[0] == sParam)
|
||||
return sParameterName[1];
|
||||
}
|
||||
}
|
||||
function IsEmail(email) {
|
||||
var regex = /^([a-zA-Z0-9_\.\-\+])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
|
||||
if(!regex.test(email)) {
|
||||
return false;
|
||||
}else{
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
btnSave();
|
||||
$.deleteFav();
|
||||
$.clickFav();
|
||||
$.windowsChecksize();
|
||||
$('.chips-placeholder').chips({
|
||||
placeholder: 'The Food tag',
|
||||
secondaryPlaceholder: '+Tag',
|
||||
});
|
||||
$('.parallax').parallax();
|
||||
$('.modal').modal();
|
||||
$('.collapsible').collapsible();
|
||||
$('select').formSelect();
|
||||
$('.tabs').tabs();
|
||||
$('#createRestaurantSelect').formSelect();
|
||||
});
|
||||
12337
it114105/itp4506/Assignment/19-20/js/materialize.js
vendored
Normal file
12337
it114105/itp4506/Assignment/19-20/js/materialize.js
vendored
Normal file
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1 @@
|
||||
{"customers":[{"userID":1,"email":"jerry@gmail.com","fname":"Jerry","lname":"Kwok","pwd":"admin","rule":"user"},{"userID":2,"email":"alex@gmail.com","fname":"Alex","lname":"Ng","pwd":"admin","rule":"admin"},{"userID":3,"email":"marywong@gmail.com","fname":"Mary","lname":"Wong","pwd":"admin","rule":"user"},{"userID":4,"email":"stephy@gmail.com","fname":"Stephy","lname":"Liu","pwd":"admin","rule":"operator"},{"userID":5,"email":"tongwong@gmail.com","fname":"Tong","lname":"Wong","pwd":"admin","rule":"user"},{"userID":6,"email":"edwardleung@gmail.com","fname":"Edward","lname":"Leung","pwd":"admin","rule":"admin"},{"userID":7,"email":"test@gmail.com","fname":"abd","lname":"cab","pwd":"admin","rule":"user","favorite":[]},{"userID":8,"email":"jerry.kwok.khh@gmail.com","fname":"Jerry","lname":"Kwok","pwd":"admin","rule":"user","favorite":[]},{"userID":9,"email":"happy123@gmail.com","fname":"Jerry","lname":"Kwok","pwd":"asd","rule":"user","favorite":[]},{"userID":10,"email":"test123123@gmail.com","fname":"Jerry","lname":"Kwok","pwd":"admin","rule":"user","favorite":[]}]}
|
||||
@@ -0,0 +1 @@
|
||||
{"userID":2,"email":"alex@gmail.com","fname":"Alex","lname":"Ng","pwd":"admin","favorite":[0,1]}
|
||||
@@ -0,0 +1 @@
|
||||
{"userID":1,"email":"jerry@gmail.com","fname":"Jerry","lname":"Test","pwd":"admin","favorite":["7","2","4"]}
|
||||
113
it114105/itp4506/Assignment/19-20/jsonDB/restaurants.json
Normal file
113
it114105/itp4506/Assignment/19-20/jsonDB/restaurants.json
Normal file
@@ -0,0 +1,113 @@
|
||||
{
|
||||
"restaurants":[
|
||||
{
|
||||
"id": 1,
|
||||
"image":"images/NeNeChickenTKO.jpeg",
|
||||
"name":"ABC Chicken",
|
||||
"tel": "21800000",
|
||||
"address": "Tseung Kwan O Road",
|
||||
"opTime": "9:00 AM",
|
||||
"clTIme": "9:00 PM",
|
||||
"user": "stephy@gmail.com",
|
||||
"tag":[
|
||||
"Noodles",
|
||||
"Koeran"
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": 2,
|
||||
"image":"images/NeNeChickenTst.jpg",
|
||||
"name":"NeNe Chicken",
|
||||
"tel": "21800000",
|
||||
"address": "Tseung Kwan O Road",
|
||||
"opTime": "10:00 AM",
|
||||
"clTIme": "9:00 PM",
|
||||
"user": "stephy@gmail.com",
|
||||
"tag":[
|
||||
"Noodles",
|
||||
"Koeran"
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": 3,
|
||||
"image":"images/TeaWood.jpg",
|
||||
"name":"TeaWood Cafe",
|
||||
"tel": "21800000",
|
||||
"address": "Shop L4-19, 4/F, apm Millennium City 5, 418 Kwun Tong Road, Kwun Tong, Hong Kong",
|
||||
"opTime": "11:00 AM",
|
||||
"clTIme": "10:00 PM",
|
||||
"user": "operator@gmail.com",
|
||||
"tag":[
|
||||
"Taiwanese",
|
||||
"Rice"
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": 4,
|
||||
"image":"images/TamJai.jpg",
|
||||
"name":"TamJai SamGor",
|
||||
"tel": "21805650",
|
||||
"address": "Portion A, Shop 15, G/F, Kai Tin Tower, 55-63 Kai Tin Road, Lam Tin, Hong Kong",
|
||||
"opTime": "11:00 AM",
|
||||
"clTIme": "10:00 PM",
|
||||
"user": "operator@gmail.com",
|
||||
"tag":[
|
||||
"Noodles",
|
||||
"Chinese"
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": 5,
|
||||
"image":"images/Satay.jpg",
|
||||
"name":"Satay King ",
|
||||
"tel": "21801234",
|
||||
"address": "Room C & D, G/F, Block 2, Kwun Tong Industrial Centre, 464-466 Kwun Tong Road, Kwun Tong, X Hong Kong",
|
||||
"opTime": "11:00 AM",
|
||||
"clTIme": "9:30 PM",
|
||||
"user": "operator@gmail.com",
|
||||
"tag":[
|
||||
"Chinese",
|
||||
"Western"
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": 6,
|
||||
"image":"images/Dimsum.jpg",
|
||||
"name":"Dim Sum",
|
||||
"tel": "21845687",
|
||||
"address": "Emperor Watch & Jewellery Ctr, 2/F Russell St, Causeway Bay",
|
||||
"opTime": "11:30 AM",
|
||||
"clTIme": "11:00 PM",
|
||||
"user": "operator@gmail.com",
|
||||
"tag":[
|
||||
"Dim Sum"
|
||||
]
|
||||
}
|
||||
],
|
||||
"commRestaurants":[
|
||||
{
|
||||
"resID":1,
|
||||
"userID": 3,
|
||||
"comment":"It is Good",
|
||||
"rate":5
|
||||
},
|
||||
{
|
||||
"resID":1,
|
||||
"userID":2,
|
||||
"comment":"It is Good AR",
|
||||
"rate":3
|
||||
},
|
||||
{
|
||||
"resID": 1,
|
||||
"userID": 4,
|
||||
"comment":"It is not Good AR",
|
||||
"rate":3
|
||||
},
|
||||
{
|
||||
"resID":1,
|
||||
"userID":5,
|
||||
"comment":"Yummy",
|
||||
"rate":2
|
||||
}
|
||||
]
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
{"userID":4,"email":"stephy@gmail.com","fname":"Stephy","lname":"Liu","pwd":"admin","favorite":[]}
|
||||
17
it114105/itp4506/Assignment/19-20/jsonDB/update.php
Normal file
17
it114105/itp4506/Assignment/19-20/jsonDB/update.php
Normal file
@@ -0,0 +1,17 @@
|
||||
<?php
|
||||
if(isset($_POST["fav"])){
|
||||
$jsonCustomer = $_POST["dataCus"];
|
||||
print($jsonCustomer);
|
||||
$jsonCustomerPath = $_POST["dataEmail"].".json";
|
||||
print($jsonCustomerPath);
|
||||
file_put_contents($jsonCustomerPath, $jsonCustomer);
|
||||
}else{
|
||||
$jsonAdmin = $_POST["dataAdmin"];
|
||||
$jsonCustomer = $_POST["dataCus"];
|
||||
$jsonAdminPath = "adminCustomer.json";
|
||||
file_put_contents($jsonAdminPath, $jsonAdmin);
|
||||
$jsonCustomerPath = $_POST["dataEmail"].".json";
|
||||
fopen($jsonCustomerPath, "w");
|
||||
file_put_contents($jsonCustomerPath, $jsonCustomer);
|
||||
}
|
||||
?>
|
||||
217
it114105/itp4506/Assignment/19-20/menu/foodRestaurant1.html
Normal file
217
it114105/itp4506/Assignment/19-20/menu/foodRestaurant1.html
Normal file
@@ -0,0 +1,217 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>Yummy Everywhere</title>
|
||||
|
||||
<!-- CSS -->
|
||||
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
|
||||
<link href="../css/materialize.css" type="text/css" rel="stylesheet" media="screen,projection" />
|
||||
<link href="../css/style.css" type="text/css" rel="stylesheet" />
|
||||
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
|
||||
<script src="../js/materialize.js"></script>
|
||||
<script src="main.js"></script>
|
||||
</head>
|
||||
<script>
|
||||
$(document).ready(function(){
|
||||
$("#actionComment").click(function(){
|
||||
var foodComment = $("#foodComment").val();
|
||||
var foodRato =$("#foodRato").val();
|
||||
console.log(foodComment);
|
||||
if(foodComment.length=="" || foodRato==""){
|
||||
$("#commentAlert").html("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Comment and Rato is required</font></div></div></div>");
|
||||
return;
|
||||
}
|
||||
if(foodRato>5|| foodRato<0)
|
||||
return;
|
||||
var date = new Date();
|
||||
console.log(date.getDate()+ " " + date.getDay()+ " " + date.getMonth());
|
||||
var curDate = date.getFullYear() + "-" + (date.getMonth()+1)+ "-"+ date.getDate();
|
||||
$("#comment").append("<div class='card horizontal'><div class='card-stacked'><div class='card-content'><h6>"+sessionStorage.getItem("username")+" said:</h6>"+foodComment+" ("+foodRato+"/5.0)<br><br>Date: "+curDate+"</div></div></div>");
|
||||
$("#foodComment").val("");
|
||||
$("#foodRato").val("");
|
||||
});
|
||||
})
|
||||
</script>
|
||||
<body>
|
||||
<nav>
|
||||
<div class="nav-wrapper container">
|
||||
<a id="logo-container" href="../index.html" class="brand-logo ">Yummy Everywhere</a>
|
||||
<ul class="right">
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
<ul id="slide-out" class="sidenav">
|
||||
</ul>
|
||||
<!--- Fav Box -->
|
||||
<div id="modal_box" class="bottom-sheet">
|
||||
</div>
|
||||
|
||||
<div id="index-banner" class="parallax-container">
|
||||
<div class="parallax" style="height: 10px"><img src="../images/NeNeChickenTKO.jpeg"></div>
|
||||
</div>
|
||||
<div class="container" style="margin-top: 10px">
|
||||
<div class="row">
|
||||
<div class="col s12 m8 card" style="min-height: 515px">
|
||||
<ul id="tabs-swipe-demo" class="tabs">
|
||||
<li class="tab col s3"><a class="active" href="#test-swipe-1">Fired Chicken</a></li>
|
||||
<li class="tab col s3"><a href="#test-swipe-2">Other</a></li>
|
||||
</ul>
|
||||
<div id="test-swipe-1" class="col s12">
|
||||
<div class="card horizontal">
|
||||
<div class="card-stacked">
|
||||
<div class="card-content">
|
||||
<p>Crispy Fried Chicken</p>
|
||||
<p>$150.0</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card horizontal">
|
||||
<div class="card-stacked">
|
||||
<div class="card-content">
|
||||
<p>Creamy Fried Chicken</p>
|
||||
<p>$166.0</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="test-swipe-2" class="col s12">
|
||||
<div class="card horizontal">
|
||||
<div class="card-stacked">
|
||||
<div class="card-content">
|
||||
<p>Kimchi Rice</p>
|
||||
<p>$98.0</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col s12 m4">
|
||||
<div class="card horizontal">
|
||||
<div class="card-stacked">
|
||||
<div class="card-content">
|
||||
<p id="foodRestaurantLocation"><h4>ABC Chicken</h4>Open Hour: 9:00 AM - 9:00 PM<br>Tel: 31800000<br>Address: Shop 225, 2/F, East Point City, 8 Chung Wa Road, Tseung Kwan O, Hong Kong<br>
|
||||
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d1845.6321957204013!2d114.25828058379905!3d22.305838490238212!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x3404038d5a180b63%3A0xe2e64ecf5e89d9b7!2z5aSp5pmJ6ZmE6L-R6Zyy5aSp5YGc6LuK5aC0!5e0!3m2!1szh-TW!2shk!4v1570870535847!5m2!1szh-TW!2shk" frameborder="0" style="border:0;" width="100%" height=300px></iframe>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container">
|
||||
<div class="card horizontal">
|
||||
<div class="card-stacked">
|
||||
<div class="card-content">
|
||||
Comment<br>
|
||||
<div id="comment">
|
||||
<div class="card horizontal">
|
||||
<div class="card-stacked">
|
||||
<div class="card-content">
|
||||
<h6>stephy@gmail.com said:</h6>
|
||||
It is Good (3.2/ 5.0)<br><br>
|
||||
Date: 2019-10-01
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card horizontal">
|
||||
<div class="card-stacked">
|
||||
<div class="card-content">
|
||||
<h6>tonywong@gmail.com said:</h6>
|
||||
It is Bad (3.2/ 5.0)<br><br>
|
||||
Date: 2019-10-02
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="card-content">
|
||||
<div class="row">
|
||||
<div class="col s12">
|
||||
<div class="row">
|
||||
<div id="commentAlert"></div>
|
||||
<div class="input-field col s12">
|
||||
Input Your comment:<br>
|
||||
<textarea id="foodComment" class="materialize-textarea" placeholder="Comment..."></textarea>
|
||||
</div>
|
||||
<div class="input-field col s3 m3">
|
||||
Rato:<input id="foodRato" type="number" class="validate" min="0.0" max="5.0">/5.0
|
||||
</div>
|
||||
</div>
|
||||
<button class="btn waves-effect waves-light" type="submit" id="actionComment">Submit
|
||||
<i class="material-icons right">send</i>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<a href="../search.html" class="waves-effect waves-light btn" id="btnBack">Back</a>
|
||||
</div>
|
||||
<!-- Modal Structure -->
|
||||
<div id="modal1" class="modal" style="width: 400px;">
|
||||
<div class="row center-align">
|
||||
<div class="col s12 modal-content">
|
||||
<span class="flow-text" id="loginInfo">
|
||||
<div id="loginAlert"></div>
|
||||
<h4 style="border-bottom: 1px solid #ebebeb; height: 50px;">LOGIN</h4>
|
||||
<div class="input-field col s12">
|
||||
<i class="material-icons prefix">account_circle</i>
|
||||
<input id="loginEmail" type="text" class="validate" required>
|
||||
<label for="loginEmail">Email</label>
|
||||
</div><br>
|
||||
<div class="input-field col s12">
|
||||
<i class="material-icons prefix">vpn_key</i>
|
||||
<input id="loginPwd" type="password" class="validate" required>
|
||||
<label for="loginPwd">Password</label>
|
||||
</div>
|
||||
|
||||
<a class="waves-effect waves-light btn col s10 offset-s1" style="margin-top: 50px" id="btnSubmitLogin">LOGIN</a>
|
||||
<h6 class=" col s12">Don"t have an account? <a href="#" id="createAccount">Sign up here</a></h6>
|
||||
</span>
|
||||
|
||||
<span class="flow-text" id="createInfo">
|
||||
<div id="pwdAlert"></div>
|
||||
<h4 style='border-bottom: 1px solid #ebebeb; height: 50px;'>REGISTER</h4><div class='input-field col s6'><input id='first_name' type='text' class='validate' required><label for='first_name'>First Name</label></div><div class='input-field col s6'><input id='last_name' type='text' class='validate' required><label for='last_name'>Last Name</label></div><div class='input-field col s12'><input id='regEmail' type='email' class='validate' required><label for='regEmail'>Email</label></div><div class='input-field col s12'><input id='regPassword' type='password' class='validate' required><label for='regPassword'>Password</label></div><div class='input-field col s12'><input id='checkPassword' type='password' class='validate' required><label for='checkPassword'>Confirm Password</label></div><a class='waves-effect waves-light btn col s10 offset-s1' style='margin-top: 50px' id='btnSubmitRegister'>REGISTER</a><h6 class='col s12' id="changeLogin">You have an account? <a href='#' id='loginAccount'>Login</a></h6>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal-footer">
|
||||
<a href="#!" class=" modal-action modal-close waves-effect waves-green btn-flat">Close</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer class="page-footer teal">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
|
||||
<div class="col l3 s12">
|
||||
<h5 class="white-text">Connect</h5>
|
||||
<ul>
|
||||
<li><a class="white-text" href="../aboutus.html">About Us</a></li>
|
||||
<li><a class="white-text" href="../userGuide.html">User Guide</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-copyright">
|
||||
<div class="container">Copyright © 2019 InnoTech HK Inc. All rights reserved</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<!-- Scripts-->
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
222
it114105/itp4506/Assignment/19-20/menu/foodRestaurant2.html
Normal file
222
it114105/itp4506/Assignment/19-20/menu/foodRestaurant2.html
Normal file
@@ -0,0 +1,222 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>Yummy Everywhere</title>
|
||||
|
||||
<!-- CSS -->
|
||||
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
|
||||
<link href="../css/materialize.css" type="text/css" rel="stylesheet" media="screen,projection" />
|
||||
<link href="../css/style.css" type="text/css" rel="stylesheet" />
|
||||
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
|
||||
<script src="../js/materialize.js"></script>
|
||||
<script src="main.js"></script>
|
||||
</head>
|
||||
<script>
|
||||
$(document).ready(function(){
|
||||
$("#actionComment").click(function(){
|
||||
var foodComment = $("#foodComment").val();
|
||||
var foodRato =$("#foodRato").val();
|
||||
if(foodComment.length=="" || foodRato==""){
|
||||
$("#commentAlert").html("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Comment and Rato is required</font></div></div></div>");
|
||||
return;
|
||||
}
|
||||
if(foodRato>5|| foodRato<0)
|
||||
return;
|
||||
var date = new Date();
|
||||
var curDate = date.getFullYear() + "-" + (date.getMonth()+1)+ "-"+ date.getDate();
|
||||
$("#comment").append("<div class='card horizontal'><div class='card-stacked'><div class='card-content'><h6>"+sessionStorage.getItem("username")+" said:</h6>"+foodComment+" ("+foodRato+"/5.0)<br><br>Date: "+curDate+"</div></div></div>");
|
||||
$("#foodComment").val("");
|
||||
$("#foodRato").val("");
|
||||
});
|
||||
})
|
||||
</script>
|
||||
<body>
|
||||
<nav>
|
||||
<div class="nav-wrapper container">
|
||||
<a id="logo-container" href="../index.html" class="brand-logo ">Yummy Everywhere</a>
|
||||
<ul class="right">
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
<ul id="slide-out" class="sidenav">
|
||||
</ul>
|
||||
<!--- Fav Box -->
|
||||
<div id="modal_box" class="bottom-sheet">
|
||||
</div>
|
||||
|
||||
<div id="index-banner" class="parallax-container">
|
||||
<div class="parallax" style="height: 10px"><img src="../images/NeNeChickenTst-1.jpg"></div>
|
||||
</div>
|
||||
<div class="container" style="margin-top: 50px">
|
||||
<div class="row">
|
||||
<div class="col s12 m8 card" style="min-height: 515px">
|
||||
<ul id="tabs-swipe-demo" class="tabs">
|
||||
<li class="tab col s3"><a class="active" href="#test-swipe-1">Fired Chicken</a></li>
|
||||
<li class="tab col s3"><a href="#test-swipe-2">Single Order</a></li>
|
||||
<li class="tab col s3"><a href="#test-swipe-3">Other</a></li>
|
||||
</ul>
|
||||
<div id="test-swipe-1" class="col s12">
|
||||
<div class="card horizontal">
|
||||
<div class="card-stacked">
|
||||
<div class="card-content">
|
||||
<p>Crispy Fried Chicken</p>
|
||||
<p>$150.0</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card horizontal">
|
||||
<div class="card-stacked">
|
||||
<div class="card-content">
|
||||
<p>Creamy Fried Chicken</p>
|
||||
<p>$166.0</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card horizontal">
|
||||
<div class="card-stacked">
|
||||
<div class="card-content">
|
||||
<p>Green Chicken</p>
|
||||
<p>$174.0</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="test-swipe-2" class="col s12">
|
||||
<div class="card horizontal">
|
||||
<div class="card-stacked">
|
||||
<div class="card-content">
|
||||
<p>Rice Roll</p>
|
||||
<p>$78.0</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card horizontal">
|
||||
<div class="card-stacked">
|
||||
<div class="card-content">
|
||||
<p>Ginseng Soup</p>
|
||||
<p>$178.0</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="test-swipe-3" class="col s12">
|
||||
<div class="card horizontal">
|
||||
<div class="card-stacked">
|
||||
<div class="card-content">
|
||||
<p>Kimchi Rice</p>
|
||||
<p>$98.0</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col s12 m4">
|
||||
<div class="card horizontal">
|
||||
<div class="card-stacked">
|
||||
<div class="card-content">
|
||||
<p id="foodRestaurantLocation"><h4>NeNe Chicken</h4>Open Hour: 9:00 AM - 9:00 PM<br>Tel: 21800000<br>Address: Shop 225, 3/F, East Point City, 8 Chung Wa Road, Tseung Kwan O, Hong Kong<br>
|
||||
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d1845.6321957204013!2d114.25828058379905!3d22.305838490238212!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x3404038d5a180b63%3A0xe2e64ecf5e89d9b7!2z5aSp5pmJ6ZmE6L-R6Zyy5aSp5YGc6LuK5aC0!5e0!3m2!1szh-TW!2shk!4v1570870535847!5m2!1szh-TW!2shk" frameborder="0" style="border:0;" width="100%" height=300px></iframe>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container">
|
||||
<div class="card horizontal">
|
||||
<div class="card-stacked">
|
||||
<div class="card-content">
|
||||
Comment<br>
|
||||
<div id="comment">
|
||||
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="card-content">
|
||||
<div class="row">
|
||||
<div class="col s12">
|
||||
<div class="row">
|
||||
<div id="commentAlert"></div>
|
||||
<div class="input-field col s12">
|
||||
Input Your comment:<br>
|
||||
<textarea id="foodComment" class="materialize-textarea" placeholder="Comment..."></textarea>
|
||||
</div>
|
||||
<div class="input-field col s3 m3">
|
||||
Rato:<input id="foodRato" type="number" class="validate" min="0.0" max="5.0">/5.0
|
||||
</div>
|
||||
</div>
|
||||
<button class="btn waves-effect waves-light" type="submit" id="actionComment">Submit
|
||||
<i class="material-icons right">send</i>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<a href="../search.html" class="waves-effect waves-light btn" id="btnBack">Back</a>
|
||||
</div>
|
||||
<!-- Modal Structure -->
|
||||
<div id="modal1" class="modal" style="width: 400px;">
|
||||
<div class="row center-align">
|
||||
<div class="col s12 modal-content">
|
||||
<span class="flow-text" id="loginInfo">
|
||||
<div id="loginAlert"></div>
|
||||
<h4 style="border-bottom: 1px solid #ebebeb; height: 50px;">LOGIN</h4>
|
||||
<div class="input-field col s12">
|
||||
<i class="material-icons prefix">account_circle</i>
|
||||
<input id="loginEmail" type="text" class="validate" required>
|
||||
<label for="loginEmail">Email</label>
|
||||
</div><br>
|
||||
<div class="input-field col s12">
|
||||
<i class="material-icons prefix">vpn_key</i>
|
||||
<input id="loginPwd" type="password" class="validate" required>
|
||||
<label for="loginPwd">Password</label>
|
||||
</div>
|
||||
|
||||
<a class="waves-effect waves-light btn col s10 offset-s1" style="margin-top: 50px" id="btnSubmitLogin">LOGIN</a>
|
||||
<h6 class=" col s12">Don"t have an account? <a href="#" id="createAccount">Sign up here</a></h6>
|
||||
</span>
|
||||
|
||||
<span class="flow-text" id="createInfo">
|
||||
<div id="pwdAlert"></div>
|
||||
<h4 style='border-bottom: 1px solid #ebebeb; height: 50px;'>REGISTER</h4><div class='input-field col s6'><input id='first_name' type='text' class='validate' required><label for='first_name'>First Name</label></div><div class='input-field col s6'><input id='last_name' type='text' class='validate' required><label for='last_name'>Last Name</label></div><div class='input-field col s12'><input id='regEmail' type='email' class='validate' required><label for='regEmail'>Email</label></div><div class='input-field col s12'><input id='regPassword' type='password' class='validate' required><label for='regPassword'>Password</label></div><div class='input-field col s12'><input id='checkPassword' type='password' class='validate' required><label for='checkPassword'>Confirm Password</label></div><a class='waves-effect waves-light btn col s10 offset-s1' style='margin-top: 50px' id='btnSubmitRegister'>REGISTER</a><h6 class='col s12' id="changeLogin">You have an account? <a href='#' id='loginAccount'>Login</a></h6>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal-footer">
|
||||
<a href="#!" class=" modal-action modal-close waves-effect waves-green btn-flat">Close</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer class="page-footer teal">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
|
||||
<div class="col l3 s12">
|
||||
<h5 class="white-text">Connect</h5>
|
||||
<ul>
|
||||
<li><a class="white-text" href="../aboutus.html">About Us</a></li>
|
||||
<li><a class="white-text" href="../userGuide.html">User Guide</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-copyright">
|
||||
<div class="container">Copyright © 2019 InnoTech HK Inc. All rights reserved</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<!-- Scripts-->
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
220
it114105/itp4506/Assignment/19-20/menu/foodRestaurant3.html
Normal file
220
it114105/itp4506/Assignment/19-20/menu/foodRestaurant3.html
Normal file
@@ -0,0 +1,220 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>Yummy Everywhere</title>
|
||||
|
||||
<!-- CSS -->
|
||||
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
|
||||
<link href="../css/materialize.css" type="text/css" rel="stylesheet" media="screen,projection" />
|
||||
<link href="../css/style.css" type="text/css" rel="stylesheet" />
|
||||
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
|
||||
<script src="../js/materialize.js"></script>
|
||||
<script src="main.js"></script>
|
||||
</head>
|
||||
<script>
|
||||
$(document).ready(function(){
|
||||
$("#actionComment").click(function(){
|
||||
var foodComment = $("#foodComment").val();
|
||||
var foodRato =$("#foodRato").val();
|
||||
console.log(foodComment);
|
||||
if(foodComment.length=="" || foodRato==""){
|
||||
$("#commentAlert").html("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Comment and Rato is required</font></div></div></div>");
|
||||
return;
|
||||
}
|
||||
if(foodRato>5|| foodRato<0)
|
||||
return;
|
||||
var date = new Date();
|
||||
console.log(date.getDate()+ " " + date.getDay()+ " " + date.getMonth());
|
||||
var curDate = date.getFullYear() + "-" + (date.getMonth()+1)+ "-"+ date.getDate();
|
||||
$("#comment").append("<div class='card horizontal'><div class='card-stacked'><div class='card-content'><h6>"+sessionStorage.getItem("username")+" said:</h6>"+foodComment+" ("+foodRato+"/5.0)<br><br>Date: "+curDate+"</div></div></div>");
|
||||
$("#foodComment").val("");
|
||||
$("#foodRato").val("");
|
||||
});
|
||||
})
|
||||
</script>
|
||||
<body>
|
||||
<nav>
|
||||
<div class="nav-wrapper container">
|
||||
<a id="logo-container" href="../index.html" class="brand-logo ">Yummy Everywhere</a>
|
||||
<ul class="right">
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
<ul id="slide-out" class="sidenav">
|
||||
</ul>
|
||||
<!--- Fav Box -->
|
||||
<div id="modal_box" class="bottom-sheet">
|
||||
</div>
|
||||
|
||||
<div id="index-banner" class="parallax-container">
|
||||
<div class="parallax" style="height: 10px"><img src="../images/TeaWood-1.jpg"></div>
|
||||
</div>
|
||||
<div class="container" style="margin-top: 50px">
|
||||
<div class="row">
|
||||
<div class="col s12 m8 card" style="min-height: 515px">
|
||||
<ul id="tabs-swipe-demo" class="tabs">
|
||||
<li class="tab col s3"><a class="active" href="#test-swipe-1">TAIWANESE DISHES</a></li>
|
||||
<li class="tab col s3"><a href="#test-swipe-2">RICE</a></li>
|
||||
</ul>
|
||||
<div id="test-swipe-1" class="col s12">
|
||||
<div class="card horizontal">
|
||||
<div class="card-stacked">
|
||||
<div class="card-content">
|
||||
<p>Fired Chicken Pieces</p>
|
||||
<p>$68.0</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card horizontal">
|
||||
<div class="card-stacked">
|
||||
<div class="card-content">
|
||||
<p>Sweet Soft-boiled Egg</p>
|
||||
<p>$42.0</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card horizontal">
|
||||
<div class="card-stacked">
|
||||
<div class="card-content">
|
||||
<p>Wonton with Chili Oil</p>
|
||||
<p>$66.0</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="test-swipe-2" class="col s12">
|
||||
<div class="card horizontal">
|
||||
<div class="card-stacked">
|
||||
<div class="card-content">
|
||||
<p>Rice with Marinated Minced Pork and Soft-boiled Egg</p>
|
||||
<p>$77.0</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card horizontal">
|
||||
<div class="card-stacked">
|
||||
<div class="card-content">
|
||||
<p>Rice with Fried Chicken Fillet, Marinated Minced Pork</p>
|
||||
<p>$77.0</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card horizontal">
|
||||
<div class="card-stacked">
|
||||
<div class="card-content">
|
||||
<p>Rice with Fried Pork and Marinated Minced Pork</p>
|
||||
<p>$77.0</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col s12 m4">
|
||||
<div class="card horizontal">
|
||||
<div class="card-stacked">
|
||||
<div class="card-content">
|
||||
<p id="foodRestaurantLocation"><h4>TeaWood Cafe</h4>Open Hour: 9:00 AM - 8:00 PM<br>Tel: 21812300<br>Address: Shop L4-19, 4/F, apm Millennium City 5, 418 Kwun Tong Road, Kwun Tong, Hong Kong<br>
|
||||
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3691.096920074908!2d114.2229437828064!3d22.31217400715772!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x0%3A0xf5e1a2461194aa9a!2zYXBt5Ym157SA5LmL5Z-ONeacnw!5e0!3m2!1szh-TW!2shk!4v1570882726423!5m2!1szh-TW!2shk" frameborder="0" style="border:0;" width="100%" height=300px></iframe>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container">
|
||||
<div class="card horizontal">
|
||||
<div class="card-stacked">
|
||||
<div class="card-content">
|
||||
Comment<br>
|
||||
<div id="comment">
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="card-content">
|
||||
<div class="row">
|
||||
<div class="col s12">
|
||||
<div class="row">
|
||||
<div id="commentAlert"></div>
|
||||
<div class="input-field col s12">
|
||||
Input Your comment:<br>
|
||||
<textarea id="foodComment" class="materialize-textarea" placeholder="Comment..."></textarea>
|
||||
</div>
|
||||
<div class="input-field col s3 m3">
|
||||
Rato:<input id="foodRato" type="number" class="validate" min="0.0" max="5.0">/5.0
|
||||
</div>
|
||||
</div>
|
||||
<button class="btn waves-effect waves-light" type="submit" id="actionComment">Submit
|
||||
<i class="material-icons right">send</i>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<a href="../search.html" class="waves-effect waves-light btn" id="btnBack">Back</a>
|
||||
</div>
|
||||
<!-- Modal Structure -->
|
||||
<div id="modal1" class="modal" style="width: 400px;">
|
||||
<div class="row center-align">
|
||||
<div class="col s12 modal-content">
|
||||
<span class="flow-text" id="loginInfo">
|
||||
<div id="loginAlert"></div>
|
||||
<h4 style="border-bottom: 1px solid #ebebeb; height: 50px;">LOGIN</h4>
|
||||
<div class="input-field col s12">
|
||||
<i class="material-icons prefix">account_circle</i>
|
||||
<input id="loginEmail" type="text" class="validate" required>
|
||||
<label for="loginEmail">Email</label>
|
||||
</div><br>
|
||||
<div class="input-field col s12">
|
||||
<i class="material-icons prefix">vpn_key</i>
|
||||
<input id="loginPwd" type="password" class="validate" required>
|
||||
<label for="loginPwd">Password</label>
|
||||
</div>
|
||||
|
||||
<a class="waves-effect waves-light btn col s10 offset-s1" style="margin-top: 50px" id="btnSubmitLogin">LOGIN</a>
|
||||
<h6 class=" col s12">Don"t have an account? <a href="#" id="createAccount">Sign up here</a></h6>
|
||||
</span>
|
||||
|
||||
<span class="flow-text" id="createInfo">
|
||||
<div id="pwdAlert"></div>
|
||||
<h4 style='border-bottom: 1px solid #ebebeb; height: 50px;'>REGISTER</h4><div class='input-field col s6'><input id='first_name' type='text' class='validate' required><label for='first_name'>First Name</label></div><div class='input-field col s6'><input id='last_name' type='text' class='validate' required><label for='last_name'>Last Name</label></div><div class='input-field col s12'><input id='regEmail' type='email' class='validate' required><label for='regEmail'>Email</label></div><div class='input-field col s12'><input id='regPassword' type='password' class='validate' required><label for='regPassword'>Password</label></div><div class='input-field col s12'><input id='checkPassword' type='password' class='validate' required><label for='checkPassword'>Confirm Password</label></div><a class='waves-effect waves-light btn col s10 offset-s1' style='margin-top: 50px' id='btnSubmitRegister'>REGISTER</a><h6 class='col s12' id="changeLogin">You have an account? <a href='#' id='loginAccount'>Login</a></h6>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal-footer">
|
||||
<a href="#!" class=" modal-action modal-close waves-effect waves-green btn-flat">Close</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer class="page-footer teal">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
|
||||
<div class="col l3 s12">
|
||||
<h5 class="white-text">Connect</h5>
|
||||
<ul>
|
||||
<li><a class="white-text" href="../aboutus.html">About Us</a></li>
|
||||
<li><a class="white-text" href="../userGuide.html">User Guide</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-copyright">
|
||||
<div class="container">Copyright © 2019 InnoTech HK Inc. All rights reserved</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<!-- Scripts-->
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
162
it114105/itp4506/Assignment/19-20/menu/foodRestaurant4.html
Normal file
162
it114105/itp4506/Assignment/19-20/menu/foodRestaurant4.html
Normal file
@@ -0,0 +1,162 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>Yummy Everywhere</title>
|
||||
|
||||
<!-- CSS -->
|
||||
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
|
||||
<link href="../css/materialize.css" type="text/css" rel="stylesheet" media="screen,projection" />
|
||||
<link href="../css/style.css" type="text/css" rel="stylesheet" />
|
||||
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
|
||||
<script src="../js/materialize.js"></script>
|
||||
<script src="main.js"></script>
|
||||
</head>
|
||||
<script>
|
||||
$(document).ready(function(){
|
||||
$("#actionComment").click(function(){
|
||||
var foodComment = $("#foodComment").val();
|
||||
var foodRato =$("#foodRato").val();
|
||||
console.log(foodComment);
|
||||
if(foodComment.length=="" || foodRato==""){
|
||||
$("#commentAlert").html("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Comment and Rato is required</font></div></div></div>");
|
||||
return;
|
||||
}
|
||||
if(foodRato>5|| foodRato<0)
|
||||
return;
|
||||
var date = new Date();
|
||||
console.log(date.getDate()+ " " + date.getDay()+ " " + date.getMonth());
|
||||
var curDate = date.getFullYear() + "-" + (date.getMonth()+1)+ "-"+ date.getDate();
|
||||
$("#comment").append("<div class='card horizontal'><div class='card-stacked'><div class='card-content'><h6>"+sessionStorage.getItem("username")+" said:</h6>"+foodComment+" ("+foodRato+"/5.0)<br><br>Date: "+curDate+"</div></div></div>");
|
||||
$("#foodComment").val("");
|
||||
$("#foodRato").val("");
|
||||
});
|
||||
})
|
||||
</script>
|
||||
<body>
|
||||
<nav>
|
||||
<div class="nav-wrapper container">
|
||||
<a id="logo-container" href="../index.html" class="brand-logo ">Yummy Everywhere</a>
|
||||
<ul class="right">
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
<ul id="slide-out" class="sidenav">
|
||||
</ul>
|
||||
<!--- Fav Box -->
|
||||
<div id="modal_box" class="bottom-sheet">
|
||||
</div>
|
||||
|
||||
<div id="index-banner" class="parallax-container">
|
||||
<div class="parallax" style="height: 10px"><img src="../images/TamJai-1.jpg"></div>
|
||||
</div>
|
||||
<div class="container" style="margin-top: 50px">
|
||||
<div class="row">
|
||||
<div class="col s12">
|
||||
<div class="card horizontal">
|
||||
<div class="card-stacked">
|
||||
<div class="card-content">
|
||||
<p id="foodRestaurantLocation"><h4>TamJai SamGor</h4>Open Hour: 11:00 AM - 10:00 PM<br>Tel: 21805650<br>Address: Portion A, Shop 15, G/F, Kai Tin Tower, 55-63 Kai Tin Road, Lam Tin, Hong Kong<br>
|
||||
<iframe src="https://www.google.com/maps/embed?pb=!1m16!1m12!1m3!1d3691.174919978861!2d114.23165941537265!3d22.30922344820756!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!2m1!1s%20Portion%20A%2C%20Shop%2015%2C%20G%2FF%2C%20Kai%20Tin%20Tower%2C%2055-63%20Kai%20Tin%20Road%2C%20Lam%20Tin%2C%20Hong%20Kong!5e0!3m2!1szh-TW!2shk!4v1570883956564!5m2!1szh-TW!2shk" frameborder="0" style="border:0;" width="100%" height=300px></iframe>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container">
|
||||
<div class="card horizontal">
|
||||
<div class="card-stacked">
|
||||
<div class="card-content">
|
||||
Comment<br>
|
||||
<div id="comment">
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="card-content">
|
||||
<div class="row">
|
||||
<div class="col s12">
|
||||
<div class="row">
|
||||
<div id="commentAlert"></div>
|
||||
<div class="input-field col s12">
|
||||
Input Your comment:<br>
|
||||
<textarea id="foodComment" class="materialize-textarea" placeholder="Comment..."></textarea>
|
||||
</div>
|
||||
<div class="input-field col s3 m3">
|
||||
Rato:<input id="foodRato" type="number" class="validate" min="0.0" max="5.0">/5.0
|
||||
</div>
|
||||
</div>
|
||||
<button class="btn waves-effect waves-light" type="submit" id="actionComment">Submit
|
||||
<i class="material-icons right">send</i>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<a href="../search.html" class="waves-effect waves-light btn" id="btnBack">Back</a>
|
||||
</div>
|
||||
<!-- Modal Structure -->
|
||||
<div id="modal1" class="modal" style="width: 400px;">
|
||||
<div class="row center-align">
|
||||
<div class="col s12 modal-content">
|
||||
<span class="flow-text" id="loginInfo">
|
||||
<div id="loginAlert"></div>
|
||||
<h4 style="border-bottom: 1px solid #ebebeb; height: 50px;">LOGIN</h4>
|
||||
<div class="input-field col s12">
|
||||
<i class="material-icons prefix">account_circle</i>
|
||||
<input id="loginEmail" type="text" class="validate" required>
|
||||
<label for="loginEmail">Email</label>
|
||||
</div><br>
|
||||
<div class="input-field col s12">
|
||||
<i class="material-icons prefix">vpn_key</i>
|
||||
<input id="loginPwd" type="password" class="validate" required>
|
||||
<label for="loginPwd">Password</label>
|
||||
</div>
|
||||
|
||||
<a class="waves-effect waves-light btn col s10 offset-s1" style="margin-top: 50px" id="btnSubmitLogin">LOGIN</a>
|
||||
<h6 class=" col s12">Don"t have an account? <a href="#" id="createAccount">Sign up here</a></h6>
|
||||
</span>
|
||||
|
||||
<span class="flow-text" id="createInfo">
|
||||
<div id="pwdAlert"></div>
|
||||
<h4 style='border-bottom: 1px solid #ebebeb; height: 50px;'>REGISTER</h4><div class='input-field col s6'><input id='first_name' type='text' class='validate' required><label for='first_name'>First Name</label></div><div class='input-field col s6'><input id='last_name' type='text' class='validate' required><label for='last_name'>Last Name</label></div><div class='input-field col s12'><input id='regEmail' type='email' class='validate' required><label for='regEmail'>Email</label></div><div class='input-field col s12'><input id='regPassword' type='password' class='validate' required><label for='regPassword'>Password</label></div><div class='input-field col s12'><input id='checkPassword' type='password' class='validate' required><label for='checkPassword'>Confirm Password</label></div><a class='waves-effect waves-light btn col s10 offset-s1' style='margin-top: 50px' id='btnSubmitRegister'>REGISTER</a><h6 class='col s12' id="changeLogin">You have an account? <a href='#' id='loginAccount'>Login</a></h6>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal-footer">
|
||||
<a href="#!" class=" modal-action modal-close waves-effect waves-green btn-flat">Close</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer class="page-footer teal">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
|
||||
<div class="col l3 s12">
|
||||
<h5 class="white-text">Connect</h5>
|
||||
<ul>
|
||||
<li><a class="white-text" href="../aboutus.html">About Us</a></li>
|
||||
<li><a class="white-text" href="../userGuide.html">User Guide</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-copyright">
|
||||
<div class="container">Copyright © 2019 InnoTech HK Inc. All rights reserved</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<!-- Scripts-->
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
162
it114105/itp4506/Assignment/19-20/menu/foodRestaurant5.html
Normal file
162
it114105/itp4506/Assignment/19-20/menu/foodRestaurant5.html
Normal file
@@ -0,0 +1,162 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>Yummy Everywhere</title>
|
||||
|
||||
<!-- CSS -->
|
||||
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
|
||||
<link href="../css/materialize.css" type="text/css" rel="stylesheet" media="screen,projection" />
|
||||
<link href="../css/style.css" type="text/css" rel="stylesheet" />
|
||||
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
|
||||
<script src="../js/materialize.js"></script>
|
||||
<script src="main.js"></script>
|
||||
</head>
|
||||
<script>
|
||||
$(document).ready(function(){
|
||||
$("#actionComment").click(function(){
|
||||
var foodComment = $("#foodComment").val();
|
||||
var foodRato =$("#foodRato").val();
|
||||
console.log(foodComment);
|
||||
if(foodComment.length=="" || foodRato==""){
|
||||
$("#commentAlert").html("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Comment and Rato is required</font></div></div></div>");
|
||||
return;
|
||||
}
|
||||
if(foodRato>5|| foodRato<0)
|
||||
return;
|
||||
var date = new Date();
|
||||
console.log(date.getDate()+ " " + date.getDay()+ " " + date.getMonth());
|
||||
var curDate = date.getFullYear() + "-" + (date.getMonth()+1)+ "-"+ date.getDate();
|
||||
$("#comment").append("<div class='card horizontal'><div class='card-stacked'><div class='card-content'><h6>"+sessionStorage.getItem("username")+" said:</h6>"+foodComment+" ("+foodRato+"/5.0)<br><br>Date: "+curDate+"</div></div></div>");
|
||||
$("#foodComment").val("");
|
||||
$("#foodRato").val("");
|
||||
});
|
||||
})
|
||||
</script>
|
||||
<body>
|
||||
<nav>
|
||||
<div class="nav-wrapper container">
|
||||
<a id="logo-container" href="../index.html" class="brand-logo ">Yummy Everywhere</a>
|
||||
<ul class="right">
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
<ul id="slide-out" class="sidenav">
|
||||
</ul>
|
||||
<!--- Fav Box -->
|
||||
<div id="modal_box" class="bottom-sheet">
|
||||
</div>
|
||||
|
||||
<div id="index-banner" class="parallax-container">
|
||||
<div class="parallax" style="height: 10px"><img src="../images/Satay-1.jpg"></div>
|
||||
</div>
|
||||
<div class="container" style="margin-top: 50px">
|
||||
<div class="row">
|
||||
<div class="col s12">
|
||||
<div class="card horizontal">
|
||||
<div class="card-stacked">
|
||||
<div class="card-content">
|
||||
<p id="foodRestaurantLocation"><h4>Satay King</h4>Open Hour: 11:00 AM - 9:30 PM<br>Tel: 21801230<br>Address: Room D, G/F, Block 2, Kwun Tong Industrial Centre, 464-466 Kwun Tong Road, Kwun Tong, X Hong Kong<br>
|
||||
<iframe src="https://www.google.com/maps/embed?pb=!1m16!1m12!1m3!1d3691.1414156713886!2d114.22580881533696!3d22.3104908853182!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!2m1!1sRoom%20C%20%26%20D%2C%20G%2FF%2C%20Block%202%2C%20Kwun%20Tong%20Industrial%20Centre%2C%20464-466%20Kwun%20Tong%20Road%2C%20Kwun%20Tong%2C%20X%20Hong%20Kong!5e0!3m2!1szh-TW!2shk!4v1570884269224!5m2!1szh-TW!2shk" frameborder="0" style="border:0;" width="100%" height=300px></iframe>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container">
|
||||
<div class="card horizontal">
|
||||
<div class="card-stacked">
|
||||
<div class="card-content">
|
||||
Comment<br>
|
||||
<div id="comment">
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="card-content">
|
||||
<div class="row">
|
||||
<div class="col s12">
|
||||
<div class="row">
|
||||
<div id="commentAlert"></div>
|
||||
<div class="input-field col s12">
|
||||
Input Your comment:<br>
|
||||
<textarea id="foodComment" class="materialize-textarea" placeholder="Comment..."></textarea>
|
||||
</div>
|
||||
<div class="input-field col s3 m3">
|
||||
Rato:<input id="foodRato" type="number" class="validate" min="0.0" max="5.0">/5.0
|
||||
</div>
|
||||
</div>
|
||||
<button class="btn waves-effect waves-light" type="submit" id="actionComment">Submit
|
||||
<i class="material-icons right">send</i>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<a href="../search.html" class="waves-effect waves-light btn" id="btnBack">Back</a>
|
||||
</div>
|
||||
<!-- Modal Structure -->
|
||||
<div id="modal1" class="modal" style="width: 400px;">
|
||||
<div class="row center-align">
|
||||
<div class="col s12 modal-content">
|
||||
<span class="flow-text" id="loginInfo">
|
||||
<div id="loginAlert"></div>
|
||||
<h4 style="border-bottom: 1px solid #ebebeb; height: 50px;">LOGIN</h4>
|
||||
<div class="input-field col s12">
|
||||
<i class="material-icons prefix">account_circle</i>
|
||||
<input id="loginEmail" type="text" class="validate" required>
|
||||
<label for="loginEmail">Email</label>
|
||||
</div><br>
|
||||
<div class="input-field col s12">
|
||||
<i class="material-icons prefix">vpn_key</i>
|
||||
<input id="loginPwd" type="password" class="validate" required>
|
||||
<label for="loginPwd">Password</label>
|
||||
</div>
|
||||
|
||||
<a class="waves-effect waves-light btn col s10 offset-s1" style="margin-top: 50px" id="btnSubmitLogin">LOGIN</a>
|
||||
<h6 class=" col s12">Don"t have an account? <a href="#" id="createAccount">Sign up here</a></h6>
|
||||
</span>
|
||||
|
||||
<span class="flow-text" id="createInfo">
|
||||
<div id="pwdAlert"></div>
|
||||
<h4 style='border-bottom: 1px solid #ebebeb; height: 50px;'>REGISTER</h4><div class='input-field col s6'><input id='first_name' type='text' class='validate' required><label for='first_name'>First Name</label></div><div class='input-field col s6'><input id='last_name' type='text' class='validate' required><label for='last_name'>Last Name</label></div><div class='input-field col s12'><input id='regEmail' type='email' class='validate' required><label for='regEmail'>Email</label></div><div class='input-field col s12'><input id='regPassword' type='password' class='validate' required><label for='regPassword'>Password</label></div><div class='input-field col s12'><input id='checkPassword' type='password' class='validate' required><label for='checkPassword'>Confirm Password</label></div><a class='waves-effect waves-light btn col s10 offset-s1' style='margin-top: 50px' id='btnSubmitRegister'>REGISTER</a><h6 class='col s12' id="changeLogin">You have an account? <a href='#' id='loginAccount'>Login</a></h6>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal-footer">
|
||||
<a href="#!" class=" modal-action modal-close waves-effect waves-green btn-flat">Close</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer class="page-footer teal">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
|
||||
<div class="col l3 s12">
|
||||
<h5 class="white-text">Connect</h5>
|
||||
<ul>
|
||||
<li><a class="white-text" href="../aboutus.html">About Us</a></li>
|
||||
<li><a class="white-text" href="../userGuide.html">User Guide</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-copyright">
|
||||
<div class="container">Copyright © 2019 InnoTech HK Inc. All rights reserved</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<!-- Scripts-->
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
161
it114105/itp4506/Assignment/19-20/menu/foodRestaurant6.html
Normal file
161
it114105/itp4506/Assignment/19-20/menu/foodRestaurant6.html
Normal file
@@ -0,0 +1,161 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>Yummy Everywhere</title>
|
||||
|
||||
<!-- CSS -->
|
||||
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
|
||||
<link href="../css/materialize.css" type="text/css" rel="stylesheet" media="screen,projection" />
|
||||
<link href="../css/style.css" type="text/css" rel="stylesheet" />
|
||||
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
|
||||
<script src="../js/materialize.js"></script>
|
||||
<script src="main.js"></script>
|
||||
</head>
|
||||
<script>
|
||||
$(document).ready(function(){
|
||||
$("#actionComment").click(function(){
|
||||
var foodComment = $("#foodComment").val();
|
||||
var foodRato =$("#foodRato").val();
|
||||
console.log(foodComment);
|
||||
if(foodComment.length=="" || foodRato==""){
|
||||
$("#commentAlert").html("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Comment and Rato is required</font></div></div></div>");
|
||||
return;
|
||||
}
|
||||
if(foodRato>5|| foodRato<0)
|
||||
return;
|
||||
var date = new Date();
|
||||
var curDate = date.getFullYear() + "-" + (date.getMonth()+1)+ "-"+ date.getDate();
|
||||
$("#comment").append("<div class='card horizontal'><div class='card-stacked'><div class='card-content'><h6>"+sessionStorage.getItem("username")+" said:</h6>"+foodComment+" ("+foodRato+"/5.0)<br><br>Date: "+curDate+"</div></div></div>");
|
||||
$("#foodComment").val("");
|
||||
$("#foodRato").val("");
|
||||
});
|
||||
})
|
||||
</script>
|
||||
<body>
|
||||
<nav>
|
||||
<div class="nav-wrapper container">
|
||||
<a id="logo-container" href="../index.html" class="brand-logo ">Yummy Everywhere</a>
|
||||
<ul class="right">
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
<ul id="slide-out" class="sidenav">
|
||||
</ul>
|
||||
<!--- Fav Box -->
|
||||
<div id="modal_box" class="bottom-sheet">
|
||||
</div>
|
||||
|
||||
<div id="index-banner" class="parallax-container">
|
||||
<div class="parallax" style="height: 10px"><img src="../images/Dimsum-1.jpg"></div>
|
||||
</div>
|
||||
<div class="container" style="margin-top: 50px">
|
||||
<div class="row">
|
||||
<div class="col s12">
|
||||
<div class="card horizontal">
|
||||
<div class="card-stacked">
|
||||
<div class="card-content">
|
||||
<p id="foodRestaurantLocation"><h4>YUM CHA</h4>Open Hour: 11:30 AM - 11:00 PM<br>Tel: 31800000<br>Address: Emperor Watch Jewellery Ctr, 2/F Russell St, Causeway Bay, Hong Kong<br>
|
||||
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3104.5680681006934!2d114.18119310259462!3d22.278958210544527!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x0%3A0x2cbada1dd12d85a9!2z6aOy6Iy2!5e0!3m2!1szh-TW!2shk!4v1570884414408!5m2!1szh-TW!2shk" frameborder="0" style="border:0;" width="100%" height=300px></iframe>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container">
|
||||
<div class="card horizontal">
|
||||
<div class="card-stacked">
|
||||
<div class="card-content">
|
||||
Comment<br>
|
||||
<div id="comment">
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="card-content">
|
||||
<div class="row">
|
||||
<div class="col s12">
|
||||
<div class="row">
|
||||
<div id="commentAlert"></div>
|
||||
<div class="input-field col s12">
|
||||
Input Your comment:<br>
|
||||
<textarea id="foodComment" class="materialize-textarea" placeholder="Comment..."></textarea>
|
||||
</div>
|
||||
<div class="input-field col s3 m3">
|
||||
Rato:<input id="foodRato" type="number" class="validate" min="0.0" max="5.0">/5.0
|
||||
</div>
|
||||
</div>
|
||||
<button class="btn waves-effect waves-light" type="submit" id="actionComment">Submit
|
||||
<i class="material-icons right">send</i>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<a href="../search.html" class="waves-effect waves-light btn" id="btnBack">Back</a>
|
||||
</div>
|
||||
<!-- Modal Structure -->
|
||||
<div id="modal1" class="modal" style="width: 400px;">
|
||||
<div class="row center-align">
|
||||
<div class="col s12 modal-content">
|
||||
<span class="flow-text" id="loginInfo">
|
||||
<div id="loginAlert"></div>
|
||||
<h4 style="border-bottom: 1px solid #ebebeb; height: 50px;">LOGIN</h4>
|
||||
<div class="input-field col s12">
|
||||
<i class="material-icons prefix">account_circle</i>
|
||||
<input id="loginEmail" type="text" class="validate" required>
|
||||
<label for="loginEmail">Email</label>
|
||||
</div><br>
|
||||
<div class="input-field col s12">
|
||||
<i class="material-icons prefix">vpn_key</i>
|
||||
<input id="loginPwd" type="password" class="validate" required>
|
||||
<label for="loginPwd">Password</label>
|
||||
</div>
|
||||
|
||||
<a class="waves-effect waves-light btn col s10 offset-s1" style="margin-top: 50px" id="btnSubmitLogin">LOGIN</a>
|
||||
<h6 class=" col s12">Don"t have an account? <a href="#" id="createAccount">Sign up here</a></h6>
|
||||
</span>
|
||||
|
||||
<span class="flow-text" id="createInfo">
|
||||
<div id="pwdAlert"></div>
|
||||
<h4 style='border-bottom: 1px solid #ebebeb; height: 50px;'>REGISTER</h4><div class='input-field col s6'><input id='first_name' type='text' class='validate' required><label for='first_name'>First Name</label></div><div class='input-field col s6'><input id='last_name' type='text' class='validate' required><label for='last_name'>Last Name</label></div><div class='input-field col s12'><input id='regEmail' type='email' class='validate' required><label for='regEmail'>Email</label></div><div class='input-field col s12'><input id='regPassword' type='password' class='validate' required><label for='regPassword'>Password</label></div><div class='input-field col s12'><input id='checkPassword' type='password' class='validate' required><label for='checkPassword'>Confirm Password</label></div><a class='waves-effect waves-light btn col s10 offset-s1' style='margin-top: 50px' id='btnSubmitRegister'>REGISTER</a><h6 class='col s12' id="changeLogin">You have an account? <a href='#' id='loginAccount'>Login</a></h6>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal-footer">
|
||||
<a href="#!" class=" modal-action modal-close waves-effect waves-green btn-flat">Close</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer class="page-footer teal">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
|
||||
<div class="col l3 s12">
|
||||
<h5 class="white-text">Connect</h5>
|
||||
<ul>
|
||||
<li><a class="white-text" href="../aboutus.html">About Us</a></li>
|
||||
<li><a class="white-text" href="../userGuide.html">User Guide</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-copyright">
|
||||
<div class="container">Copyright © 2019 InnoTech HK Inc. All rights reserved</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<!-- Scripts-->
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
480
it114105/itp4506/Assignment/19-20/menu/main.js
Normal file
480
it114105/itp4506/Assignment/19-20/menu/main.js
Normal file
@@ -0,0 +1,480 @@
|
||||
$(document).ready(function() {
|
||||
$.ajaxSetup({ cache: false });
|
||||
$.LoadFav = function(){
|
||||
$("#navBookMark").click(function(){
|
||||
$("#favModal").html("");
|
||||
$("#modal_box").html("");
|
||||
$("#modal_box").html("<div class='modal-content' id='favModal'><h4>Favorite Restaurant</h4></div><div class='modal-footer'><a href='#!' class='modal-action modal-close waves-effect waves-red btn'>Close</a></div>");
|
||||
$.getJSON("../jsonDB/"+sessionStorage.getItem("username")+".json", function(obj){
|
||||
try{
|
||||
$.getJSON("../jsonDB/restaurants.json", function(result){
|
||||
for(var i=0; i<obj.favorite.length; i++)
|
||||
$.each(result.restaurants, function(index,name){
|
||||
if(obj.favorite[i] == name.id){
|
||||
$("#favModal").append("<ul class='collection' id='delcollFav"+name.id+"'><li class='collection-item avatar'><img src='../"+name.image+"' id='favImg'class='circle'><span class='title' id='favTitle'>"+name.name+"</span><p id='favTag"+obj.favorite[i] +"'></p><a href='#' class='secondary-content deleteFav' id='Delfav"+name.id+"' ><i class='material-icons red-text' >delete</i></a></li></ul>");
|
||||
$.deleteFav();
|
||||
$.each(name.tag, function(tagIndex, tagName){
|
||||
$("#favTag"+obj.favorite[i]).append("<div class='chip'>" + tagName + "</div>");
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
//});
|
||||
}catch(err){
|
||||
console.log("NOT Thing here");
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
$.deleteFav = function(){
|
||||
$(".deleteFav").click(function(){
|
||||
var favVal = $(this).attr("id").substring(6,7);
|
||||
$.getJSON("../jsonDB/"+sessionStorage.getItem("username")+".json", function(obj){
|
||||
$.each(obj.favorite, function(favIndex, favName){
|
||||
if(favVal == favName){
|
||||
|
||||
obj.favorite.splice(favIndex, 1);
|
||||
console.log(obj);
|
||||
$.ajax({
|
||||
url: "../jsonDB/update.php",
|
||||
type: "POST",
|
||||
dataType: "json",
|
||||
data: {dataCus: JSON.stringify(obj), dataEmail: sessionStorage.getItem("username"), fav: 1}
|
||||
});
|
||||
$("#delcollFav"+favVal).effect("slide");
|
||||
$("#delcollFav"+favVal).html("");
|
||||
|
||||
}
|
||||
console.log()
|
||||
|
||||
$("#fav"+favVal).html("<i class='material-icons'>favorite</i></a>");
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
$.windowsChecksize = function() {
|
||||
var winWidth = $(window).width();
|
||||
console.log(sessionStorage.getItem("rule"));
|
||||
if (winWidth < 943) {
|
||||
if(sessionStorage.getItem("username")){
|
||||
$("nav .right").html("<li><a id='btnLoginNav' data-target='slide-out' class='sidenav-trigger'><i class='material-icons lighten-3 icon-brand' >account_circle</i></a></li>");
|
||||
}else{
|
||||
$("nav .right").html("<li id='btnLoginNavli'><a id='btnLogin'><i class='material-icons lighten-3 icon-brand' >account_circle</i></a></li>");
|
||||
}
|
||||
} else {
|
||||
if(sessionStorage.getItem("username")){
|
||||
$("nav .right").html("<li><div id='btnLoginNav' data-target='slide-out' class='sidenav-trigger'><a class='waves-effect waves-light btn'><i class='material-icons left' >menu</i>Menu</a></div></li>");
|
||||
}else{
|
||||
$("nav .right").html("<li id='btnLoginNavli'><a class='waves-effect waves-light btn' id='btnLogin'><i class='material-icons left center' >account_circle</i>Login</a></li>");
|
||||
}
|
||||
}
|
||||
if(sessionStorage.getItem("username")){
|
||||
$("#slide-out").html("");
|
||||
$("#modal_box").addClass("modal");
|
||||
$("#modal_box").html("");
|
||||
$("#favModal").html("");
|
||||
$('.sidenav').sidenav();
|
||||
if(sessionStorage.getItem("rule")=="operator"){
|
||||
$("#slide-out").append("<li><div class='user-view'><div class='background'><img src='../images/office-1.jpg'></div><a href='#user'><img class='circle' id='navIcon' src='../images/icon/yuna.jpg'></a><a href='#name'><span class='white-text name' id='navName'></span></a><a href='#email'><span class='white-text email' id='navEmail'></span></a> </div></li><li><a href='../operatorIndex.html'><i class='material-icons'>people</i>Restaurant Management</a></li><li><a href='../Info.html'><i class='material-icons'>settings</i>Personal Information</a></li><li><a href='#!' id='navLogout'>Log Out</a></li>");
|
||||
$("#btnBack").attr("href","../operatorIndex.html");
|
||||
}else if (sessionStorage.getItem("rule")=="admin"){
|
||||
$("#slide-out").append("<li><div class='user-view'><div class='background'><img src='../images/office-1.jpg'></div><a href='#user'><img class='circle' id='navIcon' src='../images/icon/yuna.jpg'></a><a href='#name'><span class='white-text name' id='navName'></span></a><a href='#email'><span class='white-text email' id='navEmail'></span></a> </div></li><li><a href='../admin.html'><i class='material-icons'>people</i>User Management</a></li><li><a href='../Info.html'><i class='material-icons'>settings</i>Personal Information</a></li><li><a href='#!' id='navLogout'>Log Out</a></li>");
|
||||
}else{
|
||||
$("#slide-out").append("<li><div class='user-view'><div class='background'><img src='../images/office-1.jpg'></div><a href='#user'><img class='circle' id='navIcon' src='../images/icon/yuna.jpg'></a><a href='#name'><span class='white-text name' id='navName'></span></a><a href='#email'><span class='white-text email' id='navEmail'></span></a> </div></li><li><a href='#modal_box' id='navBookMark' class='modal-trigger'><i class='material-icons'>bookmark</i>favorite restaurant</a></li><li><a href='../Info.html'><i class='material-icons'>settings</i>Personal Information</a></li><li><a href='#!' id='navLogout'>Log Out</a></li>");
|
||||
}
|
||||
$("#navName").append(sessionStorage.getItem("name"));
|
||||
$("#navEmail").append(sessionStorage.getItem("username"));
|
||||
$("#navLogout").click(function(){
|
||||
sessionStorage.removeItem("username");
|
||||
sessionStorage.removeItem("name");
|
||||
window.location.replace("../index.html");
|
||||
});
|
||||
$("#modal_box").html("<div class='modal-content' id='favModal'><h4>Favorite Restaurant</h4></div><div class='modal-footer'><a href='#!' class='modal-action modal-close waves-effect waves-red btn'>Close</a></div>");
|
||||
$.LoadFav();
|
||||
|
||||
}
|
||||
|
||||
|
||||
$("#btnLogin").click(function() {
|
||||
$('#modal1').modal('open');
|
||||
});
|
||||
}
|
||||
|
||||
$.getRestanauent = function(){
|
||||
$.getJSON("../jsonDB/restaurants.json", function(result) {
|
||||
$.each(result.restaurants, function(index, name) {
|
||||
var count = 0,
|
||||
rate = 0;
|
||||
$.each(result.commRestaurants, function(comIndex, comName) {
|
||||
if (name.id == comName.resID) {
|
||||
rate += comName.rate;
|
||||
count++;
|
||||
}
|
||||
});
|
||||
rate /= count;
|
||||
if (isNaN(rate))
|
||||
rate = "Not a comment";
|
||||
else
|
||||
rate = "Rate: " + rate + "/5.0";
|
||||
$("#menu").append("<a href='menu/foodRestaurant"+name.id+".html'><div class='col s12 m4 searchRest'><div class='card'><div class='card-image'><img src='" + name.image + "'><a class='btn-floating halfway-fab waves-effect waves-light red fav' id='fav" + name.id + "'></a></div><div class='card-content'><span class='card-title'>" + name.name + "</span><p>" + rate + "</p></div><div class='card-action' id='" + name.id + "'></a>");
|
||||
$.each(name.tag, function(tagIndex, tagName) {
|
||||
$("#" + name.id).append("<div class='chip'>" + tagName + "</div></div></div></div>");
|
||||
});
|
||||
if(sessionStorage.getItem("username")){
|
||||
$.getJSON("../jsonDB/"+sessionStorage.getItem("username")+".json", function(obj){
|
||||
var seaVaild = false;
|
||||
$.each(obj.favorite, function(seaFavIndex, seaFavName){
|
||||
|
||||
if(seaFavName == name.id){
|
||||
seaVaild = true;
|
||||
$("#fav"+name.id).append("<i class='material-icons'>delete</i></a>");
|
||||
|
||||
}
|
||||
});
|
||||
if(!seaVaild)
|
||||
$("#fav"+name.id).append("<i class='material-icons'>favorite</i></a>");
|
||||
});
|
||||
}else{
|
||||
$("#fav"+name.id).append("<i class='material-icons'>favorite</i></a>");
|
||||
}
|
||||
|
||||
});
|
||||
var foodText = GetURLParameter('food');
|
||||
if(typeof foodText!="undefined"){
|
||||
$(".searchRest").hide().filter(":contains('" + foodText + "')").show();
|
||||
}
|
||||
if(!sessionStorage.getItem("username")){
|
||||
$(".searchRest a").attr("href", "#");
|
||||
$(".searchRest a").click(function(){
|
||||
$("#btnLoginNavli a").click();
|
||||
});
|
||||
}else{
|
||||
$.clickFav();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
$.clickFav = function(){
|
||||
$(".fav").click(function(){
|
||||
if(sessionStorage.getItem("username")){
|
||||
var favVal = $(this).attr("id").substring(3,4);
|
||||
var vaild = false;
|
||||
$.getJSON("../jsonDB/"+sessionStorage.getItem("username")+".json", function(obj){
|
||||
$.each(obj.favorite, function(favIndex, favName){
|
||||
if(favVal == favName){
|
||||
vaild = true;
|
||||
obj.favorite.splice(favIndex, 1);
|
||||
$("#fav"+favVal).html("<i class='material-icons'>favorite</i>");
|
||||
}
|
||||
});
|
||||
if(!vaild){
|
||||
obj.favorite.push(favVal);
|
||||
console.log(obj);
|
||||
$("#fav"+favVal).html("<i class='material-icons'>delete</i>");
|
||||
}
|
||||
$.ajax({
|
||||
url: "../jsonDB/update.php",
|
||||
type: "POST",
|
||||
dataType: "json",
|
||||
data: {dataCus: JSON.stringify(obj), dataEmail: sessionStorage.getItem("username"), fav: 1},
|
||||
});
|
||||
});
|
||||
}else{
|
||||
$("#btnLoginNavli a").click();
|
||||
}
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
|
||||
$("#createInfo").hide();
|
||||
$("#createAccount").click(function() {
|
||||
$("#loginInfo").hide();
|
||||
$("#createInfo").show();
|
||||
});
|
||||
$("#loginAccount").click(function() {
|
||||
$("#createInfo").hide();
|
||||
$("#loginInfo").show();
|
||||
});
|
||||
|
||||
$(window).resize(function() {
|
||||
$.windowsChecksize();
|
||||
});
|
||||
|
||||
//$("#btnFBLogin").click(function(){
|
||||
//
|
||||
//});
|
||||
|
||||
$("#btnSubmitLogin").click(function() {
|
||||
$("#loginAlert").html("");
|
||||
var loginPwd = $("#loginPwd").val();
|
||||
var loginEmail = $("#loginEmail").val();
|
||||
if(loginEmail=="" && loginPwd==""){
|
||||
$("#loginAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>The Email and password is required!</font></div></div></div>");
|
||||
}else if(loginEmail==""){
|
||||
$("#loginAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Missing the Email Address</font></div></div></div>");
|
||||
}else if(loginPwd==""){
|
||||
$("#loginAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Missing the Password</font></div></div></div>");
|
||||
}else{
|
||||
var valid = true;
|
||||
$.getJSON("../jsonDb/adminCustomer.json",function(result){
|
||||
$.each(result.customers, function(index, name){
|
||||
|
||||
if(name.email==loginEmail && name.pwd!=loginPwd){
|
||||
valid = false;
|
||||
$("#loginAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Your Password is Worng.</font></div></div></div>");
|
||||
}else if(name.email==loginEmail && name.pwd==loginPwd){
|
||||
//$("#navIcon").attr("src", name.icon);
|
||||
$("#loginAlert").html("");
|
||||
valid = false;
|
||||
sessionStorage.setItem("username", name.email);
|
||||
sessionStorage.setItem("name", name.fname+ " " + name.lname);
|
||||
sessionStorage.setItem("rule", name.rule);
|
||||
|
||||
if(sessionStorage.getItem("rule")=="operator")
|
||||
window.location.replace("operatorIndex.html");
|
||||
else if(sessionStorage.getItem("rule")=="admin")
|
||||
window.location.replace("admin.html");
|
||||
else{
|
||||
location.reload();
|
||||
}
|
||||
valid = false;
|
||||
}
|
||||
});
|
||||
if(valid)
|
||||
$("#loginAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Your Email or Password is Worng!</font></div></div></div>");
|
||||
$("#loginAlert").effect("shake");
|
||||
});
|
||||
}
|
||||
});
|
||||
$("#btnSubmitRegister").click(function(){
|
||||
$("#pwdAlert").html("");
|
||||
var pwd = $("#regPassword").val();
|
||||
var pwdCheck = $("#checkPassword").val();
|
||||
var email = $("#regEmail").val();
|
||||
var fname = $("#first_name").val();
|
||||
var lname = $("#last_name").val();
|
||||
var valid = false;
|
||||
if(pwd=="" && pwdCheck=="" && email=="" && fname=="" && lname==""){
|
||||
$("#pwdAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>You need input the all field!</font></div></div></div>");
|
||||
valid = true;
|
||||
$("#pwdAlert").effect("shake");
|
||||
return 0;
|
||||
}
|
||||
|
||||
$.getJSON("../jsonDB/adminCustomer.json", function(obj){
|
||||
$.each(obj.customers, function(index,name){
|
||||
if(name.email == email){
|
||||
$("#pwdAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Your Email Registed!</font></div></div></div>");
|
||||
valid = true;
|
||||
$("#pwdAlert").effect("shake");
|
||||
}
|
||||
});
|
||||
});
|
||||
if(pwd != pwdCheck){
|
||||
$("#pwdAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Your Comfirm Password Not Match!</font></div></div></div>");
|
||||
$("#pwdAlert").effect("shake");
|
||||
valid = true;
|
||||
}
|
||||
if(!valid){
|
||||
$.getJSON("../jsonDB/adminCustomer.json", function(obj){
|
||||
var getID = 0;
|
||||
$.each(obj.customers, function(index, name){
|
||||
if(getID<name.userID)
|
||||
getID = name.userID;
|
||||
});
|
||||
getID++;
|
||||
var customer = {
|
||||
userID: getID,
|
||||
email: email,
|
||||
fname: fname,
|
||||
lname: lname,
|
||||
pwd: pwd,
|
||||
rule: "user"
|
||||
}
|
||||
obj.customers.push(customer);
|
||||
$.ajax({
|
||||
url: "../jsonDB/update.php",
|
||||
type: "POST",
|
||||
dataType: "json",
|
||||
data: {dataAdmin: JSON.stringify(obj), dataCus: JSON.stringify(customer), dataEmail: email}
|
||||
});
|
||||
$("#changeLogin a").click();
|
||||
$("#loginAlert").append("<div class='row'><div class='col s12'><div class='card-panel green lighten-1' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Your Account Created.</font></div></div></div>");
|
||||
$("#loginAlert").effect("slide");
|
||||
});
|
||||
}
|
||||
});
|
||||
$.checkRestaurantInf = function(){
|
||||
var name = $("#createRestaurantName").val();
|
||||
var tel = $("#createRestaureantTel").val();
|
||||
var address = $("#createRestaureantAdde").val();
|
||||
var area = $("#createRestaurantSelect").val();
|
||||
var opTime = $("#createRestaureantOPTime").val();
|
||||
var clTime = $("#createRestaureantCLTime").val();
|
||||
var valid = true;
|
||||
$("#stepOneAlert").html("");
|
||||
if(name=="" && tel=="" && address=="" && area=="" && opTime=="" && clTime==""){
|
||||
$("#stepOneAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>You need input the all field!</font></div></div></div>");
|
||||
valid=false;
|
||||
}
|
||||
if(name==""){
|
||||
$("#stepOneAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Missing the Restaurant Name</font></div></div></div>");
|
||||
valid=false;
|
||||
}
|
||||
if(tel==""){
|
||||
$("#stepOneAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Missing the Restaurant Name</font></div></div></div>");
|
||||
|
||||
valid=false;
|
||||
}
|
||||
if(address==""){
|
||||
$("#stepOneAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Missing the Restaurant Address</font></div></div></div>");
|
||||
valid=false;
|
||||
}
|
||||
|
||||
|
||||
if(clTime==""||opTime==""){
|
||||
$("#stepOneAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Missing the Restaurant opening hours</font></div></div></div>");
|
||||
valid=false;
|
||||
}
|
||||
if(!valid){
|
||||
$("#firstStep").addClass("red-text");
|
||||
}
|
||||
}
|
||||
|
||||
$("#btnAddCatalog").click(function(){
|
||||
$("#menuCatAlert").html();
|
||||
var cataHidd = $("#catalogHidden").prop("checked");
|
||||
var catalog = $("#catalog").val();
|
||||
var cataAllDay = $("#catalogAllDay").prop("checked");
|
||||
var invalid = true;
|
||||
if(!cataAllDay){
|
||||
var startTime = $("#catalogTo").val();
|
||||
var closeTime = $("#catalogCl").val();
|
||||
}
|
||||
|
||||
if(catalog==""){
|
||||
$("#menuCatAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Please input your catalog</font></div></div></div>");
|
||||
invalid=false;
|
||||
}
|
||||
if(!cataAllDay && startTime=="" && closeTime==""){
|
||||
$("#menuCatAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Missing the Catalog Time</font></div></div></div>");
|
||||
invalid=false;
|
||||
}
|
||||
if(!invalid){
|
||||
$("#secondStep i").addClass("red-text");
|
||||
}
|
||||
if(invalid){
|
||||
$("#catalogTable").append("<tr><td>"+catalog+"</td><td>"+cataAllDay+"</td><td>"+startTime+"</td><td>"+closeTime+"</td><td class='catalogHide'>"+cataHidd+"</td><td><a class='btn-floating btn-small waves-effect waves-light red btnCataDelete'><i class='material-icons'>delete</i></a> <a class='btn-floating btn-small waves-effect waves-light teal lighten-2 btnCataChange'><i class='material-icons'>repeat</i></a></td></tr>");
|
||||
$("#catalog").text();
|
||||
$("#secondStep i").removeClass("red-text");
|
||||
$(".btnCataChange").click(function(){
|
||||
var disVal = $(this).parents("tr").children("td:eq(4)").html();
|
||||
alert(disVal);
|
||||
if(disVal=="false"){
|
||||
$(this).parents("tr").children("td:eq(4)").html("true") ;
|
||||
}else{
|
||||
$(this).parents("tr").children("td:eq(4)").html("false") ;
|
||||
}
|
||||
});
|
||||
$(".btnCataDelete").click(function(){
|
||||
$(this).parents("tr").remove();
|
||||
});
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
$("#secondStep").click(function(){
|
||||
$.checkRestaurantInf();
|
||||
});
|
||||
|
||||
function btnSave(){
|
||||
$("#btnMenuSave").click(function(){
|
||||
var name = $("#createRestaurantName").val();
|
||||
var tel = $("#createRestaureantTel").val();
|
||||
var address = $("#createRestaureantAdde").val();
|
||||
var opTime = $("#createRestaureantOPTime").val();
|
||||
var clTime = $("#createRestaureantCLTime").val();
|
||||
|
||||
var valid = true;
|
||||
if(name==""){
|
||||
$("#menuMissing").append("Section 1: Restaurant name<br>");
|
||||
valid=false;
|
||||
}
|
||||
if(tel==""){
|
||||
$("#menuMissing").append("Section 1: Restaurant Telphone<br>");
|
||||
}
|
||||
if(address==""){
|
||||
$("#menuMissing").append("Section 1: Restaurant Address<br>");
|
||||
valid=false;
|
||||
}
|
||||
|
||||
if(clTime==""||opTime==""){
|
||||
$("#menuMissing").append("Section 1: Restaurant Open and close time<br>");
|
||||
valid=false;
|
||||
}
|
||||
if(address=="" || tel=="" || name=="" || clTime==""||opTime==""){
|
||||
$("#firstStep").addClass("red-text");
|
||||
}
|
||||
if($("#catalogTable tr").length<2){
|
||||
$("#menuMissing").append("Section 2: The Restaurant catalog<br>");
|
||||
valid=false;
|
||||
$("#secondStep").addClass("red-text");
|
||||
}
|
||||
if($("#resturantMenu tr").length<2){
|
||||
$("#menuMissing").append("Section 3: The Restaurant food<br>");
|
||||
valid=false;
|
||||
$("#stepThrid").addClass("red-text");
|
||||
}
|
||||
if(valid){
|
||||
$(this).removeClass("modal-trigger");
|
||||
$("#menuAlert").html("");
|
||||
$("#stepOneAlert").html("");
|
||||
$("#menuCatAlert").html("");
|
||||
$("#secondStep").removeClass("red-text");
|
||||
$("#firstStep").removeClass("red-text");
|
||||
$("#stepThrid").removeClass("red-text");
|
||||
$("#createRestaurantName").val("");
|
||||
$("#createRestaureantTel").val("");
|
||||
$("#createRestaureantAdde").text("");
|
||||
$("#createRestaurantSelect").val("");
|
||||
$("#createRestaureantOPTime").val("");
|
||||
$("#createRestaureantCLTime").val("");
|
||||
$("#catalogTable").html("<tr><th>Catalog Name</th><th>All Day</th><th>Start Time</th><th>Close Time</th><th>Hidden</th><th>Action</th></tr>");
|
||||
$("#resturantMenu").html("<tr><th>Food Name</th><th>Catalog</th><th>Price</th><th>Display</th><th>Action</th></tr>");
|
||||
}
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
function GetURLParameter(sParam) {
|
||||
var sPageURL = window.location.search.substring(1);
|
||||
var sURLVariables = sPageURL.split('&');
|
||||
for (var i = 0; i < sURLVariables.length; i++) {
|
||||
var sParameterName = sURLVariables[i].split('=');
|
||||
if (sParameterName[0] == sParam)
|
||||
return sParameterName[1];
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
btnSave();
|
||||
$.deleteFav();
|
||||
$.clickFav();
|
||||
$.windowsChecksize();
|
||||
$('.chips-placeholder').chips({
|
||||
placeholder: 'The Food tag',
|
||||
secondaryPlaceholder: '+Tag',
|
||||
});
|
||||
$('.parallax').parallax();
|
||||
$('.modal').modal();
|
||||
$('.collapsible').collapsible();
|
||||
$('select').formSelect();
|
||||
$('.tabs').tabs();
|
||||
$('#createRestaurantSelect').formSelect();
|
||||
});// JavaScript Document
|
||||
652
it114105/itp4506/Assignment/19-20/operatorIndex.html
Normal file
652
it114105/itp4506/Assignment/19-20/operatorIndex.html
Normal file
@@ -0,0 +1,652 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>Yummy Everywhere</title>
|
||||
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
|
||||
<link href="css/materialize.css" type="text/css" rel="stylesheet" media="screen,projection" />
|
||||
<link href="css/style.css" type="text/css" rel="stylesheet" />
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
|
||||
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
|
||||
<script src="js/materialize.js"></script>
|
||||
<script src="js/init.js"></script>
|
||||
</head>
|
||||
<script>
|
||||
$(document).ready(function(){
|
||||
var time=4;
|
||||
$('.timepicker').timepicker({
|
||||
container: 'body',
|
||||
});
|
||||
$("#foodSearch").keyup(function() {
|
||||
foodText = $("#foodSearch").val();
|
||||
$(".searchOPRest").hide().filter(":contains('" + foodText + "')").show();
|
||||
});
|
||||
$.getJSON("jsonDB/restaurants.json",function(obj){
|
||||
|
||||
$.each(obj.restaurants, function(index, name){
|
||||
if(name.user == sessionStorage.getItem("username")){
|
||||
$("#restaurantMenu").append("<a href='menu/foodRestaurant"+name.id+".html'><div class='col s12 m3 searchOPRest' id='"+name.id+"'><div class='card'><div class='card-image waves-effect waves-block waves-light'><img class='activator' src='"+name.image+"'></div><div class='card-content'><span class='card-title activator grey-text text-darken-4'>"+name.name+"</span><a class='dropdown-trigger' href='#' data-target='dropdown"+name.id+"'><p>Modify</p></a></div><ul id='dropdown"+name.id+"' class='dropdown-content'><li><a href='#createRest' class='restEdit modal-trigger' id='"+name.id+"'>Edit</a></li><li><a href='#warningModal' class='red-text restDel'>Delete</a></li></ul></div></div></div></a>");
|
||||
}
|
||||
});
|
||||
$("#operatorRestaurant").append("<div class='col s12 m3' id='addRest'><a href='#createRest' class='modal-trigger'><div class='card'><div class='card-image waves-effect waves-block waves-light'><img class='activator' src='images/office.jpg'></div><div class='card-content'><span class='card-title activator grey-text text-darken-4 flow-text'>Add Restaurant</span></div></div></a></div>");
|
||||
$("#addRest").css("opacity", "0.3");
|
||||
|
||||
$("#addRest").mouseover(function(){
|
||||
$(this).animate({opacity: "0.8"});
|
||||
});
|
||||
$("#addRest").mouseleave(function(){
|
||||
$(this).animate({opacity: "0.3"});
|
||||
});
|
||||
$('.dropdown-trigger').dropdown();
|
||||
|
||||
$("#addRest").click(function(){
|
||||
$("#btnMenuSave").html("Create");
|
||||
$("#menuAlert").html("");
|
||||
$("#stepOneAlert").html("");
|
||||
$("#menuCatAlert").html("");
|
||||
$("#secondStep").removeClass("red-text");
|
||||
$("#firstStep").removeClass("red-text");
|
||||
$("#stepThrid").removeClass("red-text");
|
||||
$("#createRestaurantName").val("");
|
||||
$("#createRestaureantTel").val("");
|
||||
$("#createRestaureantAdde").val("");
|
||||
$("#createRestaurantSelect").val("");
|
||||
$("#createRestaureantOPTime").val("");
|
||||
$("#createRestaureantCLTime").val("");
|
||||
$("#restChips").html("");
|
||||
$("#catalogTable").html("<tr><th>Catalog Name</th><th>All Day</th><th>Start Time</th><th>Close Time</th><th>Hidden</th><th>Action</th></tr>");
|
||||
$("#resturantMenu").html("<tr><th>Food Name</th><th>Catalog</th><th>Price</th><th>Display</th><th>Action</th></tr>");
|
||||
$('.chips-placeholder').chips({
|
||||
placeholder: 'The Food tag',
|
||||
secondaryPlaceholder: '+Tag',
|
||||
});
|
||||
});
|
||||
|
||||
$(".restDel").click(function(){
|
||||
var restDel = $(this).parents(".col");
|
||||
$(this).addClass("modal-trigger");
|
||||
$("#wraningAlert").html('Do you want to delete " '+$(this).parents(".card-content").children().first().text()+' ", you cannot recovery deleted menu.');
|
||||
$("#closeMenu").click(function(){
|
||||
restDel.hide();
|
||||
});
|
||||
});
|
||||
$(".restEdit").click(function(){
|
||||
var key = $(this).attr("id");
|
||||
$("#btnMenuSave").html("SAVE");
|
||||
if(key==1){
|
||||
$("#menuAlert").html("");
|
||||
$("#stepOneAlert").html("");
|
||||
$("#menuCatAlert").html("");
|
||||
$("#secondStep").removeClass("red-text");
|
||||
$("#firstStep").removeClass("red-text");
|
||||
$("#stepThrid").removeClass("red-text");
|
||||
$("label").addClass("active");
|
||||
$("#createRestaurantName").val("ABC Chicken");
|
||||
$("#createRestaureantTel").val("21800000");
|
||||
$("#createRestaureantAdde").val("Shop 225, 2/F, East Point City, 8 Chung Wa Road, Kowloon, Hong Kong");
|
||||
$("#createRestaureantOPTime").val("12:30 PM");
|
||||
$("#createRestaureantCLTime").val("9:00 PM");
|
||||
$("#catalogTable").html("<tr><th>Catalog Name</th><th>All Day</th><th>Start Time</th><th>Close Time</th><th>Hidden</th><th>Action</th></tr>");
|
||||
$("#resturantMenu").html("<tr><th>Food Name</th><th>Catalog</th><th>Price</th><th>Display</th><th>Action</th></tr>");
|
||||
$("restChips").html("<div class='chip' tabindex='0'>Noodles<i class='material-icons close'>close</i></div><div class='chip' tabindex='0'>Koeran<i class='material-icons close'>close</i></div><div class='chip' tabindex='0'>Rice<i class='material-icons close'>close</i></div>");
|
||||
$("#catalogTable").append("<tr><td>Fired Chicken</td><td>All Day</td><td>NA</td><td>NA</td><td>false</td><td><a class='btn-floating btn-small waves-effect waves-light red btnCataDelete'><i class='material-icons'>delete</i></a> <a class='btn-floating btn-small waves-effect waves-light teal lighten-2 btnCataChange'><i class='material-icons'>repeat</i></a></td></tr><tr><td>Single order</td><td>All Day</td><td>NA</td><td>NA</td><td>true</td><td><a class='btn-floating btn-small waves-effect waves-light red btnCataDelete'><i class='material-icons'>delete</i></a> <a class='btn-floating btn-small waves-effect waves-light teal lighten-2 btnCataChange'><i class='material-icons'>repeat</i></a></td></tr> <tr><td>Other</td><td>All Day</td><td>NA</td><td>NA</td><td>false</td><td><a class='btn-floating btn-small waves-effect waves-light red btnCataDelete'><i class='material-icons'>delete</i></a> <a class='btn-floating btn-small waves-effect waves-light teal lighten-2 btnCataChange'><i class='material-icons'>repeat</i></a></td></tr>");
|
||||
$("#resturantMenu").append("<tr><td>Crispy Fried Chicken</td><td>Fired Chicken</td><td>150.0</td><td class='menuDisplay'>true</td><td><a class='btn-floating btn-small waves-effect waves-light red btnMenuDelete'><i class='material-icons'>delete</i></a> <a class='btn-floating btn-small waves-effect waves-light teal lighten-2 btnMenuChange'><i class='material-icons'>repeat</i></a></td></tr><tr><td>Creamy Fried Chicken</td><td>Fired Chicken</td><td>166.0</td><td class='menuDisplay'>true</td><td><a class='btn-floating btn-small waves-effect waves-light red btnMenuDelete'><i class='material-icons'>delete</i></a> <a class='btn-floating btn-small waves-effect waves-light teal lighten-2 btnMenuChange'><i class='material-icons'>repeat</i></a></td></tr><tr><td>Fried Shrimp Rice Roll</td><td>Single order</td><td>88.0</td><td class='menuDisplay'>false</td><td><a class='btn-floating btn-small waves-effect waves-light red btnMenuDelete'><i class='material-icons'>delete</i></a> <a class='btn-floating btn-small waves-effect waves-light teal lighten-2 btnMenuChange'><i class='material-icons'>repeat</i></a></td></tr><tr><td>Kimchi Rice</td><td>Other</td><td>98.0</td> <td class='menuDisplay'>true</td><td><a class='btn-floating btn-small waves-effect waves-light red btnMenuDelete'><i class='material-icons'>delete</i></a> <a class='btn-floating btn-small waves-effect waves-light teal lighten-2 btnMenuChange'><i class='material-icons'>repeat</i></a></td></tr>");
|
||||
$("#stepThrid").removeClass("red-text");
|
||||
$("#restChips").html("<div class='chip' tabindex='0'>Noodles<i class='material-icons close'>close</i></div><div class='chip' tabindex='0'>Koeran<i class='material-icons close'>close</i></div><div class='chip' tabindex='0'>Rice<i class='material-icons close'>close</i></div>");
|
||||
}else if(key==2){
|
||||
$("#menuAlert").html("");
|
||||
$("#stepOneAlert").html("");
|
||||
$("#menuCatAlert").html("");
|
||||
$("#secondStep").removeClass("red-text");
|
||||
$("#firstStep").removeClass("red-text");
|
||||
$("#stepThrid").removeClass("red-text");
|
||||
$("label").addClass("active");
|
||||
$("#createRestaurantName").val("NeNE Chicken");
|
||||
$("#createRestaureantTel").val("31800000");
|
||||
$("#createRestaureantAdde").text("Shop 125, 3/F, Point City, 8 Tsim Sha Tsui Road, Tsim Sha Tsui, Hong Kong");
|
||||
$("#createRestaurantSelect").val("Hong Kong");
|
||||
$("#createRestaureantOPTime").val("12:30 PM");
|
||||
$("#createRestaureantCLTime").val("8:00 PM");
|
||||
$("#catalogTable").html("<tr><th>Catalog Name</th><th>All Day</th><th>Start Time</th><th>Close Time</th><th>Hidden</th><th>Action</th></tr>");
|
||||
$("#resturantMenu").html("<tr><th>Food Name</th><th>Catalog</th><th>Price</th><th>Display</th><th>Action</th></tr>");
|
||||
$("restChips").html("<div class='chip' tabindex='0'>Noodles<i class='material-icons close'>close</i></div><div class='chip' tabindex='0'>Koeran<i class='material-icons close'>close</i></div><div class='chip' tabindex='0'>Rice<i class='material-icons close'>close</i></div>");
|
||||
$("#catalogTable").append("<tr><td>Fired Chicken</td><td>All Day</td><td>NA</td><td>NA</td><td>false</td><td><a class='btn-floating btn-small waves-effect waves-light red btnCataDelete'><i class='material-icons'>delete</i></a> <a class='btn-floating btn-small waves-effect waves-light teal lighten-2 btnCataChange'><i class='material-icons'>repeat</i></a></td></tr><tr><td>Single order</td><td>All Day</td><td>NA</td><td>NA</td><td>true</td><td><a class='btn-floating btn-small waves-effect waves-light red btnCataDelete'><i class='material-icons'>delete</i></a> <a class='btn-floating btn-small waves-effect waves-light teal lighten-2 btnCataChange'><i class='material-icons'>repeat</i></a></td></tr> <tr><td>Other</td><td>All Day</td><td>NA</td><td>NA</td><td>false</td><td><a class='btn-floating btn-small waves-effect waves-light red btnCataDelete'><i class='material-icons'>delete</i></a> <a class='btn-floating btn-small waves-effect waves-light teal lighten-2 btnCataChange'><i class='material-icons'>repeat</i></a></td></tr>");
|
||||
$("#resturantMenu").append("<tr><td>Crispy Fried Chicken</td><td>Fired Chicken</td><td>150.0</td><td class='menuDisplay'>true</td><td><a class='btn-floating btn-small waves-effect waves-light red btnMenuDelete'><i class='material-icons'>delete</i></a> <a class='btn-floating btn-small waves-effect waves-light teal lighten-2 btnMenuChange'><i class='material-icons'>repeat</i></a></td></tr><tr><td>Creamy Fried Chicken</td><td>Fired Chicken</td><td>166.0</td><td class='menuDisplay'>true</td><td><a class='btn-floating btn-small waves-effect waves-light red btnMenuDelete'><i class='material-icons'>delete</i></a> <a class='btn-floating btn-small waves-effect waves-light teal lighten-2 btnMenuChange'><i class='material-icons'>repeat</i></a></td></tr><tr><td>Fried Shrimp Rice Roll</td><td>Single order</td><td>88.0</td><td class='menuDisplay'>false</td><td><a class='btn-floating btn-small waves-effect waves-light red btnMenuDelete'><i class='material-icons'>delete</i></a> <a class='btn-floating btn-small waves-effect waves-light teal lighten-2 btnMenuChange'><i class='material-icons'>repeat</i></a></td></tr><tr><td>Kimchi Rice</td><td>Other</td><td>98.0</td> <td class='menuDisplay'>true</td><td><a class='btn-floating btn-small waves-effect waves-light red btnMenuDelete'><i class='material-icons'>delete</i></a> <a class='btn-floating btn-small waves-effect waves-light teal lighten-2 btnMenuChange'><i class='material-icons'>repeat</i></a></td></tr>");
|
||||
$("#stepThrid").removeClass("red-text");
|
||||
$("#restChips").html("<div class='chip' tabindex='0'>Noodles<i class='material-icons close'>close</i></div><div class='chip' tabindex='0'>Koeran<i class='material-icons close'>close</i></div><div class='chip' tabindex='0'>Rice<i class='material-icons close'>close</i></div>");
|
||||
}
|
||||
|
||||
//btnSave();
|
||||
$("#btnMenuSave").click(function(){
|
||||
var name = $("#createRestaurantName").val();
|
||||
var tel = $("#createRestaureantTel").val();
|
||||
var address = $("#createRestaureantAdde").val();
|
||||
var opTime = $("#createRestaureantOPTime").val();
|
||||
var clTime = $("#createRestaureantCLTime").val();
|
||||
var btnMenuSave = $("#btnMenuSave").text();
|
||||
$("#menuMissing").html("");
|
||||
var valid = true;
|
||||
if(name==""){
|
||||
$("#menuMissing").append("Section 1: Restaurant name<br>");
|
||||
valid=false;
|
||||
}
|
||||
if(tel==""){
|
||||
$("#menuMissing").append("Section 1: Restaurant Telphone<br>");
|
||||
}
|
||||
if(address==""){
|
||||
$("#menuMissing").append("Section 1: Restaurant Address<br>");
|
||||
valid=false;
|
||||
}
|
||||
|
||||
if(clTime==""||opTime==""){
|
||||
$("#menuMissing").append("Section 1: Restaurant Open and close time<br>");
|
||||
valid=false;
|
||||
}
|
||||
if(address=="" || tel=="" || name=="" || clTime==""||opTime==""){
|
||||
$("#firstStep").addClass("red-text");
|
||||
}
|
||||
if($("#catalogTable tr").length<2){
|
||||
$("#menuMissing").append("Section 2: The Restaurant catalog<br>");
|
||||
valid=false;
|
||||
$("#secondStep").addClass("red-text");
|
||||
}
|
||||
if($("#resturantMenu tr").length<2){
|
||||
$("#menuMissing").append("Section 3: The Restaurant food<br>");
|
||||
valid=false;
|
||||
$("#stepThrid").addClass("red-text");
|
||||
}
|
||||
if( $("#menuMissing").text()!="Saved"){
|
||||
$("#alertClose").click(function(){
|
||||
$("#alert").modal("close");
|
||||
$("#createRest").modal("open");
|
||||
});
|
||||
}
|
||||
if(valid && btnMenuSave=="Create"){
|
||||
var restName = $("#createRestaurantName").val();
|
||||
$("#restaurantMenu").append("<a href='#'><div class='col s12 m3 searchOPRest'><div class='card'><div class='card-image waves-effect waves-block waves-light'><img class='activator' src='images/default.jpg'></div><div class='card-content'><span class='card-title activator grey-text text-darken-4'>"+restName+"</span><a class='dropdown-trigger' href='#' data-target='dropdown"+time+"'><p>Modify</p></a></div><ul id='dropdown"+time+"' class='dropdown-content'><li><a href='#createRest' class='restEdit modal-trigger' id='"+time+"'>Edit</a></li><li><a href='#warningModal' class='red-text restDel'>Delete</a></li></ul></div></div></div></a>");
|
||||
time++;
|
||||
$('.dropdown-trigger').dropdown();
|
||||
$("#menuAlert").html("");
|
||||
$("#menuMissing").siblings().html("System Message:");
|
||||
$("#menuMissing").html("<h5>Saved</h5>");
|
||||
$("#stepOneAlert").html("");
|
||||
$("#menuCatAlert").html("");
|
||||
$("#secondStep").removeClass("red-text");
|
||||
$("#firstStep").removeClass("red-text");
|
||||
$("#stepThrid").removeClass("red-text");
|
||||
$("#createRestaurantName").val("");
|
||||
$("#createRestaureantTel").val("");
|
||||
$("#createRestaureantAdde").val("");
|
||||
$("#createRestaurantSelect").val("");
|
||||
$("#createRestaureantOPTime").val("");
|
||||
$("#createRestaureantCLTime").val("");
|
||||
$("#menuFoodName").val("");
|
||||
$("#menuFoodPrice").val("");
|
||||
if( $("#menuMissing").text()=="Saved"){
|
||||
$("#alertClose").click(function(){
|
||||
$('.modal').modal('close');
|
||||
});
|
||||
}
|
||||
$("#menuCatalog").html("<option value='' disabled selected>Choose your catalog</option>");
|
||||
$("#catalogTable").html("<tr><th>Catalog Name</th><th>All Day</th><th>Start Time</th><th>Close Time</th><th>Hidden</th><th>Action</th></tr>");
|
||||
$("#resturantMenu").html("<tr><th>Food Name</th><th>Catalog</th><th>Price</th><th>Display</th><th>Action</th></tr>");
|
||||
$(".restDel").click(function(){
|
||||
var restDel = $(this).parents(".col");
|
||||
$(this).addClass("modal-trigger");
|
||||
$("#wraningAlert").html('Do you want to delete " '+$(this).parents(".card-content").children(".card-title").text()+'", you cannot recovery deleted menu.');
|
||||
$("#closeMenu").click(function(){
|
||||
restDel.hide();
|
||||
});
|
||||
});
|
||||
}else if(valid && btnMenuSave =="SAVE"){
|
||||
$("#menuMissing").siblings().html("System Message:");
|
||||
$("#menuMissing").html("<h5>Saved</h5>");
|
||||
if( $("#menuMissing").text()=="Saved"){
|
||||
$("#alertClose").click(function(){
|
||||
$('#createRest').modal('close');
|
||||
$("#alert").modal("close");
|
||||
});
|
||||
}
|
||||
}
|
||||
$('.chips-placeholder').chips({
|
||||
placeholder: 'The Food tag',
|
||||
secondaryPlaceholder: '+Tag',
|
||||
});
|
||||
|
||||
});
|
||||
$(".btnCataChange").click(function(){
|
||||
var disVal = $(this).parents("tr").children("td:eq(4)").html();
|
||||
alert(disVal);
|
||||
if(disVal=="false"){
|
||||
$(this).parents("tr").children("td:eq(4)").html("true") ;
|
||||
}else{
|
||||
$(this).parents("tr").children("td:eq(4)").html("false") ;
|
||||
}
|
||||
});
|
||||
$(".btnCataDelete").click(function(){
|
||||
$(this).parents("tr").remove();
|
||||
});
|
||||
$(".btnMenuDelete").click(function(){
|
||||
$(this).parents("tr").remove();
|
||||
});
|
||||
$(".btnMenuChange").click(function(){
|
||||
var disVal = $(this).parent().siblings(".menuDisplay").html();
|
||||
if(disVal=="false"){
|
||||
$(this).parent().siblings(".menuDisplay").html("true");
|
||||
}else{
|
||||
$(this).parent().siblings(".menuDisplay").html("false");
|
||||
}
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
$("#menuTime").hide();
|
||||
$("#catalogAllDay").change(function(){
|
||||
if(!$("#catalogAllDay").prop("checked"))
|
||||
$("#menuTime").show();
|
||||
else
|
||||
$("#menuTime").hide();
|
||||
});
|
||||
$("#stepThrid").click(function(){
|
||||
$("#menuAlert").html("");
|
||||
if($("#catalogTable tr").length<2){
|
||||
$("#menuAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Please input your catalog in Second collection</font></div></div></div>");
|
||||
$("#secondStep").addClass("red-text");
|
||||
}else {
|
||||
$("#secondStep").removeClass("red-text");
|
||||
}
|
||||
changeMenuVal();
|
||||
$.checkRestaurantInf();
|
||||
|
||||
});
|
||||
changeMenuVal=()=>{
|
||||
if($("#catalogTable tr").length<2){
|
||||
$("#menuCatalog").attr("disabled", true);
|
||||
$("#menuFoodName").attr("disabled", true);
|
||||
$("#menuFoodPrice").attr("disabled", true);
|
||||
$("#menuDisplay").attr("disabled", true);
|
||||
$("#btnAddFood").addClass("disabled");
|
||||
}else{
|
||||
$("#menuCatalog").removeAttr("disabled");
|
||||
$("#menuFoodName").removeAttr("disabled");
|
||||
$("#menuFoodPrice").removeAttr("disabled");
|
||||
$("#menuDisplay").removeAttr("disabled");
|
||||
$("#btnAddFood").removeClass("disabled");
|
||||
$("#menuCatalog").html("<option value='' disabled selected>Choose your catalog</option>");
|
||||
for(var i=1; i<$("#catalogTable tr").length; i++){
|
||||
var text = $("#catalogTable tr:eq("+i+")").children('td:eq(0)').text();
|
||||
$("#menuCatalog").append("<option value='"+text+"'>"+text+"</option>");
|
||||
}
|
||||
$('select').formSelect();
|
||||
}
|
||||
if($("#menuAlert").children().length>0)
|
||||
$("#stepThrid").addClass("red-text");
|
||||
else
|
||||
$("#stepThrid").removeClass("red-text");
|
||||
}
|
||||
$("#btnAddFood").click(function(){
|
||||
$("#menuAlert").html("");
|
||||
var menuCatalog = $("#menuCatalog").val();
|
||||
var menuFoodName = $("#menuFoodName").val();
|
||||
var menuFoodPrice = $("#menuFoodPrice").val();
|
||||
var menuDisplay = $("#menuDisplay").prop("checked");
|
||||
var valid = false;
|
||||
|
||||
if($("#catalogTable tr").length<2){
|
||||
$("#menuAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Please input your catalog in Second collection</font></div></div></div>");
|
||||
return 0;
|
||||
}
|
||||
if(menuFoodName==""){
|
||||
$("#menuAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Please input the food name</font></div></div></div>");
|
||||
valid= true;
|
||||
}
|
||||
if(menuFoodPrice==""){
|
||||
$("#menuAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Please input the food Price</font></div></div></div>");
|
||||
valid= true;
|
||||
}
|
||||
if(menuFoodPrice<0){
|
||||
$("#menuAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>The price don't be postive number/font></div></div></div>");
|
||||
valid= true;
|
||||
}
|
||||
if(menuCatalog==null){
|
||||
$("#menuAlert").append("<div class='row'><div class='col s12'><div class='card-panel red lighten-1 left' style=' width: 100%; line-height: 0px; text-align: left'><font size='2' class='white-text'>Please Choice catalog</font></div></div></div>"); valid= true;
|
||||
}
|
||||
$("#menuAlert").effect("shake");
|
||||
if(!valid){
|
||||
$("#menuCatalog").val("");
|
||||
$("#menuFoodName").val("");
|
||||
$("#menuFoodPrice").val("");
|
||||
$("#resturantMenu").append("<tr><td>"+menuFoodName+"</td><td>"+menuCatalog+"</td><td>"+menuFoodPrice+"</td><td class='menuDisplay'>"+menuDisplay+"</td><td><a class='btn-floating btn-small waves-effect waves-light red btnMenuDelete'><i class='material-icons'>delete</i></a> <a class='btn-floating btn-small waves-effect waves-light teal lighten-2 btnMenuChange'><i class='material-icons'>repeat</i></a></td></tr>");
|
||||
|
||||
$(".btnMenuDelete").click(function(){
|
||||
$(this).parents("tr").remove();
|
||||
});
|
||||
$(".btnMenuChange").click(function(){
|
||||
var disVal = $(this).parent().siblings(".menuDisplay").html();
|
||||
if(disVal=="false"){
|
||||
$(this).parent().siblings(".menuDisplay").html("true");
|
||||
}else{
|
||||
$(this).parent().siblings(".menuDisplay").html("false");
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
$("#btnMenuClose").click(function(){
|
||||
if(confirm("Do you want to exit? the data will not save.")){
|
||||
$("#createRest").modal("close");
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
<body>
|
||||
<nav>
|
||||
<div class="nav-wrapper container">
|
||||
<a id="logo-container" href="index.html" class="brand-logo ">Yummy Everywhere</a>
|
||||
|
||||
<ul class="right">
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
<ul id="slide-out" class="sidenav">
|
||||
</ul>
|
||||
<div id="warningModal" class="modal" style="width: 400px; margin-top: 150px">
|
||||
<div class="modal-content">
|
||||
<h4 class="red-text">Warning!</h4>
|
||||
<p id="wraningAlert"></p>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<a href="#!" class="modal-close waves-effect waves-green btn-flat">Close</a>
|
||||
<a href="#!" id="closeMenu" class="modal-close waves-effect waves-green btn-flat red-text">Yes</a>
|
||||
</div>
|
||||
</div>
|
||||
<!--- Fav Box -->
|
||||
<div id="modal_box" class="bottom-sheet"></div>
|
||||
<div id="createRest" class="modal modal-fixed-footer createRest">
|
||||
<div class="modal-content">
|
||||
<h4 class="card-panel">Create Restaurant</h4>
|
||||
<ul class="collapsible popout" data-collapsible="accordion" id="step">
|
||||
<li class="active" id="listepOne">
|
||||
<div class="collapsible-header" id="firstStep"><i class="material-icons">create</i>First: Create Your resturant Inforamtion</div>
|
||||
<div class="collapsible-body">
|
||||
<span>
|
||||
<div class="row" id="stepOne">
|
||||
<div id="stepOneAlert"></div>
|
||||
<div class="input-field col s12">
|
||||
<i class="material-icons prefix">restaurant</i>
|
||||
<input id="createRestaurantName" type="text" class="validate">
|
||||
<label for="createRestaureantName">Restaurant Name</label>
|
||||
</div>
|
||||
<div class="input-field col s12 m6">
|
||||
<i class="material-icons prefix">phone</i>
|
||||
<input id="createRestaureantTel" type="number" class="validate">
|
||||
<label for="createRestaureantTel">Telephone</label>
|
||||
</div>
|
||||
<div class="input-field col s12">
|
||||
<i class="material-icons prefix">location_on</i>
|
||||
<textarea id="createRestaureantAdde" class="materialize-textarea validate"></textarea>
|
||||
<label for="createRestaureantAdde">Address</label>
|
||||
</div>
|
||||
<div class="input-field col s12 m8">
|
||||
<i class="material-icons prefix">location_city</i>
|
||||
<select id="createRestaurantSelect">
|
||||
<option value="Kowloon">Kowloon</option>
|
||||
<option value="Hong Kong">Hong Kong</option>
|
||||
<option value="New Territories">New Territories</option>
|
||||
</select>
|
||||
<label>Area</label>
|
||||
</div>
|
||||
<div class="input-field col s5">
|
||||
<i class="material-icons prefix">location_searching</i>
|
||||
<input id="createRestaureantOPTime" type="text" class="timepicker">
|
||||
<label for="createRestaureantOPTime">Opening hours</label>
|
||||
</div>
|
||||
<div class="input-field col s2 center"> to</div>
|
||||
<div class="input-field col s5">
|
||||
<input id="createRestaureantCLTime" type="text" class="timepicker">
|
||||
<label for="createRestaureantCLTime">Close hours</label>
|
||||
</div>
|
||||
<div class="file-field input-field col s12">
|
||||
|
||||
<div class="btn">
|
||||
<span>File</span>
|
||||
<input type="file" name="file" id="file">
|
||||
</div>
|
||||
<div class="file-path-wrapper">
|
||||
<input class="file-path validate" type="text" placeholder="Your restaurent Image">
|
||||
</div>
|
||||
</div>
|
||||
<div class="input-field col s12">
|
||||
<div id="restChips" class="chips chips-placeholder"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</span>
|
||||
</div>
|
||||
</li>
|
||||
<li id="listepSecond" class="disabled">
|
||||
<div class="collapsible-header" id="secondStep"><i class="material-icons">label</i>Second: Create Your Catalog of resturant menu</div>
|
||||
<div class="collapsible-body">
|
||||
<span>
|
||||
<div class="row">
|
||||
<div id="menuCatAlert"></div>
|
||||
<div class="input-field col s12" style="margin: 0 0 50px 3px" >
|
||||
<label>
|
||||
<input type="checkbox" class="filled-in" id="catalogHidden" />
|
||||
<span>Hidden Catalog</span>
|
||||
</label>
|
||||
</div>
|
||||
<div class="input-field col s12 m8">
|
||||
<i class="material-icons prefix">label</i>
|
||||
<input type="text" class="autocomplete" id="catalog">
|
||||
<label for="catalog">Catalog (E.g. Lunch, Dinner, seasonal)</label>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="input-field col s12" style="margin-bottom: 35px">
|
||||
<label>
|
||||
<input type="checkbox" class="filled-in" checked="checked" id="catalogAllDay" />
|
||||
<span>All Day Menu</span>
|
||||
</label>
|
||||
</div>
|
||||
<div id="menuTime">
|
||||
<div class="input-field col s5">
|
||||
<i class="material-icons prefix">location_searching</i>
|
||||
<input id="catalogTo" type="text" class="timepicker">
|
||||
<label for="catalogTo">Start Time</label>
|
||||
</div>
|
||||
<div class="input-field col s1 center"> to</div>
|
||||
<div class="input-field col s5">
|
||||
<input id="catalogCl" type="text" class="timepicker">
|
||||
<label for="catalogCl">Close Time</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="input-field col s5">
|
||||
<button class="btn waves-effect waves-light btn-small" type="submit" name="action" id="btnAddCatalog">ADD Catalog
|
||||
<i class="material-icons right">add</i>
|
||||
</button>
|
||||
</div>
|
||||
<div class="col s12">
|
||||
<table id="catalogTable" >
|
||||
<tr>
|
||||
<th>Catalog Name</th>
|
||||
<th>All Day</th>
|
||||
<th>Start Time</th>
|
||||
<th>Close Time</th>
|
||||
<th>Hidden</th>
|
||||
<th>Action</th>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</span>
|
||||
</div>
|
||||
</li>
|
||||
<li id="liStepThrid">
|
||||
<div class="collapsible-header" id="stepThrid"><i class="material-icons">restaurant_menu</i>Finally: Create Your Resturant Menu</div>
|
||||
<div class="collapsible-body">
|
||||
<span>
|
||||
<div class="row">
|
||||
<div id="menuAlert"></div>
|
||||
<div class="input-field col s12 m10">
|
||||
<select id="menuCatalog">
|
||||
<option value="" disabled selected>Choose your catalog</option>
|
||||
</select>
|
||||
<label>Catalog Select</label>
|
||||
</div>
|
||||
<div class="input-field col s12 m10">
|
||||
<i class="material-icons prefix">restaurant</i>
|
||||
<input id="menuFoodName" type="text" class="validate">
|
||||
<label for="menuFoodName">Food Name</label>
|
||||
</div>
|
||||
<div class="input-field col s12 m4">
|
||||
<i class="material-icons prefix">attach_money</i>
|
||||
<input id="menuFoodPrice" type="number" class="validate">
|
||||
<label for="menuFoodPrice">Price</label>
|
||||
</div>
|
||||
<div class="input-field col s12" style="margin-bottom: 45px">
|
||||
<label>
|
||||
<input type="checkbox" class="filled-in" checked="checked" id="menuDisplay" />
|
||||
<span>Display</span>
|
||||
</label>
|
||||
</div>
|
||||
<div class="input-field col s5">
|
||||
<button class="btn waves-effect waves-light btn-small" type="submit" name="action" id="btnAddFood">ADD FOOD
|
||||
<i class="material-icons right">add</i>
|
||||
</button>
|
||||
</div>
|
||||
<table id="resturantMenu">
|
||||
<tr>
|
||||
<th>Food Name</th>
|
||||
<th>Catalog</th>
|
||||
<th>Price</th>
|
||||
<th>Display</th>
|
||||
<th>Action</th>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
</span>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<a href="#!" class="waves-effect waves-green btn-flat" id="btnMenuClose">CLOSE</a>
|
||||
<a class="waves-effect waves-green btn-flat modal-trigger" href="#alert" id="btnMenuSave">SAVE</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="alert" class="modal" style="width: 300px;">
|
||||
<div class="modal-content">
|
||||
<h4>Following the missing</h4>
|
||||
<p id="menuMissing"></p>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<a href="#!" class="modal-close waves-effect waves-green btn-flat" id="alertClose">Close</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div id="index-banner" class="parallax-container">
|
||||
<div class="">
|
||||
<div class="container" style="margin-top: 200px;">
|
||||
<h2 class="center">Restaurant</h2>
|
||||
</div>
|
||||
</div>
|
||||
<div class="parallax"><img src="images/background1.jpg"></div>
|
||||
</div>
|
||||
<div class="container">
|
||||
|
||||
<div class="section">
|
||||
<div class="row">
|
||||
<div class="col s12 m8 l7">
|
||||
<div class="card-panel grey lighten-5 ">
|
||||
|
||||
<div class="row" style="height: 50px; margin-top: -15px">
|
||||
<div class="input-field col s10 m8">
|
||||
<i class="material-icons prefix">search</i>
|
||||
<input placeholder="Resturant Name" id="foodSearch" type="text" class="validate">
|
||||
</div>
|
||||
<div class="col s2">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container" style="padding: 0">
|
||||
<div class="row" id="operatorRestaurant">
|
||||
<div id="restaurantMenu">
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Modal Structure -->
|
||||
<div id="modal1" class="modal loginModal" style="width: 400px;">
|
||||
<div class="row center-align">
|
||||
<div class="col s12 modal-content">
|
||||
<span class="flow-text" id="loginInfo">
|
||||
<div id="loginAlert"></div>
|
||||
<h4 style="border-bottom: 1px solid #ebebeb; height: 50px;">LOGIN</h4>
|
||||
<div class="input-field col s12">
|
||||
<i class="material-icons prefix">account_circle</i>
|
||||
<input id="loginEmail" type="text" class="validate" required>
|
||||
<label for="loginEmail">Email</label>
|
||||
</div><br>
|
||||
<div class="input-field col s12">
|
||||
<i class="material-icons prefix">vpn_key</i>
|
||||
<input id="loginPwd" type="password" class="validate" required>
|
||||
<label for="loginPwd">Password</label>
|
||||
</div>
|
||||
|
||||
<a class="waves-effect waves-light btn col s10 offset-s1" style="margin-top: 50px" id="btnSubmitLogin">LOGIN</a>
|
||||
<h6 class=" col s12">Don"t have an account? <a href="#" id="createAccount">Sign up here</a></h6>
|
||||
</span>
|
||||
<span class="flow-text" id="createInfo">
|
||||
<div id="pwdAlert"></div>
|
||||
<h4 style='border-bottom: 1px solid #ebebeb; height: 50px;'>REGISTER</h4><div class='input-field col s6'><input id='first_name' type='text' class='validate' required><label for='first_name'>First Name</label></div><div class='input-field col s6'><input id='last_name' type='text' class='validate' required><label for='last_name'>Last Name</label></div><div class='input-field col s12'><input id='regEmail' type='email' class='validate' required><label for='regEmail'>Email</label></div><div class='input-field col s12'><input id='regPassword' type='password' class='validate' required><label for='regPassword'>Password</label></div><div class='input-field col s12'><input id='checkPassword' type='password' class='validate' required><label for='checkPassword'>Confirm Password</label></div><a class='waves-effect waves-light btn col s10 offset-s1' style='margin-top: 50px' id='btnSubmitRegister'>REGISTER</a><h6 class='col s12' id="changeLogin">You have an account? <a href='#' id='loginAccount'>Login</a></h6>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal-footer">
|
||||
<a href="#!" class=" modal-action modal-close waves-effect waves-green btn-flat">Close</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer class="page-footer teal">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
|
||||
<div class="col l3 s12">
|
||||
<h5 class="white-text">Connect</h5>
|
||||
<ul>
|
||||
<li><a class="white-text" href="aboutus.html">About Us</a></li>
|
||||
<li><a class="white-text" href="userGuide.html">User Guide</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-copyright">
|
||||
<div class="container">Copyright © 2019 InnoTech HK Inc. All rights reserved</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<!-- Scripts-->
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
205
it114105/itp4506/Assignment/19-20/search.html
Normal file
205
it114105/itp4506/Assignment/19-20/search.html
Normal file
@@ -0,0 +1,205 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>Yummy Everywhere</title>
|
||||
|
||||
<!-- CSS -->
|
||||
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
|
||||
<link href="css/materialize.css" type="text/css" rel="stylesheet" media="screen,projection" />
|
||||
<link href="css/style.css" type="text/css" rel="stylesheet" />
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
|
||||
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
|
||||
<script src="js/materialize.js"></script>
|
||||
<script src="js/init.js"></script>
|
||||
</head>
|
||||
<script>
|
||||
$(document).ready(function() {
|
||||
$.getRestanauent();
|
||||
var foodText = GetURLParameter('food');
|
||||
$("#foodSearch").val(foodText);
|
||||
$("#foodSearch").keyup(function() {
|
||||
|
||||
$("#searchMessage").html("");
|
||||
foodText = $("#foodSearch").val();
|
||||
$(".searchRest").hide().filter(":contains('" + foodText + "')").show();
|
||||
if($(".searchRest:hidden").length >= $(".searchRest").length){
|
||||
$("#searchMessage").html("<h4>Sorry, not found about "+ foodText+ " Restanauent. <a href='search.html'>Click Here to see All Restanauent</a></h4>'");
|
||||
}
|
||||
});
|
||||
|
||||
function GetURLParameter(sParam) {
|
||||
var sPageURL = window.location.search.substring(1);
|
||||
var sURLVariables = sPageURL.split('&');
|
||||
for (var i = 0; i < sURLVariables.length; i++) {
|
||||
var sParameterName = sURLVariables[i].split('=');
|
||||
if (sParameterName[0] == sParam)
|
||||
return sParameterName[1];
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
</script>
|
||||
|
||||
<body>
|
||||
<nav>
|
||||
<div class="nav-wrapper container">
|
||||
<a id="logo-container" href="index.html" class="brand-logo ">Yummy Everywhere</a>
|
||||
|
||||
<ul class="right">
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
<ul id="slide-out" class="sidenav">
|
||||
</ul>
|
||||
<!--- Fav Box -->
|
||||
<div id="modal_box" class="bottom-sheet"></div>
|
||||
<div id="filter" class="modal" style="width: 400px">
|
||||
<div class="modal-content">
|
||||
<h4 style="border-bottom: 0.3px solid">Types of food Select</h4>
|
||||
<p style="margin-top: 30px">
|
||||
<p style="margin-left: 10px">
|
||||
<label>
|
||||
<input type="checkbox" id="filterNoodles" value="Noodles" />
|
||||
<span>Noodles</span>
|
||||
</label>
|
||||
</p>
|
||||
<p style="margin-left: 10px">
|
||||
<label>
|
||||
<input type="checkbox" id="filterKoeran" value="Koeran"/>
|
||||
<span>Koeran</span>
|
||||
</label>
|
||||
</p>
|
||||
<p style="margin-left: 10px">
|
||||
<label>
|
||||
<input type="checkbox" id="filterTaiwanese" value="Taiwanese"/>
|
||||
<span>Taiwanese</span>
|
||||
</label>
|
||||
</p>
|
||||
<p style="margin-left: 10px">
|
||||
<label>
|
||||
<input type="checkbox" id="filterRice" value="Rice"/>
|
||||
<span>Rice</span>
|
||||
</label>
|
||||
</p>
|
||||
<p style="margin-left: 10px">
|
||||
<label>
|
||||
<input type="checkbox" id="filterChinese" value="Chinese"/>
|
||||
<span>Chinese</span>
|
||||
</label>
|
||||
</p>
|
||||
<p style="margin-left: 10px">
|
||||
<label>
|
||||
<input type="checkbox" id="filterWestern" value="Western"/>
|
||||
<span>Western</span>
|
||||
</label>
|
||||
</p>
|
||||
<p style="margin-left: 10px">
|
||||
<label>
|
||||
<input type="checkbox" id="filterDimSum" value="Dim Sum"/>
|
||||
<span>Dim Sum</span>
|
||||
</label>
|
||||
</p>
|
||||
</p>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<a href="#!" class="modal-close waves-effect waves-green btn-flat" id="filterClear">Clear All</a>
|
||||
<a href="#!" class="modal-close waves-effect waves-green btn-flat" id="filterApply">Apply</a>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div id="index-banner" class="parallax-container">
|
||||
<div class="parallax"><img src="images/background1.jpg"></div>
|
||||
</div>
|
||||
|
||||
<div class="container">
|
||||
|
||||
<div class="row" id="menu">
|
||||
<div class="row">
|
||||
<div class="col s12 m8 l7">
|
||||
|
||||
<div class="card-panel grey lighten-5 ">
|
||||
<div class="row" style="height: 50px; margin-top: -15px; margin-right:0">
|
||||
<div class="input-field col s9 m8">
|
||||
<i class="material-icons prefix">search</i>
|
||||
<input placeholder="Restaurant Name or Food" id="foodSearch" type="text" id="foodSearch" class="validate">
|
||||
</div>
|
||||
|
||||
<div class="col s3 m3" style="margin-top: 20px;">
|
||||
<a class="waves-effect waves-light btn modal-trigger" href="#filter" style="width:51px"><i class="material-icons medium">offline_pin</i></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="searchMessage"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<iv class="container">
|
||||
<div class="section">
|
||||
<div class="row">
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<!-- Modal Structure -->
|
||||
<div id="modal1" class="modal" style="width: 400px;">
|
||||
<div class="row center-align">
|
||||
<div class="col s12 modal-content">
|
||||
<span class="flow-text" id="loginInfo">
|
||||
<div id="loginAlert"></div>
|
||||
<h4 style="border-bottom: 1px solid #ebebeb; height: 50px;">LOGIN</h4>
|
||||
<div class="input-field col s12">
|
||||
<i class="material-icons prefix">account_circle</i>
|
||||
<input id="loginEmail" type="text" class="validate" required>
|
||||
<label for="loginEmail">Email</label>
|
||||
</div><br>
|
||||
<div class="input-field col s12">
|
||||
<i class="material-icons prefix">vpn_key</i>
|
||||
<input id="loginPwd" type="password" class="validate" required>
|
||||
<label for="loginPwd">Password</label>
|
||||
</div>
|
||||
|
||||
<a class="waves-effect waves-light btn col s10 offset-s1" style="margin-top: 50px" id="btnSubmitLogin">LOGIN</a>
|
||||
<h6 class=" col s12">Don"t have an account? <a href="#" id="createAccount">Sign up here</a></h6>
|
||||
</span>
|
||||
<span class="flow-text" id="createInfo">
|
||||
<div id="pwdAlert"></div>
|
||||
<h4 style='border-bottom: 1px solid #ebebeb; height: 50px;'>REGISTER</h4><div class='input-field col s6'><input id='first_name' type='text' class='validate' required><label for='first_name'>First Name</label></div><div class='input-field col s6'><input id='last_name' type='text' class='validate' required><label for='last_name'>Last Name</label></div><div class='input-field col s12'><input id='regEmail' type='email' class='validate' required><label for='regEmail'>Email</label></div><div class='input-field col s12'><input id='regPassword' type='password' class='validate' required><label for='regPassword'>Password</label></div><div class='input-field col s12'><input id='checkPassword' type='password' class='validate' required><label for='checkPassword'>Confirm Password</label></div><a class='waves-effect waves-light btn col s10 offset-s1' style='margin-top: 50px' id='btnSubmitRegister'>REGISTER</a><h6 class='col s12' id="changeLogin">You have an account? <a href='#' id='loginAccount'>Login</a></h6>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal-footer">
|
||||
<a href="#!" class=" modal-action modal-close waves-effect waves-green btn-flat">Close</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer class="page-footer teal">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
|
||||
<div class="col l3 s12">
|
||||
<h5 class="white-text">Connect</h5>
|
||||
<ul>
|
||||
<li><a class="white-text" href="aboutus.html">About Us</a></li>
|
||||
<li><a class="white-text" href="userGuide.html">User Guide</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-copyright">
|
||||
<div class="container">Copyright © 2019 InnoTech HK Inc. All rights reserved</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<!-- Scripts-->
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
23
it114105/itp4506/Assignment/20-21/.gitignore
vendored
Normal file
23
it114105/itp4506/Assignment/20-21/.gitignore
vendored
Normal file
@@ -0,0 +1,23 @@
|
||||
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
|
||||
|
||||
# dependencies
|
||||
/node_modules
|
||||
/.pnp
|
||||
.pnp.js
|
||||
|
||||
# testing
|
||||
/coverage
|
||||
|
||||
# production
|
||||
/build
|
||||
|
||||
# misc
|
||||
.DS_Store
|
||||
.env.local
|
||||
.env.development.local
|
||||
.env.test.local
|
||||
.env.production.local
|
||||
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
8
it114105/itp4506/Assignment/20-21/Dockerfile
Normal file
8
it114105/itp4506/Assignment/20-21/Dockerfile
Normal file
@@ -0,0 +1,8 @@
|
||||
FROM node:14.13.1
|
||||
COPY . /app
|
||||
WORKDIR /app
|
||||
COPY package.json /app
|
||||
RUN npm install
|
||||
COPY . /app
|
||||
CMD ["npm", "start"]
|
||||
|
||||
68
it114105/itp4506/Assignment/20-21/README.md.original
Normal file
68
it114105/itp4506/Assignment/20-21/README.md.original
Normal file
@@ -0,0 +1,68 @@
|
||||
This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).
|
||||
|
||||
## Available Scripts
|
||||
|
||||
In the project directory, you can run:
|
||||
|
||||
### `npm start`
|
||||
|
||||
Runs the app in the development mode.<br />
|
||||
Open [http://localhost:3000](http://localhost:3000) to view it in the browser.
|
||||
|
||||
The page will reload if you make edits.<br />
|
||||
You will also see any lint errors in the console.
|
||||
|
||||
### `npm test`
|
||||
|
||||
Launches the test runner in the interactive watch mode.<br />
|
||||
See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information.
|
||||
|
||||
### `npm run build`
|
||||
|
||||
Builds the app for production to the `build` folder.<br />
|
||||
It correctly bundles React in production mode and optimizes the build for the best performance.
|
||||
|
||||
The build is minified and the filenames include the hashes.<br />
|
||||
Your app is ready to be deployed!
|
||||
|
||||
See the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information.
|
||||
|
||||
### `npm run eject`
|
||||
|
||||
**Note: this is a one-way operation. Once you `eject`, you can’t go back!**
|
||||
|
||||
If you aren’t satisfied with the build tool and configuration choices, you can `eject` at any time. This command will remove the single build dependency from your project.
|
||||
|
||||
Instead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you’re on your own.
|
||||
|
||||
You don’t have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn’t feel obligated to use this feature. However we understand that this tool wouldn’t be useful if you couldn’t customize it when you are ready for it.
|
||||
|
||||
## Learn More
|
||||
|
||||
You can learn more in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started).
|
||||
|
||||
To learn React, check out the [React documentation](https://reactjs.org/).
|
||||
|
||||
### Code Splitting
|
||||
|
||||
This section has moved here: https://facebook.github.io/create-react-app/docs/code-splitting
|
||||
|
||||
### Analyzing the Bundle Size
|
||||
|
||||
This section has moved here: https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size
|
||||
|
||||
### Making a Progressive Web App
|
||||
|
||||
This section has moved here: https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app
|
||||
|
||||
### Advanced Configuration
|
||||
|
||||
This section has moved here: https://facebook.github.io/create-react-app/docs/advanced-configuration
|
||||
|
||||
### Deployment
|
||||
|
||||
This section has moved here: https://facebook.github.io/create-react-app/docs/deployment
|
||||
|
||||
### `npm run build` fails to minify
|
||||
|
||||
This section has moved here: https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify
|
||||
14605
it114105/itp4506/Assignment/20-21/package-lock.json
generated
Normal file
14605
it114105/itp4506/Assignment/20-21/package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
40
it114105/itp4506/Assignment/20-21/package.json
Normal file
40
it114105/itp4506/Assignment/20-21/package.json
Normal file
@@ -0,0 +1,40 @@
|
||||
{
|
||||
"name": "dream-house-online",
|
||||
"version": "0.1.0",
|
||||
"private": true,
|
||||
"homepage": "./",
|
||||
"dependencies": {
|
||||
"@material-ui/core": "^4.11.0",
|
||||
"@material-ui/icons": "^4.9.1",
|
||||
"@testing-library/jest-dom": "^4.2.4",
|
||||
"@testing-library/react": "^9.5.0",
|
||||
"@testing-library/user-event": "^7.2.1",
|
||||
"material-table": "^1.69.1",
|
||||
"material-ui-icons": "^1.0.0-beta.36",
|
||||
"react": "^16.13.1",
|
||||
"react-dom": "^16.13.1",
|
||||
"react-router-dom": "^5.2.0",
|
||||
"react-scripts": "3.4.3"
|
||||
},
|
||||
"scripts": {
|
||||
"start": "react-scripts start",
|
||||
"build": "react-scripts build",
|
||||
"test": "react-scripts test",
|
||||
"eject": "react-scripts eject"
|
||||
},
|
||||
"eslintConfig": {
|
||||
"extends": "react-app"
|
||||
},
|
||||
"browserslist": {
|
||||
"production": [
|
||||
">0.2%",
|
||||
"not dead",
|
||||
"not op_mini all"
|
||||
],
|
||||
"development": [
|
||||
"last 1 chrome version",
|
||||
"last 1 firefox version",
|
||||
"last 1 safari version"
|
||||
]
|
||||
}
|
||||
}
|
||||
BIN
it114105/itp4506/Assignment/20-21/public/favicon.ico
Normal file
BIN
it114105/itp4506/Assignment/20-21/public/favicon.ico
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.1 KiB |
19
it114105/itp4506/Assignment/20-21/public/index.html
Normal file
19
it114105/itp4506/Assignment/20-21/public/index.html
Normal file
@@ -0,0 +1,19 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<meta name="theme-color" content="#000000" />
|
||||
<meta
|
||||
name="description"
|
||||
content="Web site created using create-react-app"/>
|
||||
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
|
||||
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
|
||||
<title>Dream House Online</title>
|
||||
</head>
|
||||
<body>
|
||||
<noscript>You need to enable JavaScript to run this app.</noscript>
|
||||
<div id="root"></div>
|
||||
</body>
|
||||
</html>
|
||||
BIN
it114105/itp4506/Assignment/20-21/public/logo192.png
(Stored with Git LFS)
Normal file
BIN
it114105/itp4506/Assignment/20-21/public/logo192.png
(Stored with Git LFS)
Normal file
Binary file not shown.
BIN
it114105/itp4506/Assignment/20-21/public/logo512.png
(Stored with Git LFS)
Normal file
BIN
it114105/itp4506/Assignment/20-21/public/logo512.png
(Stored with Git LFS)
Normal file
Binary file not shown.
25
it114105/itp4506/Assignment/20-21/public/manifest.json
Normal file
25
it114105/itp4506/Assignment/20-21/public/manifest.json
Normal file
@@ -0,0 +1,25 @@
|
||||
{
|
||||
"short_name": "React App",
|
||||
"name": "Create React App Sample",
|
||||
"icons": [
|
||||
{
|
||||
"src": "favicon.ico",
|
||||
"sizes": "64x64 32x32 24x24 16x16",
|
||||
"type": "image/x-icon"
|
||||
},
|
||||
{
|
||||
"src": "logo192.png",
|
||||
"type": "image/png",
|
||||
"sizes": "192x192"
|
||||
},
|
||||
{
|
||||
"src": "logo512.png",
|
||||
"type": "image/png",
|
||||
"sizes": "512x512"
|
||||
}
|
||||
],
|
||||
"start_url": ".",
|
||||
"display": "standalone",
|
||||
"theme_color": "#000000",
|
||||
"background_color": "#ffffff"
|
||||
}
|
||||
3
it114105/itp4506/Assignment/20-21/public/robots.txt
Normal file
3
it114105/itp4506/Assignment/20-21/public/robots.txt
Normal file
@@ -0,0 +1,3 @@
|
||||
# https://www.robotstxt.org/robotstxt.html
|
||||
User-agent: *
|
||||
Disallow:
|
||||
37
it114105/itp4506/Assignment/20-21/src/AppRouter.js
Normal file
37
it114105/itp4506/Assignment/20-21/src/AppRouter.js
Normal file
@@ -0,0 +1,37 @@
|
||||
import React from 'react';
|
||||
import { BrowserRouter, Route, Switch } from "react-router-dom";
|
||||
import LoginForm from './login/LoginForm';
|
||||
import SignUpForm from './login/SignUpForm';
|
||||
import ManagerTemplate from './user/manager/ManagerTemplate';
|
||||
//import SignUp from './SignUp';
|
||||
|
||||
|
||||
class AppRouter extends React.Component {
|
||||
|
||||
render() {
|
||||
return (
|
||||
<BrowserRouter>
|
||||
<Switch>
|
||||
<Route exact path="/" component={LoginForm} />
|
||||
<Route path="/index" component={LoginForm} />
|
||||
<Route path="/signup" component={SignUpForm}/>
|
||||
<Route path="/manager/home" component={ManagerTemplate}/>
|
||||
<Route path="/manager/profile" component={ManagerTemplate}/>
|
||||
<Route path="/manager/appointment/:id" component={ManagerTemplate}/>
|
||||
<Route path="/manager/appointment" component={ManagerTemplate}/>
|
||||
<Route path="/manager/comment" component={ManagerTemplate}/>
|
||||
<Route path="/manager/customer/:id" component={ManagerTemplate}/>
|
||||
<Route path="/manager/customer" component={ManagerTemplate}/>
|
||||
<Route path="/manager/property" component={ManagerTemplate}/>
|
||||
<Route path="/manager/agent" component={ManagerTemplate}/>
|
||||
<Route path='/manager/logout' component={ManagerTemplate} />
|
||||
<Route path='/user/home' render={() => window.location.href = "http://localhost:8080/html/user-property.html?u=" + localStorage.getItem("username")}/>
|
||||
<Route path='/agent/home' render={() => window.location.href = "http://localhost:8080/html/agent-property.html?u=" + localStorage.getItem("username")}/>
|
||||
</Switch>
|
||||
</BrowserRouter>
|
||||
);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
export default AppRouter;
|
||||
13
it114105/itp4506/Assignment/20-21/src/index.css
Normal file
13
it114105/itp4506/Assignment/20-21/src/index.css
Normal file
@@ -0,0 +1,13 @@
|
||||
body {
|
||||
margin: 0;
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
|
||||
'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
|
||||
sans-serif;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
code {
|
||||
font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
|
||||
monospace;
|
||||
}
|
||||
17
it114105/itp4506/Assignment/20-21/src/index.js
Normal file
17
it114105/itp4506/Assignment/20-21/src/index.js
Normal file
@@ -0,0 +1,17 @@
|
||||
import React from 'react';
|
||||
import ReactDOM from 'react-dom';
|
||||
import './index.css';
|
||||
import Router from './AppRouter';
|
||||
import * as serviceWorker from './serviceWorker';
|
||||
|
||||
ReactDOM.render(
|
||||
<React.StrictMode>
|
||||
<Router />
|
||||
</React.StrictMode>,
|
||||
document.getElementById('root')
|
||||
);
|
||||
|
||||
// If you want your app to work offline and load faster, you can change
|
||||
// unregister() to register() below. Note this comes with some pitfalls.
|
||||
// Learn more about service workers: https://bit.ly/CRA-PWA
|
||||
serviceWorker.unregister();
|
||||
196
it114105/itp4506/Assignment/20-21/src/login/Login.css
Normal file
196
it114105/itp4506/Assignment/20-21/src/login/Login.css
Normal file
@@ -0,0 +1,196 @@
|
||||
*{
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
body{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: #fafafa;
|
||||
}
|
||||
|
||||
button, input[type='button']{
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
img{
|
||||
max-height: 100%;
|
||||
}
|
||||
|
||||
a{
|
||||
font-size: 10px;
|
||||
color: black;
|
||||
margin-top: 40px;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.login-form-btnLogin{
|
||||
margin: 20px 0;
|
||||
width: 100px;
|
||||
background: black;
|
||||
border-radius: 4px;
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
font-size: 13px;
|
||||
padding: 10px;
|
||||
color: white;
|
||||
cursor: pointer;
|
||||
float: right;
|
||||
margin-top: 30px;
|
||||
margin-right: -20px;
|
||||
}
|
||||
|
||||
input{
|
||||
display: block;
|
||||
width: 100%;
|
||||
border: 1px solid #efefef;
|
||||
border-radius: 5px;
|
||||
font-size: 12px;
|
||||
color: #262626;
|
||||
background: #fafafa;
|
||||
padding: 12px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.signup-form input{
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
|
||||
input[name='lastName']{
|
||||
flex-direction:row;
|
||||
justify-content:flex-start;
|
||||
margin-left: 10px;
|
||||
}
|
||||
.input-container{
|
||||
display: flex;
|
||||
width: 107%;
|
||||
}
|
||||
input[name='firstName'], input[name='lastName']{
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.login-container{
|
||||
flex-wrap: nowrap;
|
||||
margin-top: 75px;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
margin: 200px auto;
|
||||
}
|
||||
|
||||
.login-form, .signup-form{
|
||||
width: 50%;
|
||||
margin: 0 auto;
|
||||
padding: 50px;
|
||||
border: 1px solid #d8dee2;
|
||||
border-radius: 3px;
|
||||
background-color: white;
|
||||
width:400px;
|
||||
height:auto;
|
||||
}
|
||||
|
||||
|
||||
.signup-form{
|
||||
height: auto;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.signup-form input[type='button']{
|
||||
width: 106%;
|
||||
background: #3897f0;
|
||||
color: white;
|
||||
font-weight: bold;
|
||||
margin-top: 50px;
|
||||
}
|
||||
|
||||
|
||||
h1{
|
||||
margin-top: 20px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.login-form hr{
|
||||
overflow: visible;
|
||||
padding: 0;
|
||||
border: none;
|
||||
border-top: medium double #333;
|
||||
color: #333;
|
||||
text-align: center;
|
||||
margin-top: 30px;
|
||||
}
|
||||
|
||||
|
||||
.login-form-detial-row{
|
||||
display: flex;
|
||||
margin-top: 70px;
|
||||
}
|
||||
|
||||
.signup-form-detial-row{
|
||||
margin-top: 40px;
|
||||
width: 90%;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.login-form-detial-col-role{
|
||||
flex: 30%;
|
||||
margin-top: -10px;
|
||||
}
|
||||
|
||||
.login-form-detial-col-input{
|
||||
flex: 70%;
|
||||
padding: 0 50px 0 50px ;
|
||||
|
||||
}
|
||||
|
||||
.login-form-detial-col-role button{
|
||||
width: 100%;
|
||||
text-align: right;
|
||||
padding: 10px;
|
||||
background-color: white;
|
||||
border: 0;
|
||||
border-right: 1px solid #d8dee2;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
.login-form-detial-col-role button:hover{
|
||||
background-color: #333;
|
||||
color: white;
|
||||
opacity: 0.6;
|
||||
transition: 0.9s;
|
||||
}
|
||||
|
||||
.login-form-detial-col-role .selected{
|
||||
background-color: black;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.signup-form span{
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: grey;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.bs-callout {
|
||||
padding: 20px;
|
||||
border: 1px solid #BEBEBE;
|
||||
border-left-width: 5px;
|
||||
border-radius: 1px;
|
||||
background-color: white;
|
||||
width: 5;
|
||||
margin: 10px auto 0px 0px;
|
||||
}
|
||||
|
||||
.bs-callout-danger {
|
||||
border-left-color: #d9534f;
|
||||
}
|
||||
|
||||
.signup-message, .login-message{
|
||||
width: 50%;
|
||||
margin: 0 auto;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
|
||||
.bs-callout-success {
|
||||
border-left-color: #5cb85c;
|
||||
}
|
||||
70
it114105/itp4506/Assignment/20-21/src/login/LoginForm.js
Normal file
70
it114105/itp4506/Assignment/20-21/src/login/LoginForm.js
Normal file
@@ -0,0 +1,70 @@
|
||||
import React, { Component } from 'react';
|
||||
import queryString from 'query-string';
|
||||
import './Login.css';
|
||||
import UserLoginForm from './UserLoginForm';
|
||||
|
||||
class LoginForm extends Component {
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
errMess: [],
|
||||
sucMess: []
|
||||
};
|
||||
}
|
||||
|
||||
showErrMessage = (mes, type) => {
|
||||
//0: error, 1:succesful
|
||||
if (mes == null) {
|
||||
this.setState({ sucMess: [], errMess:[] });
|
||||
} else {
|
||||
switch (type) {
|
||||
case 1:
|
||||
this.setState({
|
||||
sucMess: this.state.sucMess.concat(mes)
|
||||
});
|
||||
break;
|
||||
|
||||
default:
|
||||
this.setState({
|
||||
errMess: this.state.errMess.concat(mes)
|
||||
});
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
componentDidMount = () =>{
|
||||
const values = queryString.parse(this.props.location.search)
|
||||
let username = values.reg;
|
||||
if(username !== undefined){
|
||||
this.setState({
|
||||
sucMess: this.state.sucMess.concat("username: " + decodeURI(username) + " is created")
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
render = () => {
|
||||
var mesList = null;
|
||||
if (this.state.errMess.length > 0) {
|
||||
mesList = <div className="bs-callout bs-callout-danger"><h4>Login Failed</h4>{this.state.errMess[this.state.errMess.length - 1]}</div>;
|
||||
}else if(this.state.sucMess.length > 0){
|
||||
mesList = <div className="bs-callout bs-callout-success"><h4>Registration Successful</h4>{this.state.sucMess[this.state.sucMess.length - 1]}</div>;
|
||||
}
|
||||
return (
|
||||
<div className="login-container">
|
||||
<div className="login-form">
|
||||
{mesList}
|
||||
<h1>Dream House Online</h1>
|
||||
<div className="login-form-detial">
|
||||
<UserLoginForm argue={this.showErrMessage} />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
export default LoginForm;
|
||||
46
it114105/itp4506/Assignment/20-21/src/login/SignUpForm.js
Normal file
46
it114105/itp4506/Assignment/20-21/src/login/SignUpForm.js
Normal file
@@ -0,0 +1,46 @@
|
||||
import React, {Component} from 'react';
|
||||
import UserSignUpForm from './UserSignUpForm';
|
||||
|
||||
class SignUpForm extends Component {
|
||||
|
||||
constructor(props){
|
||||
super(props);
|
||||
this.state = {
|
||||
errMess: []
|
||||
}
|
||||
}
|
||||
|
||||
showErrMessage = (mes) => {
|
||||
if (mes === null){
|
||||
let newList = [];
|
||||
this.setState({errMess: newList});
|
||||
}else{
|
||||
this.setState({
|
||||
errMess: this.state.errMess.concat(mes)
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
render = () => {
|
||||
var mesList = null;
|
||||
if(this.state.errMess.length > 0){
|
||||
mesList = <div className="bs-callout bs-callout-danger"><h4>Registration Failed</h4>{this.state.errMess[this.state.errMess.length - 1]}</div>;
|
||||
}
|
||||
return(
|
||||
<div className="login-container">
|
||||
|
||||
<div className="signup-form">
|
||||
{mesList}
|
||||
<h1>Dream House Online</h1>
|
||||
<span>Create the customer account</span>
|
||||
<div className="login-form-detial">
|
||||
<UserSignUpForm argue={this.showErrMessage}/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
export default SignUpForm;
|
||||
101
it114105/itp4506/Assignment/20-21/src/login/UserLoginForm.js
Normal file
101
it114105/itp4506/Assignment/20-21/src/login/UserLoginForm.js
Normal file
@@ -0,0 +1,101 @@
|
||||
import React, {Component} from 'react';
|
||||
import { Link, Redirect } from 'react-router-dom';
|
||||
import './Login.css';
|
||||
import userJson from '../server/user.json';
|
||||
import managerJson from '../server/manager.json';
|
||||
import agentJson from '../server/agent.json';
|
||||
|
||||
class UserLoginForm extends Component{
|
||||
constructor(props){
|
||||
super(props);
|
||||
this.state = {
|
||||
role: 'customer',
|
||||
username: '',
|
||||
password: '',
|
||||
redirect: null
|
||||
}
|
||||
}
|
||||
|
||||
changeRole = (roleName) =>{
|
||||
this.props.argue(null);
|
||||
this.setState({role: roleName});
|
||||
}
|
||||
|
||||
handleChange = (event) => {
|
||||
let eleName = event.target.name;
|
||||
this.setState({[eleName]: event.target.value});
|
||||
}
|
||||
|
||||
handleLogin = (event) => {
|
||||
event.preventDefault();
|
||||
this.props.argue(null);
|
||||
var user = null;
|
||||
var route = null;
|
||||
if(this.state.role === "customer"){
|
||||
user = userJson;
|
||||
route = "user/home";
|
||||
}else if(this.state.role === "agent"){
|
||||
user = agentJson;
|
||||
route = "/agent/home"
|
||||
}else if(this.state.role === "manager"){
|
||||
user = managerJson;
|
||||
route = "/manager/home"
|
||||
}
|
||||
var isNotFound = true;
|
||||
user.forEach((userObj, index) => {
|
||||
if(userObj.username === this.state.username && userObj.password === this.state.password){
|
||||
this.setState({redirect: route});
|
||||
isNotFound = false;
|
||||
localStorage.setItem('username', this.state.username);
|
||||
localStorage.setItem('id', userObj.id);
|
||||
return;
|
||||
}else{
|
||||
if(userObj.username === this.state.username && userObj.password !== this.state.password){
|
||||
this.props.argue("Password is not correct", 0);
|
||||
this.setState({redirect: null});
|
||||
isNotFound = false;
|
||||
}
|
||||
}
|
||||
});
|
||||
if(isNotFound){
|
||||
this.props.argue("Username or Password is not correct");
|
||||
this.setState({redirect: null});
|
||||
}
|
||||
}
|
||||
|
||||
SignUp = () => {
|
||||
if(this.state.role === "customer"){
|
||||
return <Link style={{fontSize: "10px", color: "black", right: 0}} to="/signup">Click here to create account</Link>
|
||||
}
|
||||
}
|
||||
|
||||
render = () => {
|
||||
const { redirect } = this.state;
|
||||
if (redirect != null) {
|
||||
return <Redirect to={this.state.redirect} />;
|
||||
}
|
||||
return(
|
||||
<div className="login-form-detial-row">
|
||||
<div className="login-form-detial-col-role">
|
||||
<button className={(this.state.role === "customer")? "selected": ""} onClick={ () => this.changeRole("customer")}>Customer</button>
|
||||
<button className={(this.state.role === "agent")? "selected": ""} onClick={ () => this.changeRole("agent")}>Agent</button>
|
||||
<button className={(this.state.role === "manager")? "selected": ""} onClick={ () => this.changeRole("manager")}>Manager</button>
|
||||
</div>
|
||||
<div className="login-form-detial-col-input">
|
||||
<form>
|
||||
<input type="text" name="username" onChange={this.handleChange} value={this.state.username} placeholder="Username" required/>
|
||||
<input type="password" name="password" onChange={this.handleChange} value={this.state.password} placeholder="Password" required/>
|
||||
<input type="hidden" name="role" value={this.state.role} />
|
||||
{
|
||||
(this.state.role === "customer") && <Link to="signup">Click here to create account</Link>
|
||||
}
|
||||
<input type="button" className="login-form-btnLogin" value="Login" onClick={this.handleLogin}/>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
export default UserLoginForm;
|
||||
@@ -0,0 +1,80 @@
|
||||
import React, {Component} from 'react';
|
||||
import './Login.css';
|
||||
import { Link, Redirect } from 'react-router-dom';
|
||||
|
||||
|
||||
class UserSignUpForm extends Component{
|
||||
|
||||
constructor(props){
|
||||
super(props);
|
||||
this.state = {
|
||||
username: "",
|
||||
password: "",
|
||||
cpwd: "",
|
||||
email: "",
|
||||
phone: "",
|
||||
firstName: "",
|
||||
lastName: "",
|
||||
redirect: null
|
||||
}
|
||||
}
|
||||
|
||||
handleChange = (event) => {
|
||||
let changeName = event.target.name;
|
||||
this.setState({[changeName]: event.target.value});
|
||||
}
|
||||
|
||||
handleSignUp = () => {
|
||||
var isVaild = true;
|
||||
this.props.argue(null);
|
||||
const re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
|
||||
if(this.state.username === "" || this.state.password === ""
|
||||
|| this.state.cpwd === "" || this.state.email === ""
|
||||
|| this.state.phone === "" || this.state.firstName === ""
|
||||
|| this.state.lastName === ""){
|
||||
this.props.argue("Missing the required fields");
|
||||
isVaild = false;
|
||||
}else if(this.state.password !== this.state.cpwd){
|
||||
this.props.argue("Password is not match");
|
||||
isVaild = false;
|
||||
}else if (!re.test(String(this.state.email).toLowerCase())) {
|
||||
this.props.argue("Email format is incorrect");
|
||||
isVaild = false;
|
||||
}
|
||||
|
||||
if(!isVaild){
|
||||
this.setState({password: "", cpwd: "" });
|
||||
}else{
|
||||
this.setState({redirect: "/index?reg=" + encodeURI(this.state.username)});
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
render = () => {
|
||||
const { redirect } = this.state;
|
||||
if (redirect != null) {
|
||||
return <Redirect to={this.state.redirect} />;
|
||||
}
|
||||
return(
|
||||
<div className="signup-form-detial-row">
|
||||
<input type="text" name="username" onChange={this.handleChange} value={this.state.username} placeholder="Username"/>
|
||||
<input type="password" name="password" onChange={this.handleChange} value={this.state.password} placeholder="Password"/>
|
||||
<input type="password" name="cpwd" onChange={this.handleChange} value={this.state.cpwd} placeholder="Confirm Passoword"/>
|
||||
<input type="email" name="email" onChange={this.handleChange} value={this.state.email} placeholder="Email"/>
|
||||
<input type="tel" name="phone" onChange={this.handleChange} value={this.state.phone} placeholder="Phone Number"/>
|
||||
<div className="input-container">
|
||||
<input type="text" name="firstName" onChange={this.handleChange} value={this.state.firstName} placeholder="First Name"/>
|
||||
<input type="text" name="lastName" onChange={this.handleChange} value={this.state.lastName} placeholder="Last Name"/>
|
||||
</div>
|
||||
<br/>
|
||||
<Link to="index">Already have account?</Link>
|
||||
<input type="button" onClick={this.handleSignUp} value="Sign Up"/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
export default UserSignUpForm;
|
||||
7
it114105/itp4506/Assignment/20-21/src/logo.svg
Normal file
7
it114105/itp4506/Assignment/20-21/src/logo.svg
Normal file
@@ -0,0 +1,7 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 841.9 595.3">
|
||||
<g fill="#61DAFB">
|
||||
<path d="M666.3 296.5c0-32.5-40.7-63.3-103.1-82.4 14.4-63.6 8-114.2-20.2-130.4-6.5-3.8-14.1-5.6-22.4-5.6v22.3c4.6 0 8.3.9 11.4 2.6 13.6 7.8 19.5 37.5 14.9 75.7-1.1 9.4-2.9 19.3-5.1 29.4-19.6-4.8-41-8.5-63.5-10.9-13.5-18.5-27.5-35.3-41.6-50 32.6-30.3 63.2-46.9 84-46.9V78c-27.5 0-63.5 19.6-99.9 53.6-36.4-33.8-72.4-53.2-99.9-53.2v22.3c20.7 0 51.4 16.5 84 46.6-14 14.7-28 31.4-41.3 49.9-22.6 2.4-44 6.1-63.6 11-2.3-10-4-19.7-5.2-29-4.7-38.2 1.1-67.9 14.6-75.8 3-1.8 6.9-2.6 11.5-2.6V78.5c-8.4 0-16 1.8-22.6 5.6-28.1 16.2-34.4 66.7-19.9 130.1-62.2 19.2-102.7 49.9-102.7 82.3 0 32.5 40.7 63.3 103.1 82.4-14.4 63.6-8 114.2 20.2 130.4 6.5 3.8 14.1 5.6 22.5 5.6 27.5 0 63.5-19.6 99.9-53.6 36.4 33.8 72.4 53.2 99.9 53.2 8.4 0 16-1.8 22.6-5.6 28.1-16.2 34.4-66.7 19.9-130.1 62-19.1 102.5-49.9 102.5-82.3zm-130.2-66.7c-3.7 12.9-8.3 26.2-13.5 39.5-4.1-8-8.4-16-13.1-24-4.6-8-9.5-15.8-14.4-23.4 14.2 2.1 27.9 4.7 41 7.9zm-45.8 106.5c-7.8 13.5-15.8 26.3-24.1 38.2-14.9 1.3-30 2-45.2 2-15.1 0-30.2-.7-45-1.9-8.3-11.9-16.4-24.6-24.2-38-7.6-13.1-14.5-26.4-20.8-39.8 6.2-13.4 13.2-26.8 20.7-39.9 7.8-13.5 15.8-26.3 24.1-38.2 14.9-1.3 30-2 45.2-2 15.1 0 30.2.7 45 1.9 8.3 11.9 16.4 24.6 24.2 38 7.6 13.1 14.5 26.4 20.8 39.8-6.3 13.4-13.2 26.8-20.7 39.9zm32.3-13c5.4 13.4 10 26.8 13.8 39.8-13.1 3.2-26.9 5.9-41.2 8 4.9-7.7 9.8-15.6 14.4-23.7 4.6-8 8.9-16.1 13-24.1zM421.2 430c-9.3-9.6-18.6-20.3-27.8-32 9 .4 18.2.7 27.5.7 9.4 0 18.7-.2 27.8-.7-9 11.7-18.3 22.4-27.5 32zm-74.4-58.9c-14.2-2.1-27.9-4.7-41-7.9 3.7-12.9 8.3-26.2 13.5-39.5 4.1 8 8.4 16 13.1 24 4.7 8 9.5 15.8 14.4 23.4zM420.7 163c9.3 9.6 18.6 20.3 27.8 32-9-.4-18.2-.7-27.5-.7-9.4 0-18.7.2-27.8.7 9-11.7 18.3-22.4 27.5-32zm-74 58.9c-4.9 7.7-9.8 15.6-14.4 23.7-4.6 8-8.9 16-13 24-5.4-13.4-10-26.8-13.8-39.8 13.1-3.1 26.9-5.8 41.2-7.9zm-90.5 125.2c-35.4-15.1-58.3-34.9-58.3-50.6 0-15.7 22.9-35.6 58.3-50.6 8.6-3.7 18-7 27.7-10.1 5.7 19.6 13.2 40 22.5 60.9-9.2 20.8-16.6 41.1-22.2 60.6-9.9-3.1-19.3-6.5-28-10.2zM310 490c-13.6-7.8-19.5-37.5-14.9-75.7 1.1-9.4 2.9-19.3 5.1-29.4 19.6 4.8 41 8.5 63.5 10.9 13.5 18.5 27.5 35.3 41.6 50-32.6 30.3-63.2 46.9-84 46.9-4.5-.1-8.3-1-11.3-2.7zm237.2-76.2c4.7 38.2-1.1 67.9-14.6 75.8-3 1.8-6.9 2.6-11.5 2.6-20.7 0-51.4-16.5-84-46.6 14-14.7 28-31.4 41.3-49.9 22.6-2.4 44-6.1 63.6-11 2.3 10.1 4.1 19.8 5.2 29.1zm38.5-66.7c-8.6 3.7-18 7-27.7 10.1-5.7-19.6-13.2-40-22.5-60.9 9.2-20.8 16.6-41.1 22.2-60.6 9.9 3.1 19.3 6.5 28.1 10.2 35.4 15.1 58.3 34.9 58.3 50.6-.1 15.7-23 35.6-58.4 50.6zM320.8 78.4z"/>
|
||||
<circle cx="420.9" cy="296.5" r="45.7"/>
|
||||
<path d="M520.5 78.1z"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.6 KiB |
39
it114105/itp4506/Assignment/20-21/src/server/agent.json
Normal file
39
it114105/itp4506/Assignment/20-21/src/server/agent.json
Normal file
@@ -0,0 +1,39 @@
|
||||
[
|
||||
{
|
||||
"id": 1,
|
||||
"username": "agent1",
|
||||
"firstName": "Ivy",
|
||||
"lastName": "Cheung",
|
||||
"email": "ivy01@gmail.com",
|
||||
"password": "qwer1234",
|
||||
"tel": "12345678",
|
||||
"properties": [
|
||||
"hh1RScdeZlcLtQoo",
|
||||
"sjG0x0Vzr6QLVE5i"
|
||||
],
|
||||
"appointments": [
|
||||
"abcdp2kUDcAxSack",
|
||||
"8snJp2kUDcAxSack",
|
||||
"YbS7dTegCLRP8R6H",
|
||||
"vnHaTIENSxJYXFYY",
|
||||
"u6Y0dwFj3M0jUoPb",
|
||||
"FwhUYsTLrQ6eNeFO",
|
||||
"VxvqQ0NnYxFjlkvh"
|
||||
],
|
||||
"enable": true
|
||||
},
|
||||
{
|
||||
"id": 2,
|
||||
"username": "agent2",
|
||||
"firstName": "Max",
|
||||
"lastName": "Wong",
|
||||
"email": "maxwong@gmail.com",
|
||||
"password": "qwer1234",
|
||||
"tel": "12345678",
|
||||
"properties": [],
|
||||
"appointments": [
|
||||
"rFN7Aj5bOV1i0Coy"
|
||||
],
|
||||
"enable": false
|
||||
}
|
||||
]
|
||||
@@ -0,0 +1,80 @@
|
||||
[{
|
||||
"uid": "abcdp2kUDcAxSack",
|
||||
"status": "waiting",
|
||||
"date": "",
|
||||
"place": "",
|
||||
"rfa": "",
|
||||
"rfu": "",
|
||||
"cfu": "",
|
||||
"cfa": ""
|
||||
},
|
||||
{
|
||||
"uid": "8snJp2kUDcAxSack",
|
||||
"status": "confirmed",
|
||||
"date": "2010-10-10 11:11:11",
|
||||
"place": "park",
|
||||
"rfa": "",
|
||||
"rfu": "",
|
||||
"cfu": "",
|
||||
"cfa": ""
|
||||
},
|
||||
{
|
||||
"uid": "rFN7Aj5bOV1i0Coy",
|
||||
"status": "finished",
|
||||
"date": "2010-10-10 11:11:11",
|
||||
"place": "park",
|
||||
"rfa": "0",
|
||||
"rfu": "0",
|
||||
"cfu": "?",
|
||||
"cfa": "?"
|
||||
},
|
||||
{
|
||||
"uid": "YbS7dTegCLRP8R6H",
|
||||
"status": "finished",
|
||||
"date": "2010-10-10 10:10:10",
|
||||
"place": "park",
|
||||
"rfa": "",
|
||||
"rfu": "9",
|
||||
"cfu": "good",
|
||||
"cfa": ""
|
||||
}, {
|
||||
"uid": "vnHaTIENSxJYXFYY",
|
||||
"status": "finished",
|
||||
"date": "2010-10-10 11:11:11",
|
||||
"place": "park",
|
||||
"rfa": "8",
|
||||
"rfu": "8",
|
||||
"cfu": "ok",
|
||||
"cfa": "ok"
|
||||
},
|
||||
{
|
||||
"uid": "u6Y0dwFj3M0jUoPb",
|
||||
"status": "finished",
|
||||
"date": "2010-10-10 11:11:11",
|
||||
"place": "park",
|
||||
"rfa": "8",
|
||||
"rfu": "8",
|
||||
"cfu": "look good to me",
|
||||
"cfa": "look good to me"
|
||||
},
|
||||
{
|
||||
"uid": "FwhUYsTLrQ6eNeFO",
|
||||
"status": "finished",
|
||||
"date": "2010-10-10 11:11:11",
|
||||
"place": "park",
|
||||
"rfa": "2",
|
||||
"rfu": "2",
|
||||
"cfu": "bad",
|
||||
"cfa": "bad"
|
||||
},
|
||||
{
|
||||
"uid": "VxvqQ0NnYxFjlkvh",
|
||||
"status": "finished",
|
||||
"date": "2010-10-10 11:11:11",
|
||||
"place": "park",
|
||||
"rfa": "1",
|
||||
"rfu": "1",
|
||||
"cfu": "very bad",
|
||||
"cfa": "very bad"
|
||||
}
|
||||
]
|
||||
@@ -0,0 +1,10 @@
|
||||
[
|
||||
{
|
||||
"mid": 1,
|
||||
"aid": 1
|
||||
},
|
||||
{
|
||||
"mid": 1,
|
||||
"aid": 2
|
||||
}
|
||||
]
|
||||
20
it114105/itp4506/Assignment/20-21/src/server/manager.json
Normal file
20
it114105/itp4506/Assignment/20-21/src/server/manager.json
Normal file
@@ -0,0 +1,20 @@
|
||||
[
|
||||
{
|
||||
"id": 1,
|
||||
"username": "manager1",
|
||||
"firstName": "Mary",
|
||||
"lastName": "Wong",
|
||||
"email": "jerry@gmail.com",
|
||||
"password": "password",
|
||||
"tel": "12345678"
|
||||
},
|
||||
{
|
||||
"id": 2,
|
||||
"username": "manager2",
|
||||
"firstName": "Iris",
|
||||
"lastName": "Kwan",
|
||||
"email": "iriskwan@gmail.com",
|
||||
"password": "password",
|
||||
"tel": "12345678"
|
||||
}
|
||||
]
|
||||
50
it114105/itp4506/Assignment/20-21/src/server/property.json
Normal file
50
it114105/itp4506/Assignment/20-21/src/server/property.json
Normal file
@@ -0,0 +1,50 @@
|
||||
[
|
||||
{
|
||||
"uid": "hh1RScdeZlcLtQoo",
|
||||
"agent": "abc123",
|
||||
"rental": 9000,
|
||||
"sale": null,
|
||||
"address": "荔枝角道1號",
|
||||
"district": "Sham Shui Po",
|
||||
"hidden": true,
|
||||
"pin": true,
|
||||
"comment": "交通方便",
|
||||
"size": 390
|
||||
},
|
||||
{
|
||||
"uid": "sjG0x0Vzr6QLVE5i",
|
||||
"agent": "abc123",
|
||||
"rental": "",
|
||||
"sale": 400,
|
||||
"address": "荔枝角道2號",
|
||||
"district": "Wong Tai Sin",
|
||||
"hidden": false,
|
||||
"pin": false,
|
||||
"comment": "高層",
|
||||
"size": 391
|
||||
},
|
||||
{
|
||||
"uid": "6YfdJK8JZYyyccCd",
|
||||
"agent": "agent2",
|
||||
"rental": "",
|
||||
"sale": 400,
|
||||
"address": "馬仔坑道1號",
|
||||
"district": "Wong Tai Sin",
|
||||
"hidden": false,
|
||||
"pin": false,
|
||||
"comment": "高層",
|
||||
"size": 391
|
||||
},
|
||||
{
|
||||
"uid": "ctsicFxEFv1ikmNr",
|
||||
"agent": "agent2",
|
||||
"rental": "",
|
||||
"sale": 400,
|
||||
"address": "馬仔坑道2號",
|
||||
"district": "Wong Tai Sin",
|
||||
"hidden": false,
|
||||
"pin": false,
|
||||
"comment": "空氣清新",
|
||||
"size": 391
|
||||
}
|
||||
]
|
||||
141
it114105/itp4506/Assignment/20-21/src/serviceWorker.js
Normal file
141
it114105/itp4506/Assignment/20-21/src/serviceWorker.js
Normal file
@@ -0,0 +1,141 @@
|
||||
// This optional code is used to register a service worker.
|
||||
// register() is not called by default.
|
||||
|
||||
// This lets the app load faster on subsequent visits in production, and gives
|
||||
// it offline capabilities. However, it also means that developers (and users)
|
||||
// will only see deployed updates on subsequent visits to a page, after all the
|
||||
// existing tabs open on the page have been closed, since previously cached
|
||||
// resources are updated in the background.
|
||||
|
||||
// To learn more about the benefits of this model and instructions on how to
|
||||
// opt-in, read https://bit.ly/CRA-PWA
|
||||
|
||||
const isLocalhost = Boolean(
|
||||
window.location.hostname === 'localhost' ||
|
||||
// [::1] is the IPv6 localhost address.
|
||||
window.location.hostname === '[::1]' ||
|
||||
// 127.0.0.0/8 are considered localhost for IPv4.
|
||||
window.location.hostname.match(
|
||||
/^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/
|
||||
)
|
||||
);
|
||||
|
||||
export function register(config) {
|
||||
if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
|
||||
// The URL constructor is available in all browsers that support SW.
|
||||
const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href);
|
||||
if (publicUrl.origin !== window.location.origin) {
|
||||
// Our service worker won't work if PUBLIC_URL is on a different origin
|
||||
// from what our page is served on. This might happen if a CDN is used to
|
||||
// serve assets; see https://github.com/facebook/create-react-app/issues/2374
|
||||
return;
|
||||
}
|
||||
|
||||
window.addEventListener('load', () => {
|
||||
const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;
|
||||
|
||||
if (isLocalhost) {
|
||||
// This is running on localhost. Let's check if a service worker still exists or not.
|
||||
checkValidServiceWorker(swUrl, config);
|
||||
|
||||
// Add some additional logging to localhost, pointing developers to the
|
||||
// service worker/PWA documentation.
|
||||
navigator.serviceWorker.ready.then(() => {
|
||||
console.log(
|
||||
'This web app is being served cache-first by a service ' +
|
||||
'worker. To learn more, visit https://bit.ly/CRA-PWA'
|
||||
);
|
||||
});
|
||||
} else {
|
||||
// Is not localhost. Just register service worker
|
||||
registerValidSW(swUrl, config);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function registerValidSW(swUrl, config) {
|
||||
navigator.serviceWorker
|
||||
.register(swUrl)
|
||||
.then(registration => {
|
||||
registration.onupdatefound = () => {
|
||||
const installingWorker = registration.installing;
|
||||
if (installingWorker == null) {
|
||||
return;
|
||||
}
|
||||
installingWorker.onstatechange = () => {
|
||||
if (installingWorker.state === 'installed') {
|
||||
if (navigator.serviceWorker.controller) {
|
||||
// At this point, the updated precached content has been fetched,
|
||||
// but the previous service worker will still serve the older
|
||||
// content until all client tabs are closed.
|
||||
console.log(
|
||||
'New content is available and will be used when all ' +
|
||||
'tabs for this page are closed. See https://bit.ly/CRA-PWA.'
|
||||
);
|
||||
|
||||
// Execute callback
|
||||
if (config && config.onUpdate) {
|
||||
config.onUpdate(registration);
|
||||
}
|
||||
} else {
|
||||
// At this point, everything has been precached.
|
||||
// It's the perfect time to display a
|
||||
// "Content is cached for offline use." message.
|
||||
console.log('Content is cached for offline use.');
|
||||
|
||||
// Execute callback
|
||||
if (config && config.onSuccess) {
|
||||
config.onSuccess(registration);
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
};
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Error during service worker registration:', error);
|
||||
});
|
||||
}
|
||||
|
||||
function checkValidServiceWorker(swUrl, config) {
|
||||
// Check if the service worker can be found. If it can't reload the page.
|
||||
fetch(swUrl, {
|
||||
headers: { 'Service-Worker': 'script' },
|
||||
})
|
||||
.then(response => {
|
||||
// Ensure service worker exists, and that we really are getting a JS file.
|
||||
const contentType = response.headers.get('content-type');
|
||||
if (
|
||||
response.status === 404 ||
|
||||
(contentType != null && contentType.indexOf('javascript') === -1)
|
||||
) {
|
||||
// No service worker found. Probably a different app. Reload the page.
|
||||
navigator.serviceWorker.ready.then(registration => {
|
||||
registration.unregister().then(() => {
|
||||
window.location.reload();
|
||||
});
|
||||
});
|
||||
} else {
|
||||
// Service worker found. Proceed as normal.
|
||||
registerValidSW(swUrl, config);
|
||||
}
|
||||
})
|
||||
.catch(() => {
|
||||
console.log(
|
||||
'No internet connection found. App is running in offline mode.'
|
||||
);
|
||||
});
|
||||
}
|
||||
|
||||
export function unregister() {
|
||||
if ('serviceWorker' in navigator) {
|
||||
navigator.serviceWorker.ready
|
||||
.then(registration => {
|
||||
registration.unregister();
|
||||
})
|
||||
.catch(error => {
|
||||
console.error(error.message);
|
||||
});
|
||||
}
|
||||
}
|
||||
5
it114105/itp4506/Assignment/20-21/src/setupTests.js
Normal file
5
it114105/itp4506/Assignment/20-21/src/setupTests.js
Normal file
@@ -0,0 +1,5 @@
|
||||
// jest-dom adds custom jest matchers for asserting on DOM nodes.
|
||||
// allows you to do things like:
|
||||
// expect(element).toHaveTextContent(/react/i)
|
||||
// learn more: https://github.com/testing-library/jest-dom
|
||||
import '@testing-library/jest-dom/extend-expect';
|
||||
Reference in New Issue
Block a user