TypeScript | Page 6 | Emanuele Feronato

HTML5 prototype of “Block it” using Box2D in an Arcade way, powered by Phaser and written in TypeScript – Particle explosions and score

“Block it” HTML5 prototype now features a score system and particles explosion when it’s game over. A physics game using Phaser and Box2D thanks to Planck.js, written in TypeScript. Full commented source code available.

Talking about Block it game, Box2D, Game development, HTML5, Javascript, Phaser and TypeScript.

How to handle a consuming energy bar, or measure the time a player is pressing a button, in your Phaser powered HTML5 games using TypeScript

Detailed tutorial with completely commented source code about handling an energy bar in your HTML5 games. Powered by Phaser, written in TypeScript.

Talking about Game development, HTML5, Javascript, Phaser and TypeScript.

HTML5 prototype of “Block it” using Box2D in an Arcade way, powered by Phaser and written in TypeScript – Turning walls on and off, introducing energy

“Block it” HTML5 prototype now features activable walls and an energy system. A good way to learn how to build physics games with Phaser and Box2D, coding in Typescript. Full commented source code available.

Talking about Block it game, Box2D, Game development, HTML5, Javascript, Phaser and TypeScript.

HTML5 prototype of “Block it” using Box2D in an Arcade way, powered by Phaser and written in TypeScript – Moving walls and using sprites to render compound objects

The HTML5 prototype of a “Block it” game continues, adding sprites to render the Box2D compound object, which now also rotates. Powered by Phaser and Planck, written in TypeScript. Full commented source code available.

Talking about Block it game, Box2D, Game development, HTML5, Javascript, Phaser and TypeScript.

HTML5 prototype of “Block it” using Box2D in an Arcade way, powered by Phaser and featuring compound objects and custom contact callback, written in TypeScript

Compound objects and contact callbacks are two of the more complicated features of Box2D. In this HTML5 example powered by Phaser and written in TypeScript, they are explained the easy way with a real world example, as usual. Commented source code available

Talking about Block it game, Box2D, Game development, HTML5, Javascript, Phaser and TypeScript.

“Block it” HTML5 now working with no physics engine, just using continuous collision detection between a moving circle and static lines. Powered by Phaser and written in TypeScript.

Here is a HTML5 “Block it” version powered by Phaser and written in TypeScript which does not use any physics engine and features rotating walls and continuous collision detection. Full source code available.

Talking about Block it game, Game development, HTML5, Javascript, Phaser and TypeScript.

Continuous collision detection between a moving circle and one or more static line segments – vertex collision included

Complete HTML5 example of continuous collision detection between a moving circle and any number of static line segments, featuring vertices collision. Written in TypeScript and powered by Phaser, full source code available.

Talking about HTML5, Javascript, Phaser and TypeScript.

Continuous collision detection between a moving circle and a lot of other static circles – Complete example.

The journey into continuous collision detection continues. Moving circle Vs a lot of static circles trajectory prediction. HTML5 example powered by Phaser and written in TypeScript. Full source code available.

Talking about HTML5, Javascript, Phaser and TypeScript.

Understanding continuous collision detection between a moving circle and a static circle

Moving circle Vs static circle continuous collision detection explained without using any physics engine, only math. HTML5 TypeScript example powered by Phaser, full source code available.

Talking about HTML5, Javascript, Phaser and TypeScript.

Understanding continuous collision detection between a moving circle and a non axis aligned line – step 2: handling ball bounces

Moving circle Vs line continuous collision detection explained the easy way, now handling circle bounces, in only six steps with an interactive HTML5 example powered by Phaser. Physics has never been so much easy!

Talking about HTML5, Javascript, Phaser and TypeScript.

Understanding continuous collision detection between a moving circle and a non axis aligned line

Moving circle Vs line continuous collision detection explained the easy way, in only four steps with an interactive HTML5 example powered by Phaser. Physics has never been so much easy.

Talking about HTML5, Javascript, Phaser and TypeScript.

“Block it” HTML5 game ported to TypeScript with some new features, powered by Phaser and Arcade physics

“Block it” was a fun mobile game released a couple of years ago, which I prototyped using Phaser and TypeScript, so now you can have your HTML5 version. What’s your best score?

Talking about Block it game, Game development, HTML5, Javascript, Phaser and TypeScript.