Conservancy/reimbursinator
6
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add loading message and modal fade

Browse source
This commit is contained in:
Preston Doman 2019-02-09 22:23:08 -08:00
parent 9a20cf72a8
commit da50627f51
3 changed files with 28 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
front/static/edit_report.html
View file

@ -62,7 +62,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="modal" id="editReportModal" tabindex="-1" role="dialog"> <div class="modal fade" id="editReportModal" tabindex="-1" role="dialog">
<div class="modal-dialog modal-lg" role="document"> <div class="modal-dialog modal-lg" role="document">
<div class="modal-content"> <div class="modal-content">
<div class="modal-header"> <div class="modal-header">
@ -72,6 +72,12 @@
</button> </button>
</div> </div>
<div class="modal-body" id="editReportModalBody"> <div class="modal-body" id="editReportModalBody">
<div class="text-center">
<i class="fas fa-spinner fa-3x fa-spin"></i>
<br>
<br>
<h5>Loading Report ...</h5>
</div>
</div> </div>
<div class="modal-footer"> <div class="modal-footer">
<button type="button" class="btn btn-danger">Delete Report</button> <button type="button" class="btn btn-danger">Delete Report</button>
@ -81,7 +87,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="modal" id="viewReportModal" tabindex="-1" role="dialog"> <div class="modal fade" id="viewReportModal" tabindex="-1" role="dialog">
<div class="modal-dialog modal-lg" role="document"> <div class="modal-dialog modal-lg" role="document">
<div class="modal-content"> <div class="modal-content">
<div class="modal-header"> <div class="modal-header">
@ -91,6 +97,12 @@
</button> </button>
</div> </div>
<div class="modal-view"> <div class="modal-view">
<div class="text-center">
<i class="fas fa-spinner fa-3x fa-spin"></i>
<br>
<br>
<h5>Loading Report ...</h5>
</div>
</div> </div>
</div> </div>
</div> </div>

18
front/static/js/viewHistory.js
View file

@ -1,3 +1,9 @@
const reportType = {
NEW : 1,
EDIT : 2,
VIEW : 3
};
// Hack to change endpoint url // Hack to change endpoint url
function getEndpointDomain() { function getEndpointDomain() {
return "https://" + window.location.hostname + ":8444/"; return "https://" + window.location.hostname + ":8444/";
@ -18,7 +24,7 @@ function getDataFromEndpoint(url, callback, optional) {
console.log("GET SUCCESS!"); console.log("GET SUCCESS!");
console.log("Server response:\n" + this.response); console.log("Server response:\n" + this.response);
let parsedData = JSON.parse(this.response); let parsedData = JSON.parse(this.response);
optional === undefined ? callback(parsedData) : callback(parsedData, optional); optional ? callback(parsedData, optional) : callback(parsedData);
} else { } else {
console.error("GET FAILURE!"); console.error("GET FAILURE!");
console.error("Server status: " + this.status); console.error("Server status: " + this.status);
@ -51,7 +57,7 @@ function postDataToEndpoint(url, payload, callback, optional) {
console.log("POST SUCCESS!"); console.log("POST SUCCESS!");
console.log("Server response:\n" + this.response); console.log("Server response:\n" + this.response);
let parsedData = JSON.parse(this.response); let parsedData = JSON.parse(this.response);
optional === undefined ? callback(parsedData) : callback(parsedData, optional); optional ? callback(parsedData, optional) : callback(parsedData);
} else { } else {
console.error("POST FAILURE!"); console.error("POST FAILURE!");
console.error("Server status: " + this.status); console.error("Server status: " + this.status);
@ -399,17 +405,9 @@ document.addEventListener("DOMContentLoaded", function(event) {
} }
}); });
const reportType = {
NEW : 1,
EDIT : 2,
VIEW : 3
};
document.addEventListener("click", function(event) { document.addEventListener("click", function(event) {
if (event.target) { if (event.target) {
if (event.target.classList.contains("edit-report-button")) { if (event.target.classList.contains("edit-report-button")) {
console.log("Edit button clicked");
console.log(event);
const url = getEndpointDomain() + "api/v1/report/" + event.target.dataset.rid; const url = getEndpointDomain() + "api/v1/report/" + event.target.dataset.rid;
const type = reportType.EDIT; const type = reportType.EDIT;
getDataFromEndpoint(url, createReportForm, type); getDataFromEndpoint(url, createReportForm, type);

6
front/static/new_report.html
View file

@ -66,6 +66,12 @@
</button> </button>
</div> </div>
<div class="modal-body" id="newReportModalBody"> <div class="modal-body" id="newReportModalBody">
<div class="text-center">
<i class="fas fa-spinner fa-3x fa-spin"></i>
<br>
<br>
<h5>Creating Report ...</h5>
</div>
</div> </div>
<div class="modal-footer"> <div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button> <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>