CODEWITHSUNDEEP
javascriptjquerycookieslocal-storage
Charlie
Charlie

Reputation: 11787

Save draggable div's position to localstorage?

I'm rewriting my code that allowed a user to drag a div on iOS so that it is cleaner, and one of the changes I am hoping to implement is using localstorage to save and retrieve the position of each of these div's.

jQuery:

$(".drag").each(function () {
    var drag = this;
    xPos = drag.offsetWidth / 2;
    yPos = drag.offsetHeight / 2;
    drag.addEventListener("touchmove", function() {
        event.preventDefault();
        $(this).css({
            "left" : event.targetTouches[0].pageX - xPos + "px", 
            "top" : event.targetTouches[0].pageY - yPos + "px",
            "z-index" : "101",
        });
        $("div").not(this).css("z-index", "100");
    });
});

Before, I had set the position by using a cookie:

$(window).unload(function () {
    $(".remember").each(function () {
        $.cookie(this.id, this.value, {
            expires: 365
        });
    });
    $(".draggable").each(function () {
        var a = $(this);
        $.cookie(this.id, a.css("top") + "_" + a.css("left"), {
            expires: 365
        });
        $.cookie("disp" + this.id, a.css("display"), {
            expires: 365
        });
    });
});

Each div that was draggable had a .draggable class on it, and if I wanted to save the value of a text box, it had a .remember class on it.

Is it worthwhile/practical updating it to use LocalStorage?

Upvotes: 1

Views: 1875

Answers (1)

c69
c69

Reputation: 21517

Localstorage is much better place for this, than cookie. Because you will not send additional bytes to server with each request and so on. Just keep in mind that most problems with cookies remain with transition to localStorage - scripts from multiple tabs and same domain can mess up with your stored data, but i assume its your own site without third party includes, that you should worry about.

Upvotes: 1

Related Questions