Stručný obsah Úvodem... 17 1. Seznámení s HTML5... 21 2. Rozhraní Canvas... 47 3. Práce s audiem a videem v HTML5... 85 4. Geolokační rozhraní... 109 5. Komunikační rozhraní... 137 6. Rozhraní WebSocket... 161 7. Rozhraní HTML5 pro formuláře... 195 8. Rozhraní Web Workers... 219 9. Rozhraní webového úložiště... 241 10. Tvorba off-line webových aplikací HTML5... 273 11. Budoucnost HTML5... 291
Obsah Předmluva...13 O autorech...14 O odborném korektorovi...14 Poděkování...15 Věnování...16 Úvodem... 17 Komu je tato kniha určena...17 Co v této knize najdete...18 Kontakt na autory...19 Zpětná vazba od čtenářů...19 Zdrojové kódy ke knize...19 Errata...20 Kapitola 1 Seznámení s HTML5... 21 Jak se vyvíjela specifikace HTML5...21 Mýtus roku 2022 a proč na tom nezáleží...23 Kdo vyvíjí HTML5...23 Nová vize...24 Kompatibilita... 24 Přínos a upřednostnění uživatelů...24 Zjednodušení interoperability... 25 Obecný přístup... 26 Paradigma bez zásuvných modulů...26 Co sem patří a co ne... 27 Co je v HTML5 nového...29 Nový DOCTYPE a znaková sada... 29 Nové a zastaralé elementy... 31
6 Obsah Sémantické elementy... 31 Zjednodušení výběru pomocí rozhraní Selector... 38 Protokolování a ladění JavaScriptu... 41 window.json... 42 DOM Level 3... 43 Monkeys, Squirrelfish a další podivnosti... 43 Shrnutí...45 Kapitola 2 Rozhraní Canvas... 47 Seznámení s rozhraním Canvas jazyka HTML5...47 Historie... 48 Co je to plátno?... 48 Souřadnice plátna... 49 Kdy plátno nepoužívat... 49 Alternativní obsah... 50 CSS a plátno... 50 Podpora rozhraní Canvas ze strany prohlížečů... 50 Použití rozhraní Canvas...51 Ověření podpory prohlížeče... 51 Přidání plátna do stránky... 52 Aplikace transformací... 55 Práce s cestami... 58 Vytažení cesty a jeho styl... 60 Práce s výplněmi... 61 Vyplnění obdélníkové oblasti... 62 Křivky... 63 Vložení obrázku do plátna... 65 Přechody... 66 Pozadí... 69 Změna velikost objektů plátna... 71 Použití transformací... 73 Text... 74 Stíny... 76 Manipulace s pixely... 78 Zabezpečení plátna... 79 Vytvoření aplikace využívající rozhraní Canvas... 80 Praktický příklad skleněná tabule přes celé okno... 84 Shrnutí...84
Obsah 7 Kapitola 3 Práce s audiem a videem v HTML5... 85 Seznámení s audio- a videorozhraním HTML5...86 Kontejnery videa... 86 Kodeky audia a videa... 87 Omezení audia a videa... 88 Podpora audia a videa HTML5 v prohlížečích... 89 Použití rozhraní audio a video...89 Seznámení s multimediálními elementy... 91 Práce s audiem... 96 Práce s videem... 97 Praktické doplňky...104 Shrnutí...106 Kapitola 4 Geolokační rozhraní... 109 Informace o poloze...110 Zeměpisná šířka a délka...110 Odkud pochází informace o poloze?...111 Lokalizace podle adresy IP...111 Lokalizace pomocí GPS...112 Lokalizace pomocí Wi-Fi...112 Lokalizace v mobilní síti...113 Informace o poloze zadané uživatelem...113 Podpora geolokačního rozhraní HTML5 ze strany prohlížečů...114 Soukromí...114 Ochrana soukromí...115 Nakládání s informacemi o poloze...116 Použití geolokačního rozhraní HTML5...117 Ověření podpory prohlížeče...117 Požadavky na polohu...117 Opakované aktualizace polohy...122 Praktický příklad použití geolokačního rozhraní HTML5...123 Kód HTML...125 Zpracování geolokačních dat...126 Výsledný kód...129
8 Obsah Praktické doplňky...132 Jaký je stav?...132 Zobrazení na mapě...134 Shrnutí...136 Kapitola 5 Komunikační rozhraní... 137 Komunikace mezi dokumenty...138 Zabezpečení na základě původu...140 Podpora komunikace mezi dokumenty ze strany prohlížečů...141 Použití metody postmessage...142 Ukázka použití metody postmessage...143 Rozhraní XMLHttpRequest Level 2...149 Požadavky mezi zdroji různých původů...149 Stavové události...151 Podpora rozhraní XMLHttpRequest Level 2 prohlížeči...152 Použití rozhraní XMLHttpRequest...152 Ukázka použití rozhraní XMLHttpRequest...154 Praktické doplňky...159 Strukturovaná data...159 Framebusting...159 Shrnutí...160 Kapitola 6 Rozhraní WebSocket... 161 Seznámení s rozhraním WebSocket...162 HTTP a komunikace v reálném čase...162 Rozhraní WebSocket...163 Podpora rozhraní WebSocket ze strany prohlížečů...170 Vytvoření jednoduchého serveru WebSocket...170 Použití rozhraní WebSocket...178 Ověření podpory prohlížeče...178 Seznámení s rozhraním...179 Vytvoření aplikace s použitím rozhraní WebSocket...183 Soubor HTML...184 Kód pro práci s rozhraním WebSocket...186 Kód pro práci s geolokačním rozhraním...187 A teď to dáme všechno dohromady...188 Výsledný kód...190 Shrnutí...193
Obsah 9 Kapitola 7 Rozhraní HTML5 pro formuláře... 195 Seznámení s rozhraním HTML5 pro formuláře...196 Formuláře HTML vs. XForms...196 Funkční formuláře...196 Podpora formulářů HTML5 ze strany prohlížečů...197 Nové ovládací prvky...198 Použití formulářů HTML5...202 Nové atributy a metody...202 Validace formulářů...206 Zobrazení výsledku validace...210 Vytvoření aplikace s formuláři HTML5...212 Praktické doplňky...217 Heslo zní validace...217 Shrnutí...218 Kapitola 8 Rozhraní Web Workers... 219 Podpora rozhraní Web Workers prohlížeči...220 Použití rozhraní Web Workers...220 Ověření podpory prohlížeče...221 Vytvoření nové instance Web Worker...221 Načítání externích skriptů...222 Vzájemná komunikace...222 Vytvoření hlavní stránky...223 Vytvoření skriptu instance Web Worker...223 Ošetření chyb...224 Ukončení instance Web Worker...224 Použití rozhraní Web Workers uvnitř instance Web Worker...224 Časovače...225 Zdrojový kód ukázky...225 Vytvoření aplikace využívající rozhraní Web Workers HTML5...227 Vytvoření skriptu rozmazani.js...228 Vytvoření stránky rozmazani.html...229 Vytvoření skriptu rozmazaniworker.js...230 Komunikace s instancemi Web Worker...232 Aplikace v akci...233 Kód ukázky...234 Shrnutí...240
10 Obsah Kapitola 9 Rozhraní webového úložiště... 241 Seznámení s rozhraním webového úložiště...242 Podpora rozhraní v prohlížečích...243 Použití rozhraní webového úložiště...243 Ověření podpory prohlížeče...243 Nastavení a získávání hodnot...245 Úniky dat...246 Lokální vs. relační úložiště...248 Další metody a vlastnosti rozhraní webového úložiště...248 Upozornění na aktualizaci obsahu úložiště...250 Prozkoumání obsahu úložiště...252 Vytvoření aplikace využívající rozhraní webového úložiště...253 Budoucnost úložišť na straně prohlížečů...266 Praktické doplňky...269 Ukládání objektů JSON...269 Komunikace mezi okny s použitím úložiště...270 Shrnutí...272 Kapitola 10 Tvorba off-line webových aplikací HTML5... 273 Seznámení s off-line webovými aplikacemi HTML5...273 Podpora off-line webových aplikací HTML5 prohlížeči...276 Použití rozhraní HTML5 pro off-line webové aplikace...276 Ověření podpory prohlížeče...276 Vytvoření jednoduché off-line aplikace...276 Práce off-line...277 Soubory manifestu...278 Vlastnost applicationcache...279 Vytvoření aplikace využívající rozhraní pro off-line webové aplikace HTML5...280 Vytvoření souboru manifestu aplikace...282 Vytvoření kódu HTML a CSS...282 Vytvoření kódu v JavaScriptu...283 Ověření podpory prohlížeče...285
Obsah 11 Přidání obsluhy aktualizačního tlačítka...286 Přidání kódu pro sledování polohy...287 Přidání kódu pro lokální ukládání dat...287 Obsluha událostí spojených s prací v režimu off-line...288 Shrnutí...289 Kapitola 11 Budoucnost HTML5... 291 Podpora HTML5 prohlížeči...291 Vývoj HTML...292 WebGL...292 Zařízení...295 Datová audiorozhraní...295 Vylepšení videa...296 Události a dotykové obrazovky...296 P2P sítě...299 Kam to celé směřuje...299 Shrnutí...300 Rejstřík... 301