RTCMultiConnection Docs

RTCMultiConnection API Reference / "onFileProgress" event

  1. "onFileProgress" is useful in file-sharing scenarios; to display progress-bars:
  2. var progressHelper = {};
    
    // to make sure file-saver dialog is not invoked.
    connection.autoSaveToDisk = false;
    
    connection.onFileProgress = function (chunk, uuid) {
        var helper = progressHelper[chunk.uuid];
        helper.progress.value = chunk.currentPosition || chunk.maxChunks || helper.progress.max;
        updateLabel(helper.progress, helper.label);
    };
    
    connection.onFileStart = function (file) {
        var div = document.createElement('div');
        div.title = file.name;
        div.innerHTML = '<label>0%</label> <progress></progress>';
        document.body.appendChild(div);
        progressHelper[file.uuid] = {
            div: div,
            progress: div.querySelector('progress'),
            label: div.querySelector('label')
        };
        progressHelper[file.uuid].progress.max = file.maxChunks;
    };
    
    connection.onFileEnd = function (file) {
        progressHelper[file.uuid].div.innerHTML = '<a href="' + file.url + '" target="_blank" download="' + file.name + '">' + file.name + '</a>';
    };
    
    function updateLabel(progress, label) {
        if (progress.position == -1) return;
        var position = +progress.position.toFixed(2).split('.')[1] || 100;
        label.innerHTML = position + '%';
    }
    

Want to ask a Question?

You can include your email for private conversation!