Pixel Bender Toolkit

I have been wanting to have a look at Pixel Bender for some time now. The Christmas holiday proved a perfect chance. Reading blog posts and looking at some examples by the usual suspects (Andrew Zupko, Joa Ebert, Mr.Doob, Tinic Uro, Pixelero, Lee Brimelow and Antti Kupila ), Adobes Pixel Bender Exchange and the ‘Pixel Bender Specification’ you can find under ‘Help’ in the Pixel Bender Toolkit menu was of great help.

Thought it would be fun applying the shader to a 3D model in Papervision, but it could be anything ( some shaders with their current settings also look good using input from a webcam… ).

The Collada cow I got from Papervision2.com, a fine place for Papervision related tutorials and examples.

Before we look further into pixel bender source code here is the Actionscript part to integrate and make use of the shader (.pbj).

private const _buffer: BitmapData = new BitmapData( 600, 400, false );

private var _shader: Shader;
private var _loader: URLLoader;
private var _view: BasicView;

//...

private function loadShader( shaderUrl: String )
{
    _loader = new URLLoader();
    _loader.dataFormat = URLLoaderDataFormat.BINARY;
    _loader.addEventListener(Event.COMPLETE, onLoadComplete );
    _loader.load( new URLRequest( shaderUrl ) );
}

private function onLoadComplete( event: Event ): void
{
    _shader = new Shader( _loader.data );
    //... get Shader info, if you wish
    //... setup the 3d stuff
    _view = new BasicView( 600, 400, false );
    //...
    stage.addEventListener( Event.ENTER_FRAME, render );
}

private function render( e: Event ): void
{
    _view.singleRender();
    applyShader();
}

private function applyShader(): void
{
    _buffer.fillRect( _dim, 0xffffff );
    //whatever you want to have as input for pb
    _buffer.draw( _view );
    //in the pb file you will find something like 'input image3 src;'
    _shader.data.src.input = _buffer;

    graphics.clear();
    graphics.beginShaderFill( _shader );
    graphics.drawRect( 0, 0, dim.width, dim.height );
    graphics.endFill();
}
                    

That is all you need to make use of the pbj.