8.4 Example: Click to tick! 221By applying the new techniques associated with HTML5, we created an indepen-
dent program that uses the browser as a kind of runtime environment. Hardware
as well as software and the operating system of the device become secondary; the
browser is the central component for executing the program. Modern operating
systems, such as Google’s ChromeOS or Palm’s webOS, count on this technique.
By using the offline storage and the .appcache file, the program is equipped with
an automatic update function—a true joy for developers.
Figure 8.6 shows the game in action: In this round, six out of eight places were
successfully located in downtown Paris. Not bad!
Figure 8.6 The program “Click to tick!” during a game
8.4.1 Using the Application: As a Player
When starting the application, the browser loads the playing area on the left with
an interactive map section containing the targets to be located. On the right, the
browser displays a selection list with the available games and the current score.
If the user has played the game before, he or she can also see the maximum per-
centage scored and the number of games played. As you can see in Figure 8.6,
the game also shows whether the browser is currently connected to the Internet
or not. If Internet access is possible, a button for updating the game is visible
(Check for new games!).