whiteqert.blogg.se

Javascript simpleimage
Javascript simpleimage









But service workers don’t have access to the Canvas API. Normally, the answer to this is simple - the HTML Canvas API lets us draw images locally and read them out as PNG data URLs by using Canvas.toDataUrl(‘image/png’). To add to that, the UK has 650 electoral constituencies, so there’s a chance that a user might have received 650 separate images - downloading over 97MB over the course of the evening. For instance, the Samsung Galaxy S7’s 4x pixel density means a notification image will typically be over 150KB. But the image notifications are much larger, even more so when multiplied by the device’s pixel density. Our previous experiments downloaded remote images for each notification, which worked well for small icon images. With great image comes great (bandwidth) responsibilityĪlthough new, larger image notifications give a much better visual experience than icons, they’re worse in one important area: bandwidth. The vote totals were presented in text, in the collapsed view of the notification, and in a data visualization, in the expanded view using the big image spot to show the totals. Users also had the option to be alerted on results from one or more of the local elections.

#Javascript simpleimage android#

We ended up sending a web notification (to Android users only) that contained live updating results from the major UK parties as they came in throughout the night of June 8–9. What could we put together? The answer turned out to be more complicated than we originally imagined.

javascript simpleimage

Not everyone was happy, but we saw our chance: With six weeks’ notice, we had an opportunity to develop a new test. But in a perfect example of why being a newsroom developer is so interesting, the UK prime minister surprised everyone by calling a snap election in June.

javascript simpleimage

We weren’t sure we were going to have an opportunity to find out. Now, with a larger canvas to play with, we wondered what we could achieve.

javascript simpleimage

This is particularly interesting for us, since in previous experiments we had to cram data visualizations into the icon of the notification. But mobile capabilities are always improving, and since our last experiment Google expanded their Notification API capabilities to add an image attribute, letting you use Android’s BigPictureStyle notification on phones. At the lab, we’ve experimented a lot with the web Notification API.









Javascript simpleimage