yesh0907 Posted January 12, 2015 Share Posted January 12, 2015 Hi, this is my first post on here. Anyways I need help trying to solve this problem. I am making a 2D rpg game, and for now I am using a 2D array map on Phaser JS as a place holder for an actual map in the future. I need the map to generate randomly every time. I have tried my code on Phaser version 1.12 and it works. However, when I tried it on the latest version (v2.2.0) of Phaser, it did not work. I keep getting an error saying "Uncaught TypeError: Cannot set property 'content' of undefined". Here is my source code:// font sizevar FONT = 22;//Map's Displayvar mapText;//var Height and Width for the Map's COLS and ROWSvar HEIGHT = 550;var WIDTH = 800;//Key variable set upvar cursors;var spaceKey;//offset for map's positionvar MAP_OFFSET = 2.38;//Game's height and widthvar gameHeight = 600, gameWidth = 800;//Style of textvar style = { font: FONT + "px monospace", fill:"#fff"};// map dimensionsvar ROWS = HEIGHT/FONT;var COLS = WIDTH/FONT/0.61;// number of actors per level, including playervar ACTORS = 10;// the structure of the mapvar map;// the ascii display, as a 2d array of charactersvar asciidisplay;// initialize phaser, call create() once donevar game = new Phaser.Game(gameWidth, gameHeight, Phaser.CANVAS, '', { preload: preload, create: create, update: update});function preload() { game.load.spritesheet('dude', 'assets/dude.png', 32, 48);}function create() { game.physics.startSystem(Phaser.Physics.ARCADE); player = game.add.sprite(32, game.world.height - 150, 'dude'); game.physics.arcade.enable(player); player.body.gravity.y = 1500; player.body.collideWorldBounds = true; player.animations.add('left', [0, 1, 2, 3], 10, true); player.animations.add('right', [5, 6, 7, 8], 10, true); //Subject to change: cursors = game.input.keyboard.createCursorKeys(); spaceKey = game.input.keyboard.addKey(Phaser.Keyboard.SPACEBAR); // initialize map initMap(maze(ROWS, COLS)); // initialize ascii display asciidisplay = []; for (var y=0; y<ROWS; y++) { var newRow = []; asciidisplay.push(newRow); for (var x=0;x<COLS;x++) newRow.push(initCell('', x, y + MAP_OFFSET)); } drawMap();}function update() { player.body.velocity.x = 0; if (cursors.left.isDown) { player.body.velocity.x = -150; player.animations.play('left'); } else if (cursors.right.isDown) { player.body.velocity.x = 150; player.animations.play('right'); } else { //Stand Still player.animations.stop(); player.frame = 4; } if (spaceKey.isDown) { player.body.velocity.y = -550; }}function initCell(chr, x, y) { // add a single cell in a given position to the ascii display game.add.text(FONT*0.6*x, FONT*y, chr, style);}//creating the mapfunction initMap(m) { // create a new random map map = []; for (var j= 0; j<m.x*2+1; j++) { var line= []; if (0 == j%2) for (var k=0; k<m.y*4+1; k++) if (0 == k%4) line[k]= '+'; else if (j>0 && m.verti[j/2-1][Math.floor(k/4)]) line[k]= ' '; else line[k]= '-'; else for (var k=0; k<m.y*4+1; k++) if (0 == k%4) if (k>0 && m.horiz[(j-1)/2][k/4-1]) line[k]= ' '; else line[k]= '|'; else line[k]= ' '; if (0 == j) line[1]= line[2]= line[3]= ' '; if (m.x*2-1 == j) line[4*m.y]= ' '; map.push(line.join('')+'\r\n'); } return map.join('');}function drawMap() { for (var y = 0; y < ROWS; y++) for (var x = 0; x < COLS; x++) asciidisplay[y][x].content = map[y][x];}function maze(x,y) { var n=x*y-1; if (n<0) {alert("illegal maze dimensions");return;} var horiz =[]; for (var j= 0; j<x+1; j++) horiz[j]= [], verti =[]; for (var j= 0; j<y+1; j++) verti[j]= [], here = [Math.floor(Math.random()*x), Math.floor(Math.random()*y)], path = [here], unvisited = []; for (var j = 0; j<x+2; j++) { unvisited[j] = []; for (var k= 0; k<y+1; k++) unvisited[j].push(j>0 && j<x+1 && k>0 && (j != here[0]+1 || k != here[1]+1)); } while (0<n) { var potential = [[here[0]+1, here[1]], [here[0],here[1]+1], [here[0]-1, here[1]], [here[0],here[1]-1]]; var neighbors = []; for (var j = 0; j < 4; j++) if (unvisited[potential[j][0]+1][potential[j][1]+1]) neighbors.push(potential[j]); if (neighbors.length) { n = n-1; next= neighbors[Math.floor(Math.random()*neighbors.length)]; unvisited[next[0]+1][next[1]+1]= false; if (next[0] == here[0]) horiz[next[0]][(next[1]+here[1]-1)/2]= true; else verti[(next[0]+here[0]-1)/2][next[1]]= true; path.push(here = next); } else here = path.pop(); } return {x: x, y: y, horiz: horiz, verti: verti};}That is just the Javascript file. Please tell me if you want my HTML code. Thanks! Links I used for tutorials to code this so far:http://gamedevelopment.tutsplus.com/tutorials/how-to-make-your-first-roguelike--gamedev-13677 (got the map) I also used an algorithm to generate the map details online. Please help and thanks in advance! Link to comment Share on other sites More sharing options...
rich Posted January 12, 2015 Share Posted January 12, 2015 When it gives you the error it will say exactly which line caused it. Which was it? yesh0907 1 Link to comment Share on other sites More sharing options...
ultimatematchthree Posted January 12, 2015 Share Posted January 12, 2015 Short answer: Try adding the "return" keyword to the beginning of the game.add.text call in your initCell function. Long answer: Your error refers to the property "content" of undefined. Fortunately, after doing a Ctrl+F, there's just exactly one occurrence of the text "content" in your code, inside the drawMap function. Here, you're referring to an element in an array contained in the asciiDisplay array. So we look for the place where you initialize the said array. This takes us to the last part of the create function, where you push into newRow whatever the initCell function returns. Finally, going to initCell, we see that it doesn't return anything, but I'm guessing that you probably intended to return the text object created inside initCell. I'm not sure if this will fix things for you, but at the very least hopefully it would get rid of the error you mentioned. Again, we're lucky that "content" is used only once in your code. As Rich suggests, indicating the line which caused the error is really helpful. yesh0907 1 Link to comment Share on other sites More sharing options...
ForgeableSum Posted January 12, 2015 Share Posted January 12, 2015 function drawMap() {for (var y = 0; y < ROWS; y++)for (var x = 0; x < COLS; x++)asciidisplay[y][x].content = map[y][x];}Double check you asciidisplay array, make sure it is as large as you think it is. Also make sure it has the property "content" because I don't see that set anywhere:// initialize ascii displayasciidisplay = [];for (var y=0; y<ROWS; y++) {var newRow = [];asciidisplay.push(newRow);for (var x=0;x<COLS;x++)newRow.push(initCell('', x, y + MAP_OFFSET));} Link to comment Share on other sites More sharing options...
ultimatematchthree Posted January 12, 2015 Share Posted January 12, 2015 Also make sure it has the property "content" because I don't see that set anywhereGood point regarding the "content" property. Even if the text object was actually returned, the error would still probably happen. Perhaps change "content" to "text" since Phaser.Text does have a "text" property? yesh0907 1 Link to comment Share on other sites More sharing options...
yesh0907 Posted January 12, 2015 Author Share Posted January 12, 2015 If I am not mistaken the error shows up in drawMap. It is after the two for loops. Also I have tried to replace content with text and yet nothing printed to my screen but no erros show up. So why is the content in the array not printing to the screen?Also thank you to the people who have replied to this topic. You have helped me so much so far. Link to comment Share on other sites More sharing options...
ultimatematchthree Posted January 12, 2015 Share Posted January 12, 2015 Hmmm at this point there are a couple of things I'd like to find out: 1) Are the text objects actually displaying on the screen? One way of testing this is to replace your assignment line in the drawMap function to this:asciidisplay[y][x].content = "A";This way, you take the "map" data structure and any problems that it might have with it out of the picture. If the A's show up, then great, we move to the second thing. Otherwise, figure out why the text objects aren't rendering and fix that. 2) So the text objects are rendering, you'll probably want to check if your "map" data structure contains what you expect it to contain. This will take a bit more work, you'll have to figure out if the map actually is what you expect it to be, that is, a 2D array of strings. Link to comment Share on other sites More sharing options...
yesh0907 Posted January 12, 2015 Author Share Posted January 12, 2015 Good point regarding the "content" property. Even if the text object was actually returned, the error would still probably happen. Perhaps change "content" to "text" since Phaser.Text does have a "text" property? Short answer: Try adding the "return" keyword to the beginning of the game.add.text call in your initCell function. Long answer: Your error refers to the property "content" of undefined. Fortunately, after doing a Ctrl+F, there's just exactly one occurrence of the text "content" in your code, inside the drawMap function. Here, you're referring to an element in an array contained in the asciiDisplay array. So we look for the place where you initialize the said array. This takes us to the last part of the create function, where you push into newRow whatever the initCell function returns. Finally, going to initCell, we see that it doesn't return anything, but I'm guessing that you probably intended to return the text object created inside initCell. I'm not sure if this will fix things for you, but at the very least hopefully it would get rid of the error you mentioned. Again, we're lucky that "content" is used only once in your code. As Rich suggests, indicating the line which caused the error is really helpful. Thank you guys so much. I changed content to text and did a return and it worked Thank you!!!! Link to comment Share on other sites More sharing options...
ultimatematchthree Posted January 13, 2015 Share Posted January 13, 2015 You're welcome! I just realized though that I made a mistake in my last post, I used the "content" property again where I should have used "text"! Anyway, am glad that you got it to work Link to comment Share on other sites More sharing options...
Recommended Posts