rstrong's blog

Application Update billboard

March 14th, 2010 by rstrong

Previously, when the Application Update billboard is created for a release the billboard’s size had to be verified for each locale and platform since they determined the size of the billboard in the user interface. This was, to say the least, not a simple task and the people that had to perform this task could have instead been focusing on other important tasks, especially when we are trying to get a release out the door. The billboard page also has buttons that aren’t always displayed, so localizers were unable to properly determine the width of the user interface. For example, there were several locales that specified a width that was too small when all of the buttons were displayed. This made it so the localizers had to quickly patch previous releases of their locale to increase the width so the buttons would be completely displayed.

Even with these efforts the billboard size would be different than expected if the user changed their system to use non-default fonts. To lessen the work required to create the billboard and prevent the user interface from not being wide enough on some locales, the dimensions of the Application Update user interface is no longer localized and the dimensions of the billboard is the same for all locales and platforms. Another long standing request for the billboard that is now fixed is to extend the billboard to fit the available space. These changes landed on trunk on 3/11 in Bug 480178 [Toolkit] – Billboard should extend to available space and the update UI should be the same width for all locales [All] and the changes will likely be backported to mozilla-1.9.2 (e.g. Firefox 3.6.x) and mozilla-1.9.1 (e.g. Firefox 3.5.x) though the specific version where these changes will be backported to has not been decided yet.


The before / after comparison of the button strip for the ka locale below shows how the user interface can easily be too narrow and how the new width solves this problem.




Besides the changes described previously the appearance of the buttons on Mac OS X have also been changed and in my opinion greatly improved (thanks go out to Alex Faaborg for this). There are also user interface screenshots on Windows, Mac OS X, and Linux available in Bug 480178.





I haven’t finished the wiki page for these changes yet so I have included a brief summary below… I’ll include a link to the wiki in a future blog post after I have finished the pages:

• The size of the billboard is 700px for the width and 360px for the height for all locales and platforms. The actual width on Windows and Linux ends up being 701px and iirc Mac OS X ends up having a width of 701px and a height of 361px. XUL often adds an extra pixel when specifying the width or height for a child element and allowing the rest of the UI to auto size. So, going with a 700px width by 360px height billboard will be safe.
• The existing method of testing using the app.update.url.override preference can still be used but it now requires new attributes. There is a sample of the update xml available in Bug 480178 in attachment 430898. I’ll blog about the new attributes in the near future as well as update the wiki page for the update xml.
• There is a new method for testing the billboard (this also displays the three possible buttons for this page) by adding a new string preference named app.update.billboard.test_url with a value of the path to the billboard’s html. The path when testing using this method supports file:// urls as well as http(s):// urls. Clicking any of the buttons when testing with this method will close the user interface instead of carrying out their normal action.
• By specifying an attribute named zoomOutToFit on the body of the billboard it will zoom out to fit using full zoom for the width (zoomOutToFit=”width”), the height (zoomOutToFit=”height”), or both the width and height (zoomOutToFit=”both”) when the billboard html extends beyond the available space. In the css for the billboard, overflow should be set to hidden when using this method since even with zooming out the billboard may still display scroll bars. This will decrease the size of images, hence it isn’t recommended… though it might come in handy for locales where the text requires more space. If you use this method you should also test it with the billboard html you are using it with to verify that it works as you are expecting.

In the near future I will also be fixing Bug 548061 [Toolkit] – Billboard should handle 404 (other errors?) for billboard better [All]. This will require an attribute on the billboard’s html body so that Application Update can verify that the page wasn’t redirected as can be the case when using a hotel’s wifi, etc.


I also filed Bug 548764 [Toolkit] – The non-billboard pages need UI redesign [All] to improve the remainder of the Application Update user interface pages.


Thanks goes out to Alex Faaborg for the user interface design / guidance and to Dave Townsend for the quick turnaround on the review so the changes could land in time for the next Developer Preview release.

Posted in Mozilla    3 Comments

3 Responses to “Application Update billboard”

1. on 14 Mar 2010 at 4:29 am   Ms2ger
   
   

   “and mozilla-1.9.1 (e.g. Firefox 3.6.x)”: s/6/5/?

2. on 14 Mar 2010 at 4:36 am   rstrong
   
   

   Thanks and fixed

3. on 14 Mar 2010 at 8:56 am   Teoli
   
   

   Good work! I do especially like the look on Mac OS. It gives a very professional feeling. Really nice.
   (Now I’m waiting for the extension Update Channel Selector to be adapted, but that’s not important )

   Fx.next is really taking a good shape on Mac OS, UI-wise.