Progress information for TUniFileUpload

[bbm]

Hi,

 

is there any way to get progress information during uploading big files?

 

Best regards.

 

 

[Sherzod]

Hi,

 

You can open a ticket in support portal, we will try to implement this feature

[Sherzod]

I opened a ticket in our support portal

[bbm]

Hi,

 

thank you very much.

 

Best regards

[kkelchev]

Hi do you have progress with this.

I hava a same issue when uploading bigger files like DICOM (XRay) images.

Just a callback progress event into TUniFileUpload will be perfect.

Thanks.

[bbm]

Hi,

 

currently there are no new information.

I have an additional problem. When the file is very big and the connection is slow the Upload stops with nor error message.

 

Best regards 

[Sherzod]

I hope that this feature will be added soon

 

 

[bbm]

Sounds good, thank you

[kkelchev]

Will be perfect

[55143681]

Browse and upload buttons should join to one button.

[Sherzod]

Browse and upload buttons should join to one button.

 

This will cause the pop-up window to appear, which in turn can be blocked by the browser

[mhmda]

Perfect. +1

[Tokay]

we've made script for upload with help of drag-drop from sample from forum with progress:

<script type="text/javascript">

  // set vars (RUN = DoInit, ajaxtarget = Target for ajaxRequests, dropbox = dropbox Element for events):

  var RUN = false;
  //!!! var ajaxtarget = fraMultiUpload.hfrDropbox;
  //!!! var dropbox = document.getElementById( fraMultiUpload.pnlDropbox.id );

  function dragEnter( evt ) {
    evt.stopPropagation();
    evt.preventDefault();
  }

  function dragExit( evt ) {
    evt.stopPropagation();
    evt.preventDefault();
  }

  function dragOver( evt ) {
    evt.stopPropagation();
    evt.preventDefault();
  }

  function drop( evt ) {
    evt.stopPropagation();
    evt.preventDefault();
    // get Files and Count:
    var files = evt.dataTransfer.files;
    var count = files.length;
    // Only call the handler if 1 or more files was dropped:
    if (count > 0) {
      handleFiles( files );
    }
  }

  function initEventHandlers() {
    // set EventHandlers for dropbox for drag and drop:
    dropbox.addEventListener( "dragenter", dragEnter, false );
    dropbox.addEventListener( "dragexit", dragExit, false );
    dropbox.addEventListener( "dragover", dragOver, false );
    dropbox.addEventListener( "drop", drop, false );
  }

  function removeEventHandlers() {
    dropbox.removeEventListener( "dragenter", dragEnter, false );
    dropbox.addEventListener( "dragexit", dragExit, false );
    dropbox.addEventListener( "dragover", dragOver, false );
    dropbox.addEventListener( "drop", drop, false );
  }


  function handleFiles( droppedFiles ) {

    var isAdvancedUpload = function () {
      var div = document.createElement( 'div' );
      return (('draggable' in div) || ('ondragstart' in div && 'ondrop' in div)) && 'FormData' in window &&
             'FileReader' in window;
    }();

    if (isAdvancedUpload) {
      var fd = new FormData();

      for (var a = 0; a < droppedFiles.length; a++) {
        var file = droppedFiles[a];
        fd.append( "files[]", file, file.name );
      }

      //check total files size
      for (var i = 0, size = 0; i < droppedFiles.length; i++) size += droppedFiles[i].size;

      if (size > 1024 * 1024 * 1024) {
        ajaxRequest( ajaxtarget, "upload_warn_max_file_size" );
        return false;
      } else {
        ajaxRequest( ajaxtarget, "upload_start" );
      }

      var $progress = $( '<progress id="uni-upload-progress" max="100" value="0">0%</progress>' );

      $progress.css( {
        display: "block",
        margin: "auto",
        position: "relative",
        top: "94px",
        width: "300px",
        height: "20px"
      } );

      $( dropbox ).find( "[data-ref=innerCt]" ).append( $progress );

      $.ajax( {
        xhr: function () {
          var xhr = new window.XMLHttpRequest();

          function progress( evt ) {
            if (evt.lengthComputable) {
              var percentComplete = evt.loaded / evt.total;
              //Do something with download progress
              $progress.text( (percentComplete * 100).toFixed( 2 ) + "%" ).val( percentComplete * 100 );
              // ajaxRequest( ajaxtarget, "upload_progress", ['percentComplete='+percentComplete] );
            }
          }

          xhr.upload.addEventListener( "progress", progress, false );

          xhr.addEventListener( "progress", progress, false );
          return xhr;
        },
        url: "/HandleEvent?action=uni-multiupload",
        type: "POST",
        data: fd,
        cache: false,
        timeout: 0,
        processData: false,  // tell jQuery not to process the data
        contentType: false,   // tell jQuery not to set contentType
        //data - data returned from server
        success: function ( data, textStatus, jqXHR ) {
          if (typeof data.error === "undefined") {
            // Success so call function to process the form
            ajaxRequest( ajaxtarget, "upload_complite_success" );
          }
          else {
            //we can handle errors on server side or send to client JSON {"error":"some error text"}
            // received data from server in
            ajaxRequest( ajaxtarget, "upload_complite_error_server" );
          }
        },
        error: function ( jqXHR, textStatus, errorThrown ) {
          // files dont sended
          ajaxRequest( ajaxtarget, "upload_error_transport", ["message=" + textStatus] );
        },
        complete: function () {
          // last trigger after success and errors
          // hide progressbars or everything else
          ajaxRequest( ajaxtarget, "upload_complite_finaly" );
          setTimeout( function () {
            $progress.remove();
          }, 5000 );

        }
      } );

    } else {
      console.log( 'Browser dont support FormData object or drop event' );
    }

  }

  if (RUN == true) {
    initEventHandlers();
  }
</script>

procedure TUniForm1.hfrDropboxAjaxEvent(Sender: TComponent; EventName: string; Params: TUniStrings);
begin
 if EventName = 'upload_start' then
  Inc(FCounter);
 if EventName = 'upload_complite_success' then
  Dec(FCounter);
 if EventName = 'upload_complite_error_server' then
 begin
  ShowMakhDlg('Error occured while uploading process');
  Dec(FCounter);
 end;
 if EventName = 'upload_complite_finaly' then
  ShowMakhDlg('Upload compilted');
 if EventName = 'upload_warn_max_file_size' then
 begin
  ShowMakhDlg('You can upload a file with size more than 1 GB');
  Dec(FCounter);
 end;
end;

[Ruslan]

if you work on this - so I think you should implement multiupload tool and show progress by eash file instead improve only one file upload.

[Ruslan]

 

we've made script for upload with help of drag-drop from sample from forum with progress:

url: "/HandleEvent?action=uni-multiupload",

 

Is this standard uniGUI url?

 

hfrDropbox - which component?

[Tokay]

The hfrDropbox is TUniHTMLFrame component.

Original theme you can see here:

http://forums.unigui.com/index.php?/topic/2490-multiple-file-upload/

We catch files here:

UniServerModule.OnHTTPCommand > 

if Assigned(ARequestInfo.PostStream) then

and do parsing of mime format with help of TIdMessageDecoderMIME.

Distributing files by users is doing with help of sessions IDs that coming into OnHTTPCommand  in cookies:

Cookie := ARequestInfo.Cookies.Cookie['UNI_GUI_SESSION_ID', ''];

[Ruslan]

 

The hfrDropbox is TUniHTMLFrame component.

Original theme you can see here:

http://forums.unigui.com/index.php?/topic/2490-multiple-file-upload/

We catch files here:

UniServerModule.OnHTTPCommand > 

if Assigned(ARequestInfo.PostStream) then

and do parsing of mime format with help of TIdMessageDecoderMIME.

Distributing files by users is doing with help of sessions IDs that coming into OnHTTPCommand  in cookies:

Cookie := ARequestInfo.Cookies.Cookie['UNI_GUI_SESSION_ID', ''];

 

 

How you know which user which session have? 

[Tokay]

In any place where you have UniSession you can write:

UniSession.ARequest.Cookies.Cookie['UNI_GUI_SESSION_ID', '].Value;

[Aggie85]

On 8/24/2018 at 7:52 AM, Sherzod said:

I hope that this feature will be added soon

 

 

Has this feature ever been completed / released?

Aggie85