job handling code in js.
This commit is contained in:
parent
ec24d0f125
commit
6be2426f09
|
@ -7,3 +7,12 @@
|
||||||
height: 100px;
|
height: 100px;
|
||||||
width: 100px;
|
width: 100px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.msgbox {
|
||||||
|
border-radius: 25px;
|
||||||
|
padding: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.msgbox-error {
|
||||||
|
background: #ff4000;
|
||||||
|
}
|
||||||
|
|
|
@ -1,3 +1,80 @@
|
||||||
|
// Captive portal Javascript
|
||||||
|
// by Stefan Midjich
|
||||||
|
//
|
||||||
|
//
|
||||||
|
|
||||||
|
// This function ensures the user gets redirect to the correct destination once
|
||||||
|
// all jobs have succeeded in the portal software.
|
||||||
|
function do_success() {
|
||||||
|
console.log('success: '+window.location);
|
||||||
|
// Do something like refresh the window or go to another URL.
|
||||||
|
}
|
||||||
|
|
||||||
|
// Show an error to the user
|
||||||
|
function do_error(message) {
|
||||||
|
$('#error-row').show();
|
||||||
|
$('#form-row').hide();
|
||||||
|
$('#error-msg').val('Failed. Reload page and try again or contact support. ');
|
||||||
|
if (message) {
|
||||||
|
$('#error-msg').append('System response: '+message);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Poll the returned jobs and ensure they all succeed
|
||||||
|
function poll_jobs(data) {
|
||||||
|
var promises = [];
|
||||||
|
|
||||||
|
// Push promises into array
|
||||||
|
for(var job in data) {
|
||||||
|
var job_id = data[job].id;
|
||||||
|
var api_url = '/job/'+job_id;
|
||||||
|
|
||||||
|
promises.push(new Promise(function(resolve, reject) {
|
||||||
|
var maxRun = 3;
|
||||||
|
var timesRun = 0;
|
||||||
|
|
||||||
|
// Timer function that polls the API for job results
|
||||||
|
var pollJob = function() {
|
||||||
|
ajaxReq = $.get(api_url);
|
||||||
|
ajaxReq.done(function(getResponse) {
|
||||||
|
// Verify job data
|
||||||
|
var job_result = getResponse;
|
||||||
|
if(job_result.is_finished) {
|
||||||
|
resolve(job_result.result);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
ajaxReq.fail(function(XMLHttpRequest, textStatus, errorThrown) {
|
||||||
|
console.log('Request Error: '+ XMLHttpRequest.responseText + ', status:' + XMLHttpRequest.status + ', status text: ' + XMLHttpRequest.statusText);
|
||||||
|
reject(XMLHttpRequest.responseText);
|
||||||
|
});
|
||||||
|
|
||||||
|
// Set timeout recursively until a certain threshold is reached
|
||||||
|
if (++timesRun == maxRun) {
|
||||||
|
clearTimeout(timer);
|
||||||
|
reject("Job polling timed out");
|
||||||
|
} else {
|
||||||
|
timer = setTimeout(pollJob, 2000);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
var timer = setTimeout(pollJob, 500);
|
||||||
|
}));
|
||||||
|
}
|
||||||
|
|
||||||
|
// Run .all() on promises array until all promises resolve
|
||||||
|
Promise.all(promises).then(function(result) {
|
||||||
|
if(result.failed) {
|
||||||
|
do_error(result.error);
|
||||||
|
} else {
|
||||||
|
do_success();
|
||||||
|
}
|
||||||
|
}, function(reason) {
|
||||||
|
do_error(reason);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Submit the form
|
||||||
$('#approveForm').submit(function (event) {
|
$('#approveForm').submit(function (event) {
|
||||||
var api_url = '/approve';
|
var api_url = '/approve';
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
|
@ -11,13 +88,10 @@ $('#approveForm').submit(function (event) {
|
||||||
$('#approveButtonDiv').replaceWith('<img src="/static/images/radio.svg" alt="Loading, please wait..." />');
|
$('#approveButtonDiv').replaceWith('<img src="/static/images/radio.svg" alt="Loading, please wait..." />');
|
||||||
|
|
||||||
var ajaxReq = $.post(api_url);
|
var ajaxReq = $.post(api_url);
|
||||||
|
ajaxReq.done(poll_jobs);
|
||||||
ajaxReq.done(function(data) {
|
|
||||||
console.log(data);
|
|
||||||
});
|
|
||||||
|
|
||||||
ajaxReq.fail(function(XMLHttpRequest, textStatus, errorThrown) {
|
ajaxReq.fail(function(XMLHttpRequest, textStatus, errorThrown) {
|
||||||
console.log('Request Error: '+ XMLHttpRequest.responseText + ', status:' + XMLHttpRequest.status + ', status text: ' + XMLHttpRequest.statusText)
|
console.log('Request Error: '+ XMLHttpRequest.responseText + ', status:' + XMLHttpRequest.status + ', status text: ' + XMLHttpRequest.statusText);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
|
@ -19,6 +19,14 @@
|
||||||
<body>
|
<body>
|
||||||
|
|
||||||
<div class="container">
|
<div class="container">
|
||||||
|
<noscript>
|
||||||
|
<div class="row">
|
||||||
|
<div class="six columns msgbox msgbox-error" style="margin-top: 2%;">
|
||||||
|
<p>Denna sidan kräver Javascript, du måste aktivera Javascript i din webbläsare för att fortsätta.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</noscript>
|
||||||
|
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="six columns" style="margin-top: 10%">
|
<div class="six columns" style="margin-top: 10%">
|
||||||
<h4>End User Agreement</h4>
|
<h4>End User Agreement</h4>
|
||||||
|
@ -30,7 +38,13 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<form id="approveForm" method="post">
|
<form id="approveForm" method="post">
|
||||||
<div class="row">
|
<div id="error-row" class="row" style="visibility:hidden;">
|
||||||
|
<div class="five columns msgbox msgbox-error">
|
||||||
|
<p id="error-message"></p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="form-row" class="row">
|
||||||
<div class="four columns">
|
<div class="four columns">
|
||||||
<label>
|
<label>
|
||||||
<input type="checkbox" id="approveCheckbox" required> I approve this user agreement
|
<input type="checkbox" id="approveCheckbox" required> I approve this user agreement
|
||||||
|
|
Loading…
Reference in New Issue