Particle effects in JavaScript • Hacker News Board

Re: Particle effects in JavaScript

#51

Post by acomjean » Tue, Oct 29, 2013, 2:03 AM UTC

deweller wrote: post #5

Warning: This demo locked up my OS and I had to force-restart. Chrome 25/OSX 10.8/Mac Pro Desktop, Early 2008.

Oddly: worked fine on my mac pro 1.1 (2006) and 10.6 (snow leopard) and firefox.

Re: Particle effects in JavaScript

#52

Post by maxlibin » Tue, Oct 29, 2013, 2:11 AM UTC

nice!

Re: Particle effects in JavaScript

#53

Post by JacksonGariety » Tue, Oct 29, 2013, 3:10 AM UTC

Everlag wrote: post #50

JacksonGariety wrote: post #36

I did some experimenting to make particles dance to the beat of music if anyone is interested: http://trapcity.tv

Strange, I get no particle effects. When I check out the chrome console I find: Uncaught TypeError: Cannot set property 'innerHTML' of null

Browser info?

Re: Particle effects in JavaScript

#54

Post by JacksonGariety » Tue, Oct 29, 2013, 3:11 AM UTC

timthimmaiah wrote: post #46

JacksonGariety wrote: post #38

Earlier quoted context omitted.

Here you go: https://github.com/jacksonGariety/trapcity

Thanks dude. We're working on a custom soundcloud player widget thats fully customizable. I'm thinking about using your visualizer. https://github.com/tim-thimmaiah/tonedenplayer

Go for it!

Re: Particle effects in JavaScript

#55

Post by lstamour » Tue, Oct 29, 2013, 3:16 AM UTC

feistyio wrote: post #48

Dear author: If you refactor the object/array/Float32Array instantiation in the redraw loop out into one-off allocations you will see a remarkably improvement in performance in terms of garbage-collection.

Note to self: Next time you want to optimize your cool-looking effects, post the source as a demo to HN. :D

Re: Particle effects in JavaScript

#56

Post by ruggeri » Tue, Oct 29, 2013, 3:23 AM UTC

Amazing, beautifully done. Wonderful :-)

Re: Particle effects in JavaScript

#57

Post by digitalboss » Tue, Oct 29, 2013, 3:35 AM UTC

JacksonGariety wrote: post #36

I did some experimenting to make particles dance to the beat of music if anyone is interested: http://trapcity.tv

Full screen'd this beast and jammed out, bass line is thickkkkk.

Works perfect on Version 30.0.1599.101 Chrome.

http://www.youtube.com/watch?v=W5R4GFbXPvY

edit: added link to OfficialTrapCity

Re: Particle effects in JavaScript

#58

Post by Ellipsis753 » Tue, Oct 29, 2013, 3:49 AM UTC

bridgeyman wrote: post #2

What are the different rendering modes referenced by the help text? I couldn't detect any difference after hitting the space bar. Very cool effect!

Add "setRenderMode(1);" into the onResize function. Then change between the numbers 0 to 3 (so "setRenderMode(3);" for example) to try the different modes. You may have to resize the window a little each time to make the new mode start but I didn't have to. It's a little annoying that it won't register button presses.

Re: Particle effects in JavaScript

#59

Post by Everlag » Tue, Oct 29, 2013, 4:59 AM UTC

JacksonGariety wrote: post #53

Everlag wrote: post #50

Earlier quoted context omitted.

Strange, I get no particle effects. When I check out the chrome console I find: Uncaught TypeError: Cannot set property 'innerHTML' of null

Browser info?

Stable chrome branch. Version 30.0.1599.101

In chrome canary I also get:

Invalid CSS property value: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(0,0,0,0.33)), color-stop(100%,rgba(0,0,0,0.75)))

and the same error as found in in standard chrome.

Re: Particle effects in JavaScript

#60

Post by bluegate010 » Tue, Oct 29, 2013, 5:06 AM UTC

JacksonGariety wrote: post #53

Everlag wrote: post #50

Earlier quoted context omitted.

Strange, I get no particle effects. When I check out the chrome console I find: Uncaught TypeError: Cannot set property 'innerHTML' of null

Browser info?

I've got the same problem: Version 30.0.1599.101 Chrome on Mac OS X Mavericks.

I believe the problem is your time() method on line 189 of script.js; there's no element with id "time".