transfer icon indicating copy to clipboard operation
transfer copied to clipboard

Progress bars

Open danth opened this issue 3 years ago • 9 comments

Description

Display a progress bar for ongoing downloads.

Hopefully this can be implemented within the files app, showing the progress bar in the place where the file would appear if it already existed.

Use case

Provides live feedback to the user so that they know what is happening.

danth avatar Apr 07 '22 13:04 danth

That's a great idea, as currently we do not have any sign of download status once the link has been sent to download in the background (and the download delay is pretty high?).

You could maybe use the same style as the Nextcloud Files upload progress bar ? Adding maybe the real-time download speed and the ETA instead of the text "quelques secondes" ("few seconds") ?

image

TtuxX avatar Apr 08 '22 14:04 TtuxX

Including the transfer speed will be useful, if it is possible to retrieve that information from the code which handles the download.

I thought the progress bar could be displayed within the file list, something like this (borrowed your image):

Transfer progress bar mockup

And appear for other users if the folder is shared, so that they can also view the progress and know that the file name is already used.

What do you think?

danth avatar Apr 08 '22 14:04 danth

This is a great idea, I like your mockup a lot !! :)

To continue on your idea: regarding the icon (preview) of the file, given that it cannot be generated before download, you could maybe do one of these two things:

  • Use the default builtin Nextcloud icon matching the MineType of the file extension
  • Replace the preview/icon with a "downloading" icon, that will make the download status more understandable and fun to watch to the user (image https://animated-gif-creator.com/images/01/best-mattress-for-me-whats-fits-for-your-sleeping-style_85.gif)

TtuxX avatar Apr 08 '22 15:04 TtuxX

I'd say a downloading icon is better. The icon could be still when the download is queued, and become animated when it is in progress.

danth avatar Apr 08 '22 15:04 danth

How is the status on this? :) This feature would be massively useful for me because I transfer ≈ 50 GB files.

devnoname120 avatar Jun 02 '22 11:06 devnoname120

I don't have enough time to work on this right now, but I'd be happy to accept a pull request :)

danth avatar Jun 06 '22 10:06 danth

I'd like to add one more aspect to this.

When the transfer dialog is submitted, a dummy file should be created immediately with a status like "Job waiting 04:20" where the time until the next cron job is shown live. When the download is running, the wait message would be replaced by the progress bar.

This would give users a little more feedback. When I start any process, I always like to know that the system is working on it and when I can expect a result. This could also be a first step towards solving #10.

z0rgster avatar Sep 06 '22 08:09 z0rgster

I agree a placeholder should appear as soon as a transfer is requested - and it should block creation of other files with the same name.

However I think simply saying "Queued" would be a more appropriate message. There could be several other transfers waiting to start in the same cron job - so the download would not necessarily begin at the predicted time.

danth avatar Sep 06 '22 14:09 danth

The new files list in Nextcloud 28 should make this a lot easier to implement, since at a glance it appears we can now add things to the list without having to resort to workarounds.

The following things need to be done to get it working:

  • Keep track of transfers in the database
  • Provide a way to request the list of in progress transfers
  • Automatically check each time a folder is opened, and display any transfers we find

Then we can work on showing extra information like progress bars and the position in the queue.


Pseudocode for the client side:

import { emit } from '@nextcloud/event-bus'
import { Entry } from '@nextcloud/files'

// Define new class inheriting from Entry
// https://nextcloud-libraries.github.io/nextcloud-files/interfaces/Entry.html

function whenFolderLoaded() {
  // Load list of transfers
  
  for (transfer in transfers) {
    // Construct our class with the data of the transfer
    emit('files:node:created', entry)
  }
}

danth avatar Dec 14 '23 22:12 danth