Search the Community

Hi, I'm quite new to web development, so I'm quite lost regarding to make VS Code Intellisense work for PixiJS. I'm currently using Webpack 2 and I'm able to run PixiJS examples, but only because I've included this in my index.html file: <script type="text/javascript" src="libs/pixi.min.js"></script> So, my code works, but I don't get any autocomplete in VS Code because I don't know how to import Pixi classes and methods into my .js project files. Can someone give me pointers or a small tutorial about that? Thanks a lot

I have the Box2d plugin, but game.physics.box2d doesn't have autocomplete when I type "game.physics.box2d" in Visual Studio. In phaser.d.ts I see: arcade: Phaser.Physics.Arcade; config: any; game: Phaser.Game; ninja: Phaser.Physics.Ninja; p2: Phaser.Physics.P2; box2d: any; I think it Might be that it thinks game.physics.box2d is any instead of box2d class. How do I get autocomplete?

Hello everyone, Background: I have been looking around for a good engine/framework to use to build HTML5 games. Since I know Unity and am familiar with the engine (plus I know my around C# a bit) I wanted to use to create HTML5 games, however the WebGL isn't quite up to par not to mention that it doesn't work on mobile browsers. So I went ahead and switched to Construct 2, now I am quite familiar with it and have used it for a long time before the switch (in fact I started with Construct 2 and then switched to Unity for making non-HTML5 games). While Construct 2 is perfect for me (since I am more of a designer than a programmer), I figured that to do this seriously I can't escape learning to code specially that my goal is to transition to multiplayer games (where Construct 2 fails to have an authoritative server setup and sticks to the P2P setup -- but that leagues away from where I am now). Deciding that, I spent the past 2 days looking at code and comparing frameworks and I've settled that so far Phaser seems to be the best free engine and has the most support in the HTML5 game development scene (unless I am missing something). So I started using that and followed the first platformer tutorial, which needless to say while good, left me lost and note sure what is going on with a few things. As mentioned I come from a background with Visual Studio in terms of coding, so I'd like to keep Intellisense-kind of feature. I heard of Phaser Editor and I tried to give it a spin but unfortunately it didn't offer the level I had with Visual Studio (and I am not putting any blame here, it is an incredible tool and perhaps I am using it wrong -- I guess that would be more akin to the truth). That and the fact that I can't fork $30 for it at the current moment. The main problem: I would like to use VS 2015 Community edition and get the intellisense I get with Unity (now I understand that there may not be a solution for this and it might not work 100% as Unity's but I'll settle for anything at the moment that actually helps with the Phaser API rather than just Javascript code -- I don't need VS to complete "var" or "function" for me). What I have done is that I looked into the VS plugin market and found a Phaser template that uses JS and I downloaded that. However when I open a new project using that template and then start typing something like var Game = new Phaser.Game(blah, blah); it doesn't recognize anything beyond "var". I only found a way on the internet if I use Typescript (which I would rather avoid so I can learn JS and later on be able to pickup Node.JS instead of having to learn Typescript then start learning JS with Node.JS). So my question is, how can I use JS with VS and Phaser while VS2015 having intellisense active with Phaser related stuff? Secondary problem: I am searching for tutorials similar to that on the Unity Learning website. Something that does a lot of hand holding with a few small KISS games and then moves into advanced stuff while still explaining what is going on. So far what I have seen is either tutorials that has no steps and just go "Here is the code I used" or others that provide steps but general explanation and no "real learning" could occur from there. Like I said, I am not a coder and need a bit of hand holding at the start till I have built a few example games and then start doing my own. Where can I find such tutorials? TLDR: I'd like t use VS2015 with Phaser for intellisense but code in JS not Typescript. Also would like some tutotrials that actually explain what is going on and teach rather than just dump information on you -- tutorials that go through making game with hand holding and then scale up as we move on. Sorry for the long post and thank you so much in advance!

Hello, I have been working on a Phaser game and I would like to publish it in ios and android.It works good in browser. Can I use "Visual studio community" to publish the app using Cordova. Is it possible to build an apk through Visual Studio. Any help is appreciated.

Visual Studio provides a nice environment for developing cross-platform apps. To do so you need to first install the Apache Cordova plug-in. Once that's installed you can develop and debug your Babylon.js app using the Ripple Emulator which uses the latest Google Chrome). The problem occurs when you want to deploy to an actual device, like an Android tablet or phone. If you're running anything less than Android Lollipop (< V5.0), your Babylon.js app won't work because it runs in a webview and older webviews to do not support WebGL. The solution is to add CrossWalk to your Visual Studio project. In Visual Studio 15.0, the path is: Project > config.xml > Plugins > Core > Crosswalk Webview Engine (click the add button). This didn't appear to work until I did a Rebuild All. After that, it deployed just fine. FYI

Hi, i'm looking for best pratices to start a phaser project with TypeScript. Most of the tutorials are not up to date (2013 on the site). What about project's structure (i mean directories, naming convention etc.), which tools etc ? EDIT : you can now download a complete Visual Studio Template for Phaser with TypeScript : (it's up to date and easy to install (VS Extension)) https://visualstudiogallery.msdn.microsoft.com/ee6e6d8c-c837-41fb-886a-6b50ae2d06a2 https://github.com/fairydhwen/PhaserTypeScriptTemplate/blob/master/README.md Regards, Fairy Regards,

Hey, Just a video [in French] for new users of Phaser : How to install Visual Studio Code (Free) and configures it to start your project with Phaser and TypeScript: https://www.youtube.com/watch?v=E_XOp9xH4XI Regards, Fairy.

Hi everyone. I'm playing around with TypeScript and Phaser for the first time. I started off with plain Javascript/Phaser in Sublime and got a little game going where I could move a sprite around the screen and click to shoot. It worked relatively easily which was nice. Then I decided to switch to TypeScript and Visual Studio because intellisense and the class/inheritance syntax looked like it would make things easier. I still have hope, but I've run into some problems. The first issue that came up was setting up WASD controls with AddKey. I tried to use the recommended var movementLeftKey: Phaser.Key = game.input.keyboard.addKey(Phaser.KeyCode.A);but I got the message: Property 'KeyCode' does not exist on 'typeof Phaser' I got around it by using var movementLeftKey: Phaser.Key = game.input.keyboard.addKey(Phaser.Keyboard.A)This made me think that I was using the wrong version of phaser files since 2.4.4 ought to allow KeyCode. Unless I'm doing something wrong(certainly possible), I believe I'm all up to date. I have p2.d.ts, phaser.d.ts, phaser.js, phaser.min.js, and pixi.comments.d.ts from https://github.com/photonstorm/phaser/tree/master/typescript all in my project as recommended in the typescript tutorial: http://phaser.io/tutorials/how-to-use-phaser-with-typescript I wanted to use phaser.comments.d.ts instead of phaser.d.ts, but it looks like it hasn't been updated - the version appears to be 2.4.3 rather than 2.4.4 Another issue is with detecting mouse clicks. Before typescript/visual studio, I used game.input.activePointer.leftButton.isDown to check if the player was clicking. Visual Studio won't even compile that because it says game.input.activePointer.leftButton is a boolean. All of the Phaser documentation says it's a DeviceButton, and I've even printed out the value with console.log and it says it's an [object Object], so definitely not a boolean. Any ideas why Visual Studio thinks otherwise? I am using the most recent version of typescript that came installed with Visual Studio 2015 Community. Here's my project on Github. I haven't ever used github before so if something appears messed up with how I uploaded it, that's why and please let me know. The code dealing with mouse and keyboard input is here. Thanks in advance for any advice.

Hi everyone! I´m trying to make a web browser with VB Net in Visual Studio 2015 to be able to see babylon sites but when I enter to: https://get.webgl.org/ I get the following message: "Oh no! We are sorry, but your browser does not seem to support WebGL." and a link to upgrade to Windows 10 (which I already have) What can I do to be able to load babylon sites in my browser? Thanks and happy Todosantos and Día de los Muertos day.

Hello! I am relatively new to Phaser, so I downloaded the examples and started making little adjustments to them. So far the Invaders example is my favorite, so I started separating it into separate files and implementing my own graphics. Audio will come later. That is, after I figure out what to do with my game variables. I started copying the invaders code into a Visual Studio Phaser project I'd been playing around with. It wasn't much; just a bouncing Phaser logo, so I knew it would be easy to replace the existing code with the Invaders code. Everything works except for the code in the Game file: GameStates.Game = function (game) {};var player;var aliens;var bullets;var enemyBullet;var explosions;var ufoExplosions;var bulletTime = 0;var cursors;var fireButton;var starfield;var score = 0;var scoreString = '';var scoreText;var lives;var firingTimer = 0;var stateText;var livingEnemies = [];var colors = [ 0xff0000, 0xff1e00, 0xff4000, 0xff5e00, 0xff7f00, 0xff9d00, 0xffbf00, 0xffdd00, 0xffff00, 0xddff00, 0xbfff00, 0x9dff00, 0x80ff00, 0x5eff00, 0x40ff00, 0x1eff00, 0x00ff00, 0x00ff1e, 0x00ff40, 0x00ff5d, 0x00ff80, 0x00ff9d, 0x00ffbf, 0x00ffdd, 0x00ffff, 0x00ddff, 0x00bfff, 0x009dff, 0x0080ff, 0x005dff, 0x0040ff, 0x001eff, 0x0000ff, 0x1e00ff, 0x4000ff, 0x5e00ff, 0x8000ff, 0x9d00ff, 0xbf00ff, 0xdd00ff, 0xff00ff, 0xff00dd, 0xff00bf, 0xff009d, 0xff007f, 0xff005e, 0xff0040, 0xff001e, 0xffffff];GameStates.Game.prototype = { create: function () { game.physics.startSystem(Phaser.Physics.ARCADE); // The scrolling starfield background starfield = game.add.tileSprite(0, 0, 1024, 768, 'starfield'); starfield.tint = colors[Math.floor(Math.random() * colors.length)]; // Our bullet group bullets = game.add.group(); bullets.enableBody = true; bullets.physicsBodyType = Phaser.Physics.ARCADE; bullets.createMultiple(30, 'playerBullet'); bullets.setAll('anchor.x', 0.5); bullets.setAll('anchor.y', 1); bullets.setAll('outOfBoundsKill', true); bullets.setAll('checkWorldBounds', true); bullets.setAll('tint', colors[Math.floor(Math.random() * colors.length)]); // The enemy's bullets enemyBullets = game.add.group(); enemyBullets.enableBody = true; enemyBullets.physicsBodyType = Phaser.Physics.ARCADE; enemyBullets.createMultiple(30, 'enemyBullet'); enemyBullets.setAll('anchor.x', 0.5); enemyBullets.setAll('anchor.y', 1); enemyBullets.setAll('outOfBoundsKill', true); enemyBullets.setAll('checkWorldBounds', true); enemyBullets.setAll('tint', colors[Math.floor(Math.random() * colors.length)]); // The hero! player = game.add.sprite(512, 640, 'playerShip'); player.anchor.setTo(0.5, 0.5); player.tint = colors[Math.floor(Math.random() * colors.length)]; game.physics.enable(player, Phaser.Physics.ARCADE); // The baddies! aliens = game.add.group(); aliens.enableBody = true; aliens.physicsBodyType = Phaser.Physics.ARCADE; createAliens(); // The score scoreString = 'Score : '; scoreText = game.add.text(10, 10, scoreString + score, { font: '34px Arial', fill: '#fff' }); // Lives lives = game.add.group(); game.add.text(game.world.width - 100, 10, 'Lives : ', { font: '34px Arial', fill: '#fff' }); // Text stateText = game.add.text(game.world.centerX, game.world.centerY, ' ', { font: '84px Arial', fill: '#fff' }); stateText.anchor.setTo(0.5, 0.5); stateText.visible = false; for (var i = 0; i < 3; i++) { var ship = lives.create(game.world.width - 100 + (30 * i), 60, 'playerShip'); ship.anchor.setTo(0.5, 0.5); ship.angle = 90; ship.alpha = 0.4; } //Player Explosion pool explosions = game.add.group(); explosions.createMultiple(30, 'playerExplosion'); explosions.forEach(setupInvader, this); explosions.setAll('tint', colors[Math.floor(Math.random() * colors.length)]); //Enemy Explosion pool enemyExplosions = game.add.group(); enemyExplosions.createMultiple(30, 'enemyExplosion'); enemyExplosions.forEach(setupInvader, this); enemyExplosions.setAll('tint', colors[Math.floor(Math.random() * colors.length)]); // And some controls to play the game with cursors = game.input.keyboard.createCursorKeys(); fireButton = game.input.keyboard.addKey(Phaser.Keyboard.SPACEBAR); }, createAliens: function () { for (var y = 0; y < 10; y++) { for (var x = 0; x < 12; x++) { var alien = aliens.create(x * 48, y * 48, 'UFO'); alien.anchor.setTo(0.5, 0.5); alien.animations.add('fly', [0, 1, 2, 3], 20, true); alien.play('fly'); alien.body.moves = false; alien.tint = colors[Math.floor(Math.random() * colors.length)]; } } aliens.x = 100; aliens.y = 50; // All this does is basically start the invaders moving. Notice we're moving the Group they belong to, rather than the invaders directly. var tween = game.add.tween(aliens).to({ x: 200 }, 2000, Phaser.Easing.Linear.None, true, 0, 1000, true); // When the tween loops it calls descend tween.onLoop.add(descend, this); }, setupInvader: function (invader) { invader.anchor.x = 0.5; invader.anchor.y = 0.5; invader.animations.add('enemyExplosion'); }, descend: function () { aliens.y += 10; }, update: function () { // Scroll the background starfield.tilePosition.y += 5; if (player.alive) { // Reset the player, then check for movement keys player.body.velocity.setTo(0, 0); if (cursors.left.isDown) { player.body.velocity.x = -400; } else if (cursors.right.isDown) { player.body.velocity.x = 400; } else if (cursors.up.isDown) { player.body.velocity.y = -200; } else if (cursors.down.isDown) { player.body.velocity.y = 200; } game.world.wrap(player, 0, true); // Firing? if (fireButton.isDown) { fireBullet(); } if (game.time.now > firingTimer) { enemyFires(); } // Run collision game.physics.arcade.overlap(bullets, aliens, collisionHandler, null, this); game.physics.arcade.overlap(player, aliens, playerHitsAlien, null, this); game.physics.arcade.overlap(enemyBullets, player, enemyHitsPlayer, null, this); } }, render: function () { }, collisionHandler: function (bullet, alien) { // When a bullet hits an alien we kill them both bullet.kill(); alien.kill(); // Increase the score score += 20; scoreText.text = scoreString + score; // And create an explosion var explosion = enemyExplosions.getFirstExists(false); explosion.reset(alien.body.x, alien.body.y); explosion.play('enemyExplosion', 30, false, true); if (aliens.countLiving() == 0) { score += 1000; scoreText.text = scoreString + score; enemyBullets.callAll('kill', this); stateText.text = " You Won, \n Hit Enter to restart"; stateText.visible = true; //the "click to restart" handler //game.input.onTap.addOnce(restart, this); //game.input.keyboard.addKey(Phaser.Keyboard.ENTER); this.enterKey = this.game.input.keyboard.addKey(Phaser.Keyboard.ENTER); this.enterKey.onDown.add(restart, this); } }, playerHitsAlien: function (player, alien) { // When the player hits an alien we kill them both live = lives.getFirstAlive(); if (live) { live.kill(); } alien.kill(); //No score for losing a life //Reset the player's location player.x = 512; player.y = 640; // And create an explosion var eExplosion = explosions.getFirstExists(false); eExplosion.reset(alien.body.x, alien.body.y); eExplosion.play('enemyExplosion', 30, false, true); // And create an explosion var pExplosion = playerExplosion.getFirstExists(false); pExplosion.reset(player.body.x, player.body.y); pExplosion.play('playerExplosion', 30, false, true); if (aliens.countLiving() == 0) { score += 1000; scoreText.text = scoreString + score; enemyBullets.callAll('kill', this); stateText.text = " You Won, \n Hit Enter to restart"; stateText.visible = true; //the "click to restart" handler //game.input.onTap.addOnce(restart, this); //game.input.keyboard.addKey(Phaser.Keyboard.ENTER); this.enterKey = this.game.input.keyboard.addKey(Phaser.Keyboard.ENTER); this.enterKey.onDown.add(restart, this); } }, enemyHitsPlayer: function (player, bullet) { bullet.kill(); live = lives.getFirstAlive(); if (live) { live.kill(); } // And create an explosion var explosion = explosions.getFirstExists(false); explosion.reset(player.body.x, player.body.y); explosion.play('playerExplosion', 30, false, true); // When the player dies if (lives.countLiving() < 1) { player.kill(); enemyBullets.callAll('kill'); stateText.text = " GAME OVER \n Hit Enter to restart"; stateText.visible = true; //the "click to restart" handler //game.input.onTap.addOnce(restart,this); //game.input.keyboard.addKey(Phaser.Keyboard.ENTER); this.enterKey = this.game.input.keyboard.addKey(Phaser.Keyboard.ENTER); this.enterKey.onDown.add(restart, this); } }, enemyFires: function () { // Grab the first bullet we can from the pool enemyBullet = enemyBullets.getFirstExists(false); livingEnemies.length = 0; aliens.forEachAlive(function (alien) { // put every living enemy in an array livingEnemies.push(alien); }); if (enemyBullet && livingEnemies.length > 0) { var random = game.rnd.integerInRange(0, livingEnemies.length - 1); // randomly select one of them var shooter = livingEnemies[random]; // And fire the bullet from this enemy enemyBullet.reset(shooter.body.x, shooter.body.y); game.physics.arcade.moveToObject(enemyBullet, player, 120); firingTimer = game.time.now + 2000; } }, fireBullet: function () { // To avoid them being allowed to fire too fast we set a time limit if (game.time.now > bulletTime) { // Grab the first bullet we can from the pool bullet = bullets.getFirstExists(false); if (bullet) { // And fire it bullet.reset(player.x, player.y + 8); bullet.body.velocity.y = -400; bulletTime = game.time.now + 100; } } }, resetBullet: function (bullet) { // Called if the bullet goes out of the screen bullet.kill(); }, restart: function () { // A new level starts //resets the life count lives.callAll('revive'); // And brings the aliens back from the dead aliens.removeAll(); createAliens(); //revives the player player.revive(); //hides the text stateText.visible = false; }};I have a strong feeling that the variables should go inside the "GameStates.Game.prototype = {". But when I put them there, I get many expectations of semicolons, identifiers, and closing curly brackets, and syntax errors. If I put them outside of the "GameStates.Game.prototype = {", I cannot leave the title screen. Where else can I put them?

I'm starting to re-work my game using TS and now using Visual Studio 2013. IIS works perfect for me to test and iterate my game rapidly but I need to test it on my device as well. When working with Phaser JS, I need only to set up gruntfile.js, launch grunt, edit a little something and it will work. Can anyone please tell me how to test my game on my device or if needed, set up custom web server in VS? Thanks!

Hi, I've been using Phaser with Notepad++ until now but I decided to try Visual Studio with Typescript (everyone praised the IntelliSense, so I thought it would be good to test it myself). I'm a completely noob so maybe I screwed up in something pretty obvious, but the IntelliSense is not working. The strange thing is that it worked at first... but it doesn't work now. I tried with the references to the phaser files but the problem persists. Is there something I'm missing?

.

Hi, I'm new to Phaser, in the past week I started my first game and l love everything about this framework. Just so you know I usually work with Unity and MonoGame. Anyway I had a question regarding intellisense/code completion in Visual Studio 2013 for JS. I know about the /// <reference path="phaser.js" />, but my problem is more when I'm using the "this" identifier. I would like to know if there's a way to tell VS what "this" is Phaser.Game(...), just to help with the code completion of lets say this.load.image(show parameters). Is this feature available in VS, should I get another IDE, should I switch to TypeScript or should I just suckit up and learn it all. Thanks in advance

Hey Everyone, I created a Phaser starter project template for Visual Studio 2013 that uses JavaScript. You can view more here: https://github.com/funzeye/Phaser-Project-Template-Javascript https://visualstudiogallery.msdn.microsoft.com/e6eeccc4-3963-4e3d-8181-77d94ae67d9a TypeScript Version also Available: https://visualstudiogallery.msdn.microsoft.com/a4f5464e-897a-48c2-85e4-7ac2b1d92d0f

Hi all. Just started playing around with Phaser and I'm seeing some strange behaviour with JavaScript intellisense in Visual Studio 2013 Express for Web. I followed all the advice I could google, and it's almost working perfectly.. but something to do with being inside or outside of a function seems to be affecting it. I am very new to JavaScript, so I might be missing something, but the following behaviour doesn't make any sense to me: (I get one level of intellisense) (but not any more than that) However, inside of a function it works perfectly... (Intellisense shows me everything) In a separate file, I get a similar problem, but one function level down... (limited here) (but everything here) Any advice would be much appreciated!

Well the header says it all can i use phaser with javascript in visual studio 13? The reason i ask is because i saw a post about how phaser is no longer supporting typescript in VS and i don't want to waste my time with something that is no longer supported.