Uppy: Pause/resume uploads

Created on 9 Mar 2016  路  17Comments  路  Source: transloadit/uppy

There are some circumstances a button/possibility to manually pause a large, long time running upload and resume it afterwards would be really helpful:

  1. total upload bandwidth is limited and one need it for other things
  2. one is leaving office/home and change the network (WIFI->3G) and had to pay for traffic/has limited traffic per month
  3. a combination of 1) and 2): one is leaving office/home and change the network (WIFI->3G) and the upload bandwidth is smaller but one need t for other things
  4. other uploads have higher prio and should use it's bandwidth
  5. as a possibility to communicate that an upload is able to be resumed
    (to the user who does not know that this is possible)
  6. ...

don't know exactly if this kind of button/possibility may be also interesting for other "not from local" uploads (for other reasons)

Feature UI 馃挰 Discussion

All 17 comments

I like it. Good thinking about (5)! This could be part of the Tus10 Plugin I feel. For other uploaders, it would just break of course :)

I guess for the tus-js-client this would just be an abort, as it's inherent we can pick up later, so it's mostly an Uppy thing, making sure the files stay selected, and to not signal the backend that we have given up.

similar to Icons /symbols for filetypes (see https://github.com/transloadit/uppy/issues/61)
also for these buttons font awesome (FA) icons could be used:

start/resume:
e.g. https://fortawesome.github.io/Font-Awesome/icon/play-circle-o/

pause:
e.g.https://fortawesome.github.io/Font-Awesome/icon/pause-circle-o/

delete:
e.g.
https://fortawesome.github.io/Font-Awesome/icon/trash-o/
or
https://fortawesome.github.io/Font-Awesome/icon/ban/

of course there are also other icons and other versions of each available in FA...

I think we'll want to avoid adding FontAwesome as a dependency and use tags where possible, correct @arturi @hedgerh? If so I'm sure we can find good alternatives though

of course it's always fine to avoid dependencies!

Since many websites already use this for other things on their sites,
it would just be nice to have an easy possibility to enable usage of it,
because with this everything easily looks nice and "all of a piece". Of course with it it's not that individual anymore, but one can easily change colors, border, background and make thinks like making them rotating, generate new icons by stacking available ones together...
if interested just have a look at https://fortawesome.github.io/Font-Awesome/examples/

maybe one can make a small package of only the needed icons and include this directly into uppy package.
Not sure yet about how and about licences but it looks interesting
e.g.:
https://stackoverflow.com/questions/18225954/use-fontawesome-icon-in-svg-without-external-files

Nice find. Yeah, just to give you an idea, we can currently set icons like so: https://github.com/transloadit/uppy/blob/master/src/plugins/GoogleDrive.js#L10

Which is really nice in that, users only need to include the Uppy JS build, and that's that. No additional http requests to fetch imagery or fonts from other places. It's also 'bad' if Uppy itself starts fetching assets from different places, so we'd have to ask the user to also add a line for fetching the assets.

This svg approach could still be customized via: .use(GoogleDrive, {icon: 'my own URL location or svg string'})

screen shot 2016-08-09 at 17 44 03

Basic pause/resume is implemented, but there are questions:

  1. Right now we have individual pause/resume buttons. Should the main upload button also turn into pause/resume?
  2. In that case, what happens if you add a file when the upload is in progress? Should it just begin to upload? Then we loose the ability to edit the file. Now the upload button just appears again. If it turns into pause, we鈥檇 need a separate button to indicate the new file is ready for upload too.
  3. We probably want progress for all files together too, like the progressbar, but with speed and ETA?
  4. What happens if Multipart is used instead of Tus? I guess the progress circle remains, but the play/pause button is not displayed, which is an option/flag set by Tus plugin on install. What if two uploaders are used? Should we allow two uploaders or forget about it for now?

Some point from #94 that we have to keep in mind:

3) make sure, upload with network and with this IP changing is working nicely
(e.g. from wlan to 3G to other wlan)

a) -> check implementation
(maybe also with continous automatic build testing?)

b) -> give advise on needs in server configs

1 & 2. I like the idea of a "Pause All" button. I just looked at Google Drive and they have a "Cancel" button that stops all of your uploads. They also start uploads automatically, though.

One solution could be to show both "Upload" and "Pause All" buttons when there are active uploads and uploads that haven't started yet. This is the best way I can think of doing it.

  1. That may be nice to have if it can fit nicely in the UI.
  2. That sounds right regarding the Play/Pause button + progress circles. I'm actually not sure how that would even work if we had two uploaders. How would we specify which files use which uploading protocol? I actually just thought about what we're going to do for remote uploads, as well. Make them resumable or no? I'm not really sure why you'd need to pause it, as opposed to outright cancelling it.
    It also makes me think that maybe we should give some kind of visual indication that a file is not being uploaded from a local source.

1) .... Should the main upload button also turn into pause/resume?

+1
would help a lot e.g.
when loading up several files and go from wlan to mobile -> simply one pause to press

2) In that case, what happens if you add a file when the upload is in progress?

imho: nothing should happen here (so you can use editing file functions)
to start upload one could simply repess the "start upload" button
maybe one should show some kind of hint for this

One solution could be to show both "Upload" and "Pause All" buttons when there are active uploads and uploads that haven't started yet. This is the best way I can think of doing it.

+1

3) We probably want progress for all files together too, like the progressbar, but with speed and ETA?

yeeeees :-) (imho)

maybe with an option to disable it seperately from showing it for each file individually..

btw: current state already looks awseome!!!

taken from:
Some findings in actual state of pause/resume function #114

Pause and resume function is perfect :-)

Just some findings in actual state (10.08.2016) of pause/resume function.
Sure I know everything is in progress...

1) when uploading 2 files and pressing pause for first one -> nothing happens.
But when also pausing second one also first one is paused.

2) when paused showing upload speed is a litte confusing.
What do you think of showing

  • remaining time (based on speed before) this way: "~34s"
  • and "0 kB/s" for speed"
    ?

3) show decimal digits also when ",00" would stop "jumping" of with of line

4) maybe one can think of color/contrast of grey/grey/white..

2016-08-10_14h17_31

I agree that the contrast and appearance of unknown documents is not quite nice.

To improve the contrast, one could set a background-color: rgba(82,82,82,.7); on the .UppyDashboardItem-preview:
2016-12-07-111523_2560x1080_scrot


And I find that removing the document icon makes it even cleaner:
2016-12-07-111716_2560x1080_scrot

I can make a PR with the changes you like the most.

Regarding the upload speed "string jumps", prettier-bytes could be used instead of pretty-bytes.

I feel like this is working properly now, so closing. Also added prettier-bytes. Thanks to all for the discussions here!

Was this page helpful?
0 / 5 - 0 ratings

Related issues

mokutsu-coursera picture mokutsu-coursera  路  3Comments

oyeanuj picture oyeanuj  路  3Comments

NihadOb picture NihadOb  路  3Comments

matthewhartstonge picture matthewhartstonge  路  3Comments

evanoberholster picture evanoberholster  路  3Comments