Actionscript particles - Fountain equalizer

Here’s a new experiment.
It uses the computeSpectrum method together with a simple particles class i wrote.

I think the effect is graphically very satisfing and personally cannot stop to look at it.
The song is “Aria regina della notte” from Mozart’s “Flauto Magico”.

Tomorrow I’ll post code and sources of this.

Hope you’ll be hypnothized from this as I am.

The picture is not well explaining, you must see this in action.

EDIT:

Ok, sorry for the late but here we are with the source code:

Download the SimpleParticleGenerator and SimpleParticle class zipped togheter, then just use this code to build the equalizer.
I release the code just now because I wanted to wrap the main code in a class too, and maybe add some methods to scale it like a component, but I realized it’s totally unuseful for few lines of code, and I don’t wanna loose the fun part in the experiment.

I promise that from now I will be faster to release the source code :)

// Author: Pierluigi Pesenti
// Web: http://blog.oaxoa.com
 
import flash.media.Sound;
import flash.net.URLRequest;
import flash.media.SoundMixer;
import flash.utils.ByteArray;
import flash.events.*;
import flash.display.Sprite;
import flash.filters.GlowFilter;
import com.oaxoa.fx.SimpleParticleGenerator;
import com.oaxoa.components.FrameRater;
 
var req:URLRequest=new URLRequest("mozart.mp3");
var sound:Sound=new Sound(req);
var ba:ByteArray=new ByteArray();
var samples:uint=32;
var offset:uint=256/samples;
 
// create a sprite and add 1*samples istances of the SimpleParticleGenerator class
var _holder:Sprite=new Sprite();
for(var i:uint=0; i<samples; i++) {
	var pg:SimpleParticleGenerator=new SimpleParticleGenerator();
	pg.y=252;
	pg.x=15+i*offset*2;
	pg.angleDeg=-90;
	_holder.addChild(pg);
}
 
// add the holder sprite and start music
addChild(_holder);
sound.play();
 
// listener for frame based animation
addEventListener(Event.ENTER_FRAME, onframe);
 
// some fancy glow filter
// the glow filter is added to the holder sprite
// and not to the single particle for two reasons
// a lot of speed gain, and visually better blend result
var glow:GlowFilter=new GlowFilter();
glow.color=0xFFAA00;
_holder.filters=[glow];
 
// at every frame
function onframe(event:Event):void {
	// compoute sound specturm
	SoundMixer.computeSpectrum(ba, true);
	var count:uint=0;
	//for every generator
	// with a 0-256 range only the left channel is sampled
	// you can easily goto from 256 to 512 for the right or sample both and average value
	for (var i:uint=0; i<256; i+=offset) {
		var t:Number=ba.readFloat();
		var n:Number=t*20;
		var g=_holder.getChildAt(count);
		// set the particles speed at a value of n
		// n = the sound peak * 20 to raise the effect
		g.speed=n;
		count++;
	}
}
 
//add frame rate meter
var fr:FrameRater=new FrameRater(0xffFFFF, false, true, 0x0099ff);
addChild(fr);

Expect more equalizing fun.

19 Comments so far »

  1. Russ said

    am December 28 2007 @ 5:52 pm

    very nice, even though I am not a big opera fan, I watched it all the way through…

  2. Pierluigi Pesenti said

    am December 28 2007 @ 6:07 pm

    Thanks, I am not an opera fan too (only opera Browser :)) but I was searching for a song to better render the effect.
    bye

  3. Ryan said

    am December 30 2007 @ 8:04 pm

    This is so amazing, very hypnotizing indeed… I wonder how long it took you to think of and create this? It’s just so very stunning…

  4. Pierluigi said

    am January 21 2008 @ 8:41 pm

    Am-az-ing!!!
    Do you still plan to post the source code of your effect? I want it! Thanks ;-)

  5. Pierluigi Pesenti said

    am January 21 2008 @ 9:01 pm

    Hey! We have the same name ;)
    Sure I want to release the code, I’ll post it (hope) tomorrow.
    Byez

  6. Romain said

    am January 22 2008 @ 7:11 pm

    Oups!
    Wrong copy/paste ;-)
    Thanks for the source!

  7. Lamer said

    am January 25 2008 @ 8:52 am

    Where is the code?

  8. Mike Lowry said

    am February 5 2008 @ 5:35 am

    wow great effect… I’d like to learn how you did this.
    But I can’t find the code on your website?

  9. SCaSic said

    am February 15 2008 @ 2:51 pm

    Outstaning. Please share the code. Equalizer is needed.

  10. Thomas Joos said

    am February 15 2008 @ 3:38 pm

    hey dude really nice but I’m also waiting on the source code ;)

    could you please post it on your website please?

    grtz thomas

  11. Lawrence said

    am February 16 2008 @ 7:58 pm

    Very interesting! Stunning visual effect!
    I’d also love to have a look at the code. Please and thank you.

  12. Sprint-Debugger said

    am February 23 2008 @ 9:35 pm

    PLEASE, dude, man, post the coolest actionscript ever made! P L E A S E !!!

  13. Fountain equalizer now with source code - Oaxoa Blog said

    am February 24 2008 @ 11:15 am

    […] just edited the Fountain equalizer post adding the source code. You’ll just need to download the two particles classes and copy the […]

  14. zap said

    am March 4 2008 @ 4:51 pm

    com.oaxoa.components.FrameRater

    where is it?

  15. Pierluigi Pesenti said

    am March 4 2008 @ 4:54 pm

  16. Olivier said

    am April 1 2008 @ 2:08 pm

    Very nice, I would have put a bit more of red into the particles so that it looks like fire but it is already amazing ;)

  17. davidgarcia said

    am May 4 2008 @ 2:18 am

    hi!!!…….. its an amazing job…. really love it…. i got a question i dont know how what and where to put the code..and which of the three use…… i know i have to change the mp3 name which is the music but besides that ….nothing…. could someone please please help me?????? its in the actions panel or where.. do i have to put someting in the fram or layer ……

  18. Pierluigi Pesenti said

    am May 4 2008 @ 9:24 am

    simply download the zipped classes and extract them in any folder.

    Then if you use flash CS3 just do these simple steps:
    - open a new fla
    - open “publish settings” panel and in the flash tab near to the “actionscript” combobox press settings.
    - push the crossair button and browse to the folder where u saved the classes.
    - paste the above code in the first frame actions of the newly created fla.
    - compile and enjoy.

    if you use flex builder I am almost sure you know the process, very similar.

  19. davidgarcia said

    am May 5 2008 @ 3:02 am

    Thank you very much…. i dont know whats goin on …. i did just what you say… and nothing.. i dont know if being a mac affects in somehow??…..

Comment RSS · TrackBack URI

Leave a comment

Name: (Required)

eMail: (Required)

Website:

Comment: