Skip to content

Instantly share code, notes, and snippets.

@tamimibrahim17

tamimibrahim17/index.html

Created April 1, 2021 14:10
Show Gist options
  • Save tamimibrahim17/670980afb2280e194986d44c7ce62806 to your computer and use it in GitHub Desktop.
Save tamimibrahim17/670980afb2280e194986d44c7ce62806 to your computer and use it in GitHub Desktop.
Download ZIP
frontend where it controlled
Raw
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Testing ajax loader</title>
</head>
<body>
<div id="progress">0</div>
<button id="start_ajax">Click me hard</button>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
var download_file_name = null;
var time_needed = 0;
var lock_file = null;
var progress = null;
$(document).ready(function(){
$(document).on('click', '#start_ajax', function(){
lock_file = Math.floor(Math.random()*10000);
$.ajax({
url : 'run.php?lock_file='+lock_file,
method : 'GET',
beforeSend : function(){
$(document).trigger('start-dl-progress');
},
success : function(result){
result = JSON.parse(result);
console.log(result);
if( result.file ){
$(document).trigger('stop-progress');
}
},
error : function(error){
console.log(error);
}
});
});
$(document).on('start-dl-progress', function(){
progress = setInterval(function(){
$.ajax({
url : 'dl.php?lock_file='+lock_file+'.lock',
method : 'GET',
success : function(result){
result = JSON.parse(result);
console.log(result);
$('#progress').html( result.done * 20 + '%');
},
error : function(error){
console.log(error);
}
});
},1000);
});
$(document).on('stop-progress', function(){
clearInterval(progress);
})
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment