Ok, vista la marea di richieste (santo cielo, siete proprio dei lurker e non ditemi che non trovate il tempo di fare come digitaljail e scrivere almeno "chiedo") mi sono attivato per trovare un modo per postare il codice.
Ecco a voi il frutto dei miei sforzi, non vi chiedo di astenervi da commentare la qualità del codice (lurker dannati), è da intendersi solo come esempio di funzionalità del DOM Storage e della capacita di FF3 beta 3 di individuare l'evento online e agire di conseguenza.
il tutto (corredato dai commenti) dovrebbe essere abbastanza chiaro, se vi resta qualche dubbio o volete qualche chiarimento e non siete dei lurker potete chiedere lumi nei commenti.
Se vi interessa per risolvere il problema del codice ho dovuto trasformare ogni < e > nei corrispettivi < e >.
L'illuminazione è stata fornita da questo post.
Ecco a voi il frutto dei miei sforzi, non vi chiedo di astenervi da commentare la qualità del codice (lurker dannati), è da intendersi solo come esempio di funzionalità del DOM Storage e della capacita di FF3 beta 3 di individuare l'evento online e agire di conseguenza.
<html>
<head><TITLE>Offline WebApp</TITLE>
<script language="JavaScript">
var storage=globalStorage['www.questoindirizzononesiste.it'];
var send_item;
// Invia la form distinguendo l'azione da compiere in base allo status attuale del browser
function submitForm(form){
if(navigator.onLine){
alert(form.campo1.value);
} else {
pushItem(form.campo1.value);
}
form.campo1.value="Dati inviati";
}
// Rimuove dal DOM Storage una chiave
function removeItem(key){
storage.removeItem(key)
}
// Salva un elemento nel DOM Storage in una stringa con campi separati da ^
function pushItem(item){
var string=storage.getItem("array");
if(string == null)
storage.setItem("array",item+"^");
else
storage.setItem("array",string+item+"^");
}
// Resetta sia la form che il DOM Storage, cancellando quanto memorizzato
function clean(){
document.testform.campo1.value="Scrivi qui";
removeItem("array");
}
// Recupera il primo elemento dal DOM Storage gestito come una lista FIFO
function shiftItem(){
var arr_tmp=new Array();
var str_tmp=storage.getItem("array");
if(str_tmp == null)
return('');
arr_tmp=str_tmp.value.split("^");
var item=arr_tmp.shift();
storage.setItem("array",arr_tmp.join("^"));
send_item=item;
return(item);
}
// Recupera tutti gli elementi salvati e li usa per popolare la form e effettuarne il submit
function send_cached(form){
while (shiftItem() != ''){
form.campo1.value=send_item;
submitForm(form);
}
}
// Viene richiamata quando il browser torna online e invia tutto quanto
// è stato memorizzato in una cache (grazie al DOM Storage)
function updateOnlineStatus(msg) {
if (navigator.onLine) {
send_cached(document.testform);
}
}
function loaded() {
document.testform.campo1.value="Scrivi qui";
document.body.addEventListener("online", function () {
updateOnlineStatus("online")
}, false);
}
</script>
</head>
<body onload="loaded()">
<FORM name="testform" action="submitForm(this.form)">
<INPUT type="text" name="campo1" onfocus="this.value=''">
<p><INPUT type="button" value="Invia" onclick="submitForm(this.form)">
<INPUT type="button" value="Azzera" onclick="clean()"></p>
</FORM>
</body>
</html>
il tutto (corredato dai commenti) dovrebbe essere abbastanza chiaro, se vi resta qualche dubbio o volete qualche chiarimento e non siete dei lurker potete chiedere lumi nei commenti.
Se vi interessa per risolvere il problema del codice ho dovuto trasformare ogni < e > nei corrispettivi < e >.
L'illuminazione è stata fornita da questo post.
Commenti