A particular value isn't stored in localstorage within phonegap when I close the app... Other do..Why?

Question

I was trying the whole week to get this working and it still aint! I'm very sure it's not a big deal! I new to phonegap and jquery and I think I haven't implemented the script correctly.

So I have his feature in my app where I have 5 lifes and each time I press a button they decrease and they regenerate each after 6 seconds aslo if the app is closed!! (further I'll change the time and I'll remove the button, I'll set to remove a life each time the player loses a lvl and to don't start a lvl if lifes == 0 so thst's not a issue for now)

This script actiolly decreases the time when I pressed the remove life buton and the current time and if its more or equal than 6 seconds it adds lifes representing that gap.

I also have an web example wich works except the strange fact that the lives and the date values aren't updating in the localstorage and also in the div only if I click somewhere random on the page. (this script helped me somebody to make but he also doesn't know how to fix the bug) https://student.sps-prosek.cz/~eisead11it/web/IS/Administrace/index.html

I need this script in my phonegap application. And fter implementing it I saw another BIG problem: It doesn't work if I close the app and reopen it.

I also made today the whole day some steps on the mobile version to try and find the bug... I pulled on each step the fresh localstorage db from the device:

1) I cleared the localstorage and I entered the app, I killed some lives and they regenerated ok. 2) I left the app with all the 5 lives active and I closed it 3) after 1 sec I reopened it and I saw that the data from localstorage was empty 4) When I press the remove live button the lifes decreases but NO DATA was stored in the localstorage!!! and no lifes are regenerating 5) If I wait 5*15 sec (the time in wich all the lives shoud have been regenerated while this, the current life state is 0 in the app and also in the localstorage) or if I minimise the app and maximize and I PRESS AGAIN the button, a date is stored in the localstorage, the current lives are set to 4 and the lives begin to regenerate normally untill they reach 5.

I don't know why the date isn't stored if I reenter the app and I press the button. That might be the issue.

Otherwise everything is working fine while thw first run of the app.

I tested it on my galaxy s2, on galaxys2 mini, on eclipse emulator and on ripple emlator and still the same effects on all.

A strange thing is that the lvl and the life values are stored 100% perfectly in the localsorage and when I reenter the app they are still there EXCEPT the date value wich after reentering the app is lost.

I really really dont know why is that? I thing the bug is because the date isn't saved correctly or it gets removed when I start again the app.

THIS IS THE MAGIC SCRIPT:

Just a small date validator...

Date.prototype.isValid = function(first_argument) {
    if ( Object.prototype.toString.call(this) !== "[object Date]" )
        return false;
    return !isNaN(this.getTime());
}

The main var declaration among retrieving variables from localStorage

var timeout = null;
var maxlife = 5;
if (undefined === localStorage.life) {
    localStorage.life = maxlife;
}
if (undefined === localStorage.date||localStorage.date!="") {
    localStorage.date = "";
    var date = null;
}else{
    var date = new Date(Number(localStorage.date));
    if(!date.isValid()){
        date = null;
    }
}
var timeoutTime = 5 * 60000;
var life = Number(localStorage.life);

Lose life, set date if none exist yet. Set a timeout too and subtract life (& write it into localstorage).

function loseLife() {
    if (null === date) {
        date = new Date();
        localStorage.date = date.getTime();
        timeout = setTimeout(function(){addLife()}, timeoutTime);
    }
    life--;
    localStorage.life = life;
    lives.innerHTML = life;
    console.log(life);
}

Add life, set date new date or reset the date completely. Set a timeout, if needed, and add a life (& write it into localstorage).

function addLife() {
    life++;
    localStorage.life = life;
    if (life < maxlife) {
        date = new Date();
    localStorage.date = date.getTime();
        timeout = setTimeout(function(){addLife()}, timeoutTime);
    } else {
        date = null;
    localStorage.date = "";
    }
    lives.innerHTML = life;
}

Here you may need to change the hooks for blur (window not visible) and focus (window visible once again). Blur just clear timeout so it don't mess with us.

window.addEventListener('blur', function () {
    clearTimeout(timeout);
});

This function check how many time it can subtract our time needed to get life from difference of now and the date we lost a life.

function tillNow(){
    if (life < maxlife&&date!=null) {
        var d = new Date();
        var diff = d - date;
        while (diff - timeoutTime > 0) {
            diff = diff - timeoutTime;
            if (life < maxlife) {
                life++;
                console.log("add");
            }else{
                date = null;
                localStorage.date = "";
                break;
            }
        }
        lives.innerHTML = life;
        localStorage.life = life;
        if (life < maxlife) {
            date = new Date((new Date()).getTime()-diff);
            localStorage.date = date.getTime();
            timeout = setTimeout(function(){addLife()}, timeoutTime-diff);
        }
    }
}

Focus just call tillNow()

window.addEventListener('focus', function () {
    tillNow();
});

Onload do the same as focus, but fills the div with a value initially...

window.onload=function(){
    var lives = document.getElementById("lives");
    lives.innerHTML = life;
    tillNow();
}

allright and this is my repo: https://bitbucket.org/alecstheone/whatsnap

and the js is stored in /platforms/android/assets/www/js/index.js (not in the first www folder)

Please if someone can take a look if might be my fulfilled dream as I stayed the whole week the whole day fixing it without resoult and as there is such a few support on the phonegap side.

Answer 1

I finally fixed it after a week of pain.. there was a bug: in the second if in the main var declaration it should be something like this:

if (undefined === localStorage.date||localStorage.date=="")

And I also removed the blur and focus events and used the onDeviceReady event that is featured within phonegap for the first declaration and tillNow() call!