Hacker News new | comments | show | ask | jobs | submit login
Tearable Cloth Simulation in JavaScript (codepen.io)
1048 points by NathanKP on Apr 23, 2013 | hide | past | web | favorite | 153 comments

Without wishing to appear negative, I do find it odd the way that a technical crowd react to these online demos. Would you have found this impressive if it was a compiled executable? Because this is just the same thing, just running slower because it's on the web. It's not technically novel in any way.

If you're curious about the algorithm, then take a look at the presentation 'Advanced Character Physics' by Jacobson. They were used in published games at least 13 years ago and are very widely known and implemented.

I get that there's some novelty to this stuff, but we already know that asm.js can achieve performance within a factor of 2 of compiled C code. Since we know that exists, I don't really see what's interesting about seeing each individual piece of code ported to work on the web.

Imagine if HN and comp.sys.ibm.pc.demos really would have the same audience. So everybody'd be like

"oh, cloth simulation. we did that in the 90s",

as well as,

"... in javascript, even! ... just like scenerdude303 did 8 years ago, except he didn't have a canvas-element back then, web browsers were still make of wood and he had to get up at 5am to write the code in the snow when it was still fresh, type with his bare feet and be crawling uphill both ways, ah, why when I was a young programmer ...", etc.

Except that many people would also be supportive. Cool cloth demo, it works well! Nice touch with the interactivity and the right-mouse cutting action. Because those two make it fun to play with, and slightly more interesting than just the simulation by itself.

Because, and this is something that the actual HN audience should (optimally) also understand, writing a small demo like this is an act of creativity. That should be stimulated no matter what, because--actually I just remembered from some other discussions[0], there's really a load of people here that don't understand this: When making art, there is tremendous value in doing what has been done before. It's called practice, and the value is having the experience of having done something yourself. It's also rumoured to make perfect. It only gets you so far to just know the "why?" and the "how?". To get anywhere you also need to make something. Because only from the vantage-point of being right in the middle of that mess, you can truly decide what your personal take on it, your influence will be. And if you can't, just go right back to practice :)

[0] it was a series of InkScape tutorials called "vector game art for programmers" or something. many people were complaining "but he's only showing how to make these characters and objects", that the author didn't explain why the circles go where they should and what a proper shadow should look like. only by people that didn't actually do the exercises, of course. there's no magic involved. just practice. if character faces are too complex, go draw fruits. all fruits. and then remake the rest of pac-man's sprites in vector! (in the snow, uphill both ways, etc)

    When making art, there is tremendous value 
    in doing what has been done before. 
    It's called practice, and the value is having 
    the experience of having done something yourself.
This is so true, and so often overlooked in the rush to "innovate" or "disrupt" or compete with those around us. The most creative creations are an act of play, and it takes a lot of practice to get that good at playing.

Is this the InkScape tutorial you refer to? https://news.ycombinator.com/item?id=4852611

Yes, I would find it impressive. Problem is, there's about a 5% chance I'd ever get to downloading and running it.

Especially since it very likely wouldn't be compiled for mac or linux (the only systems I have) and I very very likely wouldn't feel inclined to compile it myself.

That's why we love javascript demos. We're lazy sods.

In which case the impressiveness must be coming from the lack of domain familiarity. It's basically getting excited about a game physics 'Hello World'.

I remember a good few years ago a colleague writing a fully textured 3D cloth sim that would remotely unfurl on your screen, displaying a given message on the cloth. He used it to display goatse.cx to me, which I wasn't very pleased about. This was developed in python and took him a few hours over a weekend as far as I remember, which seems about right.

> In which case the impressiveness must be coming from the lack of domain familiarity.

One of the nice things about a site like this is being exposed to domains that one is not familiar with. I for one know beans about physics simulations like this, so it is interesting.

Also, as someone who recalls what Javascript was like 10 or more years ago, yes, I am impressed with what it can do now.

One of the nice things about a site like this is being exposed to domains that one is not familiar with. I for one know beans about physics simulations like this, so it is interesting.

I suppose this is true, though the same could have been said for flash before Javascript's recent strides, and I don't recall anyone being particularly excited about similar demos implemented in actionscript.

Probably because:

1) HN wasn't that big (or existing) at that time.

2) Now you can also see the code, it's not in some opaque swt archive.

3) You don't need a proprietary Adobe IDE to code it (yes, you could do without for Flash too with some bizarro third party tools. Talking about the mainstream).

4) Everybody hates flash anyway.


Lack of domain familiarity?

Of course experts are not impressed by things they are familiar with. But usually experts are pleased that something has bought interest to people not familiar that domain. For example, people are still blown away by the sight of a far away galaxy in a telescope. Astronomers love this, they don't suggest such wonder is "odd" because they are used to it.

My familiarity with game physics ended somewhere in the early 00's when I went fully Linux. Since then the most visually impressive game I've played has been Diablo3. Intuitively I still think games look like counter-strike and when I see anything better, I am impressed.

But you missed the more important point in my post: if this wasn't in a browser, I'd never see it.

It's true, stuff like this was covered with free sample code in Game Developer magazine 10-15 years ago.

OTOH, realize that many readers here were probably not programming then.

Programming is the archetypal field where everything old is new again. The antidote -- dig up all those 1-2 day projects you did 10 years ago that you think are stupid / too simple, and re-package them for the kids.

First, people have done similar things in Flash and Java applets before. At the time, both of those technologies allowed for running things inside the browser.

Second, I am pretty sure that if someone have done this in another language (Python, Ruby, F#) and provided a platform for easy delivery and sandboxing, the most common response would be "we don't need this, this is stupid".

This and your other comment make me really sad. For everything that is posted here on Hacker News, there will be many people who are familiar with it, who have domain knowledge. In a child comment you refer to this as "a game physics 'Hello World'."

People who aren't familiar with this sort of thing find it really cool, hence the impressive number of upvotes. These online demos are accessible in the way some exe just isn't.

So condescending, dismissive, and of course the top voted comment :/

I don't think the issue is that it's unimpressive if you're familiar with the domain. The issue is that, for what's actually been linked to, it's little more than a video showing some pretty interaction.

For a HN crowd interested in learning more about the domain, a blog post or something actually talking about it would be more appropriate and something that people can actually learn from.

A demo isn't something that people generally learn from. It's something that people look at, notice how pretty it is, and then move on, learning nothing.

Code is also in that demo.

Sure but reading a code dump of a (potentially) complex algorithm is far from the best introduction to a subject. Especially given no other context whatsoever.

And not a single comment (other than the license header) in that code...

In a child comment you refer to this as "a game physics 'Hello World'."

But that's what it is. Would you be impressed if I posted a rails CRUD app?

So condescending, dismissive, and of course the top voted comment :/

I'm sorry you think that. I don't mean to be critical of the developer in any way. I was merely remarking that from my perspective, just being on the web isn't enough to be novel or interesting.

What rrreese was trying to say is that HN is not here solely for your convenience.

Your comment became "THE" comment in this thread. And I would like you to ask yourself the following: "Is the world a better place with or without my comment?"

My comment directed people to a paper that explains the underlying maths behind this well established game physics algorithm. This is much more useful than looking at an implementation of the same thing in my mind.

So, I would say yes.

The paper link was definitely good, but as a humorous way of gauging the tone, if you stood back and read the rest of your comment with the Comic Book Guy voice, would it sound in character?

I agree. I think many people here are childish in their motivation. By acting in this churlish manner they try to show how great they are. To bolster their own self image. Sad.

Don't be preposterous. How is arguing that reworking existing code for the web isn't that interesting 'bolstering self image'? Are the people anonymously agreeing with me also ego-driven?

You should consider that your post has zero content other than making a personal attack, which couldn't be said for the one you're criticising.

I think its not so much what you said, but how you said it.

The way I read it, is that by saying that you found it odd that people were impressed by this, it can be felt that you were implying that people impressed by this demo and code are some how backward in their knowledge or thinking. And by pointing that out, you must there for be implying your own superiority. So, bolstering self image and suggesting its ego driven fits with that.

Do you see what I mean?

You could have just said, "yeah very cool, and here is some additional info for those who are interested." But instead, you implied a negative value judgement on people who liked the demo and code. People don't like that much.

I don't think there's anything particularly clever about knowing about this algorithm or not. I find it odd when people are impressed by things implemented in one language/runtime when they wouldn't be impressed by it being implemented in another language/runtime. I find the excitement reserved for 'here's X implemented in JS' stories strange. To me it's basically the same story every time.

I realise that the HN readership includes a fair fraction of web developers in it's readership, so perhaps my view is in a minority. As others have said, if the link was to a technical discussion of the algorithm presented alongside a JS example implementation, it would have made more sense to me.

I do apologise if some took this as a personal slight.

What's preposterous is the amount of effort you are putting into essentially saying "meh, boring" when you could have simply moved along to the next post that actually does interest you.

HN may not need every "look at the old stuff I did in JS" post, sure. But it needs these pointless "I didn't like this" derails even less.

Look, I wasn't talking specifically about your post. I'm irritated with the tone here, in general. Live and let live, let people be interested in what they are interested in. I will probably look back at what I am interested in now, 10 or 20 years from now and consider it a little backward. I hope so.

HN isn't just for totally new things. Lots of people wouldn't be aware of the existing stuff you mention.

So what if you and a bunch of other people have been long familiar with similar stuff? When you say it "isn't that interesting" you're just saying that it isn't that interesting for _you_.

[EDIT: "When you say" -> "When you say it"]

Congrats you're an experienced advanced/game/physics developer, whatever. This is childs play to you. I'm a lowly web developer, my day-to-day involves HTML templates, Photoshop mockups and HTTP requests ... so I find this sort of thing done on a platform I'm totally familiar with novel and interesting. I see no reason to apologise for that.

Nobody is asking you to apologise. I'm just saying that we already know what the web is capable of as a runtime. Why wouldn't this have been highlighted as a flash demo? Or as a java applet?

>Nobody is asking you to apologise. I'm just saying that we already know what the web is capable of as a runtime.

Who is that "we" you're talking about? Because it's obvious that the parent does not "already know" and neither do many people.

People see trivial stuff like this simulation all the time, not knowing anything about the domain or past developments, and are inspired to learn more, or change it and adapt it to create something else, etc.

It would a sad world, yours, where everybody should delve in domain specific tomes to learn about prior art and theories and such, instead of also being able to give a quick glance at some web page and see something he didn't knew about.

Not to mention that "having been done before" and "it can be done in Javascript, on the browser, with adequate performance, and not that difficult code, and you know what, you can adapt it for your web project too" is a different thing altogether.

Definition "apologise": defend, explain, clear away, or make excuses for by reasoning. By criticising the response to the link, rather than anything to do with its technical implementation, you are asking people to apologise, either that or inviting agreement, or indeed disagreement. Unless you were hoping for no response at all?

It's not so much the novelty as the presentation that makes the difference, and I mean that as a positive thing.

Ignore the code/algorithm itself for a moment and look at everything else: we see the code first and the results underneath. It's inherently open-source and fairly accessible, because it's JS, and everyone is at least a little bit familiar with the language. Lastly, it can be tweaked and recompiled on the fly so playing with the code has never been easier. I don't recall actionscript working like that.

As far as I know, the closest other languages (that don't compile to JS) can come at the moment is something like the Go Playground, and in comparison the best it can do is a text-based Game of Life[1] or a non-interactive generated picture[2] (which can be combined to a graphical version of GoL I suppose). And even something as minimal as the Go Playground turns out to be pretty awesome when discussing bugs/ideas about Go on the internet, so even there it helps and I wish more languages had something like it.

[1] http://play.golang.org/p/6j5z_RNr0q (by Jan Mercl)

[2] http://play.golang.org/p/yOn9pQwEzJ (taken from the Go Tour - http://tour.golang.org/#35 )

> Without wishing to appear negative

One way that would have avoided sounding negative, and which (I HOPE) would have got you a lot more upvotes, would have been to say something like "This is a nice demo! Here's some further reading for these algorithms {CITE}, and here are some other implementations if different languages {CITE}", with a bit of discussion of where you used them and the problems you solved.

Personally, I'd much rather see someone's implementation of something that yet another {article I don't like}.


It's how people learn, and you can choose to help them and share in the learning as even the teacher gets to learn from a student.

> I get that there's some novelty to this stuff, but we already know that asm.js can achieve performance within a factor of 2 of compiled C code.

My guess is that even if this is common knowledge (which I doubt), lots of people still don't know what that means. Demos like this showcase that.

As to JS vs. AS or Java Applets, well, among the "technical crowd" I'd wager that JS is more popular than those other two platforms. Simple as that, perhaps?

This is what I don't understand - a lot of these WebGL demos as well are largely equivalent (minus some pixel shader stuff that couldn't be done back then) to OpenGL stuff that was being done back in 2000.

What exactly don't you understand?

People wanting to port stuff to new domains?

Excitement about the web being a feasible platform for running 3D stuff?

People learning about old stuff for the first time and doing experiments with the language available to them?

I often get the same feeling. The fact that it's running in the browser on one hand is an amazing achievement of those who brought canvas and etc. to the web. On the other hand the idea itself can perfectly run as a standalone demo, and the browser doesn't really enhance it in any way (if not making it slower).

Yeah, but you're not thinking big picture here.. now we get a whole new generation of "OBVIOUS_IDEA with SIMPLE_IMPLEMENTATION in a browser" patents to role through... a whole new generation of free money.

Wow, no points for sarcastic humor I guess.

I got the sarcasm alright, the humor I could not find.

In fact, I'd like it more if it was a compiled executable. A couple of weeks back I did something vaguely similar out of boredom on a sunday afternoon in C. It's quite simple, technologically speaking, but a lot of fun to play around with. Same here, it's not a great achievement but it's nice to look at. However, the whole fun originates in the responsiveness of the application and this being a browser implementation is horribly slow and unresponsive. Yes, we can do nice things on the browser today, but I have yet to see anything that ran fast enough to be useful while not eating all my CPU power in one big lump.

So, yes: I'd enjoy this a lot more if it was native code. And by the way, this is nowhere near a factor two of a compiled code implementation.

As already stated it's partly about the convenience. Click a link, there it is, source code et al.

The other reason is that most of us are familiar with the online world a large amount of us will have written JS and therefore have an emotional investment of some sort in it. Thanks to the recent JS engine/browser wars the possibilities have come on so far that it would have been almost inconceivable to have seen this five years ago in the IE dark ages so seeing it live like that is fascinating and gives an endorphin-fuelled sense of 'how far we've come'.

IMO, don't over estimate the size of the "technical crowd" vs the entire readership here

Without wishing to kick even more sand in your face, I thought it was pretty cool. I was as impressed with codepen (which I hadn't seen before) as I was with the demo (oh, they really can do some pretty neat stuff in javascript these days).

It's like this video: http://www.youtube.com/watch?v=GcDshWmhF4A

Where a guy builds a binary adding machine out of wood and marbles. I've seen them before. I've even seen nicer ones (more expertly constructed). His little counter / adder isn't really a feat in any way. I could even show you how to build a vastly better one with a CPLD. Yet, I am still impressed, and amused when I see that someone has built one. Wood, Minecraft, Little Big Planet, anything else.

But, don't stop being a hater. I even got something useful from your post 'Advanced Character Physics' by Jacobson. which is interesting, and which I probably wouldn't stumble across on my own.

I don't think anyone genuinely finds this impressive. People simply up-vote because it's written in JavaScript and allows for some immediate clicking gratification. Which, I agree, is sad. (And will be vehemently denied.)

I wouldn't really mind if this phenomenon didn't drain attention and resources from other technologies.

The advantage is.. you can see the code, see what it does, play with it... and see the results instantly.

But it is a scripting language! And it can draw in 2D in real time. And it is deployed to a very popular fat-client over the network. And it even looks like decent frame rate. On my quad-core machine. What is there not to be impressed with in 2013?

Time to re-implement all of these in JS, now that most people don't enable Java applets: http://www.red3d.com/cwr/steer/

well, this sounds like a pc critic in the 70s. "what's new with this thing called personal computer? I see nothing new that couldn't have been done on a mainframe it my university five years ago". but yes, the differ de is that you have now that power in your bedroom. similarly, i guess that most people visit more web pages each day than they download programs, so yes, new-old possibilities in the browser ARE a relevant thing.

Its refreshing to see this is in a scripting language that works on any browser. Take it as inspiration and do something better.

Please let us be impressed by whatever impresses us.

I was helping someone with this exact demo a few days ago. They wanted the demo so that it was an image that gets stretched appropriately with the "cloth":


I give a teeny explanation of the structure of the thing, but only enough to understand how to use an image instead of a wireframe.

Somebody should put this on the App Store with 10 textures for $0.99 and extras if you buy more. It would sell like crazy.

No, it wouldn't. It's engaging for about 2 seconds, and doesn't even begin to compare to the addictiveness of a successful game, even if you lumped a bunch of bogus social stuff on.

I think this is only really novel to technical users looking through a lens of tech, though of course I think it's incredibly novel too. But addictive video games already do very realistic stuff around hair, cloth, and all sorts of things, and your average game player will rip the cloth and move back to Angry Birds.

I agree it's really cool, and I Facebooked this, but a cool animation a game does not make.

"It's engaging for about 2 seconds"

In other words, it clearly surpasses the vast majority of games in the app store.

If you were able to try "the vast majority of games in the app store" no wonder you couldn't spend more than 2 seconds on each.

No wireless, less space than a Nomad. Lame.

This is slashdot's review of the iPod. It's a great example of techies completly under judging a new product

I've played with an app called Koi Pond for ages. Its just poking fish and feeding them, but it is still engaging. I would play with a textured cloth. I would pay for an app that let me play with a textured cloth.

There are lots of very simple toys that are popular on the App Store. (Of course, it's hard to tell which ones will make money ahead of time.)

I disagree too, and it seems by the many comments that say how satisfying this is, that others find this fun. Obviously it would need a little more to make it a game, but just like Osmos which is simple physics and a simple concept (absorb smaller things) it can b very satisfying and successful. I think you're over thinking the game buying public. Many games have been little more than a concept like this.

i disagree this could make a lot of money off pure satisfaction. better than playing first person shooters and blowing things up

Even better: select a photo from your library and tear it up. Bonus points for recording it as a video.

Link it to the accelerometer and gyroscope and watch as your photo flaps about as you move your phone. Combined with tearing up your photo I bet it would get a few downloads.

Maybe? Hard to tell - doesn't work on my iPhone. Also most apps without a marketing budget seem to be DOA these days unless they get featured by Apple or come from an established dev.

Would love counterexamples from the downvoters.

This is basically a rip-off and a direct port from this processing scetch: http://www.openprocessing.org/sketch/20140

the presentation is arguably nicer but i am a bit disappointed how it claims copyright and doesn't give attribution.

First thing I thought too. Bit of a shame

Very cool physics simulation. I think it needs a little damping though; if I cut all the cloth off I end up with a creepy wiggling pile of cloth at the bottom. (To reproduce: slowly cut across the top of the cloth so it all falls into one pile.)

The threads move far too fast in general, to be any physical substance.

Needs a bit of parameter tuning.

After you have the pile on the bottom you could throw it up and try to move it without falling down :)

Tearing at the cloth is just so... satisfying.

Don't get me wrong, this is a cool demo, but as someone who experimented with verlet based physics before I don't understand what is so impressive about a basic implementation in JavaScript.

The math behind it is ridiculously easy and JS got faster over the years. And as someone already mentioned there is a 13 years old paper about verlet physics in games so this is everything but new.

It's so little code, blows me away.

you might want to check this tutorial out:


which is what this thingy seems to be based on...

Excellent tutorial, thanks! I just tried submitting it to HN but it was auto-killed for some reason. Any idea why?

Depends what you mean by "killed" but your submission won't be accepted if there is already a duplicate one with the same url.

on a hunch, I tried posting another article from that site, and it also arrived dead. Looks like that domain has been banned for some reason, probably spam.

Is there any connection between this and http://subprotocol.com/verlet-js/ which was posted on HN a few days ago, or did you both happen to play with the same algorithm at the same time?

I'm actually not the developer. I just happened across it, enjoyed it a lot, and was surprised to find that it wasn't posted on HN yet.

Oh I did not see it the first time around. At any rate I'm glad it is getting more exposure this time.

Can anyone speak to what's going on in these algorithms? I'm interested in the physics/math behind them. For example, how much about partial differential equations do I need to know to understand them?

It's very simple really. It's a grid of point masses with constraints between them (the lines you see) that says to keep the points at a constant distance from each other. Think of the constraints as springs that follow Hooks law[1], only infinitely stiff. You iterate through all the constraints and move the two points of each constraint apart if they are too close, or closer if they are too far apart. You need some basic linear algebra for the distance and direction calculations. It's common to use verlet integration to actually move the points because it's so easy do solve the constraints with it. Add some gravity and it looks very convincing.

To tear the "cloth", all you need to do is to remove those particular constraints from the list.

[1] http://en.wikipedia.org/wiki/Hooke%27s_law

One of the things I love about encountering things like this on HN are comments like these, which are even more informative than the original post. I'd seen the demo in the OP, and thought, "neat". Later on, I read comments that say, "Oh, you just need to ___ the ___ with ___, and use ___'s Law to ____ for the whole grid" --- most of which is completely over my head. In some perspectives this might seem discouraging -- trivializing the difficulty of learning it. However, I find it tremendously invigorating: the idea that it's simple for someone with the right learning and knowledge means that it's something I could do to, if I wanted to spend the time to learn it.

Thanks for posting comments like this. It opens my eyes to questions I didn't even know I had. ("What's a verlet?" "Oh man, I need to re-learn my linear algebra someday...")

You don't need to know much (if anything) about PDEs. If you've taken an undergrad class in classical mechanics, you'll do just fine.

If you're interested specifically in game physics using Verlet integration, http://web.archive.org/web/20100111035201/http://www.tekniku... is a nice reference. Most of the springy-cloth demos use Verlet integration.

Here's a short series on 3D game physics that doesn't rely on a Verlet integration scheme: http://gafferongames.com/game-physics/. The advantage here is you get a more general ODE solver. It's a little bit more tricky to get right, though.

Once you dig a bit deeper into it, you'll find that the hard part is collision detection/response. A nice intro is the two tutorials at http://www.metanetsoftware.com/technique.html. An in-depth reference is Real-Time Collision Detection by Christer Ericson.

A community related to this is http://www.bulletphysics.org/Bullet/phpBB3/.

You can achieve most of this with Euler integration to update the positions and velocities of the points—as well as Hooke's law to simulate the connections as a grid of tiny little springs.

I've used similar algorithms in a graph layout library of mine: http://getspringy.com/

Imagine a js library that would allow to tear content on a page. I would love to tear some of my emails ;)

I read this headline and was like "Why on earth would I want to see a terrible simulation?" oy

I tried so hard to tear that last line, but just couldn't.

Awesome simulation by the way. Just getting into js myself (yeah, I know).

That was surprisingly therapeutic. If those chinese balls can be sold for $5 that serve the same "pain", then maybe Patio11's suggestion that someone should stick this in the app store has some weight.

Either way, if it doesn't require too much coding, and I have honestly no idea of how much coding it does or does not require, since i'm not a coder, but i'm assuming it's not that much work to pick up a HTML5 framework and run with it.

Better still. If it can't be charged for, it's a sure way of generating interest and creating a crowd or audience of a group of people that clearly like something like this, which should open up ideas for associated revenue streams with this serving as a hook.

If i was a coder, i'd suddenly give it a shot, even if it was only for my own learning and experimentation.

The reasons, at least for me, to give it a shot would far outweigh the reasons not to.

This reminds me of the experiments of Glenn Murphy ( http://bodytag.org )

I just wasn't ready for the awesomeness. In 2002, as a graduate student I worked on developing a similar app for Phantom (a desktop haptic device that our research group had bought). It took me a full semester to create a similar haptic simulation (actually, our visuals weren't half as good as the one here). Our goal was to simulate the texture and "feel" of skin, with the aim of one day allowing doctors to operate patients remotely. When I first came across haptic devices, I (wrongly) said to myself - 'my god! everything will work this way one day'. The promise of combining physics-driven visuals and haptic feedback still remains unfulfilled to this day (except some games, but still to a very limited extend, in my knowledge). Thanks for putting this out there. It was fun to revisit my graduate school memories!

That's not tearable at all, it's great

This is awesome. I don't know what's more satisfying: actually tearing the cloth to pieces, or the fact that my 2009 13" macbook pro can run it smoothly without stressing the CPU.

Lucky you. It maxes out the CPU on an early 2008 (2.4 GHz w/ x3100) MacBook. I guess an actual GPU makes all the difference.

My 4 year old netbook's Intel Atom N270 (1.6 GHz, 1 GB RAM, Graphics (integrated)Intel (GMA)GPU model 950) only went up to 58% CPU usage during the tearing.

    Running userland applications:
    FreeBSD 9.x
    2 terminals (urxvtc)
    DWM + dmenu
Seems like it was worth the $99.

It seems to be smooth on my Nexus 4, but interactions do not work so I'm not quite sure.

This is better than popping bubblewrap paper. Amazing job.

Especially since more cloth is only a refresh away, whereas bubble wrap.... well, you only get so much of it at a time.

There goes my evening :(

Awesome. My cpu didn't spike past 25% for chrome renderer and 20% for helper while doing all the tearing I could manage.

My cpu goes to 800% (4 core + HT).

Pretty cool, I like how the result of the torn cloth is rather artist looking.

I used to study fine art, if you want to reference something original I always thought setting up a physics engine for creating scenes that you could reference in your painting would be cool, instead of having to acquire and damage the objects yourself.

This is simply magic, I'm kinda speechless.

Neat! I showed this to my wife (she is learning JS for fun). We were both really impressed.

Interesting discussion on reddit about this: http://www.reddit.com/r/programming/comments/1ayxbr/simulati...

Modified to support touch, Vine video: https://twitter.com/wyz/status/326808367437848576

Can you share the source code for this modification? Interested to diff the two and see just what magic is required to turn something that does not support touch events into something that does. Everything I find on stack exchange about it outright doesn't work for me on the platforms I need to support. Fingers crossed!

on it...

Nice work!

Is there a way to add the stress/elasticity factor to it, so as to demonstrate that after certain point of pulling a point on cloth, any more force will tear the cloth?

Was playing around with this, made a waving flag: http://codepen.io/anon/pen/mnadz

That's just tearable! haha It's actually pretty cool!

If you like this, you'll love http://www.surgeonsimulator2013.com/ (there's a free Web playable demo available). A totally unrealistic surgery simulator where instead of cutting a cloth, you're thrusting scalpels and drills around the innards of a poor soul.

> Web playable demo

before anyone goes looking for it, it's "web playable" as long as you got the Unity3D plugin.

I'm speechless with admiration.

Wow, ridiculously impressive.


Read this as "terrible" the first time and was confused. Nice effect.

How to apply texture to this, make it looks like a real cloth ?

I wish I could click on the cloth and have it simulate a bullet

That's less than 300 LOC which interests me so much!

Cut, cut and cut across...and it smiles at you. :)

I read this as 'Terrible Cloth Simulation'. Lol.

Crashes on Safari on iPod Touch iOS 6.1.3

It's a nice demonstration. Well done.

That... that was beautiful.

This is truly awesome.

Cannot stop tearing.

protip: don't make the cloth considerably larger :(

Much admiration.

it makes for a great stress buster, imo

Tearably nice

Read that as "terrible cloth simulation."

really fascinating! Great job


modified for touch events

admiration !!

Stressball 2.0


this is a great experiment.

This is beautiful, and even more so considering it's done so well in JavaScript. It's times like these when I reflect with disdain that our industry is so full of hipster brogrammers with tons of butthurt. Get over yourself.

Thats just tearable.

had to be said

I think you should have written some kind of code that blinked back and forth between tearable and terrible.


Holy flying batsh*t, that's great!

why should I learn js. Give me incentives that defeats the flaws JS has. eg.

[1,2,3] + [4,5,6] is 1,2,34,5,6 what the hell is this. Am I supposed to go around to find every fucking bugs it has and change my understanding of basic operations?

Guidelines | FAQ | Support | API | Security | Lists | Bookmarklet | Legal | Apply to YC | Contact