Need a simple tutorial on using the Phaser Framework with VS Express 2012

[lithander]

If you reach this point you're now ready to be able to put whatever code you want into the app.ts file and start experimenting. I would recommend looking at all of the source in the Tests folder first and copying bits of that across.

 

I kinda need a step 7. How can I browse the samples from the Test folder using Visual Studio to build and run them as shown above? I can copy the content of individual *.ts files over to the app.ts and run that, but is that the best approach to looking at the examples?

[rich]

You can add the Tests project to your Visual Studio solution. Just use the "Add Existing Project" option and it will appear in the Projects list in the solution window. Then you can open up one of the test files, tweak it, re-compile it, see what happens.

[lithander]

Hey, Rich! Thanks for the info, and please excuse my lack of reply. It actually took me until the weekend to find time to get it to work. And I'm still not 100% sure that I fully understand how the test suite is supposed to be used. So here's what I did.

 

Following the 6 steps you posted I ended up with a project in Visual Studio that I could test by hitting F5 to 'run' which would open the default.htm in a browser. As you suggested I added the 'Tests' project and building it would generate all the JS files from the respective TS files so "open up one of the test files, tweak it, re-compile it" was easy enough. But hitting F5 I got:

 

HTTP-Fehler 403.14 - Forbidden

 

So I added "index.php" under Project-Properties/Web/Start Action/Specific Page. But while Visual Studio seems to install it's own webserver (IIS) that php isn't supported out of the box. Google helped. Download & Install PHP and then configure the webserver using these 2 console commands:

 

"C:\Program Files (x86)\IIS Express\appcmd.exe" set config /section:system.webServer/fastCGI /+[fullPath='"C:\Program Files (x86)\PHP\php-cgi.exe"']
"C:\Program Files (x86)\IIS Express\appcmd.exe" set config /section:system.webServer/handlers /+[name='PHP_via_FastCGI',path='*.php',verb='*',modules='FastCgiModule',scriptProcessor='"C:\Program Files (x86)\PHP\php-cgi.exe"',resourceType='Unspecified']

 

Now I can hit F5 and come to a landing page that allows me to browse the samples which is probably the intended way of running them? I didn't expect the test-suite to require an actual webserver to run the samples (after all javascript is run exclusively on the client) but that's probably my fault. I'm new to the whole java-script gamedevelopment thing!

[rich]

Well at least you got it working I will be making a pure js/html test suite runner, but you will still need to serve it via http otherwise your browser will be locked in local sandbox mode and unable to open any local files, so can't open graphics, etc. JS might be client side, but it always comes via http.

[mkavu]

Hi! I'm trying to get started with Phaser. I followed the steps and managed to get it working with visual studio, I can see the Phaser boot screen in the browser. However, I then tried to use one of the tests, animate by framename. I has two asset files: running_bot.png and running_bot.json. I'm getting this error from the browser: Failed to load resource: the server responded with a status of 404 (Not Found) referring to the json file. And this from the IIS server mounted by Visual Studio: The page you are requesting cannot be served because of the extension configuration. If the page is a script, add a handler. If the file should be downloaded, add a MIME map.
Any ideas? Is there something that I have to configure?
Thanks in advance

[mkavu]

I solved it adding the json MIME type to the IIS server configuration. The animate by framename test however wasn't working 100% correctly, it played the animation once, but it wasn't looping. I fixed it by using  
bot.animations.play('run', null, true);
instead of 
bot.animations.play('run');
Even if the animation had the looped parameter set in the add function, it seems to be overwritten by the play function, that sets the looped property as false by default, not checking if it is already set.
bot.animations.add('run', ['run00', 'run01', 'run02', 'run03', 'run04', 'run05', 'run06', 'run07', 'run08', 'run09', 'run10'], 10, true, false);
Anyway, maybe this can be helpful to someone

[jmp909]

Hi,

 

do you have any suggestions with Visual Studio (Express/2015 etc) for separating source from dist/bin . I'm finding it's creating a .dll I don't want and outputting the .js in the same folder as the .ts . 

 

really I want something like this (which I have in Visual Studio Code)

bin/      index.html      js/          app.js          phaser.jssrc/    typings/          phaser.d.ts    states/          Boot.ts          Main.ts    app.ts      

thanks for any advice

J