
var save = function(key, value) { return; };
var read = function(key) { return; };

function send(message) {
    socket.emit('broadcast', message);
    console.log(message);    
}

if(typeof(Storage) !== "undefined") {
    console.log("has storage");
    save = function(key, value) {
        var json = JSON.parse(localStorage.getItem("json"));
        json[key] = value;
        localStorage.setItem("json", JSON.stringify(json));
        console.log(key + " saved: " + value);
    };
    read = function(key) {
        var json = JSON.parse(localStorage.getItem("json"));
        if (json === null || json.key === undefined) {
            return undefined;
        }
        console.log(json[key]);
        return json[key];
    };
} else {
    console.log("does not has storage");
}

$("#reloadButton").click(function() {
    send({ event: 'reload' });
});
$("#hideMsgButton").click(function() {
    message = { event: 'hide-messages' };
    send(message);
    $("#showMsgButton").show();
    $("#hideMsgButton").hide();
});
$("#showMsgButton").click(function() {
    message = { event: 'show-messages' };
    send(message);
    $("#hideMsgButton").show();
    $("#showMsgButton").hide();
});

$("#title").blur(function() {
    message = { event: 'title', data: { text: $("#title").val() } };
    send(message);
    save('title', message.data.text);
});

$("#subtitle").blur(function() {
    message = { event: 'subtitle', data: { text: $("#subtitle").val() } };
    send(message);
    save('subtitle', message.data.text);
});

$("#hero").change(function() {
    message = { event: 'hero', data: { text: $("#hero").val() } };
    send(message);
    save('hero', message.data.text);
});

$("#rank").blur(function() {
    message = { event: 'rank', data: { text: $("#rank").val() } };
    send(message);
    save('rank', message.data.text);
});

$("#crawl").blur(function() {
    message = { event: 'crawl', data: { text: $("#crawl").val() } };
    send(message);
    save('crawl', message.data.text);
});

$("input[data-group='percents']").change(function() {
    message = { event: 'value', data: { id: $(this).attr("id"), text: parseInt($(this).val()) } };
    send(message);
    save(message.data.id, message.data.text);
});

var reload = function(id) {
    var value = read(id);
    if (value !== undefined) {
        $("#" + id).val(value);
        save(id, value);
    }
}

$(document).ready( function() {
    reload("title");
    reload("subtitle");
    reload("hero");
    reload("rank");
    reload("crawl");

    reload("blackhearts-bay-percent");
    reload("cursed-hollow-percent");
    reload("dragon-shire-percent");
    reload("haunted-mines-percent");
    reload("garden-of-terror-percent");
    reload("sky-temple-percent");
    reload("tomb-of-the-spider-queen-percent");


});
@@ -606,12 +606,13 @@
 json
-.
+%5B
 key
+%5D
  ===
@@ -723,23 +723,278 @@
 n%5Bkey%5D;%0A
-
     %7D;%0A
+    reload = function() %7B%0A        var json = JSON.parse(localStorage.getItem(%22json%22));%0A        if (json === null) %7B%0A            return undefined;%0A        %7D%0A        $.each( json, function (id, value) %7B%0A            $(%22#%22 + id).val(value);%0A        %7D);%0A    %7D%0A
 %7D else %7B
@@ -2486,570 +2486,62 @@
 );%0A%0A
-var reload = function(id) %7B%0A    var value = read(id);%0A    if (value !== undefined) %7B%0A        $(%22#%22 + id).val(value);%0A        save(id, value);%0A    %7D%0A%7D%0A%0A$(document).ready( function() %7B%0A    reload(%22title%22);%0A    reload(%22subtitle%22);%0A    reload(%22hero%22);%0A    reload(%22rank%22);%0A    reload(%22crawl%22);%0A%0A    reload(%22blackhearts-bay-percent%22);%0A    reload(%22cursed-hollow-percent%22);%0A    reload(%22dragon-shire-percent%22);%0A    reload(%22haunted-mines-percent%22);%0A    reload(%22garden-of-terror-percent%22);%0A    reload(%22sky-temple-percent%22);%0A    reload(%22tomb-of-the-spider-queen-percent%22);%0A%0A%0A%7D);
+    %7D%0A%0A$(document).ready( function() %7B%0A    reload();%0A%7D);%0A%0A

fix reloading and reinitalizing of stored json