sessionStorage working but need a cookie

Question

So I have got the following code doing what I need it to but have now been told it needs to work within ie7 and sessionStorage doesn't work in that browser. I don't have much knowledge of cookies so was wondering if someone could point me in right direction.

    var yetVisited = sessionStorage['visited'];
    if (!yetVisited) {

        $j("#adspaceModal").modal("show").on("shown", function () {
    window.setTimeout(function () {
        $j("#adspaceModal").modal("hide");
    }, 20000);
});

        // open popup
        sessionStorage['visited'] = "yes";
    }

At the moment my modal appears the first time you visit the home page and doesn't appear unless I open it in a new tab/window, which works how I want it to.

Any help is much appreciated.

Answer 1

You can use feature detection to find out if sessionStorage is available, and if not use the jQuery Cookie plugin:

var yetVisited = sessionStorage ? sessionStorage['visited'] : $.cookie('visited');
if (!yetVisited) {
    $j("#adspaceModal").modal("show").on("shown", function () {
        window.setTimeout(function () {
            $j("#adspaceModal").modal("hide");
        }, 20000);
    });

    // open popup
    sessionStorage ? sessionStorage['visited'] = 'yes' : $.cookie('visited', 'yes');
}

In fact it's probably better to abstract it to it's own function:

function storage(key, value) {
    if (!value) {
        // getter
        return window.sessionStorage ? window.sessionStorage[key] : $.cookie(key);
    } 
    else { 
        // setter
        window.sessionStorage ? window.sessionStorage[key] = value : $.cookie(key, value);
    }
}