[upload] Add clearComplete method

[davidmaxwaterman]

Please consider adding a clearComplete() method; this seems to work:

    clearComplete: function() {
      this.files = this.files.filter(function(file) { return !file.complete; });
    },

In my app, the vaadin-upload element is part of a dialog. I want to declutter the UI on subsequent open()s but removing the completed uploads (my theory is that the user will want to retry the failed uploads, but doesn't need to see the successful uploads).

[jouni]

Yeah, this is something I’ve been designing in my head also. Having the method available is an easy first step. Maybe we can add a parameter for the function to indicate whether failed uploads should also be cleared?

Once we have the method, we can start thinking if we want to add a button to the default template for the element for this.

As for your use case, I’m wondering if you should still leave it for the user themselves to clear the list. Or is there some other way for the user to verify that they have uploaded a certain file?

[davidmaxwaterman]

Actually, the reviewer of my work doesn't quite 'get' this UI - the aspect where it is kind of like a browser's 'Downloads' dialog. I think he wants it to be completely clear each time it comes up, but I don't quite agree and just clearing the completed ones is my compromise.

Ideally, it would be good to have them automatically removed, perhaps after so many seconds. I guess there's scope for an attribute to do this.

BTW, my reviewer wants other changes too which seems to mean I will need to keep my fork 'live', but I'm keen to get applicable changes moved 'upstream', so to speak. For example, he found the 'X' icon confusing on each file's line - he expected that to remove the file from the server, not just from the list of files being uploaded (I think this expectation comes from his use of a UI which is more like a CMS that does allow deleting uploaded files). So, I have remove the paper-icon-buttons and replaced them with plain paper-buttons with 'Abort' and 'OK', hidden according to file.complete). Of course, these needed styling to match the rest of our UI - I could probably have added a css variable for this, but I just hard-wired it into vaadin-upload-file for now.

[jouni]

Excellent, thank you for explaining your needs in more detail – this is the type of feedback we need more often :)

I’ve already started the design work for a new version where the UI could change, and I have some similar concerns about the current UI as your reviewer. Also, I’ve been planning that we should split the element into at least two parts, one for the file selector/uploader and one for the progress list, which would allow the developer to choose where to display those and maybe customize more easily.

[davidmaxwaterman]

Is it possible to make sure all the buttons are slots, and have slots before and after them? I'm not sure how this would work for the user specifying slots in vaadin-upload, when the slots need to be inside vaadin-upload-file - perhaps the vaadin-upload slots can be placed as light dom in vaadin-upload-file element, though that is in a dom-repeat, so I can't see that working (except for the first one), unless it's done by javascript or something.

[davidmaxwaterman]

I have hit a problem where DnD doesn't work with the version of vaadin-update I forked, and so I seem to need to revert to the upstream version, but this function isn't defined.
Is there any chance this can be merged? It's such a small change...