Any "Workaround" for (slow) Easyform file uploads?

1

OK, so I made my customer an EasyForm, with fields to upload image(s).
Next, the users complain about it 'beeing slow', which (probably) turns out to be them uploading 'large images'.

Since (these) users 'understand nothing': Are there any practical way to deal with this, is it possible to for example add a progress bar or something else… maybe even a message 'your photo is very big… uploading it to THE INTERNET :slight_smile: !

2

Not a complete idea, but as plone.restapi supports TUS-upload TUS resumable upload — plone.restapi v8.24.2.dev0, with some Javascript probably this could be solved.

3

After some thinking (!), I am not sure how I would do it, since I actually create content with 'the content of the EasyForm', including the image(s), so I would either have to wait for the image to be uploaded before creating the content or 'update the content with the image after it has been updated'. I am not sure how to put 'all that logic in the javascript'.

If I manage: What would happen if they close the browser or the page before the files are uploaded?

As an alternative: Is there any way to 'read the size of the file from within the EasyForm'.
So if a user for example selects a 10Mb file, I could add a message (with a javascript ??) saying: You file is big, it will take 27 secs. to upload so be patient)

4

Like here: JavaScript file upload size validation - Stack Overflow

5

Thanks, will give it a try (soon)

Update. I did a test, and this seems to work

$('#form-widgets-vedlegg1-input').on('change', function() {
    $file1 = this.files[0].size;
    console.log('File size is: ' + $file1 / 1024 / 1024 + 'MB');
});

Not sure why, but this does not seem to work:

$('#form-widgets-vedlegg1-input').on('change', function() {
    $file1 = $('#form-widgets-vedlegg1-input').files[0].size ;
    // or $file1 = $('#form-widgets-vedlegg1-input')[0].files[0].size ;
});
6

So I added some math and a message 'Attachement is XX Mb' and will take up to XX sec to upload.

I will also add a progress bar / spinner.

Question: Is there a way to run a javascript AFTER validation (of the Easyform) has occurred? I dont want to 'give to much feedback at the same time')

(Now, I just bind the javascript to #form-buttons-submit )

7

Slighly related: If one adds big attachment to the EasyForm, it will take a very long time before the validation is complete (so if you choose a 10Mb file on mobile, you might get a validation error of misspelled email after 20 sec).

1 Like