DonFrag Posted September 24, 2015 Share Posted September 24, 2015 i extended the sprite class using ES6 and the update method is not calledclass Block extends Phaser.Sprite{ constructor(xPos,Ypos,n) { super(game, xPos,Ypos, 'block'); this.n=n; } update() { console.log('upda'); }}funny thing i made the same eith Groups and update from groups works... Link to comment Share on other sites More sharing options...
Skeptron Posted September 24, 2015 Share Posted September 24, 2015 You don't pass game in your constructor, thus I guess you pass undefined to the super(). Link to comment Share on other sites More sharing options...
DonFrag Posted September 24, 2015 Author Share Posted September 24, 2015 game is not undefined inside blocki made a console.log before and after super and shows the game objectin fact i can use the game object with no problems. all this works, the sprite are created and shown in screen. Just the update is ignored."use strict";var BlockGroup= require('./BlockGroup.js')var BLOCK_SIZE=64;var MAX_DISTANCE=64;var FALL_SPEED=20; var DIRECTIONS={UP:0,RIGHT:1,DOWN:2,LEFT:3};var STATES={NORMAL:0,DESTROY:1,TREMBLING:2,FALLING:3};var Origin=null;class Block extends Phaser.Sprite{ constructor(xPos,Ypos,n) { super(game, xPos,Ypos, 'block'); this.AddBody(); //set COLOR and DATA this.color=game.rnd.integerInRange(1,4); this.tint=this.GetColor(this.color); this.n=n; this.myGroup=null; this.type='block'; this.state=STATES.NORMAL; this.linked=false; this.overMe=null; this.FALL_SPEED=16; game.add.existing(this); //just for debug var style = { font: "16px Arial", fill: "#000", wordWrap: true, wordWrapWidth: this.width, align: "center" }; this.text=game.add.text(0,0,'n:'+this.n+' c:'+this.color+'\n'+this.linked,style); this.addChild(this.text); this.inputEnabled = true; this.events.onInputDown.add(this.DestroySignal, this); } AddBody() { game.physics.enable(this, Phaser.Physics.ARCADE); this.body.collideWorldBounds = true; this.body.immovable =true; this.body.allowGravity =false; this.body.checkCollision.right=false; this.body.checkCollision.left=false; this.body.gravity.y=16; this.body.setSize(BLOCK_SIZE-4,BLOCK_SIZE,2,0); } CollideBlocks(me,block) { return; if(this.myGroup!=block.myGroup) { this.myGroup.StopFalling(); ///rejoin groups this.CheckAround(); }} CheckAround() { var center={x:(this.x+(BLOCK_SIZE*0.5)),y:(this.y+(BLOCK_SIZE*0.5))}; var checker=game.add.sprite(center.x,center.y,'block'); checker.width=BLOCK_SIZE*0.5; checker.height=BLOCK_SIZE*0.5; checker.anchor.setTo(0.5); checker.tint='#110000'; checker.alpha=0.1; game.physics.arcade.enable(checker); checker.body.allowGravity=false; //if(this.color!=1)return; //check up first checker.body.y-=BLOCK_SIZE; game.physics.arcade.overlap(checker,game.gm.blocksList,function(me,block){ this.Relink(me,block,DIRECTIONS.UP); },null,this); //check up left checker.body.reset(center.x,center.y); checker.body.x-=BLOCK_SIZE; game.physics.arcade.overlap(checker,game.gm.blocksList,function(me,block){ this.Relink(me,block,DIRECTIONS.LEFT); },null,this); //check right checker.body.reset(center.x,center.y); checker.body.x+=BLOCK_SIZE; game.physics.arcade.overlap(checker,game.gm.blocksList,function(me,block){ this.Relink(me,block,DIRECTIONS.RIGHT); },null,this); //check down checker.body.reset(center.x,center.y); checker.body.y+=BLOCK_SIZE; game.physics.arcade.overlap(checker,game.gm.blocksList,function(me,block){ this.Relink(me,block,DIRECTIONS.DOWN); },null,this); checker.destroy();} CheckDistance() { if(game.physics.arcade.distanceBetween(this,this.overMe)>MAX_DISTANCE) { //send signal to group above to fall if(this.overMe!=null) this.overMe.myGroup.CallFall(); }}///this is called first when the map is created CheckLinks(origin) { Origin=origin; var center={x:(this.x+(BLOCK_SIZE*0.5)),y:(this.y+(BLOCK_SIZE*0.5))}; var checker=game.add.sprite(center.x,center.y,'block'); checker.width=BLOCK_SIZE*0.5; checker.height=BLOCK_SIZE*0.5; checker.anchor.setTo(0.5); checker.tint='#110000'; checker.alpha=0.1; game.physics.arcade.enable(checker); checker.body.allowGravity=false; //check up first checker.body.y-=BLOCK_SIZE; game.physics.arcade.overlap(checker,game.gm.blocksList,function(me,block){ this.FindLink(me,block,DIRECTIONS.UP); },null,this); //check up left checker.body.reset(center.x,center.y); checker.body.x-=BLOCK_SIZE; game.physics.arcade.overlap(checker,game.gm.blocksList,function(me,block){ this.FindLink(me,block,DIRECTIONS.LEFT); },null,this); //check right checker.body.reset(center.x,center.y); checker.body.x+=BLOCK_SIZE; game.physics.arcade.overlap(checker,game.gm.blocksList,function(me,block){ this.FindLink(me,block,DIRECTIONS.RIGHT); },null,this); //check down checker.body.reset(center.x,center.y); checker.body.y+=BLOCK_SIZE; game.physics.arcade.overlap(checker,game.gm.blocksList,function(me,block){ this.FindLink(me,block,DIRECTIONS.DOWN); },null,this); checker.destroy();}//check if there is any block above CheckUp() { if(this.state==STATES.NORMAL) { var center={x:(this.x+(BLOCK_SIZE*0.5)),y:(this.y+(BLOCK_SIZE*0.5))}; var checker=game.add.sprite(center.x,center.y,'block'); checker.width=BLOCK_SIZE*0.5; checker.height=BLOCK_SIZE*0.5; checker.anchor.setTo(0.5); checker.tint='#110000'; checker.alpha=0.1; game.physics.arcade.enable(checker); checker.body.allowGravity=false; this.overMe=null; checker.body.y-=BLOCK_SIZE; game.physics.arcade.overlap(checker,game.gm.blocksList,function(me,block){ if(this.color!=block.color) { this.overMe=block; } },null,this); checker.destroy(); }}//this is called by BlockGroup.js Destroy() { //send signal to group above to fall if(this.overMe!=null) this.overMe.myGroup.CallFall(); // this.destroy(); this.kill(); var index = game.gm.blocksList.indexOf(this); if (index > -1) { game.gm.blocksList.splice(index, 1); }} DestroySignal() { game.gm.DestroyBricks(this); this.inputEnabled = false;//prevent multiple calls}///this is called first when the map is created.//Called by this.CheckLinks FindLink(checker,block,direction) { if(!block.linked) { if(this.color==block.color) { if(Origin.myGroup==null) { Origin.myGroup=new BlockGroup(game); Origin.myGroup.add(Origin); Origin.myGroup.name=this.n; game.gm.groupList.push(Origin.myGroup); } this.linked=true; Origin.linked=true; Origin.myGroup.add(block); block.myGroup=Origin.myGroup; block.CheckLinks(Origin); } else//reference to up block { switch(direction) { case DIRECTIONS.UP: this.overMe=block; break; } } }} GetColor(iColor) { var color; switch(iColor) { case 1: color='#FF0000';break;//red case 2: color='#FFFF00';break;//green case 3: color='#0000FF';break;//blue case 4: color='#FF00FF';break;//purple } return Phaser.Color.hexToRGB(color);} FallSignal() {} Relink(checker,block,direction) { if(this.color==block.color) { //replace/join groups if(block.myGroup!=this.myGroup) { console.log('change group called'); var tmpGroup=block.myGroup; tmpGroup.setAll('myGroup',this.myGroup); tmpGroup.moveAll(this.myGroup); //destroy old group game.gm.RemoveGroup(tmpGroup); } } game.gm.AttachBlocksUp();} SetFalling() { if(this.state!=STATES.FALLING) { this.state=STATES.FALLING; this.body.immovable=false; }} SetNormal() { this.state=STATES.NORMAL; this.body.velocity.set(0,0); this.body.immovable=true;} update() { console.log('upda'); switch(this.state) { case STATES.FALLING: console.log('callblcoj update'); if(this.overMe) this.CheckDistance(); this.body.velocity.y=FALL_SPEED; game.physics.arcade.overlap(this, game.gm.player.sprite,null,null,this); game.physics.arcade.overlap(this, game.gm.blocksList,this.CollideBlocks,null,this); break; } ///debug var over=''; if(this.overMe) over=this.overMe.n; else over=''; this.text.text='N:'+this.n +' G:'+this.myGroup.name+' O:'+over; }}module.exports=Block; Link to comment Share on other sites More sharing options...
DonFrag Posted September 24, 2015 Author Share Posted September 24, 2015 well ES6 does't work in most browsers so i will not use it anywaythank you Link to comment Share on other sites More sharing options...
chg Posted September 24, 2015 Share Posted September 24, 2015 well ES6 does't work in most browsers so i will not use it anyway thank youIsn't the common solution to this to use Closure to transpile ES6 down to ES5 / ES3 ? Link to comment Share on other sites More sharing options...
DonFrag Posted September 24, 2015 Author Share Posted September 24, 2015 Isn't the common solution to this to use Closure to transpile ES6 down to ES5 / ES3 ?im sorry i didn't get thatcould you explain this? Link to comment Share on other sites More sharing options...
chg Posted September 25, 2015 Share Posted September 25, 2015 im sorry i didn't get that could you explain this?There are tools you can use that transform ES6 code into ES5 (or earlier) compatible JavaScript. I mentioned Closure, but googling just now it seems like Babel might have the best support for ES6... there's a live tool you can play with here: https://babeljs.io/repl/ I haven't used any of the ES6 transpilers, but it's a similar concept to Typescript or CoffeeScript; with the possible advantage over these that you can use the ES6 code directly in an ES6 compatible browser without transpilation, and only run the transpiler on the code when you want to test on another device or browser that does not have ES6 support. Link to comment Share on other sites More sharing options...
Skeptron Posted September 25, 2015 Share Posted September 25, 2015 If you don't transpile your ES6, you should definitely have a look at that Phaser boilerplate : https://github.com/belohlavek/phaser-es6-boilerplate Really awesome to get started. drhayes 1 Link to comment Share on other sites More sharing options...
DonFrag Posted September 26, 2015 Author Share Posted September 26, 2015 thank you Link to comment Share on other sites More sharing options...
Recommended Posts