Commit 4015d74a authored by Ian De La Cruz's avatar Ian De La Cruz

Many Edits

parent e0433bec
<!DOCTYPE html>
<html lang="en">
<head>
<title>uBus | Admin System</title>
<meta charset="utf-8">
<meta name="description" content="uBus Ticket Reservation System administrator tools.">
<link rel="icon" type="image/x-icon" href="img/favicon.ico">
<link rel="stylesheet" type="text/css" href="css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="css/style.css">
<script type="text/javascript" src="js/jquery-2.1.4.js"></script>
<script src="js/parse-1.6.7.js"></script>
<script type="text/javascript" src="js/app.js"></script>
</head>
<body>
<header class="header">
<a href="index.html" class="header__logo"><img src="img/logo.png" width="40px"></a>
<nav class="header__nav" id="navigation">
<a href=""></a>
<a href=""></a>
</nav>
</header>
<main class="container">
<div class="card">
<form class="generateTrips">
<label for="startTime">
<input type="time" id="startTime">
</label>
<label for="startDate">
<input type="date" id="startDate">
</label>
<label for="endTime">
<input type="time" id="endTime">
</label>
<label for="endDate">
<input type="date" id="endDate">
</label>
<button class="generateTrips__btn">Generate Trips</button>
</form>
</div>
</main>
</body>
</html>
<!-- List all Schedule Times
List all Origin Terminals
List all Destination Terminals
List all Bus Plate of Current Bus Company
List all Bus Types of Current Bus Company -->
<!DOCTYPE html>
<html lang="en">
<head>
......@@ -11,9 +6,11 @@ List all Bus Types of Current Bus Company -->
<meta name="description" content="uBus Ticket Reservation System administrator tools.">
<link rel="icon" type="image/x-icon" href="img/favicon.ico">
<link rel="stylesheet" type="text/css" href="css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="css/rolling.css">
<link rel="stylesheet" type="text/css" href="css/style.css">
<script type="text/javascript" src="js/jquery-2.1.4.js"></script>
<script src="js/parse-1.6.7.js"></script>
<script type="text/javascript" src="js/moment.js"></script>
<script type="text/javascript" src="js/app.js"></script>
</head>
<body>
......@@ -25,54 +22,62 @@ List all Bus Types of Current Bus Company -->
</nav>
</header>
<main class="container">
<div id="loader" style="position: fixed; z-index: 100; width: 100%; height: 100%; display: block; background-color: gray;top: 80px;left: 0;-webkit-opacity: 0.5;">
<div class='uil-rolling-css' style='margin:20vh auto; -webkit-transform:scale(0.6);'><div><div></div><div></div></div></div>
</div>
<p id="successMessage" style="display:none; color: white; font-weight: 500; background-color:darkgreen; padding: 20px;">Trip created successfully!</p>
<div class="createTrip card">
<form class="createTrip__form">
<h1 class="createTrip__header">Create Trip</h1>
<label class="createTrip__selectLabel">
<span>Origin: </span>
<select class="createTrip__select" id="selectOrigin">
<option>Hello</option>
<option>--</option>
</select>
</label>
<label class="createTrip__selectLabel">
<span>Destination: </span>
<select class="createTrip__select" id="selectDestination">
<option>Hello</option>
<option>--</option>
</select>
</label>
<hr>
<label class="createTrip__selectLabel">
<span>Schedule Code: </span>
<select class="createTrip__select" id="selectSchedule">
<option>Hello</option>
</select>
<span>Schedule Date: </span>
<input type="date" id="selectDate">
</label>
<label class="createTrip__information">
<span>Time: </span>
<input type="text" id="scheduleTime" disabled="true" size="10">
<span>Day: </span>
<input type="text" id="scheduleDay" disabled="true" size="10">
<label class="createTrip__selectLabel">
<span>Schedule Time: </span>
<input type="time" id="selectTime">
</label>
<hr>
<label class="createTrip__selectLabel">
<span>Plate Number: </span>
<select class="createTrip__select" id="selectPlate">
<option>Hello</option>
<option>--</option>
</select>
</label>
<label class="createTrip__information">
<span>Bus Type: </span>
<input type="text" id="busType" disabled="true" size="10">
</label>
<!-- <label for="cost" class="createTrip__cost">
<span>Costs Per Seat</span>
<input type="text" id="cost">
</label> -->
<label class="createTrip__submit" >
<button id="createTrip__btn">Create Trip</button>
</label>
</form>
</div>
<div class="card">
<label for="startDate">
<span>Start Date</span>
<input type="month" id="startDate">
</label>
<label for="endDate">
<span>End Date</span>
<input type="month" id="endDate">
</label>
<button class="generateTrips__btn">Generate Trips</button>
</form>
</div>
</main>
</body>
</html>
......
@-webkit-keyframes uil-rolling-anim {
0% {
-ms-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
50% {
-ms-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-webkit-transform: rotate(180deg);
-o-transform: rotate(180deg);
transform: rotate(180deg);
}
100% {
-ms-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
-o-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes uil-rolling-anim {
0% {
-ms-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
50% {
-ms-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-webkit-transform: rotate(180deg);
-o-transform: rotate(180deg);
transform: rotate(180deg);
}
100% {
-ms-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
-o-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-moz-keyframes uil-rolling-anim {
0% {
-ms-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
50% {
-ms-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-webkit-transform: rotate(180deg);
-o-transform: rotate(180deg);
transform: rotate(180deg);
}
100% {
-ms-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
-o-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-ms-keyframes uil-rolling-anim {
0% {
-ms-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
50% {
-ms-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-webkit-transform: rotate(180deg);
-o-transform: rotate(180deg);
transform: rotate(180deg);
}
100% {
-ms-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
-o-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-moz-keyframes uil-rolling-anim {
0% {
-ms-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
50% {
-ms-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-webkit-transform: rotate(180deg);
-o-transform: rotate(180deg);
transform: rotate(180deg);
}
100% {
-ms-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
-o-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes uil-rolling-anim {
0% {
-ms-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
50% {
-ms-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-webkit-transform: rotate(180deg);
-o-transform: rotate(180deg);
transform: rotate(180deg);
}
100% {
-ms-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
-o-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-o-keyframes uil-rolling-anim {
0% {
-ms-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
50% {
-ms-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-webkit-transform: rotate(180deg);
-o-transform: rotate(180deg);
transform: rotate(180deg);
}
100% {
-ms-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
-o-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes uil-rolling-anim {
0% {
-ms-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
50% {
-ms-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-webkit-transform: rotate(180deg);
-o-transform: rotate(180deg);
transform: rotate(180deg);
}
100% {
-ms-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
-o-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.uil-rolling-css {
width: 200px;
height: 200px;
}
.uil-rolling-css > div {
width: 200px;
height: 200px;
position: relative;
-ms-animation: uil-rolling-anim 1s linear infinite;
-moz-animation: uil-rolling-anim 1s linear infinite;
-webkit-animation: uil-rolling-anim 1s linear infinite;
-o-animation: uil-rolling-anim 1s linear infinite;
animation: uil-rolling-anim 1s linear infinite;
}
.uil-rolling-css > div div {
position: absolute;
width: 200px;
height: 100px;
border-radius: 1000px 1000px 0 0;
border-color: #124E78;
border-style: solid;
border-width: 40px;
border-bottom-width: 0;
}
.uil-rolling-css > div div:nth-of-type(2) {
-ms-transform: translate(0, 50px) rotate(54deg) translate(0, -50px);
-moz-transform: translate(0, 50px) rotate(54deg) translate(0, -50px);
-webkit-transform: translate(0, 50px) rotate(54deg) translate(0, -50px);
-o-transform: translate(0, 50px) rotate(54deg) translate(0, -50px);
transform: translate(0, 50px) rotate(54deg) translate(0, -50px);
}
\ No newline at end of file
......@@ -6,6 +6,7 @@
<meta name="description" content="uBus Ticket Reservation System administrator tools.">
<link rel="icon" type="image/x-icon" href="img/favicon.ico">
<link rel="stylesheet" type="text/css" href="css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="css/rolling.css">
<link rel="stylesheet" type="text/css" href="css/style.css">
<script type="text/javascript" src="js/jquery-2.1.4.js"></script>
<script src="js/parse-1.6.7.js"></script>
......@@ -20,22 +21,34 @@
</nav>
</header>
<main class="container">
<div class="actionbox card">
<h1 id="welcomeMessage"></h1>
<div class="actionbox card" id="tripManagement" style="display:none;">
<!-- This is not available when user is a Clerk user -->
<h1 class="actionbox__header">Trips Management</h1>
<h2>Trips contain information on Schedules and Bus Assignments</h2>
<ul class="actionbox__list">
<li class="actionbox__listitem"><a href="createTrip.html">Create Trips</a></li>
<li class="actionbox__listitem"><a href="viewTrip.html">View All Trips</a></li>
</ul>
</div>
<div class="actionbox card">
<div class="actionbox card" id="scheduleManagement" style="display:none;">
<!-- This is not available when user is a Clerk user -->
<h1 class="actionbox__header">Schedule Management</h1>
<h2>Schedules contain information on the specifics, ie. day, time and terminals</h2>
<ul class="actionbox__list">
<li class="actionbox__listitem"><a href="createSchedule.html">Create Schedules</a></li>
<li class="actionbox__listitem"><a href="viewSchedules.html">View All Schedules</a></li>
</ul>
</div>
<div class="actionbox card" id="customerManagement">
<h1 class="actionbox__header">Customer Management</h1>
<ul class="actionbox__list">
<li class="actionbox__listitem"><a href="register.html">Register New User</a></li>
<li class="actionbox__listitem"><a href="reload.html">Reload User Credits</a></li>
</ul>
</div>
<button onclick="app.searchRole()">Print in Console</button>
<!-- <button onclick="app.searchRole()">Print in Console</button> -->
</main>
</body>
</html>
This diff is collapsed.
This source diff could not be displayed because it is too large. You can view the blob instead.
......@@ -6,6 +6,7 @@
<meta name="description" content="uBus Ticket Reservation System administrator tools.">
<link rel="icon" type="image/x-icon" href="img/favicon.ico">
<link rel="stylesheet" type="text/css" href="css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="css/rolling.css">
<link rel="stylesheet" type="text/css" href="css/style.css">
<script type="text/javascript" src="js/jquery-2.1.4.js"></script>
<script src="js/parse-1.6.7.js"></script>
......
<!DOCTYPE html>
<html lang="en">
<head>
<title>uBus | Admin System</title>
<meta charset="utf-8">
<meta name="description" content="uBus Ticket Reservation System administrator tools.">
<link rel="icon" type="image/x-icon" href="img/favicon.ico">
<link rel="stylesheet" type="text/css" href="css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="css/rolling.css">
<link rel="stylesheet" type="text/css" href="css/style.css">
<script type="text/javascript" src="js/jquery-2.1.4.js"></script>
<script src="js/parse-1.6.7.js"></script>
<script type="text/javascript" src="js/app.js"></script>
</head>
<body>
<header class="header">
<a href="index.html" class="header__logo"><img src="img/logo.png" width="40px"></a>
<nav class="header__nav" id="navigation">
<a href=""></a>
<a href=""></a>
</nav>
</header>
<main class="container">
<div id="loader" style="position: fixed; z-index: 100; width: 100%; height: 100%; display: none; background-color: gray;top: 80px;left: 0;-webkit-opacity: 0.5;">
<div class='uil-rolling-css' style='margin:20vh auto; -webkit-transform:scale(0.6);'><div><div></div><div></div></div></div>
</div>
<div class="reload card">
<form class="reload__form">
<h1>Search for User</h1>
<label class="reload__num">
<span>Cellphone Number:</span>
<input type="text" id="cellNum" placeholder="09xxxxxxxxx">
</label>
<button class="reload__btn" id="searchBtn">Search</button>
</form>
</div>
<ul class="searchResults" id="searchResults">
</ul>
</main>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<title>uBus | Admin System</title>
<meta charset="utf-8">
<meta name="description" content="uBus Ticket Reservation System administrator tools.">
<link rel="icon" type="image/x-icon" href="img/favicon.ico">
<link rel="stylesheet" type="text/css" href="css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="css/style.css">
<script type="text/javascript" src="js/jquery-2.1.4.js"></script>
<script src="js/parse-1.6.7.js"></script>
<script type="text/javascript" src="js/app.js"></script>
</head>
<body>
<header class="header">
<a href="index.html" class="header__logo"><img src="img/logo.png" width="40px"></a>
<nav class="header__nav" id="navigation">
<a href=""></a>
<a href=""></a>
</nav>
</header>
<main class="container">
<ul class="scheduleList" id="scheduleList">
</ul>
</main>
</body>
</html>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment