Hello, my name is Alexei Epishev.
Our today's lesson is dedicated to different
data operations in Quartz Composer.
And especially to iterators and queues.
We'll learn about them on the example
of a simple paint composition.
First of all, let's make a template
for our comp.
It will include: Clear, Billboard,
Render In Image, Rendering 
Destination Dimensions patches.
The last patch returns viewers current dimensions
in Quartz Composer units and in pixels.
Let's connect its outputs to respective
inputs of Render in Image patch.
This will prevent pixel loss
while rendering graphics.
Also set billboards width to 2
for full viewer area rendering.
Now we are ready to program the main part.
We will work inside a render in image patch.
First of all, create billboard
and set it's width, for example, to 0.1.
You will see a flickering image, to disable it,
go to Render In Image Settings
and switch on Enable Feedback Rendering option.
Also switch on "disable depth buffer",
to reduce the amount of VRAM used.
Let's create a kind of brush,
which is a small sample image
to render on a billboard.
I choose Radial Gradient Generator from
a patch library for my sample image.
To get transparent full off,
we need to change the color
too from black to transparent
by setting it's opacity to zero.
For the difference, you can also
try loading images from your disk.
The choice of the image can be free,
and depends on esthetic preferences.
It's always better when a sample
picture contains alpha channel.
Now I can connect generator to a billboard.
Next what I'm going to do is control.
I prefer to control my object by mouse,
so I choose a mouse patch.
Connect X and Y position from Mouse
to the same positions of a Billboard.
Now you see that our gradient
is following a mouse cursor.
An absence of clear patch inside
a Render in Image patch
leads to keeping previous frames visible.
And gives us an effect of painting.
To achieve a transparency instead of a black,
switch blending modes from Replace to Over.
In this mode, Billboard begins
to accept Alpha channel.
You can also try other blending modes.
Let's now perform colorization.
Choose Interpolation patch and HSL Color patch,
just like in previous lesson.
Make connections.
Now a color of gradient changes
from frame to frame.
Next what I'm going to do is to make a gradient
scale to depend on cursor's velocity.
For this I need to calculate
cursors velocity vector length.
Choose Derivator patch twice. And connect inputs
to X and Y position of mouse patch.
Now choose Mathematical expression patch.
To find vector length use the formula of distance.
Also let's divide a value by 50 for calibration.
A result goes to Billboard's width.
Now in a viewer window we can see
an intensity of painting.
Let's group these patches, choose
them and click Macro Patch.
Also you can rename inputs
and outputs by pressing CMD+3.
The resulting composition is very simple,
nevertheless the picture looks too static,
and I'd like to get some kind of pulsing gradients.
So let's try another approach.
You can keep unused renderers
in place by simply disabling them.
In disabled condition they
don't use any video memory.
Insert Clear Patch to clear frame buffer.
To let any gradient live its own life after
it was painted, we need to use Queue.
First we need to collect all varying
parameters into one organized set.
Choose Named Structure Maker patch.
Press CMD+2 and switch the number of inputs to 3.
Name inputs: X, Y and Scale.
And then connect to respective parameters.
Now choose Queue patch.
Let's restrict a number of elements,
set the Queue size to 100.
Connect structure output to Queue's Value Input.
Also, we need a rule for Queue filling.
Let's say that the filling will happen
only when the mouse is moved.
To make this, select Watcher patch twice
and connect it to X and Y position of the Mouse.
To use logic rule, select Mathematical Expression
and type this expression.
It means that the result is true when X or Y changes.
Then connect result to Queue filling input.
Let's also group these patches.
After all this, we get a structure
of 100 numerical sets
that contain X, Y and Scale data.
Now we need to visualize data.
For this we will use an Iterator.
Choose Iterator patch.
Note that it is a macro patch,
so we can work inside of it.
Choose Iterator Variables patch,
also insert Billboard,
Structure Index Member
and Structure Key Member.
To use in common structure inside Iterator,
we need to publish Structure Index Members,
Structure Input.
Let's call it "Data".
Connect Index Input to Iterator Variables Index.
Switch level up
and connect recently published
structure to Queue's output.
Set a number of Iterations equal to Queue's length.
Insert Input Splitter and connect to Iterations.
Now we need to spread out a given member,
since it's a set of data.
Duplicate Structure Key Member
twice by pressing CMD+D.
Name the first key - X, the second key -
Y, the third key - Scale.
Connect inputs to member output.
Now let's make final connections.
Connect X Member to Billboards X position.
Y Member to Y position. Scale Member to Width.
Now, about our gradient images.
There are actually two ways to transmit
this data into an Iterator.
First is to queue images.
Remember that the Gradient Color interpolates.
This method is very useful when you
capture video input frames, for example.
The second is to include Hue data
into existing Data Queue
and then apply it to HSL Color patch
inside an Iterator. I'll try the second.
First, publish Billboard's Image input
and connect it to Generator Image.
Disconnect Color from Gradient
and set its own color to white.
Then increase number of named inputs to four
and name the new one Hue.
Connect to Interpolation output.
Now inside an Iterator duplicate Key Member again
and name it Hue too.
Insert HSL Color patch, make connection.
Lower luminosity
and connect Color to Billboard's Color.
That's it.
We now see a resulting picture,
but still not all looks so good.
First of all, switch Blending to Over.
Now we can notice a rough disappearance of objects.
So let's set Alpha Rule for structure members
inside an Iterator for smooth fade out.
Simply connect Alpha input of HSL Color patch
to Iterator Variables current position
that various from 0 to unity.
Okay, now let's bring a life
to our picture. Choose LFO.
Set Amplitude to 0.01 for weak oscillation.
Connect LFO Offset to Scale member,
result to Width.
Now let's play with the phase, create an expression.
Index multiplied by 10
and connect it to Index and to Phase.
Note that the Phase in measured in degrees.
Now you can see beautiful
chains of pulsing objects.
Let's move to root macro patch
and answer the question:
why do we prefer Root Rendering in Image?
This becomes very suitable when you want
to place any effects on resulting image.
Just insert it before the Main Billboard.
And admire the beauty.
