How to download multiple files at same time with progress?


#1

Hello everyone, i am currently developing an app in electron that requires to download files from server.
In the GUI there is two progress bar which suppose to be updated along with the download progress. But i am not able to download multiple files with progress.
here is my code:

function downloader() {
const fs = require('fs');
const request = require('request');
const progress = require('request-progress');

let bar = document.querySelector('.progress-bar');
progress(request('https://example.com/file.zip'))
    .on('progress', function (state) {

        bar.setAttribute('data-value', `${state.percent * 100}%`);

        document.querySelector('.msg').innerHTML = `${Math.round(state.percent) * 100}%`

        document.querySelector('.down-size').innerHTML = `Size: ${ Math.round(state.size.total / 1024)} KB`;

    

        if(state.speed){

            document.querySelector('.down-speed').innerHTML = `Speed: ${Math.round(state.speed / 1024)} kb/s`
        }
        console.log('progress', state);
    })
    .on('error', function (err) {
        console.log(err)
    })
    .on('end', function () {

        let bar = document.querySelector('.progress-bar');

        bar.setAttribute('data-value','100%');

        document.querySelector('.msg').innerHTML = "Download Complete"

    })
    .pipe(fs.createWriteStream('file.zip'))

}
function downloader2() {
const fs = require(‘fs’);
const request = require(‘request’);
const progress = require(‘request-progress’);
let bar = document.querySelector(’.bar1’);
progress(request(‘https://example.com/file.zip’))
.on(‘progress’, function (state) {

        bar.setAttribute('data-value', `${state.percent * 100}%`);

        document.querySelector('.msg1').innerHTML = `${Math.round(state.percent) * 100}%`

        document.querySelector('.size').innerHTML = `Size: ${ Math.round(state.size.total / 1024)} KB`;


        if(state.speed){

            document.querySelector('.speed').innerHTML = `Speed: ${Math.round(state.speed / 1024)} kb/s`
        }
        console.log('progress', state);
    })
    .on('error', function (err) {
        console.log(err)
    })
    .on('end', function () {

        let bar = document.querySelector('.bar1');

        bar.setAttribute('data-value','100%');

        document.querySelector('.msg1').innerHTML = "Download Complete"

    })
    .pipe(fs.createWriteStream('file2.zip'))

}

function download(){
downloader();
downloader2()
}


#2

I’m not sure that this is a question for the Electron community. Would it not be better directed to the developers of the package you’re using to generate progress bars?

Additionally, make sure to format your code properly when posting it. On here, that means selecting it and pressing the </> button above the editor, or using standard GitHub-Flavored Markdown syntax. You should also add some detail about the results you see.