Arbituz

Members
  • Content count

    1
  • Joined

  • Last visited

  1. Very new to both javascript, Phaser, and Tiled so bare with me here. I'm trying to create a simple platformer for some practice. Using examples and bits and pieces of tutorials I've put together a simple game where I can move an animated penguin back and forth (yay!) Last night I decided to give Tiled a go utilizing a JSON file and a tutorial I had watched a few days back. Now with the code in place, my game crashes when it gets to loading the tilemaps. I worked backwards commenting out code from the tilemap import section and have narrowed it down to this line causing the error (found in play.js). var map = game.add.tilemap('level'); The error comes after I click the canvas when it says "Click anywhere to start...". This is what the console spits out: Any ideas what could be causing this? I feel it may be an issue with something I'm doing in tiled as all of the code (including the structure of the code) follows this tutorial. I've also attached all of the files Tiled saved and the bitmap in case it's something with those. Any help would be greatly appreciated. //game.js var game = new Phaser.Game(800, 480, Phaser.AUTO, null, 'gameDiv'); //add each game state game.state.add('boot', bootState); game.state.add('load', loadState); game.state.add('title', titleState); game.state.add('play', playState); //call the boot state game.state.start('boot'); //boot.js var bootState = { create: function() { game.physics.startSystem(Phaser.Physics.ARCADE); game.state.start('load'); } }; //load.js var loadState = { preload: function() { var loadingLabel = game.add.text(80, 150, 'loading...', {font: '30px Courier', fill: "#000000"}); game.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL; game.scale.PageAlignHorizonally = true; game.scale.PageAlignVertically = true; game.stage.backgroundColor = '#ffffff'; /****** Load graphics assets ******/ game.load.tilemap('level', 'assets/maps/room1.json', null, Phaser.Tilemap.TILED_JSON); game.load.image('tiles', 'assets/sprites/world.png'); game.load.atlas('player', 'assets/sprites/player.png', 'assets/sprites/player.json'); }, create: function() { game.state.start('title'); } }; //title.js var titleState = { create: function() { var nameLabel = game.add.text(160,80, 'Click anywhere to start', { font: '14px Arial', fill: '#000000' }); game.input.activePointer.capture = true; }, update: function() { if (game.input.activePointer.isDown) { game.state.start('play') } } }; //play.js var playState = { player: null, layer: null, create: function() { var self = this; // display tiles for maps var map = game.add.tilemap('level'); map.addTilesetImage('world', 'tiles'); self.layer = map.createLayer('Tile Layer 1'); //initialize character data self.player = game.add.sprite(200,200, 'player'); game.add.existing(self.player); self.player.anchor.setTo(.5,1); self.player.animations.add('player_idle', Phaser.Animation.generateFrameNames('sprite', 1, 3), 2); self.player.animations.add('player_walking', Phaser.Animation.generateFrameNames('sprite', 4, 6), 6); //setup physics and gravity game.physics.enable(self.player, Phaser.Physics.ARCADE); game.physics.arcade.gravity.y = 0; //load in key inputs cursors = game.input.keyboard.createCursorKeys(); keyLeft = game.input.keyboard.addKey(Phaser.Keyboard.LEFT); keyRight = game.input.keyboard.addKey(Phaser.Keyboard.RIGHT); jumpButton = game.input.keyboard.addKey(Phaser.Keyboard.SPACEBAR); }, update: function() { var self = this; self.player.body.velocity.x = 0; //react to player input and play correct animation if(keyLeft.isDown) { self.player.body.velocity.x = -150; self.player.scale.x = -1; if(!self.player.animations.play('player_walking')) { self.player.animations.play('player_walking'); } } if(keyRight.isDown) { self.player.body.velocity.x = 150; self.player.scale.x = 1; if(!self.player.animations.play('player_walking')) { self.player.animations.play('player_walking'); } } if(self.player.body.velocity.x == 0) { self.player.animations.play('player_idle'); } } }; //room1.json { "backgroundcolor":"#000000", "height":15, "layers":[ { "data":"JAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAAJAAAACQAAAAkAAAA", "encoding":"base64", "height":15, "name":"Tile Layer 1", "opacity":1, "type":"tilelayer", "visible":true, "width":25, "x":0, "y":0 }], "nextobjectid":1, "orientation":"orthogonal", "renderorder":"right-down", "tiledversion":"1.0.1", "tileheight":32, "tilesets":[ { "firstgid":1, "source":"world.tsx" }], "tilewidth":32, "type":"map", "version":1, "width":25 } level.tmx room1.json world.tsx