JavaScript projects

by Anand Devan

Tile based jigsaw puzzle
Tiled jigsaw puzzle

Solve puzzle by rearranging tiles.

Libraries, technology:
HTML5 canvas, audio, JavaScript

+ using html canvas drawImage to create tiles
+ radomize tile order to create puzzle
+ capture mouse, touch events to drag and place tiles
+ add html audio to confirm tile placement
+ use html input elem to load user images

video:
Software project details here

Picture and sound game
Dropping ball game

Click/touch dropping object to play sound!

Libraries, technology:
JavaScript, RequireJS, Box2D, HTML5 audio

+ use Box2D to simulate dropping of the object with gravity and impact
+ create a ground with arcs so that impact is interesting
+ use html audio to play sound for ball impact
+ use gimp to edit image and circular image with transparency

video:

Ball projectile game
Dropping ball game

Drop ball from height to hit target

Libraries, technology:
webGL (three.js), custom physics engine, JavaScript

+ use three.js library to create game graphics
+ developed a custom game engine to move ball accounting for sliding, contact, gravity
+ use html audio to play sound for ball impact
+ WebGL will not work on ipad, some andriod phones (desktop, chrome should work)

video:


Balloon Burst
Balloon burst game

Play game by touching (or clicking on) balloon to burst

Libraries, technology:
Box2D, HTML5 canvas, JavaScript

+ Used only canvas rendering to draw balloon
+ Used Box2D physics engine for simulation, detecting and handling collisions
+ use html audio to play sound for bursting balloon