(a) the main page is being generated from static HTML as a jQuery-Mobile (jQM) page with header, footer and content as a jQM (unordered) listview <ul>...</ul> with list item link content <li>...</li> being dynamically generated for each picture.
Here´s the static HTML to which each link is added:
Here's the dynamic part that gets fed to Underscore to fill out the <%= %> placeholders and when done to enclose the outermost div block of the "cartTemplate" within an li element and add to the above <ul> element with id "menuContent":
(b) the content pages of pictures with sound are being added to the body element of the page as jQM pages with header, footer and content containing img and usemap elements.
Here's the static HTML to which each picture content is added:
...
Here´s the dynamic part that gets fed to Underscore to fill out the <%= %> placeholders and when done to enclose the 3 outermost div blocks of the "itemTemplate" within a div element marked as a jQM page - data-role="page" - and add to the above <body> element with id = "pages":
So lets see the jQM-style result in the browsers, this time without sound but with a pop transition on picture selection and with splash screen from:
http://tutorialzine.com/2010/11/apple-style-splash-screen-jquery/
Windows Phone 7 (SDK 7.1 emulator)
Conclusion:Works well - big improvement from before. Picture selection fine. Transitions are not particularly convincing - flip back from picture to main menu for example is weak.
Android (AVD Manager v 4.1 emulator)
Conclusion: As before works well. Transitions much better than before - flip, for example, more convincing - but there's a transition flicker on initial selection of a picture.
iPod touch (simulated with Safari Desktop Browser)
Conclusion. Still works well. Still the most polished of the browsers.
Overall Conclusion: JQM with Backbone and Underscore have helped create a viable cross-browser app with a consistent look and feel. This approach has fixed the bugs previously found in Windows Phone 7 - good news :-) Its not perfect, though, and we'll have to wait on future jQM releases to improve the experience of transitions on Windows Phone and Android for example, but the app is perfectly useable. Next stop add sound and publish to App Marketplace.
Keine Kommentare:
Kommentar veröffentlichen