How do I create custom Java-like class/object in Cocos2d Javascript and add it to a layer

Question

Ive written a fairly simple sports game in Java and I am now battling to do the same thing in Cocos2d Javascript, which I'm really new at.

What I did in Java and would like to do here is to be able to create a Sprite on the click of a button and and add that sprite to an array of sprites. The tricky part is I want to be able to add and access specific properties and functions in the those sprites in order to change their position, check if they have the ball, give them a ball etc. I think I have subclass somthing and the most logical to me would be the sprite class but I am not sure if this is the right class to subclass or how to do so effectively.

eg.

var player = Player.create(somepicturefile);
this._players.push(player);
this._players[1].hasBall = true;

What I was able to do in java was use those classes to save and load teams form file and move only those players who havent moved, pass the ball around etc but hopefully just getting the sprites to appear on the screen would be a bonus for now : )

a truncated version of what I have so far...

var MakePlan = cc.LayerColor.extend({


  _players:[],
  _playernumber: 0,


 ctor:function() {

    // Rest of file...
    this._super();

    cc.associateWithNative( this, cc.LayerColor );
},

onEnter:function () {
    this._super();

this.addPlayer();

},

addPlayer:function() {

    var player = Player.create(s_player);
    this.addChild(player);

    this._players.push(player);

    this._playernumber++;

 }


});


MakePlan.create = function () {
  var sg = new MakePlan();
  if (sg && sg.init(cc.c4b(255, 255, 255, 255))) {
      return sg;
   }  
   return null;
};


MakePlan.scene = function () {
  var scene = cc.Scene.create();

  var layer1 = MakePlan.create();
  scene.addChild(layer1,0);

   return scene;
};

and

 var Player = cc.Sprite.extend ({

  _hasMoved: false,
   _hasBall: false,


    ctor:function() {

    // Rest of file...
    this._super();

    cc.associateWithNative( this, cc.Sprite );

   }



 });

It seems like a decent idea but it doesn't seem to work...

maybe this helps somewhat, ways to define a class in JS: http://stackoverflow.com/questions/387707/whats-the-best-way-to-define-a-class-in-javascript — CodeSmile, Apr 30 '13 at 17:51
Thx. Managed to patch together something that seems to work and update the question. — user2336750, May 01 '13 at 16:30

score 0 · Accepted Answer · edited Aug 18 '13 at 15:16

I changed the onEnter and addPlayer function in my MakePlan Js file above to..

    onEnter:function () {


    this._super();
    this.addPlayer();
    //just check the first player in array got the value for hasBall
    var doesplayerhaveball = this._players[0].getHasBall();
    cc.log(doesplayerhaveball);

},


    addPlayer:function() {

    var player = new Player(s_player);
    player.setPlayerSpritePos(winSize.width/2,winSize.height/2);
    player.setHasBall(true);
    player.setHasBall(false);

    this.addChild(player.getPlayerSprite(), 3);


    this._players.push(player);

    this._numberOfPlayers++;
}

And changed my Player.Js file/function/class (not sure what to call it) to...

function Player(image) {

this._testsprite =   cc.Sprite.create(image);
this._hasMoved = false;
this._hasBall = false;

}

Player.prototype._testsprite;
Player.prototype._hasMoved;
Player.prototype._hasBall;

Player.prototype.getPlayerSprite = function() {
    return this._testsprite;
}
Player.prototype.setPlayerSpritePos = function (x,y) {

    this._testsprite.setPosition(x,y);
}
Player.prototype.setHasMoved = function (bool) {

    this._hasMoved = bool;
}
Player.prototype.setHasBall = function (bool) {

    this._hasBall = bool;
}

Player.prototype.getHasMoved = function() {

   return this._hasMoved;
}
Player.prototype.getHasBall = function() {

    return this._hasBall;
}

This allows me to get at and add the sprite, access and run action on it (like cc.MoveTo and cc.setScale) while giving me some way to set and access other properties assosiated with that sprite.

It seems to work now but i'm not sure if this is the best way to solve this problem or even if it may cause more problems than it solves later on. At the moment I'm not sure if I understand exactly how the referense structure works i.e. when am I working with the object itself and when am I working with a copy and does it matter.

How do I create custom Java-like class/object in Cocos2d Javascript and add it to a layer

1 Answers1