1296554 - Implement "Unknown progress" animation on download button

Status: RESOLVED FIXED

(Firefox :: Downloads Panel, defect, P1)

Description

[KM Lee [:rexboy] (inactivate after Sep. 22)]

Attachment: preview for "unknown progress" in the download button

Upon the latest visual spec,
when there's only downloading files with unknown process,
we need to display that on the icon of download button.
Specifically, the icon of download icon should become an animation
of a blurred white bars keep dropping down inside the arrow.
Please check the attachment.

Comment 1

[:Paolo Amadini]

(In reply to KM Lee [:rexboy] from comment #0)
> Please check the attachment.

This doesn't look very visible, is it an issue with the mockup?

We should keep the implementation simple and maintainable, in particular we should avoid adding new icon files. Maybe just animating the opacity of our current icons could still obtain a valid effect, or we can do something more complex with CSS and the assets we already have in the tree.

Comment 2

[KM Lee [:rexboy] (inactivate after Sep. 22)]

Hi Carol:
Since I've the visual based on same style issue is still under discussing, I set an needinfo here. You can reply me after confirming the visual. 
If you are going to keep the same design, We may need to produce some SVG filter for that.

Paolo:
I'm not sure if we can make exact the same effect without adding a SVG mask. It's true changing opacity or something makes things simpler but I think we need to ask for visual team's comment about that.

Comment 3

[Wesly Huang (EPM)]

still confirming if this is a project MVP, move it to backlog

Comment 4

[:Paolo Amadini]

This is a long-standing quality issue with the Downloads Indicator, we show no indication that a download is in progress if the server does not send the size. Seeing this bug fixed when we switch to the new design would be great and provide definite user value.

Comment 5

[Carol Huang [:Carol]]

(In reply to KM Lee [:rexboy] from comment #2)
> Hi Carol:
> Since I've the visual based on same style issue is still under discussing, I
> set an needinfo here. You can reply me after confirming the visual. 
> If you are going to keep the same design, We may need to produce some SVG
> filter for that.

Hi Rex, I've updated the motion mock-up and spec on Bug 1269956 for "unknown progress"
We can discuss what assets you need to create the animation when you start working on this. thanks!


> Paolo:
> I'm not sure if we can make exact the same effect without adding a SVG mask.
> It's true changing opacity or something makes things simpler but I think we
> need to ask for visual team's comment about that.

Comment 9

[:Paolo Amadini]

With the Photon design for the Downloads Indicator we can easily display the in-progress state for downloads of an unknown size, without any special design treatment like we'd have needed when we filled the arrow vertically.

Comment 10

[:Paolo Amadini]

Attachment: Bug 1296554 - Show a static progress bar for downloads of unknown size.

Review commit: https://reviewboard.mozilla.org/r/170754/diff/#index_header
See other reviews: https://reviewboard.mozilla.org/r/170754/

Comment 11

[:Paolo Amadini]

This can be tested with <https://httpbin.org/stream-bytes/102400>, although currently there is a size limit and the download is quite fast, so the best way to see an effect is to paste the link in the Library window.

Comment 12

[Jared Wein [:jaws] (please needinfo? me)]

Comment on attachment 8899468 [details]
Bug 1296554 - Show a static progress bar for downloads of unknown size.

https://reviewboard.mozilla.org/r/170754/#review175936

I talked with Amy Lee and she was OK with this approach.

Comment 13

[Jared Wein [:jaws] (please needinfo? me)]

<amylee> @jaws My recommendation would have the icon remain grey until the download is completed and then it goes blue at that point and plays the end animation

Comment 14

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/mozilla-inbound/rev/75eda325afa7
Show a static progress bar for downloads of unknown size. r=jaws

Comment 15

[Wes Kocher (:KWierso) (Not reading bugmail; email directly if needed)]

https://hg.mozilla.org/mozilla-central/rev/75eda325afa7