1

I want to create a game similar to ElastoMania in JavaScript.

I was wondering, would the collision detection be impossible using divs because they are square, and the game principle revolves around driving up slopes etc?

Would this be doable in canvas?

Also, would using a library such as jQuery slow down the running of a JS game? I've noticed most games are built with vanilla JS, so I had the idea that using a library for this sort of application (a game) is a bad idea.

Thanks

UPDATE

This seems like a complicated game! I may still go ahead with it. If anyone wants to jump aboard this project, please contact me.

Improve this question
2
  • Why JavaScript? Flash is perfect for that. Commented Aug 31, 2009 at 5:56
  • @Havenard - for a learning experience. Commented Aug 31, 2009 at 6:25

5 Answers 5

Reset to default
4

Separate your model from your presentation.

The game logic and "physics" will require custom scripting, and have nothing to do with the presentation model (i.e. div's).

You may be able to use jQuery for the presentation side, but this is a special case, performance-intensive application, and, well, there's a reason most games are written in "vanilla" script.

Improve this answer
Sign up to request clarification or add additional context in comments.

Comments

1

It is very possible, if you use the Canvas Tag.

http://developer.mozilla.org/en/Canvas_tutorial

Here is a tetris game in Canvas and the library behind this game is available to anyone:

http://tommysmind.com/gamejs/

If you are looking for some libraries that may be of help:

http://openjsan.org/ (a bunch of libraries anyone can contribute to)

It looks like such a game would be quite an effort to build. It would probably be similar to this implementation of super mario bros:

http://nihilogic.dk/labs/mario/mario_small_music.htm

Improve this answer

Comments

1

This is a very good javascript implementation of a ball simulator.
Maybe you can learn something from that. Maybe it is usable for the tire collision detection in your project. This demo shows that it is possible to implement physical models in javascript at reasonable performance.

As you might already know, there is an open source implementation of a ElastoMania like game called X-Moto
X-Moto uses ODE.

Edit: I just found a JavaScript implementation of Box2D: Box2D-JS

Improve this answer

Comments

1

If it's driving up slopes I'd rather used a 1-d array for storing the height at each point and referred to id every time I need to check the position of the player against the ground. So, you'd basicaly need an image of the slope AND the corresponding set of y-s at each x:

  ___
 /   ---
/       ____

024443330000... etc.

There is one problem however: you couldn't have ideally vertical edges there, as they'd need 2 y points per 1 x.

Improve this answer

1 Comment

That's an interesting idea. Thanks +1
0

You can get a slope effect by using different colors of borders of a div.

<div style="border-left: solid 10px black; border-top: solid 10px red">

will give you a diagonal border, which you might find useful.

Improve this answer

1 Comment

But then I need to use many many divs don't I? I'd like to avoid that if possible.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.