can't get frameName setter to work

[mattlangr]

Sorry - accidentally posted this to Phaser 2 forum at first. Reposting here... I expect admin will delete the first one.

I am very new to Phaser (one day of coding) and am jumping in with v3. I am trying to create a simple matching game and using an atlas for the tiles, no I am not using the tilemap at this point.

this.load.atlas('match_tiles', 'assets/img/MatchingGameJ.png', 'assets/img/MatchingGameJ.json');

I have a simple card class tracking card data and when a card is clicked, to start, I want to change the card face. I will add the animation next, first I just want to get frameName to work. For now I am also keeping the added sprite object in an array indexed with a card's tileNum as shown below.

A click is calling this method:

clickCard(cardObj) {
    console.log(cardObj);
    console.log(_tileArray[cardObj.getTileNum()]);
    console.log(cardObj.getCardFace().toString());
    console.log("frameName", _tileArray[cardObj.getTileNum()].frameName);
    _tileArray[cardObj.getTileNum()].frameName = cardObj.getCardFace().toString();
}

Using the getter, I see frameName as undefined but then becomes defined with the string after clicking the tile the first time - js creating a property that didn't exist. I can see in the  filename in the sprite object's frame.customData.filename property but changing that has no effect.

I was able to get this to work using the setFrame() method which is documented as exposed for plugins and custom classes, but that's based on an index, not the filename string. frameName seems to be what should be used.
My JSON looks like this - came from Adobe Animate and I hand modified it adding pivots to match what I thought would come out of texture packer:
 

{
   "frames": [
      {
         "filename": "1",
         "frame": {"x": 0,"y": 0,"w": 50,"h": 50},
         "rotated": false,
         "trimmed": false,
         "spriteSourceSize": {"x": 0,"y": 0,"w": 50,"h": 50},
         "sourceSize": {"w": 50,"h": 50},
         "pivot": {"x": 0.5,"y": 0.5}
      }, ...

I even tried adding fileFrame and filename keys into the JSON based on a comment in another tread. That I can get setFrame() had me thinking about the JSON though this JSON works to put the frames up when first adding the sprites.
What am I missing? Thanks in advance.

[mattlangr]

I was wrong about setFrame(), it is looking for name and does work. I am using that for now. 

[rich]

For anyone else wondering, the setFrame() method will take a string or an integer. A string if you've loaded a texture atlas (like in the code above), or an integer if you've loaded a sprite sheet. In the JSON block above you'll see the "filename" property - that is what you need to pass to setFrame. Only be careful - in this case the filename is "1" which is a string, not a number. If you omit the quotes it'll think you're trying to get an index from a sprite sheet, which will fail.

[mattlangr]

Thanks Rich! It didn't seem to like it when I used an integer on a frame with a filename of "tile_back". In that case I was getting an error telling me it was looking for name which sent me in the right direction. Yes in this case I am playing it fast and loose and using strings that can easily convert from numbers, maybe better to concatenate a prefix...    Is there something I was doing wrong with frameName? no matter, great to have setFrame() exposed. Thanks again.

 

[rich]

Well, there's no such property as 'frameName' on Game Objects in Phaser 3, so setting it won't have any effect.

To change a frame you should use setFrame. To change a texture, setTexture.

[mattlangr]

My bad, I see I was looking at wrong docs. That explains a lot. Thanks again.