HTML5 Offline / Online App

Question

Im building a small todo app in html5. Works fine so far but i have a problem: If the user visits http://www.mydomain.com/ he is prompted to login. If he is logged in on / a different template is served -> my main application template. Plus a cookie is set for session handling.

Now he can add/delete/edit his todos. While he is online the todos are saved on the server. I also added a cache manifest for my site and use local storage to save his todos when he's offline. This works fine so far.

My Problem: If the user is online and logs himself out of the site, and the server isn't serving the main application template anymore, the browser uses the offline version of the site. But he should only use it if the browser is offline, not when the server is sending another template on the same path.

Someone a hint for me? Thanks in advance!

Answer 1

Use this function to get the cookie that is stored on your client machine. In case it returns null then that means the user is logged out. This should be done every time the page is loaded. You could also redirect the user to the login page.

    var function getCookie(c_name)
        {
        var i,x,y,ARRcookies=document.cookie.split(";");
        for (i=0;i<ARRcookies.length;i++)
        {
          x=ARRcookies[i].substr(0,ARRcookies[i].indexOf("="));
          y=ARRcookies[i].substr(ARRcookies[i].indexOf("=")+1);
          x=x.replace(/^\s+|\s+$/g,"");
          if (x==c_name)
            {
            return unescape(y);
            }
          }
        }

var cookie = getCookie("myDomainAuthenticationCookie");

if(cookie == null)
{
window.location.href = "/myDomain.com/Accounts/Login"
}