Hi group!
First post from a lurker.
I am teaching computer science with a focus on the web and have also
been in charge of all web related education in Sweden at the secondary
school level ("gymnasium" - approx senior high in the US/A-levels in UK).
Yo may see some of my work here:
http://translate.google.com/translate?sl=sv&tl=en&js=n&prev=_t&hl=en&ie=UTF-8&layout=2&eotf=1&u=http%3A%2F%2Fwww.skolverket.se%2Fforskola_och_skola%2Fgymnasieutbildning%2F2.2576%2Famnesplaner_och_kurser_for_gymnasieskolan_2011%2Fsubject.htm%3FsubjectCode%3DWEB
In the courses Web Development 2 and 3 students are expected to work
with SVG, Canvas or WebGL.
I am currently working on a project that will help them get started
doing simple games and wish to help them do collision detection. I will
not use an existing library, as all I've found are overkill.
Here is my idea:
The game should update the location of all objects 250 times/sec, in
order reduce possibilities of "walking through walls", etc.
But the game should only update what's being painted when tht
information is needed, preferably using paint events as in
mozRequestAnimationFrame, mozBeforePaint and mozAfterPaint.
So I would like some help with a simple queuing mechanism that will add
the current location of all objects to the paint buffer, but only have
the most recently added one being used when the time has come to draw
stuff on the screen.
The easy solution would be to collision detect at 4 ms interval, but
only paint at every 5th time. But paint events would of course be the
better solution, from a technical POV.
For teaching reasons I'd also like to come close to the Literate
Programming paradigm: http://en.wikipedia.org/wiki/Literate_programming
If I know the general solution, I think I can do the actual coding
myself. But I am unsure about the design/algorithm.
At the moment I do not need a gracefully degrading solution for browsers
that do not support paint events. Nor do I need the solution to actually
collision detect.
Here is some pseudo-code to reflect my current thoughts:
setInterval(function gameflow() {
// This includes collission detection
move_all_objects_in_memory(); // DOM is left alone for SVG
if ( time_to_redraw ) {
move_all_objects_on_screen(); // DOM is updated for SVG
}
}, 4);
That if-construct should probably be some kind of event handler.
All help appreciated!
--
Lars Gunther
http://keryx.se/
http://twitter.com/itpastorn/
http://itpastorn.blogspot.com/
--
To view archived discussions from the original JSMentors Mailman list:
http://www.mail-archive.com/[email protected]/
To search via a non-Google archive, visit here:
http://www.mail-archive.com/[email protected]/
To unsubscribe from this group, send email to
[email protected]
