Improve web interface

This commit is contained in:
Kumi 2018-10-19 18:21:59 +02:00
parent a78d3b0f23
commit 745ea43397
4 changed files with 75 additions and 45 deletions

View file

@ -36,57 +36,15 @@
</div>
</div>
<div class="modal"></div>
<script src="https://code.jquery.com/jquery-3.3.1.min.js" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
<script src="/worker.js"></script>
<script>
function lockform() {
$("#theform :input").prop("disabled", true);
}
function unlockform() {
$("#theform :input").prop("disabled", false);
}
$('#theform').submit(function(event){
event.preventDefault();
if(this.checkValidity()) {
$.ajax({
type: "POST",
url: "/addjob",
data: $('#theform').serialize(),
success: function(msg){
lockform();
interval = setInterval(checkServerForFile,1000,msg);
function checkServerForFile(jobid) {
$.ajax({
type: "GET",
cache: false,
url: "/getjob/" + jobid,
statusCode: {
404: function() {
clearInterval(interval);
unlockform();
},
200: function() {
clearInterval(interval);
unlockform();
window.location.href = "/getjob/" + jobid
},
500: function() {
clearInterval(interval);
unlockform();
}
}
});
}
}
});}
});
</script>
</body>

BIN
server/static/spinner.gif Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 114 KiB

View file

@ -6431,3 +6431,25 @@ html, body {
height: 100%;
content: ' ';
background: linear-gradient(white, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0)); }
.modal {
display: none;
position: fixed;
z-index: 1000;
top: 0;
left: 0;
height: 100%;
width: 100%;
background: rgba( 255, 255, 255, .8 )
url('/spinner.gif')
50% 50%
no-repeat;
}
body.loading .modal {
overflow: hidden;
}
body.loading .modal {
display: block;
}

50
server/static/worker.js Normal file
View file

@ -0,0 +1,50 @@
$body = $("body");
function lockform() {
$("#theform :input").prop("disabled", true);
$body.addClass("loading");
}
function unlockform() {
$("#theform :input").prop("disabled", false);
$body.removeClass("loading");
}
$('#theform').submit(function(event){
event.preventDefault();
if(this.checkValidity()) {
$.ajax({
type: "POST",
url: "/addjob",
data: $('#theform').serialize(),
success: function(msg){
lockform();
interval = setInterval(checkServerForFile,3000,msg);
function checkServerForFile(jobid) {
$.ajax({
type: "GET",
cache: false,
url: "/getjob/" + jobid,
statusCode: {
404: function() {
clearInterval(interval);
unlockform();
},
200: function() {
clearInterval(interval);
unlockform();
window.location.href = "/getjob/" + jobid
},
500: function() {
clearInterval(interval);
window.alert("Failed to process request.")
unlockform();
}
}
});
}
}
});}
});