Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

HTML & JS fixes #48

Merged
merged 10 commits into from
May 6, 2023
Merged

HTML & JS fixes #48

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
10 commits
Select commit Hold shift + click to select a range
8c77775
fixed invalid tag value
MAPReiff May 6, 2023
3467634
Fixed nave bar search
MAPReiff May 6, 2023
6564ba3
Correct invalid HTML in make tickets
MAPReiff May 6, 2023
c709875
Fix client side error checking for make ticket
MAPReiff May 6, 2023
970df1b
Further fixes to ticket js
MAPReiff May 6, 2023
f694b3e
Edit ticket now uses error checking
MAPReiff May 6, 2023
33bbf29
Update ticket route to pass users into makeTicket if an error is caug…
MAPReiff May 6, 2023
58a757f
Fix HTML validation on viewing tickets
MAPReiff May 6, 2023
5056233
Update edit ticket to match the same required values as make ticket
MAPReiff May 6, 2023
053a404
Fixed HTML validation on editTicket
MAPReiff May 6, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
191 changes: 109 additions & 82 deletions public/js/makeTicket.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,46 +1,51 @@


var formTicket = document.getElementById("makeTicketForm");
if (formTicket) {
let formTicket;
document.addEventListener("DOMContentLoaded", function () {
formTicket = document.getElementById("makeTicketForm");
if (formTicket) {
formTicket.addEventListener("submit", (event) => {
event.preventDefault();
let ticketName = document.getElementById("ticketName").value;
let ticketDescription = document.getElementById("ticketDescription").value;
let ticketCategory = document.getElementById("ticketCategory").value;
let ticketDeadline = document.getElementById("ticketDeadline").value;
let ticketPriority = document.getElementById("ticketPriority").value;

// let role = document.getElementById("roleInput").value;
let errorP = document.getElementById("error");
try {
event.preventDefault();
let ticketName = document.getElementById("ticketName").value;
let ticketDescription = document.getElementById("ticketDescription").value;
let ticketCategory = document.getElementById("ticketCategory").value;
let ticketDeadline = document.getElementById("ticketDeadline").value;
let ticketPriority = document.getElementById("ticketPriority").value;
// let role = document.getElementById("roleInput").value;
let errorP = document.getElementById("error");
try {
checkTicketName(ticketName, "ticket name");
checkTicketDescription(ticketDescription, "ticket description");
checkTicketCategory(ticketCategory, "ticket category");
checkTicketDeadline(ticketDeadline);
checkTicketPriority(ticketPriority);
formTicket.submit();
} catch (e) {
} catch (e) {
errorP.innerHTML = `${e}`;
errorP.hidden = false;
}
// scroll to top of page so they can see the error
window.scrollTo(0, 0);
}
});
}
}
});


function checkTicketDescription(data, type) {
if (typeof data == "undefined") {
throw new Error(`please provide a ${type} string`);
} else if (typeof data != "string") {
throw new Error(`please provide a ${type} string`);
}

data = data.trim();

return data;
if (typeof data == "undefined") {
throw new Error(`please provide a ${type} string`);
} else if (typeof data != "string") {
throw new Error(`please provide a ${type} string`);
}

data = data.trim();

if (data.length == 0) {
throw new Error(`please provide a ${type} string`);
}

return data;
}


function checkTicketName(data, type) {
if (typeof data == "undefined") {
throw new Error(`please provide a ${type} string`);
Expand All @@ -50,73 +55,95 @@ function checkTicketName(data, type) {

data = data.trim();

if (data.length == 0) {
throw new Error(`please provide a ${type} string`);
}

return data;
}


function checkTicketCategory(data, type) {
if (typeof data == "undefined") {
throw new Error(`please provide a ${type} string`);
} else if (typeof data != "string") {
throw new Error(`please provide a ${type} string`);
}
if (typeof data == "undefined") {
throw new Error(`please provide a ${type} string`);
} else if (typeof data != "string") {
throw new Error(`please provide a ${type} string`);
}

if (
category != "Service Request" &&
category != "Incident" &&
category != "Problem" &&
category != "Change Request"
) {
throw new Error("category must be a string equal to Service Request, Incident, Problem, or Change Request");
}
data = data.trim();

return data;
}
if (
data != "Service Request" &&
data != "Incident" &&
data != "Problem" &&
data != "Change Request"
) {
throw new Error(
"category must be a string equal to Service Request, Incident, Problem, or Change Request"
);
}

return data;
}

function checkTicketPriority(data) {
if (typeof data == "undefined") {
throw new Error(`please provide a ${type} string`);
} else if (typeof data != "string") {
throw new Error(`please provide a ${type} string`);
}
console.log(data)
if (typeof data == "undefined") {
throw new Error(`please provide a ${type} string`);
} else if (typeof data != "string") {
throw new Error(`please provide a ${type} string`);
}

if (
priority != "Low" &&
priority != "Normal" &&
priority != "High" &&
priority != "Critical"
) {
throw new Error("priority must be a string equal to Low, Normal, High, or Critical");
}
data = data.trim();

return data;
}
if (
data != "Low" &&
data != "Normal" &&
data != "High" &&
data != "Critical"
) {
throw new Error(
"priority must be a string equal to Low, Normal, High, or Critical"
);
}

return data;
}

function checkTicketDeadline(data) {
if (typeof data == "undefined") {
return NaN;
} else if (typeof data != "string") {
throw new Error(`please provide a ${type} string`);
}
if (typeof data == "undefined") {
return NaN;
} else if (typeof data != "string") {
throw new Error(`please provide a ${type} string`);
}

var t = data.match(/^(\d{2})\/(\d{2})\/(\d{4})$/);
if(t !== null){
var d = +t[1], m = +t[2], y = +t[3];
var date = new Date(y, m - 1, d);
if(date.getFullYear() === y && date.getMonth() === m - 1) {
if (new Date(deadline).getTime() === NaN) {
throw new Error("provided dealine is not a valid timestamp");
} else if (new Date(deadline).getTime() < createdOn) {
throw new Error("provided dealine in the past");
}
return data;
}else{
throw Error("ticket deadline must be in the format YYYY-DD-MM");
}
}else{
throw Error("ticket deadline must be in the format YYYY-DD-MM");
}
data = data.trim();
if (data.length == 0) {
return NaN;
}

}
let t = data.match(/^\d{4}-\d{2}-\d{2}$/);
if (t !== null) {
// var d = +t[1],
// m = +t[2],
// y = +t[3];
let date = new Date(data);
let y = data.substring(0, 4);
let m = data.substring(5, 7);
let d = data.substring(8, 10);


if (date.getFullYear() == y && date.getMonth() == m - 1) {
if (new Date(data).getTime() === NaN) {
throw new Error("provided dealine is not a valid timestamp");
}
// else if (new Date(data).getTime() < createdOn) {
// throw new Error("provided dealine in the past");
// }
return data;
} else {
throw Error("ticket deadline must be in the format YYYY-DD-MM");
}
} else {
throw Error("ticket deadline must be in the format YYYY-DD-MM");
}
}
2 changes: 1 addition & 1 deletion public/js/search.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ if (navForm) {
// Does not check !query because that is considered valid input (null/undefined/empty is considered an empty search i.e. everything is returned)
// Also does not check empty strings, as that is also considered valid input (same reason as above)
event.preventDefault();
let query = document.getElementById("searchTickets").value;
let query = document.getElementById("search").value;
if (query && typeof query !== "string")
throw `Error: Search Query must be a string!`;
navForm.submit();
Expand Down
2 changes: 2 additions & 0 deletions routes/tickets.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -368,6 +368,7 @@ router
res.status(400).render("makeTicket", {
title: "Create Ticket",
user_id: req.session.user._id,
users: users,
error: 'All fields must be filled out'});
}

Expand All @@ -376,6 +377,7 @@ router
res.status(400).render("makeTicket", {
title: "Create Ticket",
user_id: req.session.user._id,
users: users,
error: `${e}`});
}

Expand Down
2 changes: 1 addition & 1 deletion views/allUsersView.handlebars
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
<h1 class="display-4 fw-normal pageHeader">Users</h1>
<form id="search-form-users" class="form-inline searchForm" action="/users" method="POST">
<div class="col-auto form-group">
<input class="form-control" type="text" id="searchUsers" name="searchUsers" placeholder="Search Users" value={{query}}>
<input class="form-control" type="text" id="searchUsers" name="searchUsers" placeholder="Search Users" value="{{query}}">
<label class="visually-hidden-focusable" for="searchUsers">Search Users:</label>
</div>
<input class="btn btn-primary searchBtn" type="submit" id="subBtn" value="Search">
Expand Down
20 changes: 10 additions & 10 deletions views/editTicket.handlebars
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,10 +6,10 @@
<p id="error" class="error" hidden></p>
{{/if}}

<form action="/tickets/editTicket/{{_id}}" method="POST" class="form-inline editTicketForm" method="POST">
<form action="/tickets/editTicket/{{_id}}" method="POST" class="form-inline editTicketForm" method="POST" id="makeTicketForm">
<div class="col-auto editTicketForm-group">
<label class="" for="ticketName" >Ticket Name</label>
<input class="form-control" type="text" id="ticketName" name="ticketName" placeholder="{{name}}" value="{{name}}"> <br>
<input class="form-control" type="text" id="ticketName" name="ticketName" placeholder="{{name}}" value="{{name}}" required> <br>

{{!-- <label class="" for="ticketDescription">Description</label>
<input class="form-control" type="text" id="ticketDescription" name="ticketDescription" placeholder="{{description}}" value="{{description}}"> <br> --}}
Expand Down Expand Up @@ -41,18 +41,18 @@
<div class="infoCategory">
<i class="icon-info-sign"></i>
<span class="extra-info">
<p class="infoSubtitle">Service Request:</p><p class="categoryDescription">Inquire about product or service. These tickets are usually low-risk and do not require immediate action (ex: request new hardware or software, want to reset their password, or renew their software licenses)</p>
ervice Request: Inquire about product or service. These tickets are usually low-risk and do not require immediate action (ex: request new hardware or software, want to reset their password, or renew their software licenses)
<br>
<p class="infoSubtitle">Incident:</p> Point out a problem with product or service (ex: disruption to IT service)
Incident: Point out a problem with product or service (ex: disruption to IT service)
<br>
<p class="infoSubtitle">Problem:</p> For technical staff - problem that may cause an incident for a customer
Problem: For technical staff - problem that may cause an incident for a customer
<br>
<p class="infoSubtitle">Change Request:</p> Make changes to product or service (ex: permission changes)
Change Request: Make changes to product or service (ex: permission changes)
<br>
</span>
</div>
</div>
<select class="form-control" id="ticketCategory" name="ticketCategory" placeholder={{category}}>
<select class="form-control" id="ticketCategory" name="ticketCategory">
{{#select category}}
<option value="Service Request">Service Request</option>

Expand All @@ -65,10 +65,10 @@
</select><br>

<label class="" for="ticketDeadline">Deadline</label>
<input class="form-control" type="date" id="ticketDeadline" name="ticketDeadline" placeholder={{deadline}} value={{deadline}}><br>
<input class="form-control" type="date" id="ticketDeadline" name="ticketDeadline" value={{deadline}}><br>

<label class="" for="ticketPriority">Priority</label>
<select class="form-control" id="ticketPriority" name="ticketPriority" placeholder={{priority}}>
<select class="form-control" id="ticketPriority" name="ticketPriority">
{{#select priority}}
<option value="Critical">Critical</option>

Expand All @@ -85,7 +85,7 @@
<div class="infoCategory">
<i class="icon-info-sign"></i>
<span class="extra-info">
<p class="categoryDescription">Separate tags with commas.</p>
Separate tags with commas.
</span>
</div>
</div>
Expand Down
23 changes: 10 additions & 13 deletions views/makeTicket.handlebars
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
{{else}}
<p id="error" class="error" hidden></p>
{{/if}}
<form action="/tickets/makeTicket" method="POST" class="form-inline makeTicketForm">
<form action="/tickets/makeTicket" method="POST" class="form-inline makeTicketForm" id="makeTicketForm">
<div class="col-auto makeTicketForm-group">
<label class="" for="ticketName">Ticket Name</label>
<input class="form-control" type="text" id="ticketName" name="ticketName" placeholder="Ticket Name" required> <br>
Expand All @@ -26,17 +26,15 @@
<div class="infoCategory">
<i class="icon-info-sign"></i>
<span class="extra-info">
<p class="infoSubtitle">Service Request:</p>
<p class="categoryDescription">Inquire about product or service. These tickets are usually low-risk and do not
Service Request: Inquire about product or service. These tickets are usually low-risk and do not
require immediate action (ex: request new hardware or software, want to reset their password, or renew their
software licenses)</p>
software licenses)
<br>
<p class="infoSubtitle">Incident:</p> Point out a problem with product or service (ex: disruption to IT
service)
Incident: Point out a problem with product or service (ex: disruption to IT service)
<br>
<p class="infoSubtitle">Problem:</p> For technical staff - problem that may cause an incident for a customer
Problem: For technical staff - problem that may cause an incident for a customer
<br>
<p class="infoSubtitle">Change Request:</p> Make changes to product or service (ex: permission changes)
Change Request: Make changes to product or service (ex: permission changes)
<br>
</span>
</div>
Expand All @@ -50,7 +48,7 @@
</select><br>

<label class="" for="ticketDeadline">Deadline</label>
<input class="form-control" type="date" id="ticketDeadline" name="ticketDeadline" placeholder="MM/DD/YYYY">
<input class="form-control" type="date" id="ticketDeadline" name="ticketDeadline">
<br>

<label class="" for="ticketPriority">Priority</label>
Expand All @@ -66,20 +64,19 @@
<div class="infoCategory">
<i class="icon-info-sign"></i>
<span class="extra-info">
<p class="categoryDescription">Separate tags with commas.</p>
Separate tags with commas.
</span>
</div>
</div>
<input class="form-control" type="text" id="ticketTags" name="ticketTags"
placeholder="Ticket Tags" required> <br>
placeholder="Ticket Tags" > <br>

<label class="" for="ticketOwners">Owners</label>
<div class="col-md-12"></div>
<div class="infoCategory">
<i class="icon-info-sign"></i>
<span class="extra-info">
<p class="categoryDescription">Owners list cannot be edited after submitting ticket. Only admins can edit owners
list submssion.</p>
Owners list cannot be edited after submitting ticket. Only admins can edit owners list submssion.
</span>
</div>
</div>
Expand Down
Loading