Search the Community

Hello! I'm trying to refactor my code making some inheritance. I'm using a Character prototype which is supposed to inherit from Phaser.Sprite and then there can be - for example - a Player prototype which inherits from the Character. The problem is that i get this error: this.onTextureUpdate is not a function inside phaser.js when trying to create the Player object inside the create-function of the level. I would be greatful if someone could take a look on this. Here is the code relevant to the issue (I think) (It's in separate files): Character = function(game, x, y, type){ Phaser.Sprite.call(this, game, x, y, type); this.id = 0; this.name = ""; this.health = 0; this.dexterity = 0; this.defense = 0; this.strength = 0; /*Räknas ut*/ this.primalDamage = 0; //TODO: Lägg till uträkning this.weaponDamage = 0; this.attackRate = 0; this.hit = 0; this.protection = 0; this.block = 0; this.reach = 0; /*---------*/ }; Character.prototype = Object.create(Phaser.Sprite.prototype); Character.prototype.constructor = Character; Character.prototype = { countStats: function(){ }, Etc. etc etc...... Then the player: Player = function(game, x, y){ Character.call(this, game, x, y, 'player'); this.equipped = { rightHand: { name: "broadsword", type: "weapon", damage: 4, protection: 0, attackRate: 1.6 , block: 0, }, }; this.health = 20; this.dexterity = 13; this.defense = 14; this.strength = 15; this.groupCombatEnabled = false; this.animations.add('idleRight', [0], 5, true); this.animations.add('right', [0, 1, 2], 5); this.animations.add('hitRight', [0, 3, 4], 5, true); this.animations.add('idleLeft', [5], 5, true); this.animations.add('left', [5, 6, 7], 5); this.animations.add('hitLeft', [5, 8, 9], 5, true); this.animations.add('idleUp', [10], 5, true); this.animations.add('up', [10, 11, 12], 5); this.animations.add('idleDown', [15], 5, true); this.animations.add('down', [15, 16, 17], 5); this.animations.add('hitDown', [15, 18, 19], 5, true); this.reachCircle = this.game.add.graphics(); this.reachCircle.beginFill(0x000000, 1); this.reachCircle.drawCircle(this.x+24, this.y+24, this.reach*48); this.reachCircle.alpha = 0.2; this.reachCircle.endFill(); this.events.onAnimationComplete.add(function(self, animation){ this.animations.stop(true, true); if(animation.name.includes("hit") && this.enemiesAttacked.length > 0){ this.enemiesAttacked.pop().takeDamage(this, "primary"); } }, this); this.wasd = { up: this.game.input.keyboard.addKey(Phaser.Keyboard.W), down: this.game.input.keyboard.addKey(Phaser.Keyboard.S), left: this.game.input.keyboard.addKey(Phaser.Keyboard.A), right: this.game.input.keyboard.addKey(Phaser.Keyboard.D) }; this.combatKeys = { switchCombatStyle: this.game.input.keyboard.addKey(Phaser.Keyboard.Q) }; this.dmgTextColour = "#ff0000"; }; Player.prototype = Object.create(Character.prototype); Player.prototype.constructor = Player; Player.prototype = { checkActions: function(levelObjects){ this.reachCircle.clear(); this.reachCircle.beginFill(0x000000, 1); this.reachCircle.drawCircle(this.x+24 Etc. etc. etc.. Then there is the level: /** * Level state. */ function Level() { Phaser.State.call(this); // TODO: generated method. } /** @type Phaser.State */ var proto = Object.create(Phaser.State.prototype); Level.prototype = proto; Level.prototype.constructor = Level; Level.prototype = { create: function(){ this.map = this.game.add.tilemap('oryxtiles'); this.map.addTilesetImage('tiles', 'tiles'); this.map.addTilesetImage('tree', 'tree'); this.backgroundLayer = this.map.createLayer('backgroundLayer', 768, 768); this.blockLayer = this.map.createLayer('blockLayer', 768, 768 ); this.map.setCollisionBetween(1, 3000, true, 'blockLayer'); this.backgroundLayer.resizeWorld(); this.createItems(); this.createDoors(); var playerStart = this.findObjectsByType('playerStart', this.map, 'objectLayer')[0]; this.player = new Player(this.game, playerStart.x, playerStart.y);

Hi, I have been going through a tutorial on recreating FruitNinja (unimportant maybe). I am a beginner in JS with experiance in Java. I need some help or reference where to get it - I have 2 states like this: var FruitNinja = FruitNinja || {}; FruitNinja.JSONLevelState = function () { "use strict"; Phaser.State.call(this); }; FruitNinja.JSONLevelState.prototype = Object.create(Phaser.State.prototype); FruitNinja.JSONLevelState.prototype.constructor = FruitNinja.JSONLevelState; (...) FruitNinja.JSONLevelState.prototype.create = function () { this.create_prefab(prefab_name, this.level_data.prefabs[prefab_name]); }; FruitNinja.JSONLevelState.prototype.create_prefab = function (prefab_name, prefab_data) { if (this.prefab_classes.hasOwnProperty(prefab_data.type)) { do stuff... }; (...) and var FruitNinja = FruitNinja || {}; FruitNinja.LevelState = function () { "use strict"; FruitNinja.JSONLevelState.call(this); this.prefab_classes = { "background": FruitNinja.Prefab.prototype.constructor, (...) }; }; FruitNinja.LevelState.prototype = Object.create(FruitNinja.JSONLevelState.prototype); FruitNinja.LevelState.prototype.constructor = FruitNinja.LevelState; FruitNinja.LevelState.prototype.create = function () { "use strict"; FruitNinja.JSONLevelState.prototype.create.call(this); (...) } Somehow JSONLevelState can access LevelState this.prefab_classe object. I don't understand how. Can I somehow print it to chrome console? Or can someone explain it or point me to some external reference ? I have watched couple of videos on youtube on inheritance in JS but I still don't get it. Please help, Ok Solved. "FruitNinja.JSONLevelState.call(this);" allows dunc from JSONLevelState be called in LevelState object (having access to its variables. Watch https://youtu.be/PMfcsYzj-9M for a complete explanation.

Hi everyone, I'm trying to create two types of enemies, the first is a robot that has 2 methods: sleep and patrol. My second enemy is a flyingEnemy. The aim is to inherit the sleep method from the robot but amend the patrol method. Can anyone show me how my flyingEnemy can inherit from robot whilst amending the patrol method? Below is my code. When I create the flyingEnemy, its patrol method overwrites the robot's patrol method and ALL enemies have the same behavior. var SuperSmash = SuperSmash || {}; SuperSmash.flyingEnemy = function(game, x, y, key, velocity, tilemap, player) { "use strict"; SuperSmash.Enemy.call(this, game, x, y, key); this.game = game; this.tilemap = tilemap; this.player = player; this.animations.add("fly", [0]); }; SuperSmash.flyingEnemy.prototype = Object.create(SuperSmash.Enemy.prototype); SuperSmash.flyingEnemy.prototype.constructor = SuperSmash.flyingEnemy; SuperSmash.flyingEnemy.prototype.patrol = function() { "use strict"; SuperSmash.game.physics.arcade.moveToObject(this, this.player, 200); };

Hi people, I'm extending the Sprite class with a class named "Being", which I further extend with two child classes, "Monster" and "Player". But it doesn't work. Here is first the code for my classes. function Being(x,y,key){ Phaser.Sprite.call(this, game, x,y,key); game.add.existing(this); } Being.prototype = Object.create(Phaser.Sprite.prototype); Being.prototype.constructor = Being; function Player(x,y,key){ Being.call(x,y,key); } Player.prototype = Object.create(Being.prototype); Player.prototype.constructor = Player; function Monster(x,y,key){ Being.call(x,y,key); } Monster.prototype = Object.create(Being.prototype); Monster.prototype.constructor = Monster; ("game" is the Phaser.Game instance and is a global variable, I didn't forget to pass it as an argument.) I have looked at the examples and forum topics, and it seems to me that it's the proper way to do. Now if I create a new instance of Being, which inherits from Sprite, this works like a charm. var B = new Being(300,300,'player'); But if I try to make a new instance of Player, which inherits from Being which itself inherits from Sprite, the it doesn't work. The code is: var P = new Player(200,200,'player'); And in the console I get the following error: "phaser.js:15246 Uncaught TypeError: this.onTextureUpdate is not a function". This error makes the entire game crash. I'm really puzzled by the fact that it works for Being, but not for Player, which seems to indicate that all this code is mostly correct, except that I must be doing something wrong with the "second-level" inheritance. Any help would be greatly appreciated!

Hello, recently I found code that is defining objects inheriting from Phaser.Sprite (if I google'd it and understood correctly). Can someone explain a little more about Phaser.Sprite.call() function? I haven't found it anywhere in docs. Also, what are the possible parameters? I found an example of code on some flappy bird tutorial : Pipe = function (game, x, y, speed) { Phaser.Sprite.call(this, game, x, y, "pipe"); game.physics.enable(this, Phaser.Physics.ARCADE, this); this.body.velocity.x = speed; this.giveScore = true; }; Pipe.prototype = Object.create(Phaser.Sprite.prototype); Pipe.prototype.constructor = Pipe; Pipe.prototype.update = function() { if(this.x+this.width<bird.x && this.giveScore){ score+=0.5; intro.prototype.updateScore(); this.giveScore = false; } if(this.x<-this.width){ this.destroy(); } }; I understand that "this" in the code is object (Pipe) right? I also have a question if I can (and how) create another sprite inside that Pipe - for example if I can have Pipe object that have two sprites (pipe1 and pipe2 which will have different properties). Or should I just define two objects and spawn both of them instead one with 2 sprites?

Can the 'create' function in Phaser.Group be successfully over-ridden? Is there an alternative? I am looking for a way to have a function called at the start of my object's life-cycle and still be able to access the functions I have built into the class. I am used to Unity3D where there is always an option to do this. There is certain code that I need to execute at the start of my object's life-cycle, and additionally whenever the level ID is set in my function. Am I being clear, or have I worded this too confusingly? Thanks much! FriarDude.FallingShitFactory = function (game) { // Class variables this.levelID = 0; this.active = false; this.spawnTimer = null; this.percentShitQuantities = new Array(); this.HORIZONTAL_MARGIN = 64; // // The constructor can take an optional parameter (levelID, 0 by default) if (arguments.length == 2) { this.levelID = arguments[1]; } // // Constructor Phaser.Group.call(this, game); game.time.events.loop(1000, this.spawnShit, this); console.log('construct'); return this; //};FriarDude.FallingShitFactory.prototype = Object.create(Phaser.Group.prototype);FriarDude.FallingShitFactory.prototype.constructor = FriarDude.FallingShitFactory;FriarDude.FallingShitFactory.prototype.create = function() { // Load Level Data console.log('create'); this.setLevelID(this.levelID); //}

So I try to make inheriting to my game, but it says "peli is not defined". Where and how I need to define it? player.js: var HardDrive = HardDrive || {};HardDrive.Player = function (peli, x, y) { Phaser.Sprite.call(this, peli, x, y, 'auto'); peli.add.existing(this);};HardDrive.Player.prototype = Object.create(Phaser.Sprite.prototype);HardDrive.Player.constructor = HardDrive.Player;game.js: this.pelaaja = new HardDrive.Player(peli, 500, 380);

Hello, I'm still learning Phaser. I'm familiar with OOP Perspective. But from what I learnt from many tutorial in Phaser, Phaser does not have obvious OOP-perspective. So the tutorial use a workaround to it. For example, if I want to have a customized draggable sprite (with spesific dragDrop eventhandler). I need to create an object, which have a properties (pointer) to sprite. I can then use the sprite as the object itself (sort of wrap the sprite with my custom object method and properties). This approach is simple when used in simple object, but I can see this might create some problem for more complex object. So I am thinking maybe the reason most tutorial use this approach to do this is because they are tutorial (which tries to shows the simplest way to do it). My question is : Is this the correct practice when using phaser? Using the pseudo-inheritance workaround, as extending a base class. Or is there a better practice and cleaner approach to do this for more complex object? Thank you.

Hi everyone, I'm trying to create a clean HUD class using Phaser 2.0.7 but I am getting a weird error: "Uncaught TypeError: Cannot read property 'x' of undefined " I created a separate hud.js file with the following code: function HeadUpDisplay(game, parent, name, useStage){ Phaser.Group.call(this, game); var fpsCounter = new Phaser.Text(0,0, "test", { font: "16px Arial", fill: "#ff0044" }); fpsCounter.fixedToCamera = true; this.add(fpsCounter); this.update = function() { fpsCounter.setText(game.time.fps); };};HeadUpDisplay.prototype = Object.create(Phaser.Group.prototype);HeadUpDisplay.prototype.constructor = HeadUpDisplay; So basically my "class" HeadUpDisplay is extending Phaser.io's group. Any idea what is wrong? (and/or what could be improved) Thanks!

Apologies for the repost, the other thread is very old and marked as 'answered' so I think my question is not being seen by the people who know... Is Sprite inheritance broken in the current Main branch? I'm getting "error: undefined is not a function" on line 1719 of Phaser.js: this.onTextureUpdate(); from this code: Person = function(game) { Phaser.Sprite.call(this, game, 0, 0, 'person'); }; Person.prototype = Object.create(Phaser.Sprite.prototype); Person.prototype.constructor = Person; invoked by: var person = new Person(game); The reason I want to do this is to make a Group of type Person (to simplify collisions) and it needs to be a display object to work with Group. Other good solutions welcomed!