session_start();
if(isset($_GET['progress'])){
$status_done = '0';
if($_SESSION['progress_percentage'] == "100"){
$status_done = '1';
}
echo json_encode(array(
'progress_percentage' => $_SESSION['progress_percentage'],
'progress_status' => $_SESSION['progress_status'],
'progress_done' => $status_done
)
);
}
elseif(isset($_GET['dummytask'])){
for ($i = 1; $i <= 100; $i++) {
$_SESSION['progress_percentage'] = $i;
$_SESSION['progress_status'] = 'Checking the locks and stuffing the dolls!';
sleep(1);
}
}
$(document).ready(function(){
var timeout = '';
function checkProgress(){
console.log('Checking progress event started');
$.ajax({
url: 'http://willetu54.fiftyfour.axc.nl/dgi/ajax.php?progress&time='+ new Date().getTime(),
cache: false,
dataType: 'json'
}).done(function(data) {
$('#progressbar-progress').html(data.progress_status +'('+ data.progress_percentage +')');
console.log('Progress checked');
console.log(data);
if(data.progress_done == "1"){
clearTimeout(timeout);
}
}).fail(function(jqXHR, status, error){
console.log('Check Progress: Error: '+ error + status +'');
});
}
function checkProgressTimeout(){
checkProgress();
console.log('Timeout tick for progress');
timeout = setTimeout(checkProgressTimeout, 500);
}
$('#menu-open').click(function(event){
checkProgressTimeout();
console.log('starting dummy task');
event.preventDefault();
$.get('http://willetu54.fiftyfour.axc.nl/dgi/ajax.php?dummytask', function(data) {
alert('Load was performed.');
});
});
});
Hello again Stackoverflow!
The system I'm currently developing has scripts that run quite slow and can last up to 20 seconds sometimes. (Creating large amounts of folders, moving large amounts of files, etc). So thats why I've designed this script. I've created a small dummytask wich just lasts ~100 seconds. When I fire that script using AJAX it completes a certain amount of tasks. Every time a task completes I update my $_SESSION
variable with the scripts' progress and load that onto my page with another jQuery script.
But it works out kinda strange. I think it does launch the checkProgressTimeout
and the dummy task (With the checkProgressTimeout
function it checks the progress every 500 ms), But when I look in console I see it only fires the event but does not get any results untill the dummy task is completed and then it slowely returns the progress checking with the same timeval (500ms).
This problem occurs in Google Chrome. The script doesn't work at all in IE.
I've set up a jsFiddle: http://jsfiddle.net/nZAs4/2/. But since jsFiddle does not support PHP scripts I've taken the privilege to upload it myself to one of my own webhosts. (I've also allowed Access-Control-Allow-Origin).
So how can I get this to work?