[Java][PHP][HTML]Multiupload zdjęć + pasek postępu Opcje

[Wampirek12]

Witam wiem, że z uploadem zdjęć jest duzo tematów jednak żaden nie rozwiązuje mojego problemu.
Zrobiłem stronę wszystko działa pięknie zdjęcia się dodają jednak jak wiadomo taki upload troszkę trwa dlatego chciałbym dodać pasek postępu aby było wiadomo czy zdjęcie w ogole się dodaje czy tez nie. I tu jest moj problem bo nie znam za bardzo JS i znalazłem gotowy skrypt który działa po jednym pliku ale gdy jest ich kilki juz nie.
plik upload.php

[PHP] pobierz, plaintext 
<?php
 
/* utworzenie zmiennych */
$plik=0;
$plik = count($_FILES['fileToUpload']['name']);
print_r($plik);
/* utworzenie zmiennych */
   for ($i = 0; $i<$plik; $i++){
$folder_upload="upload";
$plik_nazwa=$_FILES['fileToUpload']['name'][$i];
$plik_lokalizacja=$_FILES['fileToUpload']['tmp_name'][$i]; //tymczasowa lokalizacja pliku
$plik_mime=$_FILES['fileToUpload']['type'][$i]; //typ MIME pliku wysłany przez przeglądarkę
$plik_rozmiar=$_FILES['fileToUpload']['size'][$i];
$plik_blad=$_FILES['fileToUpload']['error'][$i]; //kod błędu
 
/* sprawdzenie, czy plik został wysłany */
if (!$plik_lokalizacja) {
exit("Nie wysłano żadnego pliku");
}
 
 
/* sprawdzenie błędów */
switch ($plik_blad) {
case UPLOAD_ERR_OK:
break;
case UPLOAD_ERR_NO_FILE:
exit("Brak pliku.");
break;
case UPLOAD_ERR_INI_SIZE:
case UPLOAD_ERR_FORM_SIZE:
exit("Przekroczony maksymalny rozmiar pliku.");
break;
default:
exit("Nieznany błąd.");
break;
}
 
/* sprawdzenie rozszerzenia pliku - dzięki temu mamy pewność, że ktoś nie zapisze na serwerze pliku .php */
$dozwolone_rozszerzenia=array("jpeg", "jpg", "tiff", "tif", "png", "gif");
$plik_rozszerzenie=pathinfo(strtolower($plik_nazwa), PATHINFO_EXTENSION);
if (!in_array($plik_rozszerzenie, $dozwolone_rozszerzenia, true)) {
	exit("Niedozwolone rozszerzenie pliku.");
}
 
 
/* przeniesienie pliku z folderu tymczasowego do właściwej lokalizacji */
$plik_nowa_nazwa=date("YmdHisu")."-".rand(1000, 9999);
if (!move_uploaded_file($plik_lokalizacja, $folder_upload."/".$plik_nowa_nazwa.".".$plik_rozszerzenie)) {
exit("Nie udało się przenieść pliku.");
}
 
/* nie było błędów */
echo "Wysyłanie zdjęcia zostało zakończone:)"; 
$link = $folder_upload."/".$plik_nowa_nazwa.".".$plik_rozszerzenie; 
 
setcookie ("link",$link,'0');
   }
 ?>
 
[PHP] pobierz, plaintext 

javascript i formularze to gotowy skrypt znaleziony w internecie

[HTML] pobierz, plaintext 
 
 
 <script type="text/javascript">
 
 function fileSelected() {
        var file = document.getElementById('fileToUpload[]').files[0];
        if (file) {
          var fileSize = 0;
          if (file.size > 1024 * 1024)
            fileSize = (Math.round(file.size * 100 / (1024 * 1024)) / 100).toString() + 'MB';
          else
            fileSize = (Math.round(file.size * 100 / 1024) / 100).toString() + 'KB';
 
          document.getElementById('fileName').innerHTML = 'Name: ' + file.name;
          document.getElementById('fileSize').innerHTML = 'Size: ' + fileSize;
          document.getElementById('fileType').innerHTML = 'Type: ' + file.type;
        }
      }
 
      function uploadFile() {
        var fd = new FormData();
        fd.append("fileToUpload", document.getElementById('fileToUpload').files[0]);
        var xhr = new XMLHttpRequest();
        xhr.upload.addEventListener("progress", uploadProgress, false);
        xhr.addEventListener("load", uploadComplete, false);
        xhr.addEventListener("error", uploadFailed, false);
        xhr.addEventListener("abort", uploadCanceled, false);
        xhr.open("POST", "upload.php");
        xhr.send(fd);
      }
 
      function uploadProgress(evt) {
        if (evt.lengthComputable) {
          var percentComplete = Math.round(evt.loaded * 100 / evt.total);
          document.getElementById('progressNumber').innerHTML = percentComplete.toString() + '%';
        }
        else {
          document.getElementById('progressNumber').innerHTML = 'unable to compute';
        }
      }
 
      function uploadComplete(evt) {
        /* This event is raised when the server send back a response */
        alert(evt.target.responseText);
      }
 
      function uploadFailed(evt) {
        alert("There was an error attempting to upload the file.");
      }
 
      function uploadCanceled(evt) {
        alert("The upload has been canceled by the user or the browser dropped the connection.");
      }
 
 
    </script>
</head>
<body>
  <form id="form1" enctype="multipart/form-data" method="post" action="upload.php">
    <div class="row">
      <label for="fileToUpload">Select a File to Upload</label><br />
      <input type="file" multiple="multiple" name="fileToUpload[]" id="fileToUpload" onchange="fileSelected();"/>
    </div>
    <div id="fileName"></div>
    <div id="fileSize"></div>
    <div id="fileType"></div>
    <div class="row">
      <input type="button" onclick="uploadFile()" value="Upload" />
    </div>
    <div id="progressNumber"></div>
  </form>
[HTML] pobierz, plaintext