Skip to content

Commit

Permalink
Merge remote-tracking branch 'refs/remotes/origin/master' into Polishing
Browse files Browse the repository at this point in the history
  • Loading branch information
clj13001 committed Dec 2, 2016
2 parents b514536 + 37a59f0 commit 2767d62
Show file tree
Hide file tree
Showing 9 changed files with 467 additions and 184 deletions.
1 change: 1 addition & 0 deletions html/javascript/navbar.js

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

14 changes: 11 additions & 3 deletions html/javascript/request.js
Original file line number Diff line number Diff line change
Expand Up @@ -87,9 +87,15 @@ function addToCart(){
var cart = getCartItems(); //this is an array
cart.push(id); //push to bottom of cart
localStorage.setItem('cart', JSON.stringify(cart));
$('#added').fadeIn(1000);
$('#added').fadeIn(1000);
$('#added').fadeOut(1000);
}
else{
$('#already').fadeIn(1000);
$('#already').fadeIn(1000);
$('#already').fadeOut(1000);
}
else
alert("That item is already in your cart!");
}

function inCart(id){
Expand Down Expand Up @@ -137,4 +143,6 @@ function isUnavailable(id){
}
}
return 0;
}
}

//this code allows a message to appear that indicates that the item was successfully placed in the shopping cart.
144 changes: 144 additions & 0 deletions html/javascript/return.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,144 @@

var dev1 = {
id: 1,
name:"George",
hardware:"iphone",
checkout: new Date("11/11/2016"),
};

var dev2 = {
id: 2,
name:"Greyson",
hardware:"iphone",
checkout: new Date("8/10/2016"),
};

var dev3 = {
id: 3,
name:"Linkin Park",
hardware:"ipad",
checkout: new Date("8/20/2016"),
};

var dev4 = {
id: 4,
name:"Abercrombie",
hardware:"ipad",
checkout: new Date("11/3/2016"),
};

var dev5 = {
id: 5,
name:"Hulk",
hardware:"computerStick",
checkout: new Date("4/28/2016"),
};

var dev6 = {
id: 6,
name:"Captain America",
hardware:"computerStick",
checkout: new Date("10/22/2016"),
};

var devices = [dev1, dev2, dev3, dev4, dev5, dev6];
//This array corresponds to the hardcoded inventory in request.js. The description has been replaced with a
//checkout date, because I imagine that is more the kind of info to pull from the database for this page.
//IDs, names and hardware are the same.

populateDeviceList();

function populateDeviceList()
//generates html and writes to 'devContainer' div in returnPage.html
{
var devicesToList = getCheckedOutDevices(null);
var htmlString="";
for (var i = 0; i < devicesToList.length; i++) {
var id = devicesToList[i].id;
var name = devicesToList[i].name;
var hardware = devicesToList[i].hardware;
var checkout = devicesToList[i].checkout;
htmlString+="<div class=\"deviceContainer\"><div><div class=\"imgContainer\"><img src=\"../imgs/";
htmlString+=hardware;
htmlString+=".png\" class=\"device\">";
htmlString+=name;
htmlString+="</div><div class=\"deviceInfo\"><p>Checked out: "
htmlString+=checkout.toISOString().substring(0,10);
htmlString+="</p><p>You've had this device for ";
var milliseconds=new Date().getTime()-checkout.getTime();
var seconds=Math.floor(milliseconds/1000);
var minutes=Math.floor(seconds/60);
var hours=Math.floor(minutes/60);
var days=Math.floor(hours/24);
var weeks=Math.floor(days/7);
htmlString+= weeks+ " weeks!";
htmlString+="</div><div class=\"returnButtonContainer\"><button class=\"returnbutton\" id=\"button ";
htmlString+=(id);
htmlString+="\" type=\"button\">Return ";
htmlString+=name;
htmlString+="</button></div></p></div></div><br>";
}
document.getElementById("devContainer").innerHTML = htmlString;

var returnbuttons = document.getElementsByClassName('returnbutton');
for (var i = 0; i < returnbuttons.length; i++) {
returnbuttons[i].addEventListener('click',returnDevice);
}
}

function returnDevice()
{
var id = this.getAttribute('id');
id = parseInt(id.replace(/[^0-9\.]/g,''), 10);
if(isUnavailable(id))
{
var unavailable = getUnavailableIDs();
unavailable.splice(unavailable.indexOf(id),1);
localStorage.setItem('unavailable',JSON.stringify(unavailable));
}
else
alert("That's already marked available. Something may have gone wrong.");
populateDeviceList();
}

function getCheckedOutDevices(user)
//Eventually this will return information about all devices checked out by *user*
//Right now there is only one user, and the function just returns IDs of all checked out devicess.
{
var unavailable = getUnavailableIDs();
var checkedDevices = new Array();
for (var i = 0; i < unavailable.length; i++) {
for (var j = 0; j < devices.length; j++) {
if(unavailable[i] == devices[j].id)
{
checkedDevices.push(devices[j]);
break;
}
}
}
return checkedDevices;
}

function isUnavailable(id){
var unavailable = getUnavailableIDs();
if(unavailable.length == 0)
return 0;
else{
for(var i = 0; i < unavailable.length; i++){
if(unavailable[i] == (id))
return 1;
}
}
return 0;
}
function getUnavailableIDs()
//Identical to the function in request.js: just reads the 'unavailable' array in local storage.
//Will need to be changed (or may be obsolete) when we get a database
{
var unavailable = new Array;
var unavailable_str = localStorage.getItem('unavailable');
if(unavailable_str !== ""){
unavailable = JSON.parse(unavailable_str);
}
return unavailable;
}
157 changes: 71 additions & 86 deletions html/webpages/homePage.html
Original file line number Diff line number Diff line change
@@ -1,96 +1,81 @@
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<meta name="description" content="">
<meta name="author" content="">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<meta name="description" content="">
<meta name="author" content="">

<title>Synchrony Financial</title>
<title>Synchrony Financial</title>

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link rel = "stylesheet" type = "text/css" href = "../css/stylesheet.css">
<style>
div.menuOption{
display: inline-block;
width: 250px;
height: 150px;
vertical-align: top;
border: solid;
padding: 10px;
margin: 10px;
border-radius: 10px;
background-color: #E9EAEB;
}
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link rel = "stylesheet" type = "text/css" href = "../css/stylesheet.css">
<style>
div.menuOption{
display: inline-block;
width: 250px;
height: 150px;
vertical-align: top;
border: solid;
padding: 10px;
margin: 10px;
border-radius: 10px;
background-color: #E9EAEB;
}

div.menuBox{
text-align: center;
position: absolute;
top: 50%;
left: 50%;
margin-top: -160px;
margin-left: -260px;
}
</style>
</head>
div.menuBox{
text-align: center;
position: absolute;
top: 50%;
left: 50%;
margin-top: -160px;
margin-left: -260px;
}
</style>

</head>

<body>
<body>

<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#"><img src="../imgs/synchrony-financial-logo-dlpx.png" style = "height: 100%;"></a>
</div>
<div id="navbar" class="navbar-collapse collapse" aria-expanded="false">
<ul class="nav navbar-nav navbar-right">
<li><a href="homePage.html">Home</a></li>
<li><a href="requestPage.html">Request Device</a></li>
<li><a href="#">Return Device</a></li>
<li><a href="listingPage.html">Device Listing</a></li>
<li><a href="shoppingCart.html">Shopping Cart</a></li>
</ul>
</div>
</div>
</nav>
<nav class="navbar navbar-inverse navbar-fixed-top" id = "navbar">

</nav>

<div class = "menuBox">
<div>
<a class = "divlink" href = "requestPage.html">
<div class = "menuOption">
<h2>Request</h2>
<p>Check out our selection of devices that YOU have the chance to check out!</p>
</div>
</a>
<div class = "menuOption">
<h2>Return</h2>
<p>All set with a device? No problem! You can return it here!</p>
</div>
<div class = "menuBox">
<div>
<a class = "divlink" href = "requestPage.html">
<div class = "menuOption">
<h2>Request</h2>
<p>Check out our selection of devices that YOU have the chance to check out!</p>
</div>
</a>
<a class = "divlink" href="returnPage.html">
<div class = "menuOption">
<h2>Return</h2>
<p>All set with a device? No problem! You can return it here!</p>
</div>
</a>
</div>
<div>
<a class = "divlink" href = "listingPage.html">
<div class = "menuOption">
<h2>All Items</h2>
<p>Just curious to see what devices we have to offer? You've come to the right place.</p>
</div>
<div>
<a class = "divlink" href = "listingPage.html">
<div class = "menuOption">
<h2>All Items</h2>
<p>Just curious to see what devices we have to offer? You've come to the right place.</p>
</div>
</a>
<a class = "divlink" href="map.html">
<div class = "menuOption">
<h2>Map</h2>
<p>Wanna see the distribution of devices throughout the world? Check it out! HERE!</p>
</div>
</a>
</a>
<a class = "divlink" href="map.html">
<div class = "menuOption">
<h2>Map</h2>
<p>Wanna see the distribution of devices throughout the world? Check it out! HERE!</p>
</div>
</div>
</a>
</div>
</div>

<script src = "../javascript/navbar.js"></script>

</body>
</html>
</body>
</html>
23 changes: 2 additions & 21 deletions html/webpages/listingPage.html
Original file line number Diff line number Diff line change
Expand Up @@ -58,27 +58,7 @@
</head>

<body>
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#"><img src="../imgs/synchrony-financial-logo-dlpx.png" style = "height: 100%"></a>
</div>
<div id="navbar" class="navbar-collapse collapse" aria-expanded="false">
<ul class="nav navbar-nav navbar-right">
<li><a href="homePage.html">Home</a></li>
<li><a href="requestPage.html">Request Device</a></li>
<li><a href="#">Return Device</a></li>
<li><a href="listingPage.html">Device Listing</a></li>
<li><a href="shoppingCart.html">Shopping Cart</a></li>
</ul>
</div>
</div>
<nav class="navbar navbar-inverse navbar-fixed-top" id = "navbar">
</nav>
<div class="col-sm-3 col-md-2 sidebar">
<ul class="nav nav-sidebar">
Expand All @@ -101,5 +81,6 @@ <h2>Available Devices</h2>
</div>

<script src="../javascript/listing.js"></script>
<script src = "../javascript/navbar.js"></script>
</body>
</html>
Loading

0 comments on commit 2767d62

Please sign in to comment.