
Tearable cloth in asm.js - jlongster
http://jlongster.com/s/lljs-cloth/
======
niggler
The original (<http://codepen.io/stuffit/pen/KrAwx>) feels much more
responsive (when feeding the same dimensions -- 114,53 -- as what your version
uses), tested on Firefox 19.0.2 and Chrome 26.0.1410.65

~~~
jlongster
No idea what you mean. It's just as fast, if not faster, for me. I don't know
what that one does (haven't looked at the code), but it's cloth interaction is
more powerful so it's probably just an interaction difference. I liked a
softer interaction, but moving the mouse fast if you want to blow it up.

EDIT: I shouldn't have said "no idea". There is one reason I can think of --
this uses WebGL, so if you have a bad card or drivers this might be slower. My
algorithms might be more precise too, I don't know the other code.

EDIT2: A coworker just mentioned that I should turn off antialiasing (it's on
by default) and that should help a lot of machines. Also optimized WebGL a few
other ways.

~~~
niggler
This is relatively new (early 2013 retina macbook pro 15", MacBookPro10,1, 2.7
Ghz, 16GB Memory), so I would think WebGL would work in both places ...

~~~
jlgreco
I don't think WebGL is used with the original, since it was working just fine
on my eeepc with linux (which does not do WebGL, last I checked). This new one
_barely_ works in chrome on windows on this T420 though.

I don't know what the cause is in my case, maybe WebGL on this thinkpad is
really slower than CPU rendering on an Atom?

------
dragos2
<http://i.imgur.com/P1YwnY4.png>

~~~
joeblau
Nice! LOL.

------
tete
On Firefox (Aurora) it has about double cloth dimensions here.

~~~
jlongster
I just learned today that asm.js has landed on Aurora as well, so that's why.
It's really neat to see it going out so fast.

------
devrelm
Just installed Nightly to test this out. It doesn't work. Just sits there
blinking "Seeing how much your system can handle..." with no growing cloth in
the background.

Opened up FireBug; the console had the following error at line 18 of
renderer.js:

> NS_ERROR_FAILURE: Failure > this.gl = canvas.getContext('webgl') ||
> canvas.getContext('experimental-webgl')

EDIT: It doesn't work in FF 20.0.1 either... Win 7

~~~
kevingadd
That means your browser doesn't have WebGL available. If you're on Nightly,
that probably means your GPU is blacklisted. Type about:support into your
address bar to see details.

~~~
jlongster
How come it doesn't return null here? I display an alert if WebGL isn't
available.

~~~
kevingadd
You can get an exception from any canvas or WebGL API in cases where a driver
is misbehaving (or, worst case, you have hit a browser bug).

You gotta wrap that stuff in try/catch (at least the getContext call, as a
minimum). I don't think this is spec compliant, but I've seen it in Firefox,
Chrome and Opera under various configurations.

------
FourBrane
Has anyone noticed that if you edit trace("Floating point literals are typed
as double: " + 1.1 / 2) on lljs.org's demo to become trace("Floating
point...are typed as double: " + 1.0 / 2.0) you get an answer of 0 instead of
0.5? LLJS may not be ready for prime time, so compiling crap is probably just
going to produce more crap.

------
mtgx
This one is much slower than the Javascript one for me (using latest Chrome
stable).

~~~
azakai
They aren't using the same algorithm and settings, so the two demos are not
directly comparable.

------
deathbob
works well for me in chrome / os x. Used the 'a' key to cut / tear.

Cool demo! I don't know much about this sort of stuff, could you talk about
what's going on in the vertlet.js file a bit?

~~~
loupeabody
Verlet.js is a physics engine written in javascript [0]. It was posted and
discussed on HN a few days ago [1]. OP didn't write it, but probably
understands it very well.

[0]<http://subprotocol.com/verlet-js/>
[1]<https://news.ycombinator.com/item?id=5580596>

------
spyder
For me the cloth dimensions in Firefox go up to 122, in Nightly and Aurora go
only to 85 and the lines of the cloth looks blurred. (Win8, latest NVIDIA
driver)

------
surrealize
For me (firefox 19), if I've scrolled down on the page, the mouse clicks seem
to register on the cloth below the mouse pointer.

~~~
jlongster
Good point, last-minute regression. It's been fixed.

~~~
greg_bt
Getting the same thing with sideways scrolling, looks neat otherwise.

------
elliottcarlson
It randomly has the whole cloth disconnect from the top and just fall down.
Chrome 26.0.1410.65

------
saejox
got 94 in chrome 26, 168 in firefox 20. Drag does not work, it only causes
ripples.

~~~
jlongster
"drag" is a misnomer then. It's like that so that you can play with the cloth
some before destroying it. The interaction probably could be better though.

------
nbdbvcrea
Crashes Chrome tab - draws sad face. Slow in Firefox. Windows XP.

------
dpedu
Clicking and dragging doesn't really work...

~~~
azakai
Works ok here in firefox nightly. But to actually tear it and not just push it
around I do need to jerk the mouse pretty quickly.

~~~
yathern
Left clicking pushes, right clicking tears it.

------
carterschonwald
Crashes my iOS safari browser

