Peter Lubbers - Pro HTML 5 Programming

Recommendations

Info

Download from Wow! eBook 102 CHAPTER 4 ■ USING THE HTML5 GEOLOCATION API Figure 4-4. The HTML5 Geolocation example application in action This sample works by using the watchPosition() capability we discussed in the last section. Every time a new position is sent to us, we will compare it to the last known position and calculate the distance traveled. This is accomplished using a well-known calculation known as the Haversine formula, which allows us to calculate distance between two longitude and latitude positions on a sphere. As shown in Listing 4-6, the Haversine formula tells us the following:
Listing 4-6. The Haversine formula � � � = 2arcsin sin 2� �� + cos� � 2 � scos� f sin 2 � � �� 2 � � � � CHAPTER 4 ■ USING THE HTML5 GEOLOCATION API If you're hoping to learn how the Haversine formula works, you’ll be sorely disappointed. Instead, we’ll present you a JavaScript implementation of the formula, which allows anyone to use it to calculate the distance between two positions (see Listing 4-7). Listing 4-7. A JavaScript Haversine implementation function toRadians(degree) { return degree * Math.PI / 180; } function distance(latitude1, longitude1, latitude2, longitude2) { // R is the radius of the earth in kilometers var R = 6371; var deltaLatitude = toRadians(latitude2-latitude1); var deltaLongitude = toRadians(longitude2-longitude1); latitude1 =toRadians(latitude1); latitude2 =toRadians(latitude2); var a = Math.sin(deltaLatitude/2) * Math.sin(deltaLatitude/2) + Math.cos(latitude1) * Math.cos(latitude2) * Math.sin(deltaLongitude/2) * Math.sin(deltaLongitude/2); var c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1-a)); var d = R * c; return d; } If you want to know why or how this formula works, consult a teenager’s math textbook. For our purposes, we have written a conversion from degrees to radians, and we provided a distance() function to calculate the distance between two latitude and longitude position values. If we check the user’s position and calculate the distance traveled at frequent and regular intervals, it gives a reasonable approximation of distance traveled over time. This assumes that the user is moving in a straight direction during each interval, but we’ll make that assumption for the sake of our example. 103
Page 1 and 2:
THE EXPERT’S VOICE ® IN WEB DEVE
Page 3 and 4:
■ ■ ■ Pro HTML5 Programming P
Page 5 and 6:
For my beautiful wife, Vittoria, an
Page 7 and 8:
Contents ■Foreword ..............
Page 9 and 10:
■ CONTENTS Implementing Canvas Se
Page 11 and 12:
■ CONTENTS Summary ..............
Page 13 and 14:
■ CONTENTS Setting and Retrieving
Page 15 and 16:
Foreword In June 2004, representati
Page 17 and 18:
About the Technical Reviewer � Pa
Page 19 and 20:
Introduction HTML5 is brand new. In
Page 21 and 22:
C H A P T E R 1 ■ ■ ■ Overvie
Page 23 and 24:
CHAPTER 1 ■ OVERVIEW OF HTML5 wit
Page 25 and 26:
Interoperability Simplification CHA
Page 27 and 28:
• MathML • Microdata • Server
Page 29 and 30:
Figure 1-1. A page rendered in stan
Page 31 and 32:
Table 1-2. New sectioning HTML5 ele
Page 33 and 34:
CHAPTER 1 ■ OVERVIEW OF HTML5 Wit
Page 35 and 36:
article { background-color: #eee; d
Page 37 and 38:
Figure 1-2. An HTML5 page with all
Page 39 and 40:
CHAPTER 1 ■ OVERVIEW OF HTML5 The
Page 41 and 42:
Figure 1-3. Developer Tools view in
Page 43:
CHAPTER 1 ■ OVERVIEW OF HTML5 All
Page 46 and 47:
26 CHAPTER 2 ■ USING THE HTML5 CA
Page 48 and 49:
Page 50 and 51:
Page 52 and 53:
Download from Wow! eBook 32 CHAPTE
Page 54 and 55:
Page 56 and 57:
Page 58 and 59:
Page 60 and 61:
Page 62 and 63:
Download from Wow! eBook 42 CHAPTE
Page 64 and 65:
Page 66 and 67:
Page 68 and 69:
Page 70 and 71:
Page 72 and 73: Download from Wow! eBook 52 CHAPTE
Page 74 and 75: 54 CHAPTER 2 ■ USING THE HTML5 CA
Page 82 and 83: Download from Wow! eBook 62 CHAPTE
Page 85 and 86: C H A P T E R 3 ■ ■ ■ Working
Page 87 and 88: Audio and Video Codecs CHAPTER 3
Page 89 and 90: Table 3-1. Browser support for HTML
Page 91 and 92: MEDIA FOR EVERYONE CHAPTER 3 ■ WO
Page 93 and 94: CHAPTER 3 ■ WORKING WITH HTML5 AU
Page 95 and 96: Table 3-4 shows a few of the read-o
Page 103 and 104: find the actual frame since the vid
Page 105 and 106: LOSING VIEWERS IN THE OF AN EYE CH
Page 107 and 108: C H A P T E R 4 ■ ■ ■ Using t
Page 109 and 110: A device can use any of the followi
Page 111 and 112: Table 4-4. Pros and cons of cell ph
Page 113 and 114: Figure 4-1. HTML5 Geolocation brows
Page 115 and 116: CHAPTER 4 ■ USING THE HTML5 GEOLO
Page 121: CHAPTER 4 ■ USING THE HTML5 GEOLO
Page 125 and 126: Listing 4-9. Adding the loadDemo()
Page 127 and 128: THE EASIEST WAY TO TRAVEL CHAPTER 4
Page 129 and 130: var deltaLatitude = toRadians(latit
Page 131 and 132: Practical Extras CHAPTER 4 ■ USIN
Page 133 and 134: Show Me on a Google Map CHAPTER 4
Page 137 and 138: CHAPTER 5 ■ USING THE COMMUNICATI
Page 143 and 144: var defaultTitle = "Portal [http://
Page 145 and 146: Send Notification CHAPTER 5 ■ U
Page 147 and 148: Figure 5-4. Difference between clie
Page 149 and 150: “SEEMINGLY ARBITRARY” TIMES CHA
Page 151 and 152: crossOriginRequest.upload.onprogres
Page 159 and 160: Figure 6-1. The complexity of real-
Page 161 and 162: Listing 6-2. The WebSocket interfac
Page 163 and 164: Listing 6-4. HTTP response header H
Page 165 and 166: Figure 6-4. Latency comparison betw
Page 167 and 168: EXISTING WEBSOCKET SERVERS CHAPTER
Page 169 and 170: CHAPTER 6 ■ USING THE HTML5 WEBSO
Page 171 and 172: def terminate(self): self.ready_sta
Page 173 and 174:
self.sessions = [] self.port = port
Page 175 and 176:
Basic API Usage CHAPTER 6 ■ USING
Page 177 and 178:
CHAPTER 6 ■ USING THE HTML5 WEBSO
Page 179 and 180:
Page 181 and 182:
Page 183 and 184:
Page 185 and 186:
HTML5 WebSocket / Geolocation Track
Page 187:
} } Summary incomingRow = docume
Page 190 and 191:
170 CHAPTER 7 ■ USING THE HTML5 F
Page 192 and 193:
Download from Wow! eBook 172 CHAPT
Page 194 and 195:
Page 196 and 197:
Page 198 and 199:
Page 200 and 201:
Page 202 and 203:
Page 204 and 205:
Page 206 and 207:
Page 208 and 209:
Page 210 and 211:
Page 212 and 213:
Download from Wow! eBook
Page 214 and 215:
194 CHAPTER 8 ■ USING THE HTML5 W
Page 216 and 217:
Page 218 and 219:
Page 220 and 221:
Page 222 and 223:
Page 224 and 225:
Page 226 and 227:
Page 228 and 229:
Page 230 and 231:
Page 232 and 233:
Page 234 and 235:
Page 236 and 237:
Page 238 and 239:
Page 240 and 241:
Page 242 and 243:
Page 244 and 245:
Page 246 and 247:
Page 248 and 249:
Page 250 and 251:
Page 252 and 253:
Page 254 and 255:
Page 256 and 257:
Page 258 and 259:
Page 260 and 261:
Page 262 and 263:
Download from Wow! eBook
Page 264 and 265:
244 CHAPTER 10 ■ CREATING HTML5 O
Page 266 and 267:
Page 268 and 269:
Page 270 and 271:
Page 272 and 273:
Page 274 and 275:
Page 276 and 277:
Page 279 and 280:
C H A P T E R 11 ■ ■ ■ The Fu
Page 281 and 282:
Figure 11-1. Quake II 3D Shaders CH
Page 283 and 284:
CHAPTER 11 ■ THE FUTURE OF HTML5
Page 285 and 286:
Page 287:
Page 290 and 291:
270 ■ INDEX unsupported, 68 using
Page 292 and 293:
Download from Wow! eBook 272 ■ I
Page 294 and 295:
274 ■ INDEX Web SQL database supp
Page 296 and 297:
276 ■ INDEX HTML5 page CSS file f
Page 298 and 299:
278 ■ INDEX media elements. See a
Page 300 and 301:
280 ■ INDEX building application
Page 302 and 303:
Download from Wow! eBook 282 ■ I
Page 304:
284 ■ INDEX stopping Web Workers,
show all

Peter Lubbers - Pro HTML 5 Programming

You also want an ePaper? Increase the reach of your titles

Delete template?

Save as template?