• b007
  • Member
  • Offline
  • Registered: 2011-05-02
  • Posts: 26

Topic: ProgressBar adding some details...

Hi,

Can it be added to the progress bar,
next to the total files size, and the progress upload percents,
- bitrate of client uploading
- counter of uploadind Kb from totla size:
1000/6577

[6577 is total, and 1000 is always going up as the size of sending]

Can those details be added to the progress bar?
Thanks..

  • b007
  • Member
  • Offline
  • Registered: 2011-05-02
  • Posts: 26

Re: ProgressBar adding some details...

Please help me,

Thanks..

  • davit
  • Maintainer
  • Offline
  • Registered: 2010-11-29
  • Posts: 2,143

Re: ProgressBar adding some details...

What you need is uploader.total (I suppose you know how to get hold of the reference to uploader object?).

bitrate of client uploading

Speed obviously. Aye? uploader.total.bytesPerSec

counter of uploadind Kb from totla size, 1000/6577

uploader.total.loaded/uploader.total.size

If you want to see your issue fixed, do not report it here, do it on - GitHub.
  • b007
  • Member
  • Offline
  • Registered: 2011-05-02
  • Posts: 26

Re: ProgressBar adding some details...

Thanks,

How to add those details in the progressBar / footer of the Ui?
and update them on realtime?

Thanks..

  • davit
  • Maintainer
  • Offline
  • Registered: 2010-11-29
  • Posts: 2,143

Re: ProgressBar adding some details...

@b007, some jQuery magic I guess - find a proper DOM element and update it accordingly. To make it realtime you need to attach the handler to UploadProgress event.

There is no out-of-the-box method for this. You need to arrange this manually.

If you want to see your issue fixed, do not report it here, do it on - GitHub.

6 Reply by b007 (edited by b007 2011-05-18 21:35:32)

  • b007
  • Member
  • Offline
  • Registered: 2011-05-02
  • Posts: 26

Re: ProgressBar adding some details...

Can u explain me more about it - DOM element?

and the UploadProgress  event?
where is it written?
Thanks..

  • Registered: 2012-01-30
  • Posts: 15

Re: ProgressBar adding some details...

Hi there,

I am trying to achieve the same thing. Unfortunatelly the dom will not be updated with real time data during the upload. The percentage will show up after the upload and progress is always 1%

e.g: 370Kb/s 1% uploaded

The file upload OK though.

Here is my code:

<div id="upload_progress"></div>

...

uploader.bind('UploadProgress', function(up, file) {
   $('#upload_progress').html(parseInt(up.total.bytesPerSec/1024) +'Kb/s ' + (uploader.total.loaded/uploader.total.size) +'% uploaded');
   
});

Thank you for any help.

  • mike
  • Administrator
  • Offline
  • Registered: 2010-10-30
  • Posts: 236

Re: ProgressBar adding some details...

Some of the run-times only push through a progress event at the start and/or end of each file upload.  This is one of the reasons why some people choose chunking, essentially splitting files into smaller "virtual files" and getting additional progress reports as a result.

  • Registered: 2012-01-30
  • Posts: 15

Re: ProgressBar adding some details...

I am using following uploader

var uploader = new plupload.Uploader({
        runtimes : 'gears,html5,flash,silverlight,browserplus',
        browse_button : 'filepicker',
        container: 'uploader',
        max_file_size : '10mb',
        url : '/x_dev/picload/examples/upload.php',
        max_file_size : '10mb',
        chunk_size : '1mb',
        unique_names : true,

        // Resize images on clientside if we can
        resize : {width : 1000, /*height : 400,*/ quality : 90},
        // Specify what files to browse for
        filters : [
            {title : "Image files", extensions : "jpg,gif,png"}
            /*{title : "Zip files", extensions : "zip"}*/
        ],    
        flash_swf_url : '/x_dev/picload/js/plupload.flash.swf',
        silverlight_xap_url : '/x_dev/picload/js/plupload.silverlight.xap'
});

might be gears? The config suggests that I am already using chungs, but the size is 1mb. Does it make sense to put it to 100kb?

  • mike
  • Administrator
  • Offline
  • Registered: 2010-10-30
  • Posts: 236

Re: ProgressBar adding some details...

Try whatever you like.  I'd be surprised if you are using gears.  Look at the custom example that comes with plupload to see how to print out the runtime being used.