File "script.js"

Full Path: /home/analogde/www/LED/2024_PHP_03_10_2024/script.js
File size: 3.42 KB
MIME-type: text/plain
Charset: utf-8

document.getElementById('fileInput').addEventListener('change', handleFileSelect);

 

function handleFileSelect(event) {

    const fileList = document.getElementById('fileList');

    fileList.innerHTML = ''; // Clear previous files

 

    const files = event.target.files;

    for (let i = 0; i < files.length; i++) {

        const file = files[i];

        const listItem = document.createElement('div');

        listItem.classList.add('d-flex', 'justify-content-between', 'align-items-center', 'mb-2');

        listItem.innerHTML = `

            <span>${file.name}</span>

            <button type="button" class="btn btn-danger btn-sm" onclick="removeFile(this, '${file.name}')">Supprimer</button>

        `;

        fileList.appendChild(listItem);

    }

}

 

function removeFile(button, fileName) {

    const fileList = document.getElementById('fileList');

    const listItem = button.parentElement;

    fileList.removeChild(listItem);

 

    // Remove the file from the FileList (not directly possible, so we need to filter it out)

    const fileInput = document.getElementById('fileInput');

    const dt = new DataTransfer();

    const files = Array.from(fileInput.files).filter(file => file.name !== fileName);

    files.forEach(file => dt.items.add(file));

    fileInput.files = dt.files;

}

 

function submitFiles() {

    const fileInput = document.getElementById('fileInput');

    const files = fileInput.files;

 

    if (files.length === 0) {

        alert('Veuillez sélectionner des fichiers.');

        return;

    }

 

    const formData = new FormData();

    for (let i = 0; i < files.length; i++) {

        formData.append('files[]', files[i]);

    }

 

    const xhr = new XMLHttpRequest();

    xhr.open('POST', 'ia_upload.php', true);

 

    let startTime = new Date().getTime();

    let lastLoaded = 0;

 

    xhr.upload.onprogress = function (event) {

        if (event.lengthComputable) {

            const percentComplete = (event.loaded / event.total) * 100;

            const progressBar = document.getElementById('progress');

            progressBar.style.width = percentComplete + '%';

            progressBar.innerHTML = percentComplete.toFixed(2) + '%';

 

            lastLoaded = event.loaded;

        }

    };

 

    const updateProgressInfo = setInterval(function () {

        const elapsedTime = (new Date().getTime() - startTime) / 1000;

        const speed = (lastLoaded / elapsedTime) / 1024; // kbps

        const remainingTime = (xhr.upload.total - lastLoaded) / (lastLoaded / elapsedTime);

 

        const progressInfo = document.getElementById('progressInfo');

        progressInfo.innerHTML = `

            <p>Vitesse de transfert: ${speed.toFixed(2)} kbps</p>

            <p>Temps écoulé: ${elapsedTime.toFixed(2)} secondes</p>

            <p>Temps restant: ${remainingTime.toFixed(2)} secondes</p>

            <p>Temps estimé pour 100%: ${(xhr.upload.total / speed / 1024).toFixed(2)} secondes</p>

        `;

    }, 1000);

 

    xhr.onload = function () {

        clearInterval(updateProgressInfo);

        if (xhr.status === 200) {

            alert('Fichiers envoyés avec succès.');

        } else {

            alert('Erreur lors de l\'envoi des fichiers.');

        }

    };

 

    xhr.send(formData);

}