Closed Bug 946173 Opened 6 years ago Closed 6 years ago

Network activity indicator in statusbar is not hi-res

Categories

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

x86
macOS
defect
Not set

Tracking

(blocking-b2g:1.3+, b2g18 wontfix, b2g-v1.1hd unaffected, b2g-v1.2 affected, b2g-v1.3 fixed)

RESOLVED FIXED
blocking-b2g 1.3+
Tracking Status
b2g18 --- wontfix
b2g-v1.1hd --- unaffected
b2g-v1.2 --- affected
b2g-v1.3 --- fixed

People

(Reporter: timdream, Assigned: timdream)

Details

(Keywords: regression, Whiteboard: [FT:System-Platform])

Attachments

(8 files, 3 obsolete files)

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:
network-activity@1.5x.png (APNG file)

extra file:
network-activity-flat@1.5x.png
network-activity@1.5x.gif
signal-searching@1.5x.gif

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.
Flags: needinfo?(firefoxos-ux-bugzilla)
Assignee: timdream → nobody
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/
According to bug 888184 comment 12 we might need gif in v1.1.0hd and apng in master?
QA Wanted specifically to see if this reproduces on 1.1 HD on a Helix device.
Wayne,

Please chime in on 1.1 HD v/s not
Flags: needinfo?(wchang)
Flags: needinfo?(wchang) → needinfo?(whsu)
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.
(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.
Flags: needinfo?(whsu)
Keywords: qawanted
However I would like to remove extra files in the hd branch so I will ask for approval there.
Assignee: nobody → timdream
Wayne - Is Helix support needed on 1.2?
Flags: needinfo?(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.
Flags: needinfo?(wchang)
Hi Patryk,

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

emergency-callback_icon_notification@1.5.png
network-activity@1.5x.png
system-downloads@1.5x.png

Could you help and find the proper person for producing these files? Thanks!
Flags: needinfo?(firefoxos-ux-bugzilla) → needinfo?(padamczyk)
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
Attachment #8342901 - Flags: review?(alive)
Attached image 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.
Flags: needinfo?(padamczyk) → needinfo?(amylee.design)
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!
(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.

emergency-callback_icon_notification@1.5.png
network-activity@1.5x.png
system-downloads@1.5x.png
Noted that they are network activity and system downloads icons are APNG (animated PNG) files.
Hi, 

Attached are the 3 files requested. Please note that the "emergency-callback_icon_notification@1.5.png" 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.
Flags: needinfo?(amylee.design)
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.
Attachment #8342901 - Flags: review?(alive) → review+
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.
Flags: needinfo?(gsvelto)
Flags: needinfo?(amylee.design)
(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
Flags: needinfo?(amylee.design)
Flags: needinfo?(timdream)
Gabriele will answer the APNG question :)
Flags: needinfo?(timdream)
(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:

network-activity@1.5.png
signal-searching@1.5.png
system-downloads@1.5x.png
wifi-connecting@1.5x.png

I can generate them from the existing assets like I did previously. Can I take the bug and provide the fix myself?
Flags: needinfo?(gsvelto)
(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.

> network-activity@1.5.png
> signal-searching@1.5.png
> system-downloads@1.5x.png
> wifi-connecting@1.5x.png
> 
> 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

network-activity@1.5x.png
system-downloads@1.5x.png

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 :)
According to Gabriele, the other two files are not animated at all :-/ So we would have to fix that too.
(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
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?
blocking-b2g: koi? → 1.3?
(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.
blocking-b2g: 1.3? → 1.3+
Keywords: regression
Whiteboard: [FT:System-Platform]
Attached image signal-searching@1.5x.png (obsolete) —
Attached image wifi-searching@1.5x.png (obsolete) —
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
(In reply to Gabriele Svelto [:gsvelto] from comment #32)
> I've added all the missing assets in APNG format.

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

wifi-connecting@1.5x.png
signal-searching@1.5x.png

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?
Flags: needinfo?(epang)
Flags: needinfo?(amylee.design)
(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.
> 
> wifi-connecting@1.5x.png
> signal-searching@1.5x.png
> 
> 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?
(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.
> > 
> > wifi-connecting@1.5x.png
> > signal-searching@1.5x.png
> > 
> > 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.
(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.
> > > 
> > > wifi-connecting@1.5x.png
> > > signal-searching@1.5x.png
> > > 
> > > 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.
Attachment #8345871 - Attachment is obsolete: true
Attachment #8345802 - Attachment is obsolete: true
I've re-created the wifi-connecting@1.5x.png and the signal-searching@1.5x.png 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.
Thanks Gabriele.

Alive, this is a CSS and image only patch.
Attachment #8346978 - Flags: review?(alive)
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.
Attachment #8342901 - Attachment is obsolete: true
Attachment #8346978 - Flags: review?(alive) → review+
Flags: needinfo?(epang)
Flags: needinfo?(amylee.design)
master: https://github.com/mozilla-b2g/gaia/commit/ca82b55fe4b93b7706836406d91bc87e5dca89e5
Status: NEW → RESOLVED
Closed: 6 years ago
Resolution: --- → FIXED
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
Please remove the V1.3+ flag (blocking-b2g) if we don't need to uplift the patch to V1.3.
Thanks.
Uplifted ca82b55fe4b93b7706836406d91bc87e5dca89e5 to:
v1.3: 6a7f2d0f45d8b838aa69d667b447bdaa561f2f6c
Thank you John! :)
You need to log in before you can comment on or make changes to this bug.