views:

1286

answers:

6

I'm sure this question's come up before, but I can't find any reference to it.

As an exercise, I've decided to look into Javascript for game programming. While it's far from being the best language for that, I do like the idea that it's cross platform and it's always available as a web page. So I thought I'd see what I could do with it.

Specifically, I'd like to make a 2d tile-based game of some kind. Where can I find resources to do that?

+1  A: 

How about http://www.javascriptgaming.com/ ?

I wouldn't say Javascript is a bad language to learn gaming. It's now powerful and fast enough that you should be able to implement many 2D game clients in it. The current limitations make it a good platform to learn how to optimize you game - a benefit since computers today would normally allow you to make simple games pretty inefficiently and still "work" ok. Being in a more constrained environment gives you a good experience at optimization.

levik
A: 

The nice thing about JS is you can usually read the source pretty easily. So try looking at the HTML, CSS, JS for some existing tile-based games (yes, there are some).

You can use divs for sprites and it's pretty speedy to move them by changing the left and top. But be warmed that it will be slow on iPhone--my experience is touching the DOM on Mobile Safari causes a hiccup. You can try css animations (with JS callbacks) on iPhone, but it's much easier to stick with common desktop browsers and assume phone browsers will fail.

Nosredna
+1  A: 

Totally look into Processing.js!

Alex Barrett
How would processing.js help with a tile-based game?
Nosredna
+7  A: 

Use HTML5 and canvas (available on non IE browsers). Modern browsers have very powerful JS engines. It's very fast using tile-like graphics and sprites (images with apha channel).

Making 2D games like those on Genesis and SNES wouldn't be a problem. Many "oldschool" gaming techniques are valid for JS, like tile mapping, scrollings, parallax, hit detections, etc. But now you have more powerful tools.

canvas tutorial: https://developer.mozilla.org/en/Canvas%5Ftutorial

Using images: https://developer.mozilla.org/en/Canvas%5Ftutorial/Using%5Fimages

Game tutorial using Canvas and Javascript: http://webdemos.sourceforge.net/jsplatformer11/jsplatformer11.html

Spaceship shooter: http://29a.ch/jswars/

Tiled Platform game: http://www.paulbrunt.co.uk/bert/

Canvas 3D tetris: http://www.benjoffe.com/code/games/torus/

I did this: http://www.codebase.es/jsgb -> it's a Javascript gameboy emulator (use google chrome to get full speed).

And: http://www.codebase.es/test/snow.php -> a very simple animation demo (snow falling effect)

Also, newer developer versions of FF/webkit have OpenGL support for canvas

Pedro Ladaria
A: 

I had a look at a bunch of existing Javascript game engines and it seems like most of them suffer from two major issues: there's no community around them and their documentation is minimal. The following two were exceptions - they had at least decent amount of docs: The Render Engine and Effect Games.

Maine
+1  A: 

Recently I have worked for some 2d game development and explored about it. Here is some canvas game engine for you -

If you are working with canvas, http://code.google.com/p/explorercanvas/ will make your application IE compatible.

If you want to make DOM based game, you can check these -

For working with sounds on web, the BEST tool is http://www.schillmania.com/projects/soundmanager2/

I've only listed which I checked (except DOM based engines) and think will help u.

And another great tutorial for canvas- http://diveintohtml5.org/canvas.html

Anis