Commit 187299a8 authored by Ian De La Cruz's avatar Ian De La Cruz

Added icons

JS
- Sending Parse Data

CSS
- Reworked CSS
parent 860413da
This diff is collapsed.
/* html, body {
Main CSS styles for main uBus web app.
for CS 123 Group Project.
Group D : Ian De La Cruz, Pearl Santos, Chi Señires, EJ Villadarez
*/
/* ------------ */
/* MAIN */
/* ------------ */
*, *:after, *:before {
margin: 0; margin: 0;
padding: 0; padding: 0;
box-sizing: border-box; }
html, body {
font-size: 10px;
background-color: #124E78;
font-family: monospace;
overflow: hidden;
} }
a { nav {
text-decoration: none; position: relative;
color: #333; height: 60px;
font-weight: bold; background-color: #124E78;
} }
/* ------------ */ nav a {
/* INDEX.html */ display: inline-block;
/* ------------ */ height: 100%;
.container { padding: 10px;
margin: 4.5% auto; position: relative;
width: 50%; float:right;
background-color: #A7BCAF;
border-radius: 5%;
} }
header { nav a:first-child {
width: 100%; float: left;
padding: 2.5em 0;
text-align: center;
} }
.logo { .wrapper {
display: block; width: 90%;
margin: 0 auto; margin: 0 auto;
width: 20em; padding-top: 20px;
} }
.content { .title {
height: 15em;
}
.button a {
display: block;
width: 12em;
height: 12em;
text-align: center; text-align: center;
} }
.button > a img { .title h1{
width: 100%; display: inline-block;
background-color: #ccc; }
padding: 3%;
border-radius: 10%;
}
#admin {
float: left;
}
#loading {
float: right;
margin-right: 30%;
}
/* -------------- */
/* SCHEDULE.html */
/* -------------- */
nav {
background-color: #999;
height: 115px;
}
.brand img {
float: left;
width: 100px;
margin: 10px;
}
.align-right { .card {
float: right; box-shadow:0 1px 2px #aaa;
margin: 20px 10px; /*height: 300px;*/
padding: 2rem;
border-radius:3px;
margin: 0 auto;
width: 60%;
} }
.nav a { .card img {
display: inline-block; display: inline-block;
padding: 20px 10px; position: relative;
margin: auto 0; top: 0;
} left: 0;
}
.wrapper { .card form {
width: 60%; display: inline-block;
margin: 0 auto; width: calc(100% - 80px);
} }
.content { .card_schedule fieldset {
display: block; display: inline-block;
width: 100%; width: 30%;
margin: 0 auto; border:none;
} }
.title { .card_schedule fieldset:nth-child(5) {
margin: 2.5% 5%; width: 80%;
color: #f0f0c9; }
}
.title > img { .card_schedule fieldset:nth-child(n+6):nth-child(-n+8) {
width: 75px; width: 40%;
background-color: #ccc;
padding: 0.75%;
border-radius: 10%;
float: left;
margin-left: -9em;
} }
/* Temporary */ .card_schedule fieldset:nth-child(n+5):nth-child(-n+8) input {
.placeholder { position: relative;
width: 50px; top: 50%;
height: 50px; transform: translateY(-50%);
background-color: aqua; margin-left: 10px;
} border-top:0;
border-left: 0;
border-right: 0;
}
.clearfix { .row {
display: block; display: block;
clear: both; }
} \ No newline at end of file
This source diff could not be displayed because it is too large. You can view the blob instead.
Parse.initialize("VHNmZxSO2pSrd2KjsjW6a8QUdJYZLFS6Il4WDrQM", "s36ClRKw9cXstmvT9Z2L6d5H9CaoUc5V1R9vQ2kP");
var Schedule = Parse.Object.extend("Schedule");
$("#create_schedule").submit(function(event){
event.preventDefault();
var destination = document.getElementById("destination").value,
initial = document.getElementById("initial").value,
etd = document.getElementById("etd").value,
eta = document.getElementById("eta").value,
company = document.getElementById("bus_company").value,
plate = document.getElementById("plate_number").value,
seats = document.getElementById("seats_available").value,
fare = document.getElementById("fare").value;
// console.log(typeof "plate");
var newSchedule = new Schedule();
newSchedule.save({
destination:destination,
startingTerminal: initial,
arrival: eta,
departure: etd,
busCompany: company,
busPlate: plate,
seatsAmount: seats,
ticketPrice: fare
}, {
success: function(newSchedule) {
// Execute any logic that should take place after the object is saved.
alert('New object created with objectId: ' + newSchedule.id);
console.log('New object created with objectId: ' + newSchedule.id);
},
error: function(newSchedule, error) {
// Execute any logic that should take place if the save fails.
// error is a Parse.Error with an error code and message.
alert('Failed to create new object, with error code: ' + error.message);
}
});
alert(destination);
});
var query = new Parse.Query(Schedule);
var id;
query.find({
success: function(results) {
console.log("Successfully retrieved " + results.length);
// Do something with the returned Parse.Object values
for (var i = 0; i < results.length; i++) {
var object = results[i];
id = object.id;
console.log(object);
}
},
error: function(error) {
status.error("Error: " + error.code + " " + error.message);
}
});
\ No newline at end of file
...@@ -2,28 +2,67 @@ ...@@ -2,28 +2,67 @@
<html> <html>
<head> <head>
<title>uBus | Bus Schedules</title> <title>uBus | Bus Schedules</title>
<link rel="stylesheet" type="text/css" href="css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="css/style.css"> <link rel="stylesheet" type="text/css" href="css/style.css">
<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.4.js"></script>
<script src="http://www.parsecdn.com/js/parse-1.6.6.min.js"></script>
</head> </head>
<body> <body>
<nav> <nav>
<div class="brand"> <a href="index.html"><img src="img/logo.png" width="40px"></a>
<a href="index.html"><img src="img/logo.png"></a>
</div> <a href="javascript:void(0);"><img src="img/add.png" width="40px"></a>
<a href="javascript:void(0);"><img src="img/search.png" width="40px"></a>
<div class="align-right">
<a href="javascript:void(0);"><img src="img/add.png" class="nav button"></a>
<a href="javascript:void(0);"><img src="img/search.png" class="nav button"></a>
</div>
</nav> </nav>
<div class="wrapper"> <div class="wrapper">
<div class="content"> <div class="title">
<div class="title"> <img src="img/scheduling.png" width="40px">
<img src="img/scheduling.png"> <h1>Bus Schedules</h1>
<h1>Bus Schedules</h1> </div>
<div class="card">
<div class="row">
<img src="img/scheduling.png" width="60px">
<form method="post" class="card_schedule" id="create_schedule">
<fieldset>
<label for="etd" style="display:block;">Starting Terminal</label>
<input type="text" id="initial" placeholder="hello">
</fieldset>
<fieldset>
<label for="etd" style="display:block;">Destination</label>
<input type="text" id="destination" placeholder="hello">
</fieldset>
<fieldset>
<label for="etd" style="display:block;">ETD</label>
<input type="datetime-local" id="etd" placeholder="hello">
</fieldset>
<fieldset>
<label for="etd" style="display:block;">ETA</label>
<input type="datetime-local" id="eta" placeholder="hello">
</fieldset>
<fieldset>
<label><i class="fa fa-2x fa-bus"></i>
<input type="text" id="bus_company" placeholder="Company" size="10"></label>
<label>
<input type="text" id="plate_number" placeholder="Plate Number" size="10"></label>
</fieldset>
<fieldset>
<label><i class="fa fa-2x fa-users"></i>
<input type="text" id="seats_available" placeholder="Seats Available" size="10"></label>
</fieldset>
<fieldset>
<label><i class="fa fa-2x fa-money"></i>
<input type="text" id="fare" placeholder="Fare" size="10"></label>
</fieldset>
<fieldset>
<input type="submit">
</fieldset>
</form>
</div> </div>
</div> </div>
<div class="schedules"></div>
</div> </div>
<script type="text/javascript" src="js/app.js"></script>
</body> </body>
</html> </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