Queue Control 2 - Image Queue Structures - Quartz Composer Tutorial




The Queue patch that is provided by Apple in the Quartz Composer app, included in the Developer Tools, is nifty for a variety of reasons. The queue is basically a value store, that allows you to store a given amount of incoming values. It comes in handy for building structures to feed to rendering objects or for grabbing incoming images. Line drawing, time blurs and acid trails, my compadres!

The limitation of the Queue patch, as is, is that it only grabs one incoming feed. In the same way that I talked about a 3D value Queue in my last post, it's not too hard to make a Queue grabs images instead of values, and that has multiple input ports. This is useful, because one can take an image and feed it through different effects, and then sort through the result via iteration, or even build up separate image feeds (multiple movies, video feeds), and then sort via iteration, without having a bunch of redundant queue patches hanging around.

The code is just this easy:

_Queue = []

function (__structure Queue) main (__image Value[3], __index Size)
{
var result = new Object();
_Queue.push([Value[0], Value[1], Value[2]]);
if (_Queue.length > Size) _Queue.splice(0,_Queue.length-Size); result.Queue = _Queue;
return result;
}


If you want to add in more sources, change "(_image Value[3]" to a higher value, like "(_image Value[5]" and then add in a port for the increased value on the line "_Queue.push([Value[0], Value[1], Value[2]]);"... so it would read something like " _Queue.push([Value[0], Value[1], Value[2], Value[3], Value[4]]);" and so on.

So, literally, the only thing one has to do to change a javascript value queue, to an image queue, is to change the main function line from "value" to "image".

What will result is a two tiered structure; for each initial structure member, there will be three separate images in this case, one for each image input. So, two structure index patches will give access to the actual image. One can also use the old "interpolate in an iterator" trick to splay out the image sources across multiple sprites automagically instead of manually sorting to different rows. I'm uploading an example that displays both methods to the Box widget on the sidebar.