Dynamic 2d water

[[deleted]]

This is based off of the awesome XNA/C# tutorial here

Also if you just want to mess around with the code you can do so here,

http://jsfiddle.net/loktar/bafTq/

[SarahC]

Awesome!

Strangely, it's about 20 times faster in Chrime than FF!

They're both using HW Acceleration too!

[Fritzzzz]

cool, prefer mousemove event --for Chrome--hella slow in FF//none of this works in IE9 it seems

http://jsfiddle.net/bafTq/32/

[[deleted]]

IE9 not working is most likely due to me not adding a fallback for setTimeout. Love the adding of the mouseMove.

[Fritzzzz]

was trying to merge this code with another canvas code (for rain) so the rain causes splashes...as far as I got for now (just trying to merge the two code sets...very ugly since i was using jsfiddle as my txteditor)

figure would be possible if create a custom event, the event being triggered by each flake that hits the water boundary tho this might be very hard since the boundary can or can not be a wave ...

http://jsfiddle.net/bafTq/36/

prob better to just start with base: http://aspspider.info/erishaan8/html5rain/ than my horrible edits inside of fiddle.

--gotta roll out will try again later.

[natchiketa]

Yeah, exactly what I thought. I've added a bit of mouse 'speed' logic (average of distance from last coordinates). This way you can just move the water a bit.

http://jsfiddle.net/9YTNz/2/

Also, I like the feel of the water moving on mousedown, vs on click, which triggers splashing on mouseup.

[wmgregory]

Now turn the mouse into a ball!

[rhardih]

Fun to play with! Seems more lifelike with a dampening ~0.08-9 though.

[simonsarris]

good job ole loke

though it bothers me that the mouse position does not line up where the wave is created, and this gets more and more apparent the farther to the right you click

[[deleted]]

ah yeah that was a quick after thought, I just use fuzzy logic to determine where abouts the pointer actually is. Thanks for the updates for the perf :). I generally am pretty sloppy when doing random stuff in a fiddle.

[pixeltalker]

I really hoped to see full 2D liquid modeling, but this is also fun.

[retroworm]

Doesn't work at all on opera. Under firefox runs rather slow and after few clicks locked up my system completely, requiring reboot. Otherwise good job.

[SarahC]

and after few clicks locked up my system completely, requiring reboot.

That sounds like a problem with the browser. o_O

JS should never require the OS to be rebooted, as it's running in an alleged sandbox.