<?xml version='1.0' encoding='UTF-8'?>

<?xml-stylesheet href="./_c74_tut.xsl" type="text/xsl"?>
<chapter name="Tutorial 18: Iterative Processes and Matrix Re-Sampling">
<setdocpatch name="18jIterativeProcesses" patch="18jIterativeProcesses.maxpat"/>

<previous name="jitterchapter17">Feedback Using Named Matrices</previous>
<next name="jitterchapter19">Recording movies</next>
<parent name="jitindex">Jitter Tutorials</parent>



<h1>Tutorial 18: Iterative Processes and Matrix Re-Sampling</h1>
<p>This tutorial demonstrates a more complicated example of when to use named <o>jit.matrix</o> objects, as well as how to use <o>jit.matrix</o> objects to upsample and downsample an image.</p>


<p>The upper left-hand corner of the patch contains a <o>jit.movie</o> object that has a still image (the file <i>fuzz_circle.jpg</i>) loaded into it when the patch opens.</p>

<illustration><img src="images/jitterchapter18a.png"/>Read the image</illustration>
<bullet>Start the <o>metro</o> object by clicking the <o>toggle</o> box above it. You should see an image appear in the<o> jit.pwindow</o> in the lower right of the tutorial patch:</bullet>
<illustration><img src="images/jitterchapter18b.png"/>Our little comet</illustration>
<p>The <i>fuzz_circle.jpg</i> file contains an image of a white circle with a black background, which is being scaled in size to appear as a small circle inside of our final matrix.</p>

<illustration><img src="images/jitterchapter18c.png"/>The real fuzz circle</illustration>
<h2>Getting Drunk</h2>
<p>The top part of the patch writes the image from the <o>jit.movie</o> into the first <o>jit.matrix</o> object in the chain. A <m>bang</m> generated by the <o>bangbang</o> object changes the <m>dstdimstart</m> and <m>dstdimend</m> attributes of the <o>jit.matrix</o> object with each frame, randomly varying the coordinates using Max <o>drunk</o> objects. Note that our first <o>jit.matrix</o> object has its <m>usedstdim</m> attribute set to <m>1</m>, so that it will scale the input matrix:</p>

<illustration><img src="images/jitterchapter18d.png"/>The drunk part of the patch</illustration>
<p>This first <o>jit.matrix</o>, therefore, simply serves to scale the circle image to fit in a small (80 by 60) region of our output matrix. Note that the <o>message</o> box that formats the coordinates for the scaled image also clears the matrix with every frame (with a <m>clear</m> message), so that there are no artifacts from a previously written image. The Max <o>drunk</o> objects vary the placing of the circle, causing it to jitter around (no pun intended).</p>

<bullet>Click somewhere in the <o>jit.pwindow</o> in the lower right corner of the patch. The circle will jump to the position you clicked, and begin to move from there.</bullet>
<p>The result of a mouse click in the <o>jit.pwindow</o> is sent to the <o>receive</o> object with the name <m>winclick</m>. This message is then stripped of its selector (<m>mouse</m>) and the first two elements (the x and y position of the mouse click) are extracted by the <o>unpack</o> object. These coordinates are then used to set the new origin for the <o>drunk</o> objects.</p>

<h2>The Feedback Network</h2>
<p>Once our circle image has been scaled and placed appropriately by the <o>jit.matrix</o> object, our patch enters a feedback chain that centers around a pair of <o>jit.matrix</o> objects sharing a matrix named <m>blurry</m>:</p>

<illustration><img src="images/jitterchapter18e.png"/>The feedback loop in our patch</illustration>
<p>This section of the patch contains four <o>jit.matrix</o> objects (not including the one at the top which scales down the circle image). Two of the objects share a <m>name</m> (<m>blurry</m>) and are used simply to store and retreive previous matrices generated by the rest of the patch. The topmost <o>jit.matrix</o> object sends its matrix to the rightmost inlet of the first <o>jit.op</o> object in the patch. In addition, it sends a <m>bang</m> to the first named<o> jit.matrix</o> object using a <o>bangbang</o> object, causing it to output its stored matrix (called <m>blurry</m>). This matrix eventually ends up in the left inlet of the <o>jit.op</o>, where it is then displayed (by the <o>jit.pwindow</o>) and multiplied by a scalar (the second <o>jit.op</o> object). It eventually overwrites the previous <m>blurry</m> matrix (by going into the bottom named <o>jit.matrix</o> object).  Without worrying about what the intermediate Jitter objects do, you can see that the <m>blurry</m> matrix will hold some version of the previous 'frame' of our circle image:</p>

<illustration><img src="images/jitterchapter18f.png"/>A scaled-down and illustrated map of our patch</illustration>
<p>The new and old images are combined by the first <o>jit.op</o> object using the <m>max</m> operator. The <m>max</m> operator compares each cell in the two matrices and retains the cell with the highest value. The second <o>jit.op</o> object (with the <m>*</m> operator) serves to darken our image by multiplying it by a scalar (set by the <o>number</o> box on the right of the patch that is sent to the <o>receive</o> object named <m>fb</m>):</p>

<illustration><img src="images/jitterchapter18g.png"/>The feedback amount sets how much the image is darkened before being stored in the <m>blurry</m> matrix.</illustration>
<bullet>Change the feedback amount of the patch by playing with the <o>number</o> box labeled <i>Feedback</i> in the blue region of the patch. Notice how the trails after the circle increase or decrease when you move the circle by clicking in the <o>jit.pwindow</o>, depending on how the feedback amount is set.</bullet>

<h2>Downsampling and Upsampling</h2>
<p>The final step in our image processing algorithm concerns the part of the patch in between the first named <o>jit.matrix</o>, which sends out the matrix saved there during the previous frame by the <o>jit.matrix</o> at the bottom, and the first <o>jit.op</o> object, which composites the previous matrix with the new one:</p>

<illustration><img src="images/jitterchapter18h.png"/>Using jit.matrix objects for resampling of an image</illustration>

<p>The two <o>jit.matrix</o> objects colored green in the tutorial patch are used to <i>resample</i> the <m>blurry</m> image matrix coming out of the <o>jit.matrix</o> object above them. The first of the two <o>jit.matrix</o> objects has its <m>dim</m> attibute set to <m>4</m> x <m>4</m>cells. This size can be changed by setting the attribute with the <o>number</o> box in the blue region with the caption <i>Pixelation</i>. This number gets sent to the <o>receive</o> object named <m>dim</m> above the <o>jit.matrix</o> object.</p>

<illustration><img src="images/jitterchapter18i.png"/>Change the pixelation of the trails</illustration>

<bullet>Change the <o>number</o> box labeled <i>Pixelation</i> in the blue region of the tutorial patch. Notice how the circle trails change.</bullet>

<p>By downsampling the image matrix, the <o>jit.matrix</o> object copies the <m>320</m>x <m>240</m> matrix from its input into a much smaller matrix, jettisoning excess data. The result is a pixelation of the image that you can control with the <m>dim</m> of the matrix.</p>

<p>The second <o>jit.matrix</o> object upsamples the matrix back to a <m>320</m>x <m>240</m> matrix size. This is so that when subsequent Jitter objects process the matrix, they will have a full resolution image to work with and will output a full resolution matrix.</p>

<p>The <o>jit.streak</o> object adds a nice effect to the pixelated trails by randomly 'streaking' cells into their neighbors. The <m>prob</m> attribute of <o>jit.streak</o> controls the likeliness that any given cell in the matrix will be copied onto a neighboring cell. Our <o>jit.streak</o> object has a <m>prob</m> attribute of <m>0.5</m>, so there's a 50% chance of this happening with any given cell.  </p>

<div>
<techdetail>Technical Detail: By default, <o>jit.streak</o> copies cells towards the left. Changing the <m>direction</m> attribute will alter this behavior. There is also a <m>scale</m> attribute that determines the brightness of the 'streaked' cells as compared to their original values. The help patch for <o>jit.streak</o> explains more about how the object works.</techdetail>
</div>
<illustration><img src="images/jitterchapter18j.png"/>Our effects chain with intermediate <o>jit.pwindow</o> objects to show the processing</illustration>

<h2>Summary</h2>
<p>Pairs of named <o>jit.matrix</o> objects can be used effectively to store previous iterations of a Jitter process. These techniques can be used to generate video delay effects by combining the previous matrix with the current one using matrix compositing objects such as <o>jit.op</o>. You can also use <o>jit.matrix</o> objects to resample an image (using the <m>dim</m> attribute), both to perform an algorithm more efficiently (the smaller the matrix, the faster it will be processed by subsequent images) and to create pixelation effects. The <o>jit.streak</o> object performs random cell streaking on an input matrix by copying cells over to their neighbors according to a probability factor (set by the <m>prob</m> attribute).</p>

	<seealsolist>
		<seealso name="drunk">Output random numbers in a moving range</seealso>
		<seealso name="jit.matrix">The Jitter Matrix!</seealso>
		<seealso name="jit.op">Apply binary or unary operators</seealso>
		<seealso name="jit.pwindow">In-Patcher Window</seealso>
		<seealso name="jit.movie">Play or edit a movie</seealso>
		<seealso name="jit.streak">Probability lines</seealso>
	</seealsolist>
</chapter>
