Search the Community
Showing results for tags 'class'.
-
Hi, I've checked a couple posts on this forum regarding extending classes in Phaser, but get confused on how it exactly works, below is the code I'm trying to implement to add stats to a sprite: class spriteStats extends Phaser.GameObjects.Sprite { constructor (scene, x, y,myExtra) { super(scene, x, y); this.setTexture('../assets/testsprite.png'); this.setPosition(x, y); } setStats(speed, jump){ var stats = { "speed": speed, "jump": jump, } } getStats(){ return stats } } But when I attempt to create the sprite: var hero = this.add.spriteStats(100, 450, 'hero',0).setInteractive(); hero.setStats(5,5); it gives me a: "Uncaught TypeError: this.add.spriteStats is not a function". I don't think I'm extending the class correctly. Please forgive me, as I'm still relatively new to JavaScript. Thanks!
-
Hello everyone What is the most powerful and performance way to extends a PIXI class? Example from my side, I need the native PIXI.Container class but with more methods and properties, and here's how i proceed. PIXI.ContainerData = (function () { class ContainerData extends PIXI.Container { constructor() { super(); this.Sprites = {}; // others custom proprety for game obj }; get d() { return this.Sprites.d }; // return diffuse sprites get n() { return this.Sprites.n }; // return normals sprites //TODO: spine normal are arrays }; ContainerData.prototype.createJson = function(dataValues) { }; ContainerData.prototype.asignJson = function(dataValues) { }; //END return ContainerData; })(); I also know another way to extends functional prototyping. example: function ContainerData() { PIXI.Container.call(this); this.initialize(); }; ContainerData.prototype = Object.create(PIXI.Container.prototype); ContainerData.prototype.constructor = ContainerData; ContainerData.prototype.initialize = function () { this.Sprites = {}; }; I wondering about the cleanest and most efficient techniques to properly extend a class pixi? But especially on the most optimal way, knowing that JS need scan all the prototypes from the bottom to the top! The first technique worries me a little because in my console, Is look like that all the prototypes are cloned by reference and duplicate! So, i am interested in different techniques and advice. I am therefore looking for the most equitable approach between performance (speed) but also the readability for debugging. Thanks in advance.
-
Hey all, i was wondering if anyone could tell me what would be triggering these warnings to spam my console so much? usually these only appear once when i load a BJS project, but i have done something in this project which causes these warnings to spam and it slows things down by a second or two whilst it spams the log, even when the log is closed! (see pic) i have even searched for these classes to see if i have used them but I have not so i assume i am using an old BJS function that must be using them? just need help identifying why they would be spammed so much! many thanks.
-
let MainMenu = new Phaser.Class({ Extends: Phaser.Scene, initialize: function MyScene(config) { Phaser.Scene.call(this, config) }, preload: function () { this.load.image('Logo', 'assets/Logo.png'); }, create: function () { this.Logo = this.add.image(1024/2 ,100, 'Logo').setScale(2); Phaser.Display.Align.In.TopCenter(Logo); } }); I have this class (Scene?) that should represent my game's main menu. But, i want to pass to this class the game object that i'm creating in another file. In this case i want it merely to set my game's logo in top center using game.width and game.height as a way to make the logo be correctly placed with any size of the canvas. How can i do it?
-
So i'm trying to switch scenes when a tween is complete, however i get the titular error 'Cannot read property 'start' of undefined' , and i don't know why this is... Here's the code: class StartScreen extends Phaser.Scene{ constructor(){ super({key: "StartScreen"}); } preload() { this.load.image('Logo', 'assets/Logo.png'); this.load.spritesheet('background', 'assets/backs.png' , { frameWidth: 480, frameHeight: 320 }); } create() { this.anims.create({ key: 'stars', frames: this.anims.generateFrameNames('background', { start: 0, end: 127 }), repeat: -1 }); this.add.sprite(1024/2 , 400, 'background').play('stars', true).setScale(2.5); this.logo = this.add.image(1024/2 , 300, 'Logo').setScale(2); this.text = this.add.text(320, 450, 'Push Enter', { font: '50px NES', fill: '#FFF'}); this.enter = this.input.keyboard.addKey(Phaser.Input.Keyboard.KeyCodes.ENTER); } update(){ if(this.enter.isDown){ this.text.destroy(); this.enter = ''; this.tweens.add({ targets: this.logo, y: 150, duration: 2000, onComplete: this.onCompleteHandler }); } } onCompleteHandler(){ this.scene.start('MainMenu'); } } class MainMenu extends Phaser.Scene{ constructor(){ super({key: "MainMenu"}); } preload() { this.load.image('Logo', 'assets/Logo.png'); this.load.spritesheet('background', 'assets/backs.png' , { frameWidth: 480, frameHeight: 320 }); this.anims.create({ key: 'stars', frames: this.anims.generateFrameNames('background', { start: 0, end: 127 }), repeat: -1 }); this.add.sprite(1024/2 , 400, 'background').play('stars', true).setScale(2.5); this.add.image(150 , 300, 'Logo').setScale(2); } create() { } }
-
Hi everyone, as someone new to Phaser I came across the question most of us (newbies) have after a few hours experimenting.. Am I doing it right?! Obviously there's never only one "right way" of doing things, after watching a few tutorials I ended up with the code below. I'm looking for a feedback in the following topics: Classes - If I am not mistaken I've probably tried 3 differents ways of making classes, this one was the most logical to my eyes. (I'm refering to classes which I want to use as scenes) Var vs this. - Is there any difference? I see people using var x and this.x (I assume I can also use let instead of var since I'm always on the same block) Starting a new scene - This is the part I am really confused about, I have menuNumber initialized in another .js and basically I'm waiting for a pointerdown event to happen in one of the images to then change menuNumber value that will be read through update() since it's an infinite loop in order to start a new scene. Note: Everything is working fine and I'm preloading all the images in another .js file class MainMenu extends Phaser.Scene { constructor() { super({key: "MainMenu"}); } create() { this.add.image(640, 320, "background"); //var title = this.add.image(200, 200, "title"); reduce png size var jogarBut = this.add.image(960, 120, "jogarBut").setInteractive(); var opcoesBut = this.add.image(960, 180, "opcoesBut").setInteractive(); var ajudaBut = this.add.image(960, 240, "ajudaBut").setInteractive(); var rankingBut = this.add.image(960, 300, "rankingBut").setInteractive(); var creditosBut = this.add.image(960, 360, "creditosBut").setInteractive(); var sairBut = this.add.image(960, 420, "sairBut").setInteractive(); //Click on title easter egg - to do menuNumber = -1; jogarBut.on("pointerdown", function (ev) { menuNumber = 0; }); opcoesBut.on("pointerdown", function (ev) { menuNumber = 1; }); ajudaBut.on("pointerdown", function (ev) { menuNumber = 2; }); rankingBut.on("pointerdown", function (ev) { menuNumber = 3; }); creditosBut.on("pointerdown", function (ev) { menuNumber = 4; }); sairBut.on("pointerdown", function (ev) { menuNumber = 5; }); } update() { if(menuNumber===0){ this.scene.start("Jogar"); } else if (menuNumber===1){ this.scene.start("OpcoesMenu"); } else if (menuNumber===2){ this.scene.start("AjudaMenu"); } else if (menuNumber===3){ this.scene.start("RankingMenu"); } else if (menuNumber===4){ this.scene.start("CreditosMenu"); } else if (menuNumber===5){ this.scene.start(""); } } }
-
Hi, I'm coming from Unity (C#), I've followed some JS tutorials, but I can't find really clear answers about OOP. Because many js online documentation talks about web developpement, I don't know if it's better to use CLASSES over PROTOTYPES in javascript game dev ? What th pros, what the cons ? (Or where can I find answers about ?)
-
Say I have a simple class: class SimpleGame { game: Phaser.Game; myColor: Phaser.Color; constructor() { this.myColor = Phaser.Color.createColor(255,255,0); this.game = new Phaser.Game(1200, 600, Phaser.AUTO, 'content', { preload: this.preload, create: this.create}); } preload(){ this.game.load.image("platform", "Graphics/platform.png"); } create() { console.log(this.myColor); } } window.onload = () => { var game = new SimpleGame(); }; The console always prints/returns undefined and if I try to modify the value of myColor, it brings up an error. Can the create method not access class properties? What have I done wrong here? Thanks
-
Following this example: https://phaser.io/examples/v2/sprites/extending-sprite-demo-1 I've been trying to extend MonsterBunny. I've added this: // here is an extension of a custom game object SuperMonsterBunny = function (game, x, y, rotateSpeed, vertSpeed) { MonsterBunny.call(this, game, x, y, rotateSpeed); this.vertSpeed = vertSpeed; this.ydir = 1; }; SuperMonsterBunny.prototype = Object.create(MonsterBunny.prototype); SuperMonsterBunny.prototype.constructor = SuperMonsterBunny; SuperMonsterBunny.prototype.update = function() { /* this.y += this.vertSpeed * this.ydir; if (this.y < 0 || this.y > h) { this.ydir *= -1; } */ }; This works fine, and the commented out code works as expected. (when it's uncommented!) The extended class's update overrides the parent class, which is expected, but, I can't find a way of calling super.update() or equivalent. Can anyone enlighten me?
-
So I'm currently following @rich 's Shoot-em-up tutorial from over here https://phaser.io/tutorials/coding-tips-007. Please have a look at the source code if you haven't already. From what I understand he create's a weapon array that holds all the weapon types (each of which are an object inside a Weapon object). Now my question is How do I access the current weapon bullets in game.physics.arcade.collide? I've used game.physics.arcade.collide(this.weapon[this.currentWeapon], this.enemies) and this works fine, the bullets and the enemy collide well. BUT what if I want to kill that bullet? How would I pass the specific bullet that collided with the enemy into a function? This is what I've tried: game.physics.arcade.collide(this.weapon[this.currentWeapon], this.enemies, function(bullet, enemy) { bullet.kill(); }, null, this); However the above code doesn't work. Bullet is undefined. What do I do?
-
Hello guys I have recently started doing my projects in ES6 and I am wondering the following. //Player.js class Player extends Phaser.Image { constructor(game, x, y, sheet, key) { super(game, x, y, sheet, key); } } export default Player; //GameState.js import Player from 'views/Player'; class GameState extends Phaser.State { create() { this.player = new Player(); // Cannot see required parameters //If I call it like that this.player = Player.constructor() // I can see them - obviously } } export default GameState; Should I just initialize the new Player and then just call the constructor so I can actually create what I need? -
I don't know how to call a class member function from a button declared within the same class. Here is my code: class Player { constructor() { this.sprite = game.add.sprite(0, 0, "player"); this.sprite.scale.setTo(scale.x, scale.y); this.sprite.x = gameWidth / 2; this.sprite.y = game.world.height - (this.sprite.height / 2); game.physics.p2.enable(this.sprite, false); this.sprite.body.setCircle(45 * scale.x); this.sprite.body.setCollisionGroup(playerCollisionGroup); this.sprite.body.collides(bubbleCollisionGroup, playerHitBubble, this); this.sprite.body.static = true; this.button = game.add.button(0, 0, "player", onClick); this.button.scale.setTo(scale.x, scale.y); this.button.anchor.setTo(0.5, 0.5); this.button.x = this.sprite.x; this.button.y = this.sprite.y; this.shootingMode = ShootingMode.SPLIT; } onClick() { console.log(this); if (this.shootingMode == ShootingMode.SPLIT) { this.shootingMode = ShootingMode.BOUNCE; this.sprite.tint = 0x000000; } else { this.shootingMode = ShootingMode.SPLIT; this.sprite.tint = 0xffffff; } } } As it is, I get the error message that onClick is not defined. But if i call it as "this.onClick", then "this" in the onClick function is the button, not the class instance. Any ideas? -
Phaser Game with ES6 Phaser object orientation with objects and class. We do not use prototype See one example class file class Items extends Phaser.Sprite { constructor(game,sprite) { var arrEnemyX = [500,1500,1800,1300,1400,1900,2200,2500,1701,2250]; var arrEnemyY = [1200,1400,2000,2100,1000,1250,1650,1450,2101,2021]; var vx = Math.floor((Math.random()*10)+0); var vy = Math.floor((Math.random()*10)+0); super(game,arrEnemyX[vx],arrEnemyY[vy],sprite); this.scale.setTo(1.1, 1.1); this.frame = 9; game.physics.arcade.enable(this); this.body.collideWorldBounds = true; game.add.existing(this); this.body.allowGravity = false; this.effects = game.add.group(); for (var i = 0; i < 20; i++) { this.effect = this.effects.create(0, 0, 'effectRing', [0], false); this.effect.anchor.setTo(0.4,0.4); this.effect.animations.add('effectRing'); } } animate(l,r,u,d){ this.animations.add('left', l, 10, true); this.animations.add('right',r, 10, true); this.animations.add('up', u, 10, true); this.animations.add('down', d, 10, true); } see more in this proyect https://github.com/pardeep4e/Proyecto-DAW-2015-2016
-
Hi all, I am currently running into Phaser's problems on the preload state with the code snippet as below class Preload extends Phaser.State { constructor(game, progress,cacheKey,progressDisplay) { super(game, progress,cacheKey,progressDisplay); this.progress = progress; this.cacheKey = cacheKey; this.progressDisplay = progressDisplay; } loadStart(){ let box = this.make.graphics(0, 0); box.lineStyle(8, 0xFF0000, 0.8); box.beginFill(0xFF700B, 1); box.drawRect(-50, -50, 100, 100); box.endFill(); this.spinner = this.add.sprite(this.world.centerX, this.world.centerY, box.generateTexture()); this.spinner.anchor.set(0.5); this.add.tween(this.spinner.scale).to( { x: 0, y: 0 }, 1000, "Elastic.easeIn", true, 250); } preload(game,progressDisplay){ let center = { x: this.game.world.centerX, y: this.game.world.centerY }; game.load.image("player", Images.lander); game.load.spritesheet("asteroids", Images.asteroid, 64, 64, 30); game.load.onLoadStart.add(this.loadStart,this); let loadingText = new Text(this.game, center.x, center.y); loadingText.anchor.set(0.5); var timerEvt = this.game.time.events.loop(100, function (){ if(progressDisplay <= 100){ loadingText.text = 'Loading...'+(++progressDisplay)+'%'; } else{ game.time.events.remove(timerEvt); let loadingText = new Text(this.game, center.x, center.y); loadingText.text = 'Completed'; game.add.tween(loadingText).to({alpha: 0}, 500, Phaser.Easing.Linear.None, true); game.load.onLoadComplete.add(this.loadComplete, this); } }, this); } create(){ this.game.state.start('GameState'); } loadComplete(){ this.create(); } } Somehow the this.game.state.start('GameState'); was executed before the Complete text could fade out. Is there anyway to resolve the bug where to get the complete text to fade out first then execute the GameState? Thanks.
-
Hello! I'm having a hell of a time trying to create different bullet types in my game (and this problem extends to different weapon types, enemy types, etc.). I know how to extend Sprite, and I have done so to make a base bullet class. However, I can't seem to figure out how to extend that class to make bullets that behave differently. For example: I have a weapon of type Pistol that will shoot bullets of type BulletPistol, and a weapon of RocketLauncher that will shoot bullets of type BulletRocket. The form is like a typical bullet, while the latter will start moving slowly, then accelerate. My thinking is that for the base Bullet class, I can put in all of the default behavior. For BulletPistol, and any other weapons that use this behavior, I merely pass in the sprite I want to use. For BulletRocket, I will need to override the update function (at least) to change how the rocket moves. Here is the code in my Bullet.js file: var Bullet = function(game, key) { console.log("Bullet.prototype"); Phaser.Sprite.call(this, game, 0, 0, key); this.texture.baseTexture.scaleMode = PIXI.scaleModes.NEAREST; this.anchor.set(0.5); this.checkWorldBounds = true; this.outOfBoundsKill = true; this.exists = false; this.tracking = false; this.scaleSpeed = 0; }; Bullet.prototype = Object.create(Phaser.Sprite.prototype); Bullet.prototype.constructor = Bullet; Bullet.prototype.fire = function(x, y, angle, speed, gx, gy) { gx = gx || 0; gy = gy || 0; this.reset(x, y); this.scale.set(1); this.game.physics.arcade.velocityFromAngle(angle, speed, this.body.velocity); this.angle = angle; }; Bullet.prototype.update = function() { console.log("Bullet.prototype.update"); if (this.tracking) { this.rotation = Math.atan2(this.body.velocity.y, this.body.velocity.x); } if (this.scaleSpeed > 0) { this.scale.x += this.scaleSpeed; this.scale.y += this.scaleSpeed; } }; //////////////////////////////////////////////////////////// // PISTOL //////////////////////////////////////////////////////////// var BulletPistol = function(game) { console.log("Bullet.Pistol.prototype"); Bullet.call(game, 'img_BulletPistol'); }; BulletPistol.prototype = Object.create(Bullet.prototype); BulletPistol.prototype.constructor = BulletPistol; BulletPistol.prototype.fire = function(x, y, angle, speed, gx, gy) { // }; BulletPistol.prototype.update = function() { console.log("Bullet.Pistol.prototype.update"); }; Here are the error messages and console logs I get when I load my game: I'm not sure what I'm doing wrong, exactly. I went through 11 pages on this forum and several more on Google, but the closest things I could find to what I'm attempting were written in other languages. Any insight on how to extend an extended class is greatly appreciated!
-
Hello, this is my first topic on this board. I'm coding a simple BreakOut clone in TypeScript. My app consists of a main BreakOut class and the instances for Ball, Paddle and the canvas context. BreakOut.ts /** * Created by Nomid on 20/01/2016. */ /// <reference path="GameObject.ts"/> /// <reference path="Ball.ts"/> /// <reference path="Paddle.ts"/> /// <reference path="Direction.ts"/> /// <reference path="Sprite.ts"/> /// <reference path="Key.ts"/> class BreakOut { Ball : Ball; Paddle : Paddle; private pressed_keys : { [keycode: number] : boolean }; update(time: number): void { this.context.fillStyle = "red"; this.context.fillRect(0, 0, this.context.canvas.width, this.context.canvas.height); this.Ball.update(time); this.Paddle.update(time, this.pressed_keys); } updateKeys(E: KeyboardEvent) { this.pressed_keys[E.which || E.keyCode] = !this.pressed_keys[E.which || E.keyCode]; } constructor(public context: CanvasRenderingContext2D) { this.Ball = new Ball(context); this.Paddle = new Paddle(context); this.pressed_keys = []; window.addEventListener("keypress", this.updateKeys); window.addEventListener("keyup", this.updateKeys); } } It compiles without errors, but when I run it, these errors appear: BreakOut is initialized as follows: // jQuery 2.2.0 $(document).ready(function() { var Canvas = $("<canvas/>") .attr("width", window.innerWidth) .attr("height", window.innerHeight) .appendTo("body"); window.Game = new BreakOut(Canvas[0].getContext("2d")); window.requestAnimationFrame(Game.update); }); Thank you for helping me.
-
Hi, I'm new with phaser and would like to know if there is any way to add html class or id tag to images and sprites so some properties can be apply. Regards.
-
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);
-
Hi, I've come from an OOP style background with AS3, etc. I'm struggling to work out how to groups things together (kind of like a movieclip in flash). So basically i want to create an object, which will have certain values i can access, but also have created several sprites, and bitmaptext associated with it. Example of how i want to create my object: createNewUpgradeItem:function(myNumber){ var upgradeItem = new UpgradeItem(this, 25, 200+i*55, GAME_NAME.UpgradesAvailable.name, GAME_NAME.UpgradesAvailable.description, GAME_NAME.UpgradesAvailable.upgradePrice, GAME_NAME.UpgradesAvailable.priceMultiplier, GAME_NAME.UpgradesAvailable.sMultiplier, GAME_NAME.UpgradesAvailable.cMultiplier, i%4); GAME_NAME.upgradeMenu.add(upgradeItem); // Doesn't Work upgradeItem._background.events.onInputDown.add(function(){UpgradeItemUpdate(this,upgradeItem);console.log(upgradeItem._name)},this); }, // Where 'i' would be a count (in a for loop) to create several objects. And UpgradesAvailable[] is an array of information to be passed. This works fine i believe and it creates the objects fine and puts them on screen,etc. What i want to do is have this upgradeItem added to a Group (say MenuGroup), so I would have thought something like the following would have worked: GAME_NAME.upgradeMenu.add(upgradeItem); But it doesn't seem to like it. My UpgradeItem code consists of some things, for example: var UpgradeItem = function(game, x, y, upgradeItemName, upgradeDescription, upgradePrice, price, speed, cSpeed, bNumber){ this._name = upgradeItemName; this._description = upgradeDescription; this._upgradePrice = upgradePrice; this._pMultiplier = price | 1; this._sMultiplier = speed | 1; this._cMultiplier = cSpeed | 1; this._active = false; this._backgroundNumber = bNumber | 1; this._upgradeItemGroup = game.add.group(); GAME_NAME.upgradeMenu.add(this._upgradeItemGroup); switch(bNumber){ case 0: this._background = game.add.image(x+10, y+36, 'uBackground1'); break; case 1: this._background = game.add.image(x+10, y+36, 'uBackground2'); break; default : this._background = game.add.image(x+10, y+36, 'uBackground1'); break; } this._background.inputEnabled = true; this._background.input.useHandCursor = true; this._background.anchor.setTo(0); this._upgradeItemGroup.add(this._background); this.UpgradeItemName = game.add.bitmapText(x+30, y+48, 'Lobster',this._name,26,this._upgradeItemGroup); this.UpgradeItemName.anchor.setTo(0); this.UpgradeItemDescription = game.add.bitmapText(x+180, y+48, 'Lobster',this._description,26,this._upgradeItemGroup); this.UpgradeItemDescription.anchor.setTo(0); } You can also see from my code here that i'm trying to group the 'assets' (the text and sprites) into a seperate group. Am I missing something really simple here? Thanks for looking
-
Hey guys, How can I get the 'index' attribute from a class to use it in a for loop? new stars are pushed into starsList = []; 'p_id' here is compared to the 'index' value in starsList starsList.star.id or starsList.id do not work, what is the correct way? I'm a total newbie. Thanks in advance! And here is the class:
-
Hi ! I'm trying to test thing we can do with phaser. My purpose was to found a way to have "Models" which contains all a component logic (player, button, ...). I've succeed doing like this: //Create function of my MenuState object (just creating a button here) create: function () { this.buttonsMenu = this.add.group(); var button = new ButtonMenu(this, this.make.button()); this.buttonsMenu.add(button); },//My basic button menu object allowing me to keep method and attributes here and not in my state object var ButtonMenu = function (game, button) { //Set methods on the phaser object (is this dirty ?) button = constructor(this, button); //Keep game reference this.game = game; //Load attributes and set button params button.reset(this.game.world.centerX - 95, 400); button.loadTexture('buttons_menu'); button.setFrames('button_hover.png', 'button_up.png', 'button_click.png'); button.onInputUp.add(button.alert, button); button.anchor.set(0.5); button.scale.set(2); return button;};function constructor(plan, obj){ for(var m in plan) { obj[m] = plan[m]; } return obj; } ButtonMenu.prototype.alert = function(){ alert('test');};ButtonMenu.prototype.update = function(){ this.angle += 1;};What do you think of this way to do thing ? Can I do better ? Is my way to do that will be a problem for later ? Thanx !
-
Hi, good people! I encountered a new problem while coding my first game. First, let me explain what I have so far. It's a fighting game. I have my two characters on screen: player1 and player2. They move alright. They both have some movements in common (like moving around, jumping and ducking) and some movements of their own (a combination of keys will trigger a special move of some sort). Among other things, I have this in my code: var player; var player1; In function create() : player = game.add.sprite(18, 200, 'ciro'); player2 = game.add.sprite(618, 200, 'damian'); Finally, in function update() I have the movements of each of these characters. So what's the problem? I also have other characters in mind, with individual sprites, animations and moves (and they will share the basic moves, as well). My idea is to have a roster of fighters from where player1 and player2 will choose one each and then, in a stage randomly picked, fight each other. You know how it goes. How can player1 and player2 "choose" a character? Should I set the characters, with the sprites, animations and special moves in some sort of class or separate file and then, add the chosen one to either player1 or player2? I'm guessing I need some sort of variable there but I know almost nothing about javascript :s Help! I'm clueless!
-
I got a game class and various enemy classes. e.g. a class BasicGame.Enemy_1 = function(){ this.name = "Enemy_1"; this.hp = 10;};and BasicGame.Enemy_2 = function(){ this.name = "Enemy_2"; this.hp = 330;};in both classes sprite/image properties are also set for a game sprite to be created from these informations now in my game i want to collision detect my player and instances of the above enemies (1-n) for this i think i need a "group" of enemies, which can be achieved with this.enemies = game.add.group();so that i don't have to check each enemy instance collision on it's own. afterwards i'd like to add various enemy instances to this group and display them. the problem is, that only sprite/display objects could be added to groups. but when i only add the sprites, all my properties, like hitpoints, damage, aso. cant get read from the sprite itself. i thought that i could write a helper function to add all needed properties from the class to the sprite, but i didn't find a method "addProperty" for sprites (like there is one for groups - "setProperty") what's the best way to set the needed properties, which could be read from colliding objects aso.?
-
I'm doing some experimenting in Phaser (to say the least), trying to find a way to randomly generate maps. Now, I've got something of a "framework" worked out for this. My problem, however, is that although I can display a "wall" tile, I can't configure physics. Here's where I'm at - including a few ideas I've tried: create: function() { this.makeMap(); this.map.push(new this.Tile(128, 64, true, true)); this.renderMap(); }, // This is actually a "class" and is used to define a single // tile on the game screen. It also defines blocked vs. non-blocked // tiles both for movement and sight Tile: function(x, y, moveBlock, sightBlock) { this.x = x; this.y = y; this.moveBlock = moveBlock; this.sightBlock = sightBlock; this.body = this; if (moveBlock == false) { this.image = 'floor'; } else if (moveBlock == true){ this.image = 'wall'; this.tile = game.add.sprite(this.x, this.y, this.image); /* This doesn't work: game.physics.enable(this.tile, Phaser.Physics.ARCADE); game.physics.arcade.collide(this.tile, this.player); */ } }, // "map" is an array, and this function creates floor tiles (32, 32) and feeds // them into the map array. However, they are NOT actually rendered at this // point makeMap: function() { for (var y = 0; y < game.world.height; y+=32) { for (var x = 0; x < game.world.width; x+=32) { this.map.push(new this.Tile(x, y, false, false)); } } this.room1 = new this.Room(32, 64, 64, 64); this.room2 = new this.Room(128, 128, 64, 64); //this.createRoom(this.room1); //this.createRoom(this.room2); }, // This is where the tiles are actually rendered... renderMap: function() { for (var i = 0; i < this.map.length;i++) { this.newtile = game.add.sprite(this.map[i].x, this.map[i].y, this.map[i].image); game.physics.enable(this.newtile, Phaser.Physics.ARCADE); this.newtile.body.immovable = true; /* this doesn't work: if (this.map[i].image == 'wall') { game.physics.arcade.collide(this.newtile, this.player); }*/ console.log(this.map[i].image); // for debugging } },As always, your help is greatly appreciated
-
How would I add animations to a class I've extended from sprite? I'm trying to follow the information Extending Sprite Demos 1 and 2 but neither animate the sprites and if I add 'this.animations.add' in the update function I get the error 'animations is not defined'. The code to my class is here: Puppy = function(thisGame,x,y) { Phaser.Sprite.call(this,thisGame,x,y,'puppy');};Puppy.prototype = Object.create(Phaser.Sprite.prototype);Puppy.prototype.constructor = Puppy; Puppy.prototype.create = function() { this.animations.add('idleleft',[0,1,2],4,true); this.animations.add('idleright',[3,4,5],4,true); this.animations.play('idleright');};puppy = new Puppy(this,100,256);this.add.existing(puppy);Other than animations it seems to work. Any help would be greatly appreciated.
