Skip to content

Commit

Permalink
Merge branch 'search'
Browse files Browse the repository at this point in the history
  • Loading branch information
@arc12012
arc12012 committed Apr 21, 2017
2 parents 49c6fbf + b9d4c85 commit 186a6b1
Showing 1 changed file with 196 additions and 96 deletions.
292 changes: 196 additions & 96 deletions WebContent/html/webpages/administration/adminApprove.jsp
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
<%@ page import = "database.*,entities.*" %>
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
Expand Down Expand Up @@ -73,85 +73,88 @@
tbody{
text-align: left;
}
.btn{
margin-top: 15px;
}
</style>
</head>

<body>
<nav class="navbar navbar-inverse navbar-fixed-top" id = "navbaruniversal">
<%@ include file="../components/adminnavbar.jsp"%>
</nav>

<div class="col-sm-3 col-md-2 sidebar">
<%@ include file="../components/adminsidebar.jsp" %>
</div>

<!-- Modal for choosing ticket action. -->
<div id="Modal" class="modal">
<div class="modal-content">
<div class="modal-head">
<span id="closeForm" class="close">&times;</span>
<h4>View Ticket Below</h4>
</div><br>
<div class="modal-body">
<!-- Where new information is added. -->
<form ACTION = "../redirect/ticketAdminRedirect.jsp" METHOD = "POST">
<table style = 'margin: 0 auto;' class="table table-bordered table-hover">
<thead>
<tr>
<th>Ticket ID</th>
<th>Requestor Name</th>
<th>Location Name</th>
<th>Device Name</th>
<th>Status</th>
<th>Return Date</th>
</tr>
</thead>
<tbody id="tablemodal">
</tbody>
</table>
<button type = "submit" name = "approve" value = "Approve" class="btn btn-primary">Approve</button>
<button type = "submit" name = "reject" value = "Reject" class="btn btn-primary">Reject</button>
<input type = "text" id = "ticketIDfield" name = "ticketid" style = "display: none;">
<input type = "text" id = "deviceIDfield" name = "deviceid" style = "display: none;">
<input type = "text" id = "locationIDfield" name = "locationid" style = "display: none;">
</form>
</div>
</div>
</div>

<div class = "displayDevice">
<h2>Admin View Approvals</h2>
<table class="table table-bordered table-hover">
<thead>
<tr>
<th>Ticket ID</th>
<th>Requestor Name</th>
<th>Location Name</th>
<th>Device Name</th>
<th>Status</th>
<th>Return Date</th>
</tr>
</thead>
<tbody id="tablebodymain">
</tbody>
</table>
</div>
.btn{
margin-top: 15px;
}
</style>
</head>

<body>
<nav class="navbar navbar-inverse navbar-fixed-top" id = "navbaruniversal">
<%@ include file="../components/adminnavbar.jsp"%>
</nav>

<div class="col-sm-3 col-md-2 sidebar">
<%@ include file="../components/adminsidebar.jsp" %>
</div>

<!-- Modal for choosing ticket action. -->
<div id="Modal" class="modal">
<div class="modal-content">
<div class="modal-head">
<span id="closeForm" class="close">&times;</span>
<h4>View Ticket Below</h4>
</div><br>
<div class="modal-body">
<!-- Where new information is added. -->
<form ACTION = "../redirect/ticketAdminRedirect.jsp" METHOD = "POST">
<table style = 'margin: 0 auto;' class="table table-bordered table-hover">
<thead>
<tr>
<th>Ticket ID</th>
<th>Requestor Name</th>
<th>Location Name</th>
<th>Device Name</th>
<th>Status</th>
<th>Return Date</th>
</tr>
</thead>
<tbody id="tablemodal">
</tbody>
</table>
<button type = "submit" name = "approve" value = "Approve" class="btn btn-primary">Approve</button>
<button type = "submit" name = "reject" value = "Reject" class="btn btn-primary">Reject</button>
<input type = "text" id = "ticketIDfield" name = "ticketid" style = "display: none;">
<input type = "text" id = "deviceIDfield" name = "deviceid" style = "display: none;">
<input type = "text" id = "locationIDfield" name = "locationid" style = "display: none;">
</form>
</div>
</div>
</div>

<div class = "displayDevice">
<h2>Admin View Approvals</h2>
<form onsubmit="return false;" class="form-inline">
<input type="search" class="form-control" name="searchBar" placeholder=" search tickets" autocomplete="off" style="width: 50%; text-align: left; margin: 1%;" />
</form>
<table class="table table-bordered table-hover">
<thead>
<tr>
<th>Ticket ID</th>
<th>Requestor Name</th>
<th>Location Name</th>
<th>Device Name</th>
<th>Status</th>
<th>Return Date</th>
</tr>
</thead>
<tbody id="tablebodymain">
</tbody>
</table>
</div>

<%
Ticket[] tickets = TicketQueries.getTickets();
String ticketStr = Ticket.arrayToString(tickets);
Ticket[] tickets = TicketQueries.getTickets();
String ticketStr = Ticket.arrayToString(tickets);
%>
<script>
window.json = '<%=ticketStr%>';
var tickets = JSON.parse(window.json);
populateTickets();

<script>
window.json = '<%=ticketStr%>';
var ticks = JSON.parse(window.json);
populateTickets(ticks);
//adds event listeners to all table records
$("tr.entry").click(ticketAction);
//Exits modal when x is clicked.
Expand All @@ -160,31 +163,128 @@
window.onkeydown = function(e){if (e.keyCode == 27){closeModal();}}
//Event listener exits modal when click outside modal.
window.onclick = function(e){var modal = document.getElementById('Modal'); if(e.target == modal) {closeModal();}}
// search bar listener
var searchbar = document.getElementsByName('searchBar');
searchbar[0].onkeyup = refresh;
function refresh() {
populateTickets(fuzzyFilter(JSON.parse(window.json)));
//adds event listeners to all table records
$("tr.entry").click(ticketAction);
}
//Places all tickets from query into page
function populateTickets(){
var html = "";
for(var i = 0; i < tickets.length; i++){
function populateTickets(tickets){
var html = "";
for(var i = 0; i < tickets.length; i++){
//NEED TO ADD IN RETURN DATE AT END BUT THAT WOULD BREAK THINGS AT THE MOMENT
html += "<tr class = 'entry' id = '" + i + "'><td>" + tickets[i].id + "</td><td>" + tickets[i].username + "</td><td>" + tickets[i].locationname + "</td><td>" + tickets[i].devicename + "</td><td>" + tickets[i].status + "</td><td>" + tickets[i].return + "</td></tr>";
html += "<tr class = 'entry' id = '" + i + "'><td>" + tickets[i].id + "</td><td>" + tickets[i].username + "</td><td>" + tickets[i].devicename + "</td><td>" + tickets[i].locationname + "</td><td>" + tickets[i].status + "</td><td>" + tickets[i].return + "</td></tr>";
}
document.getElementById("tablebodymain").innerHTML = html;
}
function ticketAction(){
var id = this.id;
var html = "<tr><td>" + tickets[id].id + "</td><td>" + tickets[id].username + "</td><td>" + tickets[id].locationname + "</td><td>" + tickets[id].devicename + "</td><td>" + tickets[id].status + "</td><td>" + tickets[id].return + "</td></tr>";
document.getElementById("tablemodal").innerHTML = html;
$("#ticketIDfield").val(tickets[id].id);
$("#deviceIDfield").val(tickets[id].deviceID);
$("#locationIDfield").val(tickets[id].location);
$("#Modal").show();
}
function closeModal(){
$("#Modal").hide();
}
</script>
</body>
var html = "<tr><td>" + tickets[id].id + "</td><td>" + tickets[id].username + "</td><td>" + tickets[id].locationname + "</td><td>" + tickets[id].devicename + "</td><td>" + tickets[id].status + "</td><td>" + tickets[id].return + "</td></tr>";
document.getElementById("tablemodal").innerHTML = html;
$("#ticketIDfield").val(tickets[id].id);
$("#deviceIDfield").val(tickets[id].deviceID);
$("#locationIDfield").val(tickets[id].location);
$("#Modal").show();
}
function closeModal(){
$("#Modal").hide();
}
function fuzzyFilter(ticketArray) {
// First pass: filter by id
var searchText = document.getElementsByName('searchBar')[0].value;
var options = {
pre: "<span style='color: darkmagenta; font-size: 115%'><b>",
post: '</b></span>',
extract: function(arg) {return ''+arg.id;}
}
var idFilterResults = fuzzy.filter(searchText, ticketArray, options);
for (var i = idFilterResults.length - 1; i >= 0; i--) {
idFilterResults[i].original.id=idFilterResults[i].string;
}
// Pass #2: filter by status
options.extract=function(arg) {return arg.status;}
var statusFilterResults = fuzzy.filter(searchText, ticketArray, options)
for (var i = statusFilterResults.length-1;i >=0; i--) {
statusFilterResults[i].original.status=statusFilterResults[i].string;
}
// Pass #3: filter by username
options.extract=function(arg) {return arg.username;}
var usernameFilterResults = fuzzy.filter(searchText, ticketArray, options)
for (var i = usernameFilterResults.length-1;i >=0; i--) {
usernameFilterResults[i].original.username=usernameFilterResults[i].string;
}
// Pass #4: filter by locationname
options.extract=function(arg) {return arg.locationname;}
var locationnameFilterResults = fuzzy.filter(searchText, ticketArray, options)
for (var i = locationnameFilterResults.length-1;i >=0; i--) {
locationnameFilterResults[i].original.locationname=locationnameFilterResults[i].string;
}
// Pass #5: filter by devicename
options.extract=function(arg) {return arg.devicename;}
var devicenameFilterResults = fuzzy.filter(searchText, ticketArray, options)
for (var i = devicenameFilterResults.length-1;i >=0; i--) {
devicenameFilterResults[i].original.devicename=devicenameFilterResults[i].string;
}
// Pass #6: filter by return
options.extract=function(arg) {return arg.return;}
var returnFilterResults = fuzzy.filter(searchText, ticketArray, options)
for (var i = returnFilterResults.length-1;i >=0; i--) {
returnFilterResults[i].original.return=returnFilterResults[i].string;
}
var filteredResults = union([idFilterResults, statusFilterResults, usernameFilterResults, locationnameFilterResults, devicenameFilterResults, returnFilterResults]);
// this returns a filtered array of objects with attributes 'index', 'original', 'score', and 'string'
// I am interested in the 'original' attribute, which is the relevant object exactly as it was submitted,
// and the 'string' attribute, which is the attribute that was compared against with matching characters conveniantly bolded
var finalResults = new Array(filteredResults.length);
for (var i = 0; i < finalResults.length; i++) {
finalResults[i]= {
id:filteredResults[i].original.id,
status:filteredResults[i].original.status,
username:filteredResults[i].original.username,
locationname:filteredResults[i].original.locationname,
devicename:filteredResults[i].original.devicename,
return:filteredResults[i].original.return,
};
}
return finalResults;
}
function union(arrays) {
if(arrays.length == 2)
return(unionBaseCase(arrays[0],arrays[1]))
if(arrays.length == 1)
return(arrays[0])
else{
var pivot = Math.floor(arrays.length/2);
var arrayA=arrays.slice(0,pivot);
var arrayB=arrays.slice(pivot);
return union([union(arrayA),union(arrayB)]);
}
}
function unionBaseCase(array1,array2) {
var results = new Array();
while(array1.length>0 && array2.length>0) {
if(array1[0].index == array2[0].index){
array1.splice(0,1);
}
else
results.push((array1[0].index > array2[0].index ? array2.splice(0,1)[0] : array1.splice(0,1)[0]))
}
results = results.concat(array1);
results = results.concat(array2);
return results;
}
</script>
<script src="../../javascript/lib/fuzzy.js"></script>
</body>
</html>

0 comments on commit 186a6b1

Please sign in to comment.