946173 - Network activity indicator in statusbar is not hi-res

Status: RESOLVED FIXED

(Firefox OS Graveyard :: Gaia::System, defect)

Description

[Tim Guan-tin Chien [:timdream] (please needinfo)]

With a Peak on master build I can see that network activity indicator in statusbar is not hi-res. 

After further investigation I realized we have miss some files

https://github.com/mozilla-b2g/gaia/tree/master/apps/system/style/statusbar/images

file missing:
[e-mail] (APNG file)

extra file:
[e-mail]
[e-mail]
[e-mail]

We would need to audit what are the actual assets being used.

Should block v1.2 coz it looks the same in the tree. Not sure on v1.1.0hd, qawanted.

needinfo on UX for the graphic assets.

Comment 1

[Tim Guan-tin Chien [:timdream] (please needinfo)]

PS quick grep shows all the "flat" and "gif" files should be redundant. APNG images with @1.5x missing should be added in this bug.

timdream:~/repo/gaia master$ grep -r gif apps/system/style/statusbar/
timdream:~/repo/gaia master$ grep -r flat apps/system/style/statusbar/

Comment 2

[Tim Guan-tin Chien [:timdream] (please needinfo)]

According to bug 888184 comment 12 we might need gif in v1.1.0hd and apng in master?

Comment 3

[Jason Smith [:jsmith]]

QA Wanted specifically to see if this reproduces on 1.1 HD on a Helix device.

Comment 4

[Preeti Raghunath(:Preeti)]

Wayne,

Please chime in on 1.1 HD v/s not

Comment 5

[Wayne Chang [:wchang]]

I believe this is not obviously visible on HD/Helix as it has yet to be noticed, but i will check on the device tomorrow.

Comment 6

[Tim Guan-tin Chien [:timdream] (please needinfo)]

(In reply to Wayne Chang [:wchang] from comment #5)
> I believe this is not obviously visible on HD/Helix as it has yet to be
> noticed, but i will check on the device tomorrow.

I can verified that the @1.5x file is being included by the Gaia build script, so we shouldn't have a problem here.

Comment 7

[Tim Guan-tin Chien [:timdream] (please needinfo)]

However I would like to remove extra files in the hd branch so I will ask for approval there.

Comment 8

[Jason Smith [:jsmith]]

Wayne - Is Helix support needed on 1.2?

Comment 9

[Wayne Chang [:wchang]]

(In reply to Jason Smith [:jsmith] from comment #8)
> Wayne - Is Helix support needed on 1.2?

It isn't confirmed currently but it will likely receive an update to either 1.2 or 1.3. The discussion is still ongoing between partners.

Comment 10

[Tim Guan-tin Chien [:timdream] (please needinfo)]

Hi Patryk,

We are missing the following file for the status bar on v1.2 and v1.3/master branch:

[e-mail]
[e-mail]
[e-mail]

Could you help and find the proper person for producing these files? Thanks!

Comment 11

[Mozilla Shepherd (This account is used for automation and doesn't receive bugmail)]

Attachment: mozilla-b2g:v1.1.0hd PR#14388

Comment 12

[Tim Guan-tin Chien [:timdream] (please needinfo)]

Comment on attachment 8342901 [details] [review]
mozilla-b2g:v1.1.0hd PR#14388

Not sure how to see approval here but this patch; there isn't a approval‑gaia‑v1.1.0hd flag.

[Approval Request Comment]
[Bug caused by] (feature/regressing bug #): bug 881157
[User impact] if declined: None, simply make the built image a little bit bigger
[Testing completed]: Yes, verified these files are not referenced anywhere in the code.
[Risk to taking this patch] (and alternatives if risky): none if the above conclusion is right.
[String changes made]: none

Comment 13

[Patryk Adamczyk [:patryk] UX]

Attachment: 2013-12-05-15-27-43.png

Amy, can you please attach the 1.5x version of the transmission arrows, they are in fact fuzzy.

Comment 14

[William Hsu [:whsu]]

Hi, all,

Double check the bug. FYI.
I cannot see the fuzzy icon on V1.1.0hd build.
But I can see the fuzzy icon on M-C build (V1.3)

* Test Build:
+ V1.1.0 hd
 - Gaia:     e11c2e9cf7e9131a667783f909b0a47c866be293
 - Gecko:    http://hg.mozilla.org/releases/mozilla-b2g18_v1_1_0_hd/rev/155c632d4a41
 - BuildID   20131201042201
 - Version   18.0
 => The Network activity indicator is hi-res version

+ V1.3
 - Gaia:     45564d6318cdab2fae2de0eb801308e2bcf4e472
 - Gecko:    http://hg.mozilla.org/mozilla-central/rev/9688476c1544
 - BuildID   20131204040204
 - Version   28.0a1
 => The Network activity icon is fuzzy


Thanks!

Comment 15

[Tim Guan-tin Chien [:timdream] (please needinfo)]

(In reply to Patryk Adamczyk [:patryk] UX from comment #13)
> Created attachment 8342906 [details]
> 2013-12-05-15-27-43.png
> 
> Amy, can you please attach the 1.5x version of the transmission arrows, they
> are in fact fuzzy.

If it's possible please address two other files than only the network indicator.

[e-mail]
[e-mail]
[e-mail]

Comment 16

[Tim Guan-tin Chien [:timdream] (please needinfo)]

Noted that they are network activity and system downloads icons are APNG (animated PNG) files.

Comment 17

[Amy Lee [:amylee] UX]

Attachment: [e-mail]

Hi, 

Attached are the 3 files requested. Please note that the "[e-mail]" looks outdated. We already have the emergency callback icon in our status bar sprite but in case you need it as a separate png, I've attached the updated version. Let me know if you need anything else.

Comment 18

[Jason Smith [:jsmith]]

Comments for 12/5 triage:

Wayne's comment indicates we don't clearly know right now if Helix will update to 1.2 or 1.3. However, we do know that they will likely update to 1.2 or 1.3. It is a confirmed regression. It's debatable right now if this blocks 1.2, but I think this would definitely block 1.3 at a minimum.

Comment 19

[Tim Guan-tin Chien [:timdream] (please needinfo)]

Amy, thanks for highlighting the emergency call situation. However for animations I need APNG (animated PNG) instead of GIF.

Gabriele, where did you get APNG in bug 888184? We simply need 1.5x version of the files you checked-in.

Comment 20

[Amy Lee [:amylee] UX]

(In reply to Tim Guan-tin Chien [:timdream] (MoCo-TPE) (please ni?) from comment #19)
> Amy, thanks for highlighting the emergency call situation. However for
> animations I need APNG (animated PNG) instead of GIF.
> 
> Gabriele, where did you get APNG in bug 888184? We simply need 1.5x version
> of the files you checked-in.

Hi Tim, 

APNG isn't a common file format. Yes, can you please find out who had created the original APNGs? I would like to know what software they used to create them. Thanks

Comment 21

[Tim Guan-tin Chien [:timdream] (please needinfo)]

Gabriele will answer the APNG question :)

Comment 22

[Gabriele Svelto [:gsvelto]]

(In reply to Tim Guan-tin Chien [:timdream] (MoCo-TPE) (please ni?) from comment #19)
> Gabriele, where did you get APNG in bug 888184? We simply need 1.5x version
> of the files you checked-in.

I slowly, painfully assembled them from the existing PNG files or created them from the GIF ones (which involved a lot of pixel-by-pixel twiddling in GIMP to get the transparencies right). So I will provide the following icons, correct me if you need more:

[e-mail]
[e-mail]
[e-mail]
[e-mail]

I can generate them from the existing assets like I did previously. Can I take the bug and provide the fix myself?

Comment 23

[Tim Guan-tin Chien [:timdream] (please needinfo)]

(In reply to Gabriele Svelto [:gsvelto] from comment #22)
> (In reply to Tim Guan-tin Chien [:timdream] (MoCo-TPE) (please ni?) from
> comment #19)
> > Gabriele, where did you get APNG in bug 888184? We simply need 1.5x version
> > of the files you checked-in.
> 
> I slowly, painfully assembled them from the existing PNG files or created
> them from the GIF ones (which involved a lot of pixel-by-pixel twiddling in
> GIMP to get the transparencies right). So I will provide the following
> icons, correct me if you need more:

Ouch.

> [e-mail]
> [e-mail]
> [e-mail]
> [e-mail]
> 
> I can generate them from the existing assets like I did previously. Can I
> take the bug and provide the fix myself?

We are only missing two files

[e-mail]
[e-mail]

I already have a WIP patch for cleaning up extra files, and I would like to update the emergency callback icon too. So it would be easier if you could upload the file here. Thanks :)

Comment 24

[Tim Guan-tin Chien [:timdream] (please needinfo)]

According to Gabriele, the other two files are not animated at all :-/ So we would have to fix that too.

Comment 25

[Amy Lee [:amylee] UX]

(In reply to Tim Guan-tin Chien [:timdream] (MoCo-TPE) (please ni?) from comment #24)
> According to Gabriele, the other two files are not animated at all :-/ So we
> would have to fix that too.

Hi Tim/Gabriele, 

I have the other files as animated gifs (search for network, connecting to wifi) as well. Let me know if these will be needed when creating the APNGs, or if you need any assistance with the graphics

Comment 26

[Jason Smith [:jsmith]]

Discussed offline with Wayne - we have no firm plans right now for Helix support on 1.2. When an update becomes planned for Helix, we'll plan on recommending 1.3. On that regard, moving to 1.3?

Comment 27

[Jason Smith [:jsmith]]

(In reply to Tim Guan-tin Chien [:timdream] (MoCo-TPE) (please ni?) from comment #12)
> Comment on attachment 8342901 [details] [review]
> mozilla-b2g:v1.1.0hd PR#14388
> 
> Not sure how to see approval here but this patch; there isn't a
> approval‑gaia‑v1.1.0hd flag.
> 
> [Approval Request Comment]
> [Bug caused by] (feature/regressing bug #): bug 881157
> [User impact] if declined: None, simply make the built image a little bit
> bigger
> [Testing completed]: Yes, verified these files are not referenced anywhere
> in the code.
> [Risk to taking this patch] (and alternatives if risky): none if the above
> conclusion is right.
> [String changes made]: none

We don't support approvals on 1.1 HD at this time - only blockers can land.

Comment 28

[Gabriele Svelto [:gsvelto]]

Attachment: [e-mail]

Comment 29

[Gabriele Svelto [:gsvelto]]

Attachment: [e-mail]

Comment 30

[Gabriele Svelto [:gsvelto]]

Attachment: [e-mail]

Comment 31

[Gabriele Svelto [:gsvelto]]

Attachment: [e-mail]

Comment 32

[Gabriele Svelto [:gsvelto]]

I've added all the missing assets in APNG format. For those interested to create them here's how I did it: for the icons that had flat versions of the PNG files I just chopped them up and then assembled the resulting animation using this online assembler: http://littlesvr.ca/apng/assembler/assembler.php

For the ones that were present only in animated GIF format I did the folliwing:

- converted the animations into frames using ImageMagick

  convert -coalesce <animation_name>.gif <animation_name>_%d.gif

- turned each file into a PNG image using the contents of the GIF as the alpha channel and setting the color channels to be solid white, in GIMP to the following
 - open one of the resulting GIF files
 - put the image in RGB mode
 - add a mask layer transferring the existing image as grayscale into it
 - disable editing the mask layer
 - fill the color layer with solid white
 - apply the mask layer so that it's transferred to the alpha channel
 - export as a PNG file

- once this is done compress all files (see tools/png_recompress.sh in the gaia repo) and assemble them using the online assembler mentioned above

Comment 33

[Tim Guan-tin Chien [:timdream] (please needinfo)]

(In reply to Gabriele Svelto [:gsvelto] from comment #32)
> I've added all the missing assets in APNG format.

Thank you very much!!

Comment 34

[Tim Guan-tin Chien [:timdream] (please needinfo)]

Amy, upon verifying Gabriele's work I realized we couldn't convert APNG with existing GIF files. The two of his files.

[e-mail]
[e-mail]

did not match the color of the @1x files.

Could you construct the two APNG files with the PNG frames and the website Gabriele mentioned? Thanks!

Eric,

You made the two files in bug 863710 comment 17. Can you help Amy generate these files?

Comment 35

[Gabriele Svelto [:gsvelto]]

(In reply to Tim Guan-tin Chien [:timdream] (MoCo-TPE) (please ni?) from comment #34)
> Amy, upon verifying Gabriele's work I realized we couldn't convert APNG with
> existing GIF files. The two of his files.
> 
> [e-mail]
> [e-mail]
> 
> did not match the color of the @1x files.

Tim how did you check this? I've created those files just like I created all the others so I would be surprised that they don't match. They're now transparent - which the GIFs weren't - so you have to test them against a black background to compare them to the GIFs. Did you do that?

Comment 36

[Tim Guan-tin Chien [:timdream] (please needinfo)]

(In reply to Gabriele Svelto [:gsvelto] from comment #35)
> (In reply to Tim Guan-tin Chien [:timdream] (MoCo-TPE) (please ni?) from
> comment #34)
> > Amy, upon verifying Gabriele's work I realized we couldn't convert APNG with
> > existing GIF files. The two of his files.
> > 
> > [e-mail]
> > [e-mail]
> > 
> > did not match the color of the @1x files.
> 
> Tim how did you check this? I've created those files just like I created all
> the others so I would be surprised that they don't match. They're now
> transparent - which the GIFs weren't - so you have to test them against a
> black background to compare them to the GIFs. Did you do that?

I simply open the @1.5x files in Firefox desktop and compare them with @1x files. It seems like the "dark" area of the bars (or waves) is not entirely opaque, so it doesn't match the color of @1x files when compare it on the gray background Fx given.

It doesn't really matter what color I used as the background to compare -- the user is supposed be able to see the icon on whatever background she/he chooses so we need to ensure the icon looks the same regardless of pixel density. Thanks.

Comment 37

[Gabriele Svelto [:gsvelto]]

(In reply to Tim Guan-tin Chien [:timdream] (MoCo-TPE) (please ni?) from comment #36)
> (In reply to Gabriele Svelto [:gsvelto] from comment #35)
> > (In reply to Tim Guan-tin Chien [:timdream] (MoCo-TPE) (please ni?) from
> > comment #34)
> > > Amy, upon verifying Gabriele's work I realized we couldn't convert APNG with
> > > existing GIF files. The two of his files.
> > > 
> > > [e-mail]
> > > [e-mail]
> > > 
> > > did not match the color of the @1x files.
> > 
> > Tim how did you check this? I've created those files just like I created all
> > the others so I would be surprised that they don't match. They're now
> > transparent - which the GIFs weren't - so you have to test them against a
> > black background to compare them to the GIFs. Did you do that?
> 
> I simply open the @1.5x files in Firefox desktop and compare them with @1x
> files. It seems like the "dark" area of the bars (or waves) is not entirely
> opaque, so it doesn't match the color of @1x files when compare it on the
> gray background Fx given.

You're absolutely right, my mistake.

> It doesn't really matter what color I used as the background to compare --
> the user is supposed be able to see the icon on whatever background she/he
> chooses so we need to ensure the icon looks the same regardless of pixel
> density. Thanks.

Right, I'll re-do them.

Comment 38

[Gabriele Svelto [:gsvelto]]

Attachment: [e-mail]

Comment 39

[Gabriele Svelto [:gsvelto]]

Attachment: [e-mail]

Comment 40

[Gabriele Svelto [:gsvelto]]

I've re-created the [e-mail] and the [e-mail] icons this time properly preserving the opaque color channels of the bars/waves so they appear exactly like the @1x and @2x versions against all backgrounds.

Comment 41

[Tim Guan-tin Chien [:timdream] (please needinfo)]

Attachment: Github: https://github.com/mozilla-b2g/gaia/pull/14624

Thanks Gabriele.

Alive, this is a CSS and image only patch.

Comment 42

[Tim Guan-tin Chien [:timdream] (please needinfo)]

Comment on attachment 8342901 [details] [review]
mozilla-b2g:v1.1.0hd PR#14388

According to jsmith I am not allow to land v1.1hd change.

Comment 43

[Tim Guan-tin Chien [:timdream] (please needinfo)]

master: https://github.com/mozilla-b2g/gaia/commit/ca82b55fe4b93b7706836406d91bc87e5dca89e5

Comment 44

[William Hsu [:whsu]]

Verified this patch on M-C.
Attaching the screenshot.(2013-12-18-22-47-44.png)

* Test Build:
 - Gaia:     e2f0e09e980b1cb3275a0bb033931cb48f9d521c
 - Gecko:    http://hg.mozilla.org/mozilla-central/rev/862cb6a1cc88
 - BuildID   20131218040201
 - Version   29.0a1

Comment 45

[William Hsu [:whsu]]

Attachment: 2013-12-18-22-47-44.png

Comment 46

[William Hsu [:whsu]]

Please remove the V1.3+ flag (blocking-b2g) if we don't need to uplift the patch to V1.3.
Thanks.

Comment 47

[John Ford [:jhford] CET/CEST Berlin Time]

Uplifted ca82b55fe4b93b7706836406d91bc87e5dca89e5 to:
v1.3: 6a7f2d0f45d8b838aa69d667b447bdaa561f2f6c

Comment 48

[William Hsu [:whsu]]

Thank you John! :)