HTML5 iPhone Web Application Development -- Table of Contents -- HTML5 iPhone Web Application Development -- Credits -- About the Author -- About the Reviewers -- www.PacktPub.com -- Support files, eBooks, discount offers and more -- Why Subscribe? -- Free Access for Packt account holders -- Preface -- What this book covers -- What you need for this book -- Who this book is for -- Conventions -- Reader feedback -- Customer support -- Downloading the example code -- Errata -- Piracy -- Questions -- 1. Application Architecture -- Implementing the HTML5 Mobile Boilerplate -- Downloading and installing the HTML5 Mobile Boilerplate -- Integrating the build script -- Creating our application framework -- Modifying the boilerplate -- Customizing our markup -- Customizing our framework -- Creating semantic markup -- Creating the header -- Creating the footer -- Clearing up section -- Structuring our stylesheets -- Global styling -- Defining our global fonts -- Our page layout -- Using content with :before and :after -- Styling our navigation -- Responsive design principles -- Media queries to the rescue -- Responsive images -- Fluid images -- Fluid width images -- Full width images -- Establishing our JavaScript architecture -- Structuring our app functionality -- Namespacing our application -- Immediately Invoked Function Expressions -- Use strict -- Default options -- Defining the constructor -- The prototype -- Defining public methods -- Returning our constructor/function -- Integrating a custom module template -- Including our scripts -- Initializing our framework -- Routing to a mobile site -- Redirecting via PHP -- Redirecting via htaccess -- Home screen icons -- Introducing our build script -- Configuring our build script -- Minifying and concatenating scripts -- Minifying and concatenating styles -- Creating multiple environments.

Navigating our directories -- Building our project -- Summary -- 2. Integrating HTML5 Video -- Configuring the server -- Video formats -- Video format directives -- A simple HTML5 video -- Single video format -- Supporting multiple formats -- Listening to HTML5 video events -- Video markup review -- Attaching video events -- Initializing our video -- Creating a JavaScript video library -- Centralizing our events -- Scope in JavaScript -- Exposing functionality -- Integrating callbacks -- Extending callbacks -- Using callbacks -- Tying it all up -- Customizing HTML5 video controls -- Summary -- 3. HTML5 Audio -- Server configuration -- Audio formats -- Audio format directives -- Simple HTML5 audio integration -- MediaElement abstraction -- Creating App.MediaElement.js -- Initializing App.MediaElement.js -- Extending the MediaElement API for audio -- The base template -- Creating an instance of MediaElement -- Finding and caching an audio element -- Initializing MediaElement -- Dynamic audio player -- The select element -- Switching audio tracks -- The change event listener -- The change event handler -- Refactoring our code -- Initializing our Audio class -- Customizing HTML5 audio controls -- Creating custom media controls -- Adding interactivity to our customized controls -- Sequential playback -- The markup -- The JavaScript -- iOS considerations -- Volume -- Autoplay -- Simultaneous playback -- Summary -- 4. Touch and Gestures -- Simplifying the navigation -- Navigation markup and styling -- The basic template -- Styling a select component -- Navigation interactivity -- The basic template -- Caching our navigation -- Listening and handling the change event -- Initializing the navigation -- Touch and Gesture events -- Touch events -- On scroll -- On touch and hold -- On double-tap zoom -- Supported touch events and how they work -- Gestures.

Creating a responsive photo gallery -- Gallery markup and styling -- The basic gallery slide list -- Adding simple gallery controls -- Making images responsive -- Styling our gallery -- Using CSS3 transitions -- Gallery interactivity -- The basic template -- Caching the gallery -- Connecting our controls -- Attaching the events -- Handling our events -- Caching variables, again -- Gallery responsiveness -- Setting the gallery styles -- Resetting the gallery styles -- Initializing the gallery styles -- Extending the gallery for touch -- The basic template -- Default options and modularizing swipe events -- Listening to touch events -- Handling touch events -- Putting it all together -- The JavaScript -- The markup -- Summary -- 5. Understanding HTML5 Forms -- HTML5 input types -- HTML5 attributes for forms -- Form layout for iPhone -- Sample HTML5 forms -- Setup work -- Including our forms styling -- Updating the navigation -- Including our navigation and forms scripts -- The forms -- The login form -- The registration form -- The profile form -- The datetime type -- The number type -- The range type -- Form validation -- The basic template -- Initializing our forms -- Attaching events -- Event handlers -- Validating our input -- Form styling for iOS -- Basic styling -- Custom styling -- Summary -- 6. Location-aware Applications -- Geolocation specification -- Implementation -- Scope, security, and privacy -- API descriptions -- The Geolocation interface -- The getCurrentPosition method -- The watchPosition method -- The clearWatch method -- The PositionOptions interface -- The enableHighAccuracy option -- The timeout option -- The maximumAge option -- The Position interface -- The Coordinates interface -- The PositionError interface -- Use cases -- Points of interest -- Route navigation -- Latest information -- Google Maps API -- The API(s).

Obtaining an API key -- Activating the service -- Retrieving the key -- Geolocation and Google Maps -- Markup preparation -- The Geolocation wrapper -- Geolocation with Google Maps -- Summary -- 7. One-page Applications -- Model-View-Controller or MVC -- Models -- Views -- Controllers -- Relationships -- Introduction to Underscore.js -- Implementation -- _.extend -- _.each -- _.template -- Introduction to Backbone.js -- MVC and Backbone.js -- Backbone models -- Backbone views -- Backbone collections -- Server-side interactions -- Our sample application -- Application architecture -- Basic sample architecture -- Application markup -- Creating templates -- Application scripts -- The BaseView -- Music application -- The router -- The collection -- The model -- The view(s) -- The playlist view -- The audio player view -- The song view -- User application -- The router -- The collection -- The model -- The view(s) -- The dashboard view -- The profile view -- Summary -- 8. Offline Applications -- Application Cache -- The manifest file -- Manifest implementation -- A simple example -- The markup -- The JavaScript -- Debugging the cache manifest -- Debugging in the browser -- Debugging using JavaScript -- Handling offline applications -- A simple use case -- Detecting network connectivity -- The localStorage API -- Summary -- 9. Principles of Clean and Optimized Code -- Optimizing stylesheets -- Validating our CSS -- W3C CSS Validator -- Customizable options -- Validating a successful example -- Validating an unsuccessful example -- CSS Lint -- Customizable options -- Validating a successful example using CSS Lint -- Validating an unsuccessful example using CSS Lint -- Integrating CSS Lint -- Profiling our CSS -- Optimizing our CSS -- Avoid universal rules -- Don't qualify ID or Class rules -- Never use !important -- Modularize styles.

Optimizing JavaScript -- Validating JavaScript using JSLint -- Validating a successful example using JSLint -- Validating an unsuccessful example -- Customizable options -- Integrating JSLint -- Profiling our JavaScript -- Optimizing our JavaScript -- Avoid globals -- Leave the DOM alone -- Use literals -- Modularize functionality -- Summary -- 10. Creating a Native iPhone Web Application -- Setting up the development environment -- Getting started with Xcode -- Installing Xcode -- Xcode IDE overview - the basics -- The Xcode workspace -- The Xcode toolbar -- Setting up PhoneGap -- Installing PhoneGap -- Creating a PhoneGap project -- The PhoneGap license -- Configuring our project -- Transferring a web application -- Transferring our assets -- Including our markup -- Incorporating our styles -- Inserting our scripts -- Debugging our application -- Logging out our code -- Using the Safari developer tools -- Extending our application with native functionality -- Configuring our application -- Setting up our contacts functionality -- Creating the ContactsView class -- Implementing the ContactsView template -- Integrating the Contacts API -- Summary -- Index.