is this plugin compatible with phaser version 2.3.0 about phaser-tiled

[pooya72]

and this is my console log after running the code

[englercj]

Yes, this plugin works correctly in 2.3.0.

The error you are getting generally happens when you try to create a texture with a frame that doesn't fit into the size of the source object that texture is using.

The error you got is on this line:

https://github.com/englercj/phaser-tiled/blob/master/dist/phaser-tiled.js#L5240

Where it tries to make texture frames for each texture in the tileset. I notice you are loading resources by hand. Are you sure you are loading the right resources under the right names? Are you sure you didn't accidently load a different image as the tileset than what it expected?

Do you have a running example I can debug?

[pooya72]

Phaser itself returns this warning "Phaser.Tileset - image tile area is not an even multiple of tile size"
but it works anyway may this warning be the cause of this issue ?
phaserjs/phaser#1892

uploading the project to server so you can debug.
Thx for helping me.

[pooya72]

here is a link to project :
http://techsinter.com/gamedevs/

[englercj]

Yeah this library doesn't handle a tileset that isn't a multiple of the tilesize. Just resize your tileset image appropriately.

[pooya72]

may you help a little bit more how to fix this problem ?

[englercj]

The only options are:

1. Resize your tileset image to be a multiple of the tilesize by adding some transparent padding, you can do this right now.
   OR
2. Update this library's Tileset implementation to include handling of malformed tilesets. I plan to do this in v2.

I don't currently have a project I am actively working on that uses this library, so I don't work on it very much. I can't say how long it will be before I can get around to completing v2.

[pooya72]

thx for recommendation
solved that problem now again it doesn't works .

here is console log

and this is the code :

var layer;
var map;
var girlsy;
var gameState = {

    init:function(){
        game.add.plugin(Phaser.Plugin.Tiled);
        var cacheKey = Phaser.Plugin.Tiled.utils.cacheKey;
        game.load.tiledmap(cacheKey('MyTilemap', 'tiledmap'), 'assets/tilemapnum3.json', null, Phaser.Tilemap.TILED_JSON);
        game.load.image(cacheKey('MyTilemap', 'tileset', 'tiles_spritesheet'), 'assets/tile_sprites.png');

    },

    preload : function () {



        game.load.atlasJSONHash('ourgirl','assets/sprites.png','assets/sprites.json');
        game.load.image('background','assets/colored_desert.png');
        game.world.setBounds(0, 0, 3500, 840);
        //game.load.tilemap('MyTilemap', 'assets/tilemapnum3.json', null, Phaser.Tilemap.TILED_JSON);
        //game.load.image('tiles_spritesheet', 'assets/tile_sprites.png'); 

    },

    create : function(){


        game.physics.startSystem(Phaser.Physics.ARCADE);

        background = game.add.tileSprite(0, 0, 30920, 950, 'background');

        var map = game.add.tiledmap('MyTilemap');

        game.add.plugin(Phaser.Plugin.Debug);

        //map = game.add.tilemap('MyTilemap');

        //map.addTilesetImage('tile_sprites', 'tiles_spritesheet');

        //layer = map.createLayer('Tile Layer 1');

        //layer.resizeWorld();

        //layer.wrap = true;

        girl = game.add.sprite(1200,0,'ourgirl');

        girl.animations.add('rightrun',[12,13,14],10,true);
        girl.animations.add('rightidle',[0,1,2],5,true);
        girl.animations.add('rightjump',[11],5,true);

        //girl.width=girl.width/4;
        //girl.height=girl.height/4;

        cursors=game.input.keyboard.createCursorKeys();

        game.physics.enable([girl],Phaser.Physics.ARCADE);
        game.physics.arcade.gravity.y = 450;
        girl.body.collideWorldBounds = true;

        // ... in your state or game setup...
        this.cameraPos = new Phaser.Point(0, 0); // store the smoothed virtual camera position
        this.cameraLerp = 0.5; // specifies how tightly the camera follows; 1 for locked to object, lower values for smoother following




    },

    update:function(){


        //this.cameraPos.x += (girl.x - this.cameraPos.x) * this.cameraLerp; // smoothly adjust the x position
        game.camera.focusOn(girl); // apply smoothed virtual positions to actual camera

        game.physics.arcade.collide(girl, layer);

        this.checkmood();
    },

    checkmood:function(){

            charactermoving = false;
            girl.body.velocity.x=0;
            girlBodyOnFloor=girl.body.onFloor();

            if (cursors.right.isDown){

                girl.animations.play('rightrun');
                background.tilePosition.x = 0.5;
                girl.body.velocity.x= 360;
                charactermoving = true;
                girl.scale.setTo(1,1);

            }




            if(cursors.up.isDown){

                if(girlBodyOnFloor){
                    girl.body.velocity.y = -600;
                    charactermoving = true;
                    }
            }

            if(!(girlBodyOnFloor)){
                charactermoving=true;
                girl.animations.play('rightjump');   
            }




            if(cursors.left.isDown){

                if(girlBodyOnFloor){

                    girl.animations.play('rightrun');   

                }

                background.tilePosition.x = -0.5;
                girl.body.velocity.x = -350;
                charactermoving = true;

                girl.anchor.setTo(0.5,0.5);
                girl.scale.setTo(-1,1);
            }



            if(charactermoving==false){
                girl.animations.play('rightidle');
            }

    },



}

[englercj]

The code looks fine, can you show me a running example?

[pooya72]

online version updated :
http://techsinter.com/gamedevs/

[englercj]

You are loading the tilemap in create, so the load isn't finished when are trying to use it. It fails because it isn't in the cache, it hasn't yet been loaded. You need to move the load calls to the preload functions.

There are warnings in the log that tell you this:

Phaser.Cache.getTilemapData: Invalid key: "MyTilemap_tiledmap"
Phaser.TilemapParser.parse - No map data found for key MyTilemap

[pooya72]

wow amazing, phaser with tiled map runs 60 fps even when character moves and camera follows him in safari.(7-15 fps with phasers's default tilemap reader).

do you know whats the reason of this padding between tiles ? no padding in phaser tilemap renderer

[englercj]

Could be rounding issues, could be miscalculation of spacing/margin id your tileset has those, could be a lot of things. No way to know without debugging the app.

[pooya72]

changing the Phaser Game Size from window.innerWidth_0.70,window.innerHeight_0.70 to window.innerWidth,window.innerHeight solved the problem

Thx for your support, this is an absolutely amazing plugin, hope to be able to make it better or at least
make its documentation clearer after mastering some Html5 game developing skills

[englercj]

Cool man, glad you got it working!