Názory k článku
OffTheRoad: Píšeme offline aplikaci s HTML5

Výborný článek, taková praktická sumarizace a implementace těch předchozích. Díky :)

Moc pekny clanek. Ovsem je videt ze se to na kazdem prohlizeci chova jinak – na iPhone v off-line rezimu mi to neuklada zpravy do fronty. Mohlo by to byt zpusobeno i tim, ze v off-line rezimu nezjistit polohu z GPS (v on-line rezimu ji zjisti z vysilace wifi/gsm) – jsem v tuto chvili pod strechou. Az budu mit vic casu a moznost vyjit ven tak se na to zkusim podivat.
Co se tyce off-line rezimu, tak s tim jsem take bojoval, nakonec jsem se dostal do stavu, kdy jsem cisloval vsechny soubory. Pozdeji jsem si o tom precetl neco vic a doufal ze pujde cache obnovit pouzitim window.applica­tionCache.upda­te(), ale k tomu vyzkouset jak se to bude chovat jsem se uz nedostal.

Já se k window.appli­cationCache.up­date() dostal, a právě u téhle metody jsem se zasekl na velmi dlouho. Totiž: ona metoda (FF3.6) sice načítá manifest, ovšem mezi ní a souborem na serveru leží ještě HTTP cache (v prohlížeči, v serveru a leckdy i jinde). A pokud tuhle nepotlačíte, tak bohužel – metoda update() se totiž (alespoň ve FF3.6) spokojila i s odpovědí 304 a pravděpodobně nežádala o necachovanou verzi. Nakonec se mi osvědčila kombinace s „vymazáním lokálně uložených dat“ (ve FF3.6 to je Možnosti – Rozšířené – Síť – Úložiště režimu offline), pak si prohlížeč zaručeně sahal pro nový manifest. Ale jak říkám: Každý prohlížeč se bude chovat naprosto jinak.
V Safari *by to mělo* fungovat, ovšem jestli to bude fungovat zrovna v té verzi, co je ve vašem iPhone, to je ve hvězdách.

Kto píše ten Javascriptový kód? Výraz !JSON v prehliadačoch, ktoré JSON nepodporujú, vyhodí ReferenceError. Správny zápis by vyzeral !window.JSON, alebo !(„JSON“ in window), alebo kontrola pomocou typeof. Podobnú chybu robíte aj vo vašom detektore podpory HTML5, máte tam !!FileReader, minimálne IE8 na tom vyhodí chybu.
Tiež nepovažujem za šťastný nápad siahať akémukoľvek elementu na atribút style, jednoduchšia by bola aplikácia, keby ste jedným riadkom kódu nastavili documentElementu nejakú triedu a všetky zobrazenia či nezobrazenia prvkov riešili v CSS.
Prečo sa obsluha udalostí online a offline pripája dvakrát za sebou?
Inak článok je celkom dobrý.

Á, ten kód píše externí stážistka… :)
Ne, napsal jsem to já a za !JSON se kaju. Kdesi jsem to objevil, zkusil, fungovalo… Díky za upozornění, upravil jsem to i v detektoru (ale divné, IE8 nic nehlásil).
„Sahání na atribut style“ není v ukázce coby „čistá metoda“, ale coby metoda „rychlá“. Přepínání barev či viditelnosti není podstatou ukázky, proto jsem bez rozpaků zvolil tento „quick-and-dirty“ přístup, kde je jasně na první pohled vidět: Aha, element bude schován. Kdybych se nestyděl nalinkovat jQuery, tak tam bude $(„element“).hi­de(); Ale nešlo o to ukazovat metody skrývání prvků, pohybujeme se o úroveň výš, skrývání je nepodstatné, podstatnější je kombinace nových API (a odvážím se tvrdit, že i konkrétní kód, který s ním pracuje, je podružný)!
Obsluha připojena dvakrát: Viz diskuse u příslušného článku – připojení pouze pomocí addEventListener v některých prohlížečích nefungovalo stoprocentně (a ani dvojnásobné nefunguje spolehlivě všude).

Ďakujem za odpoveď. Ale s tým IE8 je to zaujímavé, ja si spomínam na Error on page a Opera takisto vyhodí na takomto kóde výnimku. Hm.

Článek výborný! Navíc jsem ten vtípek s OffTheRoad postřehl až poměrně pozdě a pochvaloval si u prvních odstavců, jak ten Michal Bláha pěkně umí psát :-)
V JavaScriptu mě trošku zarazila konstrukce !((‚localStorage‘ in window) && window[‚local­Storage‘] !== null) u které prostě nemohu přijít na to, jak se liší od prostého !window.local­Storage. Je to bug nebo záměr?

Díky. Konstrukci jsem opsal od Pilgrima (http://diveintohtml5.org/detect.html sekce Detection), protože věřím, že ví co dělá a že má nějaký specifický důvod to dělat právě takhle (protože u jiných HTML5 vymožeností má test jednoduchý). Ano, vypadá to divně, ale jsou dvě možná vysvětlení: Buď se Pilgrim upsal a neopravil, nebo se setkal s nějakou nestandardností, o které nevím. Z nějakého důvodu je test stejně i v Modernizru (u local i session storage). Možná to je jen nějaký tradovaný omyl, možná to je reakce na nějakou specifičnost nějakého prohlížeče. Nemám na to to ověřovat, jestli chceš, prozkoumej to a poinformuj. Nebo – nejde okolo nějaký odborník na JS?

Asi tušíš, že „protože věřím, že ví co dělá a že má nějaký specifický důvod“ je přesně ten typ odpovědi, se kterým se nemohu spokojit. Díky za navedení na Modernizr, tam jsem našel odpověď: tested via the in operator because otherwise Firefox will throw an error: https://bugzilla.mozilla.org/show_bug.cgi?id=365772 if cookies are disabled
Nicméně ta konstrukce s hranatýma závorkama a null je už zbytečná, stačilo by jen && window.localSto­rage.

Takže jsem měl recht a vystačil jsem s vírou, že to je kvůli něčemu divnému. O konstrunkci se, Davide, nebudu dohadovat, a opět odpovím stejně: Nezkoušel jsem a nevím proč je to přesně takhle.
Nicméně bych se obával napsat to jako && window.localStorage a z důvodu, o němž věřím, že je dobrý, bych použil && (!!window.local­Storage)

&& window.localStorage a && (!!window.local­Storage) je totéž, pokud je to použito v podmínce if, naopak třeba v return by to bylo něco jiného.

Řídím se zásadou, že než si pamatovat kde mohu použít jiný zápis, je pro mne jednodušší používat všude stejný. Takže si pamatuju, že kde chci použít objekt na místě pravdivostní hodnoty, tam dám dvojí negaci, i když by tam být nemusela. Připadá mi to v téhle situaci jako „závorka navíc“ – nemusí být, ale přispěje srozumitelnosti. U zápisu !!window.storage vidíš, že nejde o data v objektu, ale o to udělat z něj pravdivostní hodnotu.

O tom není sporu, !!window.local­Storage je zcela v pořádku, zarazilo mě použití window[‚local­Storage‘] !== null, které je v kontextu tvého i Markova článku vybočením z normálu, takže jsem v tom popátral a zjistil, že vzniklo jen jako důsledek otrockého přepisu z Modernizr. Peace!

Tak ještě zbývá dodat, proč to autoři Modernizru takhle napsali… Peaceoir!

Protože mají název ‚localStorage‘ v konstantě, tak museli použít hranaté závorky. A v konstantě to mají kvůli lepší minifikaci. Ta za všechno může!

Což je ovšem mimifikace na prd. Mimifikovaný soubor je sice menší.. o to hůř ho ale pak GZIP kompresí. True story.

IE8 totiž podporu JSON má.

Ukázka mi nefunguje v žádném prohlížeči. Který bych měl použít?
Opera 10.60 a Chrome 5.0.375.126 ne­funguje detekce offline.
Firefox 3.6.8 nefungu­je vůbec.

V Opeře 10.60 mi online/offline funguje, ale nezařazuje to zprávy do fronty. (Může být způsobeno konfliktním UserJS, nebo nějakým mým nastavením, dost se v tom vrtám).
Ve Firefoxu 3.6.6 to funguje bezchybně.
Chromium (nějaký dnešní nightbuild) se mi nepodařilo přepnout do offline módu (ani jsem po tom nějak moc nepátral).
Docela rád bych se na to podíval podrobněji, ale moc práce a málo času :(

Dobrý den,
děkuji za názorný článek.
Akorát bych se chtěl zeptat (i když to sem možná nepatří), jak znovu spustit aplikaci na N900 bez připojení. Odjel jste na místo, kde není 300 km kolkolem vůkol GSM signál a …?
Děkuji

Dobrý den,
odpověď je: „… a klikl jsem si na ploše na ikonu, kterou jsem si tam předtím vytvořil pomocí Vytvořit zástupce na ploše. To otevře prohlížeč s patřičnou URL, která je v AppCache, takže se aplikace načte odtamtud.“ Nebo bych mohl otevřít prohlížeč a zadat URL/vzít z Favorites… Pokud je pro to URL záznam v AppCache, čte se z AppCache.

Dobrý den,
děkuji za odpověď.
Asi je to tím pátkem třináctým, či snad rukama gramlavýma, však mně se nechce aplikace nikdy z AppCache načíst. Vždycky MicroB chce připojení na net a když nevyberu, tak zahlasí chybu spojení. I když podle http:///ukazky­.zdrojak.cz/html5/ je AppCache k dispozici.

No, to je právě ukázka toho, co jsem psal na konci – že si prohlížeče vykládají podporu AppCache různě. Já to zkusil i ve Firefoxu pro Maemo, a tam to funguje, takže je to zatím spíš Proof-Of-Concept než reálně použitelná věc. Bohužel… Musíme nějakou dobu počkat, až bude podpora skutečná, ne jen deklarovaná.

Opravdu jednoduché a názorné vysvětlení všeho nového na jednom místě, díky!

Nemala by sa funkcia dequeue volat z funkcie online?

Máte na mysli to, co je v článku popsáno slovy „A právě ve funkci online, která je zavolaná po přechodu z offline do online, si zavoláme nějaké to „vysypání přichystaných zpráv z fronty“.“?

Sorry, trochu som to prehliadol. Pozeral som hlavne zdrojaky a tam nie je volana ta funkcia. Inak super clanok, vdaka…