Error in sprite vs Group Collision

[JayParker]

I am very new with phaser and have been having a lot of trouble with Sprite v Group collision.

 

I have a JSON map with an object layer set up for item collision.

 

//Creat function has se up a new game group called items, enabled physics and added a new object with the gitId 2062 to the item object group

 

var items;

 

function create(){

.....

 

    items = game.add.group();

    items.enablebody =true;

    items.physicsBodyType = Phaser.Physics.ARCADE;

    mymap.createFromObjects('objectLayer', 2062, 'keyYellow', 0, true, false, items);

 

.....

}

 

// In the update function I have tried several way to try to detect a collisions, these are just the latest.

 

function update(){

....

    // neither currently working, but at least being rendered.

 

   game.physics.arcade.overlap(player, items, keyCollision, null, this);

    game.physics.arcade.collide(player, items, keyCollision);

 

    //if(game.physics.arcade.overlap(player, items))

    //keyCollision(player, items);

....

}

 

// The console log isnt being detected, so I am guessing no collision is being detected either.

 

function keyCollision (player, items){

    console.log(' Colission detected! ');

    

      //items.kill();

    

}

 

//JSON file for gID

 

         "draworder":"topdown",

         "height":0,

         "name":"objectLayer",

         "objects":[

                {

                 "gid":2062,

                 "height":0,

                 "name":"",

                 "properties":

                    {

                     "sprite":"key",

                     "type":"item"

                    },

 

 

I end up receiving 2 errors:

 

 Exception in 'styleSheetRemoved' listener on Object

 

GET <url>json net::ERR_CONNECTION_REFUSED

 

Honestly I am stuck, any help would be appreciated. I will attach the whole code and assets if necessary.

 

[JayParker]

Here is the code in its entirety.  Perhaps it will help better understand what I am trying to accomplish and where I went wrong.

var mymap;Unused Object Layers//var layerDoorOpen;//var layerPlayerStart;//var layerPlayerFinish;//var layerPlatformCollision;var layerplatform;var layerDirectionalArrow;var layerbackground;var layerLadder;var layerKey;var tileset;var player;var BGMusic;var items;var game = new Phaser.Game(700, 700, Phaser.CANVAS, '',{preload:preload, create:create, update:update});function preload() {      // Assets    //  Firefox doesn't support mp3 files, so use ogg    game.load.audio('BGMUSIC', ['assets/Happy.mp3', 'assets/Happy.ogg']);    game.load.atlasJSONHash('duck', 'assets/duck_65_Jason_nomovement.png', 'assets/duck_65_Jason_nomovement.json');    game.load.image('backGround', 'BackGround.png');    game.load.tilemap('testmap', 'Beach 1.json', null, Phaser.Tilemap.TILED_JSON);    //game.load.image('Beach 1', 'Beach 1.png'    //game.load.image('backGround', 'BackGround.png');    game.load.image('dirtCenter', 'assets/images/2D PLATFORM/Tiles/dirtCenter.png');    game.load.image('sandHalfLeft', 'assets/images/2D PLATFORM/Tiles/sandHalfLeft.png');    game.load.image('sandHalfMid', 'assets/images/2D PLATFORM/Tiles/sandHalfMid.png');    game.load.image('sandHalfRight', 'assets/images/2D PLATFORM/Tiles/sandHalfRight.png');    game.load.image('sandCliffLeft', 'assets/images/2D PLATFORM/Tiles/sandCliffLeft.png');    game.load.image('sandCenter', 'assets/images/2D PLATFORM/Tiles/sandCenter.png');    game.load.image('ladder_mid', 'assets/images/2D PLATFORM/Tiles/ladder_mid.png');    game.load.image('ladder_top', 'assets/images/2D PLATFORM/Tiles/ladder_top.png');    game.load.image('keyYellow', 'assets/images/2D PLATFORM/Items/keyYellow.png');    game.load.image('Menu_3', 'Menu_3.png');    game.load.image('signRight', 'assets/images/2D PLATFORM/Tiles/signRight.png');}function create() {    game.physics.startSystem(Phaser.Physics.ARCADE);    game.physics.arcade.gravity.y = 1200;        if (!game.device.desktop) {        game.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL;        document.body.style.backgroundColor = '#3498db';        game.scale.minWidth = 250;        game.scale.minHeight = 170;        game.scale.maxWidth = 1000;        game.scale.maxHeight = 680;        game.scale.pageAlignHorizontally = true;        game.scale.pageAlignVertically = true;        game.scale.setScreenSize(true);    }    BGMusic = game.add.audio('BGMUSIC','Happy',1,true);    BGMusic.play('',0,1,true);    BG = game.add.tileSprite(0,0,700,700,'backGround');        mymap = game.add.tilemap('testmap');   // mymap.addTilesetImage('Beach 1', 'Beach 1');    mymap.addTilesetImage('dirtCenter', 'dirtCenter');    mymap.addTilesetImage('sandHalfLeft', 'sandHalfLeft');    mymap.addTilesetImage('sandHalfMid', 'sandHalfMid');    mymap.addTilesetImage('sandHalfRight', 'sandHalfRight');    mymap.addTilesetImage('sandCliffLeft', 'sandCliffLeft');    mymap.addTilesetImage('sandCenter', 'sandCenter');    mymap.addTilesetImage('ladder_mid', 'ladder_mid');    mymap.addTilesetImage('ladder_top', 'ladder_top');    //mymap.addTilesetImage('keyYellow', 'keyYellow');    mymap.addTilesetImage('Menu_3', 'Menu_3');    mymap.addTilesetImage('signRight', 'signRight');       layerborder = mymap.createLayer('Border');    layerplatform = mymap.createLayer('Platform');    //layerKey = mymap.createLayer('Key');    layerLadder = mymap.createLayer('Ladder');    layerDirectionalArrow = mymap.createLayer('Directional Arrow');        //HERE YOU HAVE TO USE createFromObjects    //layerPlayerStart = mymap.createLayer('Player Start');    //layerPlayerFinish = mymap.createLayer('Player Finish');    //layerPlatformCollision = mymap.createLayer('Platform Collision');        // Here trying to add an sprite with the ID of 2062 to the item group from the onjectLayer from tmx JSON        items = game.add.group();    items.enablebody =true;    mymap.createFromObjects('objectLayer', 2062, 'keyYellow', 0, true, false, items);    items.physicsBodyType = Phaser.Physics.ARCADE;   // items.body.setCollisionGroup(player)        layerborder.resizeWorld();        // Previous attempt at collision when the layer was attributed to an imageLayer rather than an ObjecLayer.    //mymap.setCollisionBetween(2062, true, items);    //mymap.setCollision(33, true, layerKey);    mymap.setCollisionByExclusion([0], true, layerborder);  // here we activate a possible collision for all tiles on layer1 except the one with the index 0 (the index starts with 1 (first tile) so this means "collide with all tiles on the tilset that are placed on the layer)    mymap.setCollisionBetween(1,24,true,layerplatform);  // here we use a different approach - we activate the potential collision for all tiles with an index between 1 and 24 (again all tiles of the tilesetimage - there are only 20 tiles on it)       player = game.add.sprite(150, 200, 'duck');             game.physics.enable(player);    player.anchor.setTo(0.5,0.5);    game.camera.follow(player);   // camera allways center the player    player.body.width=40;    player.animations.add('RStep', [19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32, 33, 34, 35, 36, 37, 38, 39, 40, 41, 42, 43, 44], 20, true);    player.animations.add('LStep', [130,129,128, 127, 126, 125, 124, 123, 122, 121, 120, 119, 118, 113, 116, 115, 114, 113, 112, 111, 110, 109, 108, 107, 106, 105, 104, 103, 102, 101, 100, 99, 98], 20, true);    cursors = game.input.keyboard.createCursorKeys();  // we need some cursor keys for our controls}    function update() {       //  Checks to see if the player overlaps with any of the item objects, if he does call the keyCollision function        // neither currently working, but at least game being rendered.   game.physics.arcade.overlap(player, this.items, keyCollision, null, this);    game.physics.arcade.collide(player, items, keyCollision);        game.physics.arcade.collide(player, layerborder);   //here we actually activate the collision for layermain (called layer1 in tiled)    game.physics.arcade.collide(player, layerplatform);  // here we activate the collision for "layer2" aka layersecondary as we named the layer object        player.body.velocity.x=0;  // reset player velocity every step        if (cursors.left.isDown ){   //  Move to the left            player.scale.x = 1;  // a little trick.. flips the image to the left            player.body.velocity.x = -150;            player.animations.play('LStep');  //now play the animation named "walk"    }    else if (cursors.right.isDown) {//  Move to the right            player.scale.x = 1;            player.body.velocity.x= 150;                     player.animations.play('RStep');    }    else {            player.loadTexture('duck', 0);   // this loads the frame 0 of duck spritesheet    }        // this loads the frame 0 (jump) of duck spritesheet    if (cursors.up.isDown) {        player.loadTexture('duck', 0);                           if(player.body.onFloor()){  // this checks if the player is on the floor (we don't allow airjumps)            player.body.velocity.y = -800;   // change the y velocity to -800 means "jump!"        }    }    }    function ladderCollision (player, layerLadder) {   console.log(' Colission detected! ');    if (cursors.up.isDown ){   //  Move up            player.scale.x = 1;              player.body.velocity.y = 150;        player.loadTexture('duck', 100);                 }    if (cursors.down.isDown ){   //  Move up            player.scale.x = 1;              player.body.velocity.y = -150;        player.loadTexture('duck', 100);                 }}//This console log does not ouput.    function keyCollision (player, items){    console.log(' Colission detected! ');         //items.kill();  }