Skip to content

Commit

Permalink
DB changes
Browse files Browse the repository at this point in the history
Also some code clean up :)
  • Loading branch information
clj13001 committed Feb 23, 2017
1 parent e41e62e commit 1193551
Show file tree
Hide file tree
Showing 6 changed files with 256 additions and 306 deletions.
149 changes: 50 additions & 99 deletions WebContent/html/webpages/returnPage.jsp
Original file line number Diff line number Diff line change
Expand Up @@ -78,13 +78,15 @@
</nav>
</head>
<body>
<!-- Modal for transaction review. -->
<div id="orderInfoModal" class="modal">
<div class="modal-content">
<div class="modal-head">
<span id="closeOrderForm" class="close">&times;</span>
<h4>Please Review Your Return Choices</h4>
</div><br>
<div class="modal-body">
<!-- Table to display review data. -->
<table class="table table-bordered table-hover" id = "tabledisplay">
<thread>
<tr>
Expand All @@ -94,25 +96,14 @@
</tr>
</thread>
<tbody id = "tablebody">
<tr>
<td>Bobby</td>
<td>iPhone 6s</td>
<td>Smartphone</td>
</tr>
<tr>
<td>Bobby</td>
<td>iPhone 6s</td>
<td>Smartphone</td>
</tr>
</tbody>
</table><br>
<button>Continue</button>
</div>
</div>
</div>
<script type="text/javascript" charset="utf8" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.2.min.js"></script>
<script type="text/javascript" charset="utf8" src="http://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/jquery.dataTables.min.js"></script>
<div class="col-sm-3 col-md-2 sidebar">
<!-- Sidebar. -->
<div class="col-sm-3 col-md-2 sidebar">
<ul class="nav nav-sidebar">
<h4>Filter by Time Ordered</h4>
<li class = "option" id = "all"><a href="#">All devices</a></li>
Expand All @@ -124,57 +115,51 @@
</div>
<div class="displayDevice">
<h2>Devices to Be Returned</h2>
<!-- Device information boxes placed here. -->
<div id = "devContainer">
</div>
<button id ="returnbutton">Return</button>
</div>
<div style = "display: inline-block">
<h2>Return Here</h2>
</div>
<%

<%
//database connection
MySQLAccess myaccess = new MySQLAccess();
//String userID =
int counter = 0;
//9 is just for testing purposes. Should be returning 4 devices at the moment.
//String userID = cookie implementation exists here.
//19 is just for testing purposes. Replaced by userID later.
RentedDevice[] mydevices = myaccess.getUserDevices("19");
//string representation of array.
String deviceString = RentedDevice.arrayToString(mydevices);
%>

<script type=text/javascript>
//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.
//JSON representation of array.
var devices = makeDeviceArray();
//This will be the array of ids that are checked off
var toReturn = []
//Adds event listener to each mennu option
var options = document.getElementsByClassName('option');
for (var i = options.length - 1; i >= 0; i--) {
options[i].addEventListener('click',filterDeviceList);
}
//Devices to be returned.
var toReturn = [];
//This calls on the filter function, which by default displays ALL DEVICES! You can later filter by take out period!
populateDeviceList(null);
//Populates devices into device divs
populateDeviceList();
//Place event listeners on all device containers after they're displayed.
//Event listeners for divs.
$('div.deviceContainer').click(fireCheck);
$('input.deviceCheckbox').click(selectBox);
//Event listener for return button.
$('#returnbutton').click(returnDevice);
//Event listener for modal x button.
$('#closeOrderForm').click(hidePopup);
//event listeners to escape modal
//Event listener exits modal when esc key pressed.
window.onkeydown = function(e){if (e.keyCode == 27){hidePopup();}}
window.onclick = function(e){var modal = document.getElementById('orderInfoModal'); if(e.target == modal) modal.style.display = "none";}
//Event listener exits modal when click outside modal.
window.onclick = function(e){var modal = document.getElementById('orderInfoModal'); if(e.target == modal) hidePopup();}
//This should make the device array of retrieved devices
//Make JSON from Java of retrieved devices.
function makeDeviceArray(){
window.json = '<%=deviceString%>';
return JSON.parse(window.json);
}
//This makes a corresponding checkbox get set off, and then changes box color
//Event listener for div changes color and adds/removes from selected to return.
function fireCheck(){
//get device id
var id = this.getAttribute('data-num');
Expand Down Expand Up @@ -203,13 +188,15 @@ function fireCheck(){
}
}
//behaves similarly to above, minus the forced checking
//and if statement reversed
//Event listener to undo checkmark so fireCheck() can handle instead.
function selectBox(){
//get id
var id = this.getAttribute('data-num');
//Create query to get checkbox
var query = 'input[data-num="'+id+'"]';
var query2 = 'div[data-num="'+id+'"]';
//Determine if it's checked
var checked = $(query).prop('checked');
//Undo the checkmark in this branch
if(checked === false){
$(query).prop('checked',true);
}
Expand All @@ -218,56 +205,18 @@ function selectBox(){
}
}
function filterDeviceList()
{
var id = this.getAttribute('id');
month=30*24*60*60*1000;
var upperbound;
var lowerbound;
var filter = new Array();
switch(id)
{
case "all":
populateDeviceList(null);
break;
case "1month":
upperbound=new Date().getTime();
lowerbound=upperbound-month;
filter=[lowerbound, upperbound];
populateDeviceList(filter);
break;
case "1-3months":
upperbound=new Date().getTime()-month;
lowerbound=upperbound-2*month;
filter=[lowerbound, upperbound];
populateDeviceList(filter);
break;
case "3-5months":
upperbound=new Date().getTime()-3*month;
lowerbound=upperbound-2*month;
filter=[lowerbound, upperbound];
populateDeviceList(filter);
break;
case "5+months":
upperbound=new Date().getTime()-5*month;
lowerbound=0;
filter=[lowerbound, upperbound];
populateDeviceList(filter);
break;
}
}
function populateDeviceList(filter)
//generates html and writes to 'devContainer' div in returnPage.html
{
var devicesToList = devices;
//Generates html and writes to 'devContainer' div in JSP
function populateDeviceList(){
//begin empty html
var htmlString="";
var i;
for (i = 0; i < devicesToList.length; i++) {
var id = devicesToList[i].id;
var name = devicesToList[i].name;
var hardware = devicesToList[i].model;
var checkout = devicesToList[i].checkout;
//iterate returned devices
for (var i = 0; i < devices.length; i++) {
//get device values
var id = devices[i].id;
var name = devices[i].name;
var hardware = devices[i].hardware;
var checkout = devices[i].checkout;
//HTML representation in divs
htmlString+="<div class=\"deviceContainer\" data-num=\"" + i +"\">";
htmlString+="<input class=\"deviceCheckbox\" type = \"checkbox\" data-num=\"" + i + "\">";
htmlString+="<div><div class=\"imgContainer\"><img src=\"../imgs/my-icons-collection-devices/png/";
Expand All @@ -278,30 +227,32 @@ function populateDeviceList(filter)
htmlString+=checkout;
htmlString+="</div></p></div></div><br><br>";
}
//Handles if no devices are returned
if(i==0) htmlString+="Couldn't find any devices to return. Why not go order some?";
//Place html in body
document.getElementById("devContainer").innerHTML = htmlString;
var returnbuttons = document.getElementsByClassName('returnbutton');
for (var i = 0; i < returnbuttons.length; i++) {
returnbuttons[i].addEventListener('click',returnDevice);
}
}
//Initiates modal to popup for review
function returnDevice()
{
var html = "";
//iterate devices that are to be returned
for(var i = 0; i < toReturn.length; i++){
html+= "<tr><td>" + devices[toReturn[i]].name + "</td><td>" + devices[toReturn[i]].hardware + "</td><td>" + devices[toReturn[i]].model + "</td></tr>";
html+= "<tr><td>" + devices[toReturn[i]].name + "</td><td>" + devices[toReturn[i]].model + "</td><td>" + devices[toReturn[i]].hardware + "</td></tr>";
}
//place html in body
document.getElementById("tablebody").innerHTML = html;
//show modal
$('#orderInfoModal').show();
}
//called when clicking x on the modal
//Call to exit modal
function hidePopup(){
$('#orderInfoModal').hide();
}
</script>
<!-- Navbar generation. -->
<script src = "../javascript/navbar.js"></script>
<!-- <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> -->
</body>
Binary file modified db/Schema.mwb
Binary file not shown.
Binary file modified db/Schema.mwb.bak
Binary file not shown.
Loading

0 comments on commit 1193551

Please sign in to comment.