{"author_name":"Thecoolestnerdguy","cat":"LD #26","comments":[{"author_name":"","time":"April 22, 2013 7:09 am","epoch":1366632540,"text":"JSON (JavaScript Object Notation) is the answer to your question","spam":"N"},{"author_name":"","time":"April 22, 2013 7:13 am","epoch":1366632780,"text":"Another idea popped up in my head just now: strip the HTMLImage elements and only conserve the image path. Any element of the DOM tends to screw up JSON.","spam":"N"}],"epoch":1366631340,"likes":1,"metadata":{"p_key":"46948","p_author":"Thecoolestnerdguy","p_authorkey":"506310","p_urlkey":"82611","p_title":"Stringy madness","p_cat":"LD #26","p_event":"LD26","p_time":"1366631340","p_likes":"1","p_comments":"2","p_status":"UPD5","us_key":"506310","us_name":"Thecoolestnerdguy","us_username":"Thecoolestnerdguy","event_start":"1366934400","event_key":"16","event_name":"LD26"},"text":"

So, I’m making a veeery basic level editor in html5 for LD.<\/p>\n

“Ok, what’s the matter”, you could ask. Well, as you know, level editors “generally” needs to actually save the levels.<\/p>\n

I tried some solutions and the localStorage API seemed to be \u00a0a easy win, except for one thing: it just works with strings!<\/p>\n

My level editor saves all the objects on the level in a gigantic array. I just needed to save that array, but how?<\/p>\n

Four steps:<\/p>\n

 <\/p>\n

    \n
  1. Convert every property in every object in the array to a string and save them in temporary objects in a temporary array.<\/span><\/li>\n
  2. Convert every object on the temporary array to strings.<\/li>\n
  3. Convert the array populated with strings into a string.<\/li>\n
  4. Save the gigantic string on localStorage.<\/li>\n <\/ol>\n

     <\/p>\n

    “Well, why not use JSON.stringify with the array” you may also ask. Well, because I was getting some “circular structure” errors, and I had no patience to figure out what was causing it.<\/p>\n

    “And why this is so mad” you may finally ask. Well, because a level (with only two tiles) looks something like this:<\/p>\n

     <\/p>\n

    [“{\\”x\\”:\\”240\\”,\\”y\\”:\\”192\\”,\\”cell\\”:\\”0,0\\”,\\”image\\”:\\”[object HTMLImageElement]\\”,\\”imgsrc\\”:\\”spritesheet.png\\”,\\”densidade\\”:\\”0\\”,\\”friccao\\”:\\”0\\”,\\”<\/p>\n

    elasticidade\\”:\\”0\\”,\\”tipo\\”:\\”static\\”,\\”collisiongroup\\”:\\”solid\\”,\\”forma\\”:\\”Quadrada\\”}”,”{\\”x\\”:\\”272\\”,\\”y\\”:\\”192\\”,\\”cell\\”:\\”0,0\\”,\\”image\\”:\\”[object HTMLImageElement]\\”,\\”imgsrc\\”:\\”spritesheet.png\\”,\\”densidade\\”:\\”0\\”,\\”friccao\\”:\\”0\\”,<\/p>\n

    \\”elasticidade\\”:\\”0\\”,\\”tipo\\”:\\”static\\”,\\”collisiongroup\\”:\\”solid\\”,\\”forma\\”:\\”Quadrada\\”}”]<\/p>\n

     <\/p>\n

    Well, there must be a more elegant way to do this…<\/p>\n

     <\/p>\n

    Potatoes FTW!<\/p>","time":"April 22nd, 2013 6:49 am","title":"Stringy madness"}