Lubbers P., Albers B., Salim F. - Pro HTML5 Programming, 2nd Edition + Code

Скачать

Lubbers P., Albers B., Salim F. - Pro HTML5 Programming, 2nd Edition  + Code

Pro HTML5 Programming, 2nd Edition

Год: November 30, 2011

Автор: Peter Lubbers, Brian Albers, Frank Salim

Издательство: Apress

ISBN: 143023864X, 978-1430238645

Язык: Английский

Формат: PDF

Качество: Изначально компьютерное (eBook)

Количество страниц: 352

Описание:

Pro HTML5 Programming, 2nd Edition

HTML5 is here, and with it, web applications have acquired power, ease, scalability, and responsiveness like never before. With this book, developers will learn how to use the latest cutting-edge HTML5 web technology available in the most recent versions of modern browsers to build web applications with unparalleled functionality, speed, and responsiveness.

This new edition includes major revisions for WebSockets functionality, reflecting the new W3C specification. It also features new chapters covering the drag-and-drop API as well as SVG.

Explains how to create real-time HTML5 applications that tap the full potential of modern browsers

Provides practical, real-world examples of HTML5 features in action

Covers all the new HTML5 APIs to get you up-to-speed quickly with HTML5

Fully updated to include the latest revisions of the WebSocket API, and much more.

An update of Pro HTML5 Programming, 2nd Edition, including major corrections for WebSockets functionality, along with new chapters covering the drag and drop API, as well as SVG.

What you’ll learn

How the HTML5 specification has evolved

How to develop cutting-edge web applications using new HTML5 features like WebSockets, geolocation, web storage, Canvas, and audio/video

Which features are available in modern browsers

Who this book is for

Web designers and developers who want to use the latest cutting-edge technology available in current browsers

Developers who want to create dynamic, HTML5 web applications

Developers who want to know which HTML5 features are supported by modern browsers

Pro HTML5 Programming, 2nd Edition

HTML5 is here, and with it, web applications have acquired power, ease, scalability, and responsiveness like never before. With this book, developers will learn how to use the latest cutting-edge HTML5 web technology available in the most recent versions of modern browsers to build web applications with unparalleled functionality, speed, and responsiveness.

An update of Pro HTML5 Programming, 2nd Edition, including major corrections for WebSockets functionality, along with new chapters covering the drag and drop API, as well as SVG.

Foreword............................................................................................................... xv

 About the Authors................................................................................................ xvi

 About the Technical Reviewer ............................................................................ xvii

 Acknowledgments ............................................................................................. xviii

 Introduction ......................................................................................................... xix

 Chapter 1: Overview of HTML5................................................................................1

The Story So Far—The History of HTML5..........................................................................1

The Myth of 2022 and Why It Doesn’t Matter ....................................................................2

Who Is Developing HTML5? ...............................................................................................3

A New Vision......................................................................................................................3

Compatibility and Paving the Cow Paths .................................................................................................. 3

Utility and the Priority of Constituencies .................................................................................................. 3

Interoperability Simplification .................................................................................................................. 4

Universal Access ..................................................................................................................................... 5

A Plugin–Free Paradigm ....................................................................................................5

What’s In and What’s Out? ....................................................................................................................... 6

What’s New in HTML5?......................................................................................................8

New DOCTYPE and Character Set............................................................................................................. 8

New and Deprecated Elements ................................................................................................................ 9

Semantic Markup .................................................................................................................................. 10

Simplifying Selection Using the Selectors API........................................................................................ 17

JavaScript Logging and Debugging........................................................................................................ 19

window.JSON ........................................................................................................................................ 20

DOM Level 3 .......................................................................................................................................... 21

Monkeys, Squirrelfish, and Other Speedy Oddities ................................................................................ 21

Summary .........................................................................................................................22

 Chapter 2: Using the Canvas API ..........................................................................23

Overview of HTML5 Canvas .............................................................................................23

History ................................................................................................................................................... 23

What Is a Canvas? ................................................................................................................................. 24

Canvas Coordinates............................................................................................................................... 24

When Not to Use Canvas ........................................................................................................................ 25

Fallback Content.................................................................................................................................... 25

CSS and Canvas..................................................................................................................................... 26

Browser Support for HTML5 Canvas....................................................................................................... 26

Using the HTML5 Canvas APIs .........................................................................................26

Checking for Browser Support ............................................................................................................... 27

Adding a Canvas to a Page ..................................................................................................................... 27

Applying Transformations to Drawings .................................................................................................. 30

Working with Paths ............................................................................................................................... 32

Working with Stroke Styles .................................................................................................................... 34

Working with Fill Styles .......................................................................................................................... 35

Filling Rectangular Content .................................................................................................................... 36

Drawing Curves ..................................................................................................................................... 37

Inserting Images into a Canvas .............................................................................................................. 39

Using Gradients ..................................................................................................................................... 41

Using Background Patterns .................................................................................................................... 43

Scaling Canvas Objects .......................................................................................................................... 44

Using Canvas Transforms...................................................................................................................... 46

Using Canvas Text ................................................................................................................................. 48

Applying Shadows . ............................................................................................................................... 50

Working with Pixel Data . ....................................................................................................................... 52

Implementing Canvas Security. ............................................................................................................. 54

Building an Application with HTML5 Canvas ...................................................................55

Practical Extra: Full Page Glass Pane . ................................................................................................... 58

Practical Extra: Timing Your Canvas Animation. .................................................................................... 58

Summary .........................................................................................................................61

 Chapter 3: Working with Scalable Vector Graphics ..............................................63

Overview of SVG ..............................................................................................................63

History . ................................................................................................................................................. 63

Understanding SVG. ............................................................................................................................... 64

Scalable Graphics. ................................................................................................................................ 66

Creating 2D Graphics with SVG . ............................................................................................................ 66

Adding SVG to a Page . ........................................................................................................................... 67

Simple Shapes. ..................................................................................................................................... 67

Transforming SVG Elements . ................................................................................................................. 68

Reusing Content . .................................................................................................................................. 69

Patterns and Gradients . ......................................................................................................................... 70

SVG Paths . ............................................................................................................................................ 71

Using SVG Text . .................................................................................................................................... 72

Putting the Scene Together . .................................................................................................................. 73

Building an Interactive Application with SVG...................................................................74

Adding Trees. ........................................................................................................................................ 75

Adding the updateTrees Function. ......................................................................................................... 75

Adding the removeTree Function . ......................................................................................................... 76

Adding the CSS Styles . .......................................................................................................................... 76

The Final Code . ..................................................................................................................................... 77

Summary .........................................................................................................................81

 Chapter 4: Working with Audio and Video ............................................................83

Overview of Audio and Video ...........................................................................................83

Video Containers.................................................................................................................................... 83

Audio and Video Codecs ......................................................................................................................... 84

Audio and Video Restrictions.................................................................................................................. 85

Browser Support for Audio and Video .................................................................................................... 86

Using the Audio and Video API.........................................................................................86

Checking for Browser Support ............................................................................................................... 87

Accessibility........................................................................................................................................... 88

Understanding Media Elements.............................................................................................................. 89

Working with Audio ............................................................................................................................... 94

Working with Video................................................................................................................................ 95

Practical Extras.................................................................................................................................... 103

Summary .......................................................................................................................106

 Chapter 5: Using the Geolocation API .................................................................107

About Location Information ...........................................................................................107

Latitude and Longitude Coordinates..................................................................................................... 107

Where Does Location Information Come From? ................................................................................... 108

IP Address Geolocation Data ................................................................................................................ 109

GPS Geolocation Data ........................................................................................................................... 109

Wi-Fi Geolocation Data ......................................................................................................................... 110

Cell Phone Geolocation Data................................................................................................................. 110

User–Defined Geolocation Data............................................................................................................ 111

Browser Support for Geolocation...................................................................................111

Privacy ...........................................................................................................................112

Triggering the Privacy Protection Mechanism...................................................................................... 113

Dealing with Location Information........................................................................................................ 114

Using the Geolocation API..............................................................................................114

Checking for Browser Support ............................................................................................................. 114

Position Requests ................................................................................................................................ 115

Building an Application with Geolocation ......................................................................120

Writing the HTML Display ..................................................................................................................... 122

Processing the Geolocation Data.......................................................................................................... 123

The Final Code ..................................................................................................................................... 126

Practical Extras..............................................................................................................129

What’s My Status?............................................................................................................................... 130

Show Me on a Google Map................................................................................................................... 131

Summary .......................................................................................................................133

 Chapter 6: Using the Communication APIs .........................................................135

Cross Document Messaging ..........................................................................................135

Understanding Origin Security.............................................................................................................. 138

Browser Support for Cross Document Messaging................................................................................ 139

Using the postMessage API .................................................................................................................. 139

Building an Application Using the postMessage API ............................................................................ 140

XMLHttpRequest Level 2................................................................................................146

Cross-Origin XMLHttpRequest .............................................................................................................. 147

Progress Events................................................................................................................................... 149

Browser Support for HTML5 XMLHttpRequest Level 2 ......................................................................... 150

Using the XMLHttpRequest API............................................................................................................. 150

Building an Application Using XMLHttpRequest ................................................................................... 152

Practical Extras..............................................................................................................156

Structured Data ................................................................................................................................... 156

Framebusting ...................................................................................................................................... 157

Summary .......................................................................................................................157

 Chapter 7: Using the WebSocket API ..................................................................159

Overview of WebSocket.................................................................................................159

Real-Time and HTTP ............................................................................................................................. 159

Understanding WebSocket ................................................................................................................... 161

Writing a Simple Echo WebSocket Server .....................................................................167

Using the WebSocket API ..............................................................................................176

Checking for Browser Support ............................................................................................................. 176

Basic API Usage................................................................................................................................... 177

Building a WebSocket Application .................................................................................182

Coding the HTML File........................................................................................................................... 183

Adding the WebSocket Code ................................................................................................................ 185

Adding the Geolocation Code................................................................................................................ 185

Putting It All Together.......................................................................................................................... 186

The Final Code ..................................................................................................................................... 188

Summary .......................................................................................................................191

 Chapter 8: Using the Forms API ..........................................................................193

Overview of HTML5 Forms.............................................................................................193

HTML Forms Versus XForms ................................................................................................................ 194

Functional Forms................................................................................................................................. 194

Browser Support for HTML5 Forms ...................................................................................................... 194

An Input Catalog .................................................................................................................................. 195

Using the HTML5 Forms APIs.........................................................................................200

New Form Attributes and Functions ..................................................................................................... 200

Checking Forms with Validation ........................................................................................................... 204

Validation Feedback ............................................................................................................................. 207

Building an Application with HTML5 Forms...................................................................209

Practical Extras.................................................................................................................................... 213

Summary .......................................................................................................................215

 Chapter 9: Working with Drag-and-Drop ............................................................217

Web Drag-and-Drop: The Story So Far ..........................................................................217

Overview of HTML5 Drag-and-Drop...............................................................................218

The Big Picture .................................................................................................................................... 218

Events to Remember ............................................................................................................................ 221

Drag Participation................................................................................................................................ 224

Transfer and Control............................................................................................................................ 224

Building an Application with Drag-and-Drop .................................................................225

Getting Into the dropzone ..................................................................................................................... 234

Handling Drag-and-Drop for Files..................................................................................235

Practical Extras..............................................................................................................239

Customizing the Drag Display............................................................................................................... 239

Summary .......................................................................................................................240

 Chapter 10: Using the Web Workers API.............................................................241

Browser Support for Web Workers ................................................................................242

Using the Web Workers API ...........................................................................................242

Checking for Browser Support ............................................................................................................. 242

Creating Web Workers......................................................................................................................... 243

Loading and Executing Additional JavaScript ...................................................................................... 244

Communicating with Web Workers ...................................................................................................... 244

Coding the Main Page....................................................................................................245

Handling Errors.................................................................................................................................... 246

Stopping Web Workers ......................................................................................................................... 247

Using Web Workers within Web Workers ............................................................................................. 247

Using Timers........................................................................................................................................ 248

Example Code...................................................................................................................................... 248

Building an Application with Web Workers....................................................................250

Coding the blur.js Helper Script............................................................................................................ 252

Coding the blur.html Application Page ................................................................................................. 253

Coding the blurWorker.js Web Worker Script ....................................................................................... 254

Communicating with the Web Workers ................................................................................................ 254

The Application in Action...................................................................................................................... 256

Example Code...................................................................................................................................... 257

Summary .......................................................................................................................261

 Chapter 11: Using the Storage APIs....................................................................263

Overview of Web Storage ..............................................................................................263

Browser Support for Web Storage.................................................................................264

Using the Web Storage API ............................................................................................264

Checking for Browser Support ............................................................................................................. 264

Setting and Retrieving Values .............................................................................................................. 266

Plugging Data Leaks............................................................................................................................ 267

Local Versus Session Storage .............................................................................................................. 269

Other Web Storage API Attributes and Functions ................................................................................. 269

Communicating Web Storage Updates ................................................................................................. 272

Exploring Web Storage ......................................................................................................................... 273

Building an Application with Web Storage.....................................................................275

The Future of Browser Database Storage......................................................................286

The Web SQL Database ........................................................................................................................ 286

The Indexed Database API .................................................................................................................... 289

Practical Extras..............................................................................................................291

JSON Object Storage ............................................................................................................................ 291

A Window into Sharing ......................................................................................................................... 292

Summary .......................................................................................................................293

 Chapter 12: Creating Offline Web Applications..................................................295

Overview of HTML5 Offline Web Applications................................................................295

Browser Support for HTML5 Offline Web Applications ......................................................................... 297

Using the HTML5 Application Cache API........................................................................297

Checking for Browser Support ............................................................................................................. 297

Creating a Simple Offline Application................................................................................................... 298

Going Offline ........................................................................................................................................ 298

Manifest Files ...................................................................................................................................... 299

The ApplicationCache API..................................................................................................................... 300

Application Cache in Action.................................................................................................................. 301

Building an Application with HTML5 Offline Web Applications......................................303

Creating a Manifest File for the Application Resources........................................................................ 306

Creating the HTML Structure and CSS for the UI .................................................................................. 306

Creating the Offline JavaScript............................................................................................................. 307

Check for ApplicationCache Support .................................................................................................... 309

Adding the Update Button Handler ....................................................................................................... 309

Add Geolocation Tracking Code............................................................................................................ 310

Adding Storage Code ............................................................................................................................ 310

Adding Offline Event Handling .............................................................................................................. 311

Summary .......................................................................................................................311

 Chapter 13: The Future of HTML5 .......................................................................313

Browser Support for HTML5 ..........................................................................................313

HTML Evolves ................................................................................................................313

WebGL ................................................................................................................................................. 314

Devices ................................................................................................................................................ 316

Audio Data API ..................................................................................................................................... 316

Touchscreen Device Events.................................................................................................................. 317

Peer-to-Peer Networking..................................................................................................................... 320

Ultimate Direction................................................................................................................................ 320

Summary .......................................................................................................................320

 Index ...................................................................................................................323

Скачать