ProgressBar при загрузке файлов

Всем привет!

Нужен совет от знающих. Есть следующий код:
[JS]
$(document).ready(function() {

$('#uploadForm').ajaxForm({
dataType: 'html',
target: '#uploadOutput',
clearForm: true,
beforeSubmit: function() {
$('#uploadOutput').html('<img src=\'../images/ajax-loader.gif\'>');
},
success: function(data) {
var $out = $('#uploadOutput');
$out.html('<div><pre>'+ data +'</pre></div>');
}
});
});
[/JS]

HTML:

1.  
2. <form id="uploadForm" action="file.php" method="POST" enctype="multipart/form-data">
3.                 File: <input type="file" name="file" />
4.                
5.                 <input type="submit" value="Submit" />
6. </form>
7. <label>Output:</label>
8.             <div id="uploadOutput"></div>
9.  
10.             </div>
11.  

Код (Text):

1.  
2. $xhr = $_SERVER['HTTP_X_REQUESTED_WITH'] == 'XMLHttpRequest';
3.  
4. if ($xhr)
5. {
6.     $uploaddir = $_SERVER['DOCUMENT_ROOT'] . '/photo/uploads/'; /* Папку, куда будут загружаться файлы */
7.     $file = $uploaddir . basename($_FILES['file']['name']);
8.    
9.     if (move_uploaded_file($_FILES['file']['tmp_name'], $file)) {
10.     echo "Файл ".$_FILES['file']['name'] ." загружен успешно";
11.     } else {
12.     echo "Файл ".$_FILES['file']['name'] ." не был загружен. Ошибка " . $_FILES['file']['error'];
13.     }
14. }

Всё прекрасно работает. Но вместо вот этого:
[JS]
beforeSubmit: function() {
$('#uploadOutput').html('<img src=\'../images/ajax-loader.gif\'>');
},
[/JS]

хочу встроить прогресс бар. У меня вопрос даже не в том, как его встроить (jQuery UI рулит) сколько в том, каким образом передавать проценты загруженного файла... вообще это реально или нет?

Да, ещё условие: без всякого флеша.