How to use saveJSON and loadJSON (Custom Boards)

Get help with JavaScript coding questions and share your snippets with the community.
Post Reply
User avatar
swordmaster
Site Admin
Posts: 53
Joined: Tue May 23, 2017 11:22 pm

How to use saveJSON and loadJSON (Custom Boards)

Post by swordmaster » Fri Oct 06, 2017 9:54 pm

As requested by Grindalf, this post contains a more detailed example of how to use saveJSON to create boards at runtime.

Raw code past below of a working example, you can use this with the included demo project to create the below board:

Image

Simply save it as a program, and then set that as the project's startup program to see the result.

Code: Select all

// Variable that contains the board file format data.
var boardData = {
   "backgroundMusic":"",
   "tileSets":[
      "tower.tileset"
   ],
   "name":"Simple2.board",
   "width":5,
   "layers":[
      {
         "tiles":[ 
            // Number to left of the ":" is the index of the tileset in "tileSets", 
            // the number to the right is the tile index.
            "0:30", "0:30", "0:30", "0:30", "0:30",
            "0:30", "0:30", "0:30", "0:30", "0:30",
            "0:30", "0:38", "0:30", "0:38", "0:30",
            "0:30", "0:38", "0:30", "0:38", "0:30", 
            "0:30", "0:38", "0:38", "0:38", "0:30"
         ],
         "vectors":[
            {
               "isClosed":false,
               "id":"",
               "type":"SOLID",
               "events":[
                  {
                     "program":"",
                     "type":"overlap"
                  }
               ],
               "points":[
                  {
                     "x":32,
                     "y":64
                  },
                  {
                     "x":32,
                     "y":160
                  },
                  {
                     "x":64,
                     "y":160
                  },
                  {
                     "x":64,
                     "y":64
                  },
                  {
                     "x":32,
                     "y":64
                  }
               ]
            },
            {
               "isClosed":false,
               "id":"",
               "type":"SOLID",
               "events":[
                  {
                     "program":"",
                     "type":"overlap"
                  }
               ],
               "points":[
                  {
                     "x":64,
                     "y":128
                  },
                  {
                     "x":64,
                     "y":160
                  },
                  {
                     "x":96,
                     "y":160
                  },
                  {
                     "x":96,
                     "y":128
                  },
                  {
                     "x":64,
                     "y":128
                  }
               ]
            },
            {
               "isClosed":false,
               "id":"",
               "type":"SOLID",
               "events":[
                  {
                     "program":"",
                     "type":"overlap"
                  }
               ],
               "points":[
                  {
                     "x":96,
                     "y":64
                  },
                  {
                     "x":96,
                     "y":160
                  },
                  {
                     "x":128,
                     "y":160
                  },
                  {
                     "x":128,
                     "y":64
                  },
                  {
                     "x":96,
                     "y":64
                  }
               ]
            },
            {
               "isClosed":false,
               "id":"",
               "type":"PASSABLE",
               "events":[
                  {
                     "program":"",
                     "type":"overlap"
                  }
               ],
               "points":[
                  {
                     "x":64,
                     "y":64
                  },
                  {
                     "x":64,
                     "y":96
                  },
                  {
                     "x":96,
                     "y":96
                  },
                  {
                     "x":96,
                     "y":64
                  },
                  {
                     "x":64,
                     "y":64
                  }
               ]
            }
         ],
         "name":"Untitled Layer 0"
      }
   ],
   "firstRunProgram":"",
   "tileWidth":32,
   "startingPosition":{
      "x":83,
      "y":20,
      "layer":0
   },
   "version":1.1,
   "sprites":[
      {
         "name":"EvilEye.npc",
         "id":"My-NPC",
         "thread":"",
         "startingPosition":{
            "x":80,
            "y":112,
            "layer":0
         },
         "events":[

         ]
      }
   ],
   "height":5,
   "tileHeight":32
};

// Save our custom board, will be stored in the temporary runtime Boards directory
// not the project directory we normally work from.
rpgcode.saveJSON(
   {     
      path: "Boards/test.board", // Subdirectory and file to save.
      type: "board",    
      data: boardData 
   },
   function(response) {    // Success callback.
      // Below code is triggered if the save was successful.    
      rpgcode.sendToBoard("test.board", 2, 0, 0);
      rpgcode.endProgram(); 
   },  
   function(response) {    // Failure callback.
      // Below code is triggered if the save failed.     
      rpgcode.endProgram(); 
   }
);

Grindalf
Posts: 15
Joined: Sat May 27, 2017 8:04 am
Location: Sidmouth, devon

Re: How to use saveJSON and loadJSON (Custom Boards)

Post by Grindalf » Sat Oct 07, 2017 9:11 am

WOW Nice example swordmaster, I'm sure I will have many more questions but this should keep me busy for at least a few hours

rpggamer17
Posts: 47
Joined: Wed Jun 07, 2017 2:14 am

Re: How to use saveJSON and loadJSON (Custom Boards)

Post by rpggamer17 » Sun Oct 08, 2017 4:33 am

To help with custom maps

Code: Select all

function prepareMapForLoad( map ) {
   var load = []; //same as: = new Array();
   for(y = 0; y < map[0].length; y++) { //the wizard loads boards using row style
      for(x = 0; x < map.length; x++) { load.push(map[x][y]); }
   }
   return load;
}
function getTileInfo(map,x,y) {
   var arraySplit = map[x][y].split(":");
   //parseInt converts the string to an int value, It really isn't needed
   return { tileset: parseInt(arraySplit[0]), index: parseInt(arraySplit[1]) };
}
function setTileInfo(map,x,y, index, tileset) {
   var info = getTileInfo(map,x,y);
   if( tileset == null ) { //left out: keep the previous value
      tileset = info.tileset;
   }
   map[x][y] = tileset+":"+index;
}
//can work with objects
function createMap(rowLength, columnLength, fillWith) {
   var map = new Array(rowLength);
   var x;
   for(x = 0; x < map.length; x++) { //create columns
      map[x] = new Array(columnLength);
      if( fillWith ) {
         if( typeof fillWith !== 'object' ) {
            map[x].fill(fillWith);
               //note: passing objects to fill will result in a reference copy.
               //changing one will change them all.
         }
         else {
            for(y = 0; y < map[x].length; y++) { 
               map[x][y] = Object.assign({},fillWith); //copy basically
            }
         }
      }
   };
   return map;
}

var boardWidth = 5;
var boardHeight = 5;
map = createMap(boardWidth,boardHeight,"0:30");
setTileInfo(map,1,2, 30); setTileInfo(map,3,2, 38);
setTileInfo(map,1,3, 38); setTileInfo(map,3,3, 38);
setTileInfo(map,1,4, 38); setTileInfo(map,3,4, 38);
map[1][2] = "0:38"; //x = 1, y = 2; //directly access

/*
//show:
map.forEach( function (arrx, x) { //for(x = 0; x < map.length; x++) { arrx = map[x];
   arrx.forEach( function (value,y) {//for(y = 0; y < map[x].length; x++) { value = map[x][y];
      rpgcode.drawText(20+(x*30)+(5*x), 20+(y*30), value); 
   }); 
});
rpgcode.renderNow();
*/

load = prepareMapForLoad(map); //adjusted array for loading
you'd change swordmasters code to "tiles": load

Post Reply