Pro HTML5 Programming: Powerful APIs for Richer Internet Application Development

Prelim......Page 1
Contents at a Glance......Page 6
Contents......Page 7
Foreword......Page 15
About the Authors......Page 16
About the Technical Reviewer......Page 17
Acknowledgments......Page 18
Who This Book Is For......Page 19
Contacting the Authors......Page 20
The Story So Far—The History of HTML5......Page 21
The Myth of 2022 and Why It Doesn’t Matter......Page 22
Compatibility and Paving the Cow Paths......Page 23
Separation of Presentation and Content......Page 24
A Plugin–Free Paradigm......Page 25
What’s In and What’s Out?......Page 26
New DOCTYPE and Character Set......Page 28
New and Deprecated Elements......Page 29
Semantic Markup......Page 30
Simplifying Selection Using the Selectors API......Page 37
JavaScript Logging and Debugging......Page 40
window.JSON......Page 41
Monkeys, Squirrelfish, and Other Speedy Oddities......Page 42
Summary......Page 43
History......Page 45
Canvas Coordinates......Page 46
Fallback Content......Page 47
Browser Support for HTML5 Canvas......Page 48
Checking for Browser Support......Page 49
Adding a Canvas to a Page......Page 50
Applying Transformations to Drawings......Page 52
Working with Paths......Page 55
Working with Stroke Styles......Page 58
Working with Fill Styles......Page 59
Filling Rectangular Content......Page 60
Drawing Curves......Page 62
Inserting Images into a Canvas......Page 64
Using Gradients......Page 65
Using Background Patterns......Page 67
Scaling Canvas Objects......Page 69
Using Canvas Transforms......Page 72
Using Canvas Text......Page 73
Applying Shadows......Page 75
Working with Pixel Data......Page 77
Implementing Canvas Security......Page 78
Building an Application with HTML5 Canvas......Page 79
Summary......Page 83
Video Containers......Page 85
The Codec Wars and the Tentative Truce......Page 87
Browser Support for HTML5 Audio and Video......Page 88
Using the HTML5 Audio and Video APIs......Page 89
Checking for Browser Support......Page 90
The Basics: Declaring Your Media Element......Page 91
Using the Source......Page 92
Taking Control......Page 94
Audio Activation......Page 96
Working with Video......Page 97
Adding the Video and the Canvas Element......Page 98
Adding Variables......Page 99
Adding the updateFrame Function......Page 100
Adding the startVideo Function......Page 101
Handling User Input......Page 102
Adding the stopTimeline Function......Page 103
Background Noise in a Page......Page 104
Mouseover Video Playback......Page 105
Summary......Page 106
About Location Information......Page 107
Where Does Location Information Come From?......Page 108
GPS Geolocation Data......Page 109
Cell Phone Geolocation Data......Page 110
Browser Support for HTML5 Geolocation......Page 111
Privacy......Page 112
Triggering the Privacy Protection Mechanism......Page 113
Checking for Browser Support......Page 115
One-Shot Position Requests......Page 116
Repeated Position Updates......Page 120
Building a Real-Time Application with HTML5 Geolocation......Page 121
Processing the Geolocation Data......Page 124
The Final Code......Page 128
What’s My Status?......Page 131
Show Me on a Google Map......Page 133
Summary......Page 134
Cross Document Messaging......Page 135
Understanding Origin Security......Page 137
Browser Support for Cross Document Messaging......Page 138
Listening for Message Events......Page 139
Building an Application Using the postMessage API......Page 140
Building the Portal Page......Page 141
The Final Code......Page 142
The Application in Action......Page 145
Cross-Origin XMLHttpRequest......Page 146
Progress Events......Page 148
Checking for Browser Support......Page 149
Using Progress Events......Page 150
Building an Application Using XMLHttpRequest......Page 151
The Final Code......Page 152
The Application in Action......Page 154
Framebusting......Page 155
Summary......Page 156
Real-Time and HTTP......Page 157
Understanding HTML5 WebSockets......Page 159
The WebSocket Interface......Page 160
A Dramatic Reduction in Unnecessary Network Traffic and Latency......Page 161
Writing a Simple Echo WebSocket Server......Page 166
Checking for Browser Support......Page 174
Sending Messages......Page 175
Running the WebSocket Page......Page 176
Building an Application with HTML5 WebSockets......Page 178
Coding the HTML File......Page 179
Adding the WebSocket Code......Page 181
Putting It All Together......Page 182
The Final Code......Page 184
Summary......Page 187
Overview of HTML5 Forms......Page 189
Browser Support for HTML5 Forms......Page 190
An Input Catalog......Page 191
The placeholder Attribute......Page 196
The autofocus Attribute......Page 197
The min and max Attributes......Page 198
The required Attribute......Page 199
Checking forms with validation......Page 200
Validation Fields and Functions......Page 203
Validation feedback......Page 204
Building an Application with HTML5 Forms......Page 205
The Password is: Validation!......Page 210
Summary......Page 211
Using the HTML5 Web Workers API......Page 213
Checking for Browser Support......Page 214
Communicating with HTML5 Web Workers......Page 215
Coding the Main Page......Page 216
Handling Errors......Page 217
Using HTML5 Web Workers within HTML5 Web Workers......Page 218
Simple Example Code......Page 219
Building an Application with HTML5 Web Workers......Page 220
Coding the blur.js Helper Script......Page 221
Coding the blur.html Application Page......Page 223
Coding the blurWorker.js Web Worker Script......Page 224
Communicating with the Web Workers......Page 225
Example Code......Page 227
Summary......Page 232
Overview of HTML5 Web Storage......Page 233
Browser Support for HTML5 Web Storage......Page 234
Checking for Browser Support......Page 235
Setting and Retrieving Values......Page 236
Plugging Data Leaks......Page 237
Other Web Storage API Attributes and Functions......Page 239
Communicating Web Storage Updates......Page 241
Exploring Web Storage......Page 243
Building an Application with HTML5 Web Storage......Page 244
The Future of Browser Database Storage......Page 255
JSON Object Storage......Page 258
A Window into Sharing......Page 259
Summary......Page 261
Overview of HTML5 Offline Web Applications......Page 263
Browser Support for HTML5 Offline Web Applications......Page 265
Creating a Simple Offline Application......Page 266
Manifest Files......Page 267
The applicationCache API......Page 268
Building an Application with HTML5 Offline Web Applications......Page 270
Creating a Manifest File for the Application Resources......Page 271
Creating the Offline JavaScript......Page 272
Check for ApplicationCache Support......Page 274
Add Geolocation Tracking Code......Page 275
Adding Offline Event Handling......Page 276
Summary......Page 277
HTML Evolves......Page 279
HTML in Three Dimensions......Page 280
3D Shaders......Page 281
Devices......Page 282
Touchscreen Device Events......Page 283
Gestures......Page 284
Touches......Page 285
Peer-to-Peer Networking......Page 286
Summary......Page 287
Index......Page 289