diff --git a/README.md b/README.md index edff13a6..8ae0ef02 100644 --- a/README.md +++ b/README.md @@ -212,6 +212,8 @@ Bug Fixes: * Sound.onMarkerComplete event is now dispatched when a marker stops. See Sound.onLoop for a looping marker event (thanks registered99, fixes #500) * Events.onInputUp would be dispatched twice if the Sprite had drag enabled, now only dispatched once (thanks Overbryd, fixes #502) * You can now load in CSV Tilemaps again and they get created properly (fixes #391) +* Tilemap.putTile can now insert a tile into a null/blank area of the map (before it could only replace existing tiles) +* Tilemap.putTile now correctly re-calculates the collision data based on the new collideIndexes array (fixes #371) TO DO: diff --git a/examples/wip/tilemap put tile update.js b/examples/wip/tilemap put tile update.js deleted file mode 100644 index fe7f637e..00000000 --- a/examples/wip/tilemap put tile update.js +++ /dev/null @@ -1,89 +0,0 @@ - -var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create, update: update, render: render }); -// var game = new Phaser.Game(800, 600, Phaser.AUTO, 'phaser-example', { preload: preload, create: create, update: update, render: render }); - -function preload() { - - game.load.tilemap('map', 'assets/tilemaps/maps/collision_test.json', null, Phaser.Tilemap.TILED_JSON); - game.load.image('ground_1x1', 'assets/tilemaps/tiles/ground_1x1.png'); - game.load.image('walls_1x2', 'assets/tilemaps/tiles/walls_1x2.png'); - game.load.image('tiles2', 'assets/tilemaps/tiles/tiles2.png'); - game.load.image('player', 'assets/sprites/phaser-dude.png'); - game.load.image('box', 'assets/sprites/ufo.png'); - game.load.image('ship', 'assets/sprites/thrust_ship2.png'); - -} - -var ship; -var map; -var tileset; -var layer; -var p; -var b; -var cursors; -var box2; -var dump; - -function create() { - - game.renderer.roundPixels = true; - - // game.stage.backgroundColor = '#787878'; - - map = game.add.tilemap('map'); - - map.addTilesetImage('ground_1x1'); - map.addTilesetImage('walls_1x2'); - map.addTilesetImage('tiles2'); - - layer = map.createLayer('Tile Layer 1'); - - layer.resizeWorld(); - - map.setCollisionBetween(1, 12); - - layer.debug = true; - - // dump = map.generateCollisionData(layer); - - - - box2 = game.add.sprite(200, 200, 'box'); - box2.physicsEnabled = true; - box2.body.fixedRotation = true; - - game.camera.follow(box2); - - cursors = game.input.keyboard.createCursorKeys(); - -} - -function update() { - - if (cursors.left.isDown) - { - box2.body.moveLeft(200); - } - else if (cursors.right.isDown) - { - box2.body.moveRight(200); - } - else - { - box2.body.setZeroVelocity(); - } - - if (cursors.up.isDown) - { - box2.body.moveUp(200); - } - else if (cursors.down.isDown) - { - box2.body.moveDown(200); - } - -} - -function render() { - -} diff --git a/examples/wip/tilemap put tile.js b/examples/wip/tilemap put tile.js new file mode 100644 index 00000000..ed57813a --- /dev/null +++ b/examples/wip/tilemap put tile.js @@ -0,0 +1,117 @@ + +var game = new Phaser.Game(800, 600, Phaser.AUTO, 'phaser-example', { preload: preload, create: create, update: update, render: render }); + +function preload() { + + game.load.image('ground_1x1', 'assets/tilemaps/tiles/ground_1x1.png'); + +} + +var map; +var layer; + +var marker; +var currentTile = 0; +var cursors; + +function create() { + + game.stage.backgroundColor = '#787878'; + + // Creates a blank tilemap + map = game.add.tilemap(); + + // Creates a layer and sets-up the map dimensions. + // In this case the map is 30x30 tiles in size and the tiles are 32x32 pixels in size. + map.create('level1', 30, 30, 32, 32); + + // Add a Tileset image to the map + map.addTilesetImage('ground_1x1'); + + // Create a layer. This is where the map is rendered to. + layer = map.createLayer('level1'); + + // Resize the world + layer.resizeWorld(); + + map.setCollisionBetween(0, 12); + + layer.debug = true; + + // Create our tile selector at the top of the screen + createTileSelector(); + + game.input.setMoveCallback(updateMarker, this); + + cursors = game.input.keyboard.createCursorKeys(); + +} + +function pickTile(sprite, pointer) { + + currentTile = game.math.snapToFloor(pointer.x, 32) / 32; + +} + +function updateMarker() { + + marker.x = layer.getTileX(game.input.activePointer.worldX) * 32; + marker.y = layer.getTileY(game.input.activePointer.worldY) * 32; + + if (game.input.mousePointer.isDown) + { + map.putTile(currentTile, layer.getTileX(marker.x), layer.getTileY(marker.y)) + } + +} + +function update() { + + if (cursors.left.isDown) + { + game.camera.x -= 4; + } + else if (cursors.right.isDown) + { + game.camera.x += 4; + } + + if (cursors.up.isDown) + { + game.camera.y -= 4; + } + else if (cursors.down.isDown) + { + game.camera.y += 4; + } + +} + +function render() { + +} + +function createTileSelector() { + + // Our tile selection window + var tileSelector = game.add.group(); + + var tileSelectorBackground = game.make.graphics(); + tileSelectorBackground.beginFill(0x000000, 0.5); + tileSelectorBackground.drawRect(0, 0, 800, 34); + tileSelectorBackground.endFill(); + + tileSelector.add(tileSelectorBackground); + + var tileStrip = tileSelector.create(1, 1, 'ground_1x1'); + tileStrip.inputEnabled = true; + tileStrip.events.onInputDown.add(pickTile, this); + + tileSelector.fixedToCamera = true; + + // Our painting marker + marker = game.add.graphics(); + marker.lineStyle(2, 0x000000, 1); + marker.drawRect(0, 0, 32, 32); + +} \ No newline at end of file diff --git a/src/tilemap/Tile.js b/src/tilemap/Tile.js index e7cf8444..e4c5c4bf 100644 --- a/src/tilemap/Tile.js +++ b/src/tilemap/Tile.js @@ -179,10 +179,12 @@ Phaser.Tile.prototype = { if (left || right || up || down) { + this.collides = true; this.collideNone = false; } else { + this.collides = false; this.collideNone = true; } @@ -199,6 +201,11 @@ Phaser.Tile.prototype = { this.collideRight = false; this.collideUp = false; this.collideDown = false; + this.collides = false; + this.faceTop = false; + this.faceBottom = false; + this.faceLeft = false; + this.faceRight = false; }, diff --git a/src/tilemap/Tilemap.js b/src/tilemap/Tilemap.js index c54cc364..dbbc42f0 100644 --- a/src/tilemap/Tilemap.js +++ b/src/tilemap/Tilemap.js @@ -106,6 +106,11 @@ Phaser.Tilemap = function (game, key, tileWidth, tileHeight, width, height) { */ this.objects = data.objects; + /** + * @property {array} collideIndexes - An array of tile indexes that collide. + */ + this.collideIndexes = []; + /** * @property {array} collision - An array of collision data (polylines, etc). */ @@ -763,6 +768,20 @@ Phaser.Tilemap.prototype = { if (typeof layer === 'undefined') { layer = this.currentLayer; } if (typeof recalculate === 'undefined') { recalculate = true; } + if (collides) + { + this.collideIndexes.push(index); + } + else + { + var i = this.collideIndexes.indexOf(index); + + if (i > -1) + { + this.collideIndexes.splice(i, 1); + } + } + for (var y = 0; y < this.layers[layer].height ; y++) { for (var x = 0; x < this.layers[layer].width; x++) @@ -848,6 +867,14 @@ Phaser.Tilemap.prototype = { left = this.getTileLeft(layer, x, y); right = this.getTileRight(layer, x, y); + if (tile.collides) + { + tile.faceTop = true; + tile.faceBottom = true; + tile.faceLeft = true; + tile.faceRight = true; + } + if (above && above.collides) { // There is a tile above this one that also collides, so the top of this tile is no longer interesting @@ -974,6 +1001,15 @@ Phaser.Tilemap.prototype = { }, + /** + * Checks if there is a tile at the given location. + * + * @method Phaser.Tilemap#hasTile + * @param {number} x - X position to check if a tile exists at (given in tile units, not pixels) + * @param {number} y - Y position to check if a tile exists at (given in tile units, not pixels) + * @param {number|string|Phaser.TilemapLayer} layer - The layer to set as current. + * @return {boolean} True if there is a tile at the given location, otherwise false. + */ hasTile: function (x, y, layer) { return (this.layers[layer].data[y] !== null && this.layers[layer].data[y][x] !== null); @@ -995,30 +1031,44 @@ Phaser.Tilemap.prototype = { if (x >= 0 && x < this.layers[layer].width && y >= 0 && y < this.layers[layer].height) { + var index; + if (tile instanceof Phaser.Tile) { + index = tile.index; + if (this.hasTile(x, y, layer)) { this.layers[layer].data[y][x].copy(tile); } else { - //Phaser.Tile = function (layer, index, x, y, width, height) { - this.layers[layer].data[y][x] = new Phaser.Tile(layer, tile.index, x, y, tile.width, tile.height); + this.layers[layer].data[y][x] = new Phaser.Tile(layer, index, x, y, tile.width, tile.height); } } else { + index = tile; + if (this.hasTile(x, y, layer)) { - this.layers[layer].data[y][x].index = tile; + this.layers[layer].data[y][x].index = index; } else { - this.layers[layer].data[y][x] = new Phaser.Tile(layer, tile, x, y, this.tileWidth, this.tileHeight); + this.layers[layer].data[y][x] = new Phaser.Tile(layer, index, x, y, this.tileWidth, this.tileHeight); } } + if (this.collideIndexes.indexOf(index) > -1) + { + this.layers[layer].data[y][x].setCollision(true, true, true, true); + } + else + { + this.layers[layer].data[y][x].resetCollision(); + } + this.layers[layer].dirty = true; this.calculateFaces(layer); diff --git a/src/tilemap/TilemapLayer.js b/src/tilemap/TilemapLayer.js index ed92a2a8..f424e6b0 100644 --- a/src/tilemap/TilemapLayer.js +++ b/src/tilemap/TilemapLayer.js @@ -837,12 +837,12 @@ Phaser.TilemapLayer.prototype.renderDebug = function () { } // Collision callback - if (tile && (tile.collisionCallback || tile.layer.callbacks[tile.index])) - { - this.context.fillStyle = this.debugCallbackColor; - this.context.fillRect(this._tx, this._ty, this._cw, this._ch); - this.context.fillStyle = this.debugFillColor; - } + // if (tile && (tile.collisionCallback || tile.layer.callbacks[tile.index])) + // { + // this.context.fillStyle = this.debugCallbackColor; + // this.context.fillRect(this._tx, this._ty, this._cw, this._ch); + // this.context.fillStyle = this.debugFillColor; + // } this._tx += this.map.tileWidth;