Wildhoney/EmberDroplet

Reset uploadedFiles after upload

Closed this issue · 6 comments

What's going to be the best way to reset uploadedFiles after the uploads have completed?

I'm trying to provide some user feedback and while the uploadStatus.uploading is fine while the files are being uploaded, it disappears several seconds before the files actually reappear in my app. So, I'm trying to use uploadedFiles to display when the files are being uploaded, but it never resets after the files have been uploaded so I was trying to do it manually.

This code works:

didUploadFiles: function(response) {
  this.set('uploadedFiles', null);
  var images = this.store.findAll('image');
}

But then while trying to upload more files, uploadedFiles never shows up again, I broked it until I refresh the browser of course. :-)

Or perhaps there's a better way to do this? I'll keep looking myself and let you know if I find something.

Why do they disappear "several seconds before the files actually reappear in my app"?

In those cases I think it's probably best if you add your own variable. For example, the percentage will show the uploading status, whereas to be truly complete – when all processing has finished, then you should define your own variable.

That's all assuming you know when the images are going to appear in your app.

They disappear, I'm assuming, once the've been uploaded, i.e., ember-droplet has handed them completely off to the Rails backend, however, it takes several seconds for the Rails backend to process them before they get handed back to Ember, in which time, it appears to the user as though nothing is happening. And we all know it takes less than a millisecond for most users to get restless and start doing things like hitting the "back" button, "refreshing", "setting themselves on fire and running through the house screaming", etc. ;-)

I know when they've appeared in the app using the didUploadFiles callback, but I have nothing, that I know of, to indicate that a new upload has started. uploadedFiles doesn't get reset and it appears that uploadStatus.percentComplete doesn't get reset either. I'm talking about the case where someone has already uploaded files, that completes, and then they try to upload more files.

😆

Before you invoke uploadAllFiles can you not this.set('uploading', true) and then this.set('uploading', false) in didUploadFiles?

Ah, yes, that works. Silly me. For now, I've changed the Ember-Droplet mixin code, but how do I invoke the uploadAllFiles from within one of my own actions? I'm assuming this is what you mean. When the user pushes the magic upload button the action is:

doUploadAllFiles: function() {
  this.set('uploading', true);
  // invoke uploadAllFiles somehow
}

BTW, I have added $ember.set(this, 'uploadStatus.percentComplete', 0) to your _addSuccessListener method. Not sure if you want to implement this yourself, but it seemed to be missing.

If doUploadAllFiles is in your controller, and your controller implements the Droplet mixin, then you can just invoke it straight away: this.uploadAllFiles() or with Ember's send: this.send('uploadAllFiles').

Awesome, just found it myself, too. So here's my code:

App.ImagesController = Ember.Controller.extend(DropletController, {

    ---snip---

    uploading: false,

    didUploadFiles: function(response) {
        this.set('uploading', false);
        var images = this.store.findAll('image');
    },

    actions: {
        doUploadAllFiles: function() {
            this.set('uploading', true);
            this.send('uploadAllFiles');
        }
    }
});

Thanks again for your help.