<?xml version='1.0' encoding='UTF-8'?>

<?xml-stylesheet href="./_c74_tut.xsl" type="text/xsl"?>
<chapter name="Tutorial 11: Lists and Matrices">
<setdocpatch name="11jListsAndMatrices" patch="11jListsAndMatrices.maxpat"/>

<previous name="jitterchapter10">Chromakeying</previous>
<next name="jitterchapter12">Color Lookup Tables</next>
<parent name="jitindex">Jitter Tutorials</parent>



<h1>Tutorial 11: Lists and Matrices</h1>
<p>This tutorial shows how to use Max <i>lists</i> anf the <o>jit.fill</o> object to fill all or part of a matrix , and how to retrieve all or part of a matrix's contents as a list with <o>jit.spill</o>. We will also demonstrate the use of matrix <i>names</i> to access the contents of a matrix remotely, a concept that will be demonstrated further in <i>Tutorials 12, 16, and 17</i>.</p>


<h2>Matrix Names</h2>

<p>At the left of the patch, you'll see a blue <o>jit.matrix</o> object. The first argument gives the matrix a specific name, <m>smallbox</m>. The remaining arguments say that the matrix will have <m>1</m> plane of <m>char</m> data, and that the matrix will have only one dimension with <m>12</m> cells.</p>


<illustration><img src="images/jitterchapter11a.png"/>This matrix has a unique name: <m>smallbox</m>.</illustration>
<p>In <i>Tutorial 2</i> we explained that every matrix has a name. If we don't give a matrix a name explicitly, Jitter will choose a name arbitrarily (usually something strange like "u040000114", so that the name will be unique). The name is used to refer to the place in the computer's memory where the matrix's contents are stored. So, why give a name of our own to a matrix? That way we'll know the name, and we can easily tell other objects how to find the matrix's contents. By referring to the name of a matrix, objects can share the same data, and can access the matrix's contents remotely, without actually receiving a <m>jit_matrix</m> message.</p>


<div>
<techdetail>Jitter's use of the matrix name to refer to its memory location is analogous to the way Max's <o>value</o> object works. You can have many <o>value</o> objects with the same name, and you can store a numeric value in any one of them and retrieve the same value from any other one of them. But there is really only one memory location for that name, so they are all sharing the same data. In a like manner, you can have more than one <o>jit.matrix</o> object with the same name, and they will all share the same data. Some other objects, such as <o>jit.fill</o>, can access the contents of that matrix just by knowing its name.</techdetail>
</div>
<h2>jit.fill</h2>
<p>In <i>Tutorial 2</i> we showed how to place a numeric value in a particular matrix location using the <m>setcell</m> message, and how to retrieve the contents of a location with the <m>getcell</m> message. Now we will show how to use the <o>jit.fill</o> object to place a whole list of values in a matrix. (Later in this chapter we'll also show how to retrieve many values at once from a matrix.)</p>


<p>In the upper left corner of the patch there is a <o>message</o> box containing a <m>list</m> of twelve numeric values. It's attached to a <o>jit.fill</o> <m>smallbox</m> object. The <m>smallbox</m> argument refers to a matrix name.</p>


<illustration><img src="images/jitterchapter11b.png"/><o>jit.fill</o> puts a list of values in the named matrix </illustration>
<bullet>Click on the <o>message</o> box to send the list of values to the <o>jit.fill</o> <m>smallbox</m> object. The <o>jit.fill</o> <m>smallbox</m> object places those values in the matrix named "smallbox". To verify that this is true, click on the <o>button</o> above the <o>jit.matrix</o> <m>smallbox</m> object to display the contents of the "smallbox" matrix. The values are printed in the Max Console by <o>jit.print</o>, and displayed as levels of gray in a narrow <o>jit.pwindow</o>.</bullet>
<p>In this example, the list was exactly the right length to fill the entire matrix. That need not be the case, however. We can place a list of any length in any contiguous portion of a 1D or 2D matrix.</p>


<h3>The offset attribute</h3>
<bullet>Open the <m>random_lists</m> subpatch by double-clicking it.</bullet>

<p>By default, <o>jit.fill</o> places the list of values at the very beginning of the matrix. You can direct the list to any location in the matrix, though, by setting <o>jit.fill</o>'s <m>offset</m> attribute.  The <m>random_lists</m> subpatch demonstrates the use of the <m>offset</m> feature.</p>


<illustration><img src="images/jitterchapter11c.png"/>First specify the offset, then provide the list</illustration>

<p>This example chooses a cell index at random, uses that random number as the argument to an <m>offset</m> message to the <o>jit.fill</o> <m>randbox</m> object, then sends a 16-element list to be stored starting at that index in the <m>randbox</m> matrix.</p>


<bullet>Click on the <o>toggle</o> to start the <o>metro</o>. Every half-second, the 16-element list will be written to a new location in the <m>randbox</m> matrix.</bullet>

<illustration><img src="images/jitterchapter11d.png"/>The list has been written to four locations in the "graybox" matrix</illustration>

<bullet>You can use the <m>clear</m> message to zero the contents of the <m>randbox</m> matrix, then watch it as the <o>metro</o> writes the list into new random locations. Note that the metro is also banging the <m>randbox</m> <o>jit.matrix</o> to send its contents to the <o>jit.pwindow</o> for dispaly. When you're done, turn off the <o>metro</o>.</bullet>

<h2>Using multiSlider</h2>
<bullet>Open the <m>draw_list</m> subpatch.</bullet>

<p>So far we've shown how to put a predetermined list of values into a matrix. When you want to generate such a list of numbers interactively in Max and place them in a matrix in real time, you'll need to use a Max object designed for building lists. We'll look at two such objects: <o>multislider</o>, and <o>zl</o>.</p>


<p>The <o>multislider</o> object displays a set of individual sliders, and it sends out the position of all of its sliders at once as a list of values. (The sliders can be as small as one pixel wide, which can make it look more like a graph than a set of individual controls.) It sends out the whole list when you click in the window to move any of the sliders, and it sends the list again when you release the mouse button. In the draw_list subpatch, we've set up a <o>multislider</o> to contain 256 sliders that send values from 0 to 255, so it's just right for sending a list of 256 <i>char</i> values to the <o>jit.fill</o> <m>graybox</m> object.</p>


<bullet>Use the mouse to draw in the <o>multislider</o>, setting its 256 sliders. When you release the mouse button, the list of 256 values is sent out to the <o>jit.fill</o> <m>graybox</m> object. Notice how the brightness of the matrix cells corresponds to the height of the sliders.</bullet>
<p>As soon as <o>jit.fill</o> receives a <m>list</m> in its inlet, it writes the values into the named matrix (at the position specified by the <m>offset</m> attribute). As soon as this is done, <o>jit.fill</o> sends a <m>bang</m> out its left outlet. You can use that <m>bang</m> to trigger another action, such as displaying the matrix.</p>


<techdetail>In the first two examples we deliberately avoided using the <m>bang</m> from the left outlet of <o>jit.fill</o>, in order to make it quite clear that <o>jit.fill</o> writes into the named matrix remotely without being physically connected to the <o>jit.matrix</o> object. The <m>bang</m> out of <o>jit.fill</o>'s left outlet is convenient, though, for triggering the output of the matrix as soon as it has been filled.</techdetail>


<h2>Using zl</h2>
<bullet>Open the <m>collect_values</m> subpatch</bullet>
<p>In some situations you might want to use a matrix to store numeric messages that have occurred somewhere in the patch: MIDI messages, numbers from a user interface object, etc. The <m>setcell</m> and <m>getcell</m> messages to <o>jit.matrix</o> are useful for that, but another way to do it is to collect the messages into a list and then place them in the matrix all at once with <o>jit.fill</o>.</p>


<p>The <o>zl</o> object is a versatile list-processing object with many possible modes of behavior, depending on its first argument. When its first argument is <m>group</m>, it collects the messages received in its left inlet until it has amassed a certain number of them, then sends the numbers out as a single list. (The values are grouped in the order in which they were received.) So, in the <m>collect_values</m> subpatch, we have placed a <o>zl</o> <m>group 256</m> object that will collect 256 values in its left inlet, and when it has received 256 of them it will send them out its left outlet as a list (and clear its own memory).</p>


<bullet>Move the <o>slider</o> up and down to generate 256 input values for the <o>zl</o> object. When <o>zl</o> has received 256 numbers, it sends them as a <m>list</m> to <o>jit.fill</o> <m>midibox</m> &#x2014;which writes them into the <m>midibox</m> matrix&#x2014;then <m>bang</m>s the <o>jit.matrix</o> <m>midibox 1 char 256</m> object to display the matrix.</bullet>

<illustration><img src="images/jitterchapter11e.png"/><o>zl</o> sends a 256-element list into the <m>midibox</m> matrix, then bangs <o>jit.matrix</o> to display the result</illustration>

<bullet>If you have a MIDI keyboard controller attached to your computer, you can use the modulation wheel of the MIDI keyboard to move the <o>slider</o>. (The interaction between MIDI and Jitter is explored in detail in later tutorial chapters.)</bullet>

<illustration><img src="images/jitterchapter11f.png"/>Values are doubled to occupy the range 0-254, making them useful as char data for the matrix</illustration>

<p>You can change the length of the list that <o>zl</o> collects, by sending a new list length in the right inlet from the <i>List Length</i> <o>number</o> box. And you can say <i>where</i> in the matrix you want to put it, by sending an <m>offset</m> message to <o>jit.fill</o> from the <i>Location</i> <o>number</o> box. By varying the list length and location, you can put any number of values into any contiguous region of the matrix.</p>


<bullet>Try changing the <i>List Length</i> of <o>zl</o> (to, say, <m>100</m>) and setting the <i>Location</i> of <o>jit.fill</o>'s offset attribute (to, say <m>50</m>), then move the <o>slider</o> some more to put a list of values into that particular location in the matrix.</bullet>

<h2>jit.fill with Multiple-plane Matrices</h2>
<bullet>Open the <m>fill_separate_panes</m> subpatch</bullet>

<p><o>jit.fill</o> works fine with multiple-plane matrices, but it can only fill one plane at a time. The plane that <o>jit.fill</o> will access is specified in its <m>plane</m> attribute. In the <m>fill_separate_panes</m> subpatch, we've created another matrix, with four planes of <i>char</i> data this time, named <m>colorbox</m>. We've set up three <o>multislider</o>s and three <o>jit.fill</o> objects, each one addressing a different color plane of the <m>colorbox</m> matrix.</p>


<illustration><img src="images/jitterchapter11g.png"/>Filling each plane independently</illustration>
<bullet>Drag on the three colored <o>multislider</o> objects to fill each of the three color planes.</bullet>
<p>This is a convenient way to generate different curves of intensity in the RGB planes of a matrix. The <o>jit.pwindow</o> that's showing the matrix is actually 256 pixels wide, so each of the 64 cells of the matrix is displayed as a 4-pixel-wide band. If you turn on the <m>interp</m> attribute of the <o>jit.pwindow</o>, the differences between adjacent bands will be smoothed by interpolation.</p>


<bullet>Click on the <o>toggle</o> above the <m>interp $1</m> <o>message</o> box to send the message <m>interp 1</m> to <o>jit.pwindow</o>. (Note that this also sends a <m>bang</m> to <o>jit.matrix</o> to re-display its contents.</bullet>

<illustration><img src="images/jitterchapter11h.png"/>The same as the previous example, but with interpolation turned on in <o>jit.pwindow</o></illustration>

<h3>jit.fill with 2D Matrices</h3>
<p>So far, all of our examples have involved one-dimensional matrices. What happens when you use a list (which is a one-dimensional array) to fill a two-dimensional matrix via <o>jit.fill</o>? The <o>jit.fill</o> object will use the list to fill as far as it can in the first dimension (i.e. it will go as far as it can the specified row), then it will wrap around to the next row and continue at the beginning of that row. We've made it possible for you to see this wrapping effect in action.</p>


<bullet>Click on the button labeled <i>2D</i>. This will change the <o>jit.matrix</o> <m>colorbox</m> object to contain a two-dimensional 8x8 matrix, and will also resize the <o>jit.pwindow</o> to a more appropriate shape. Whenever you change the dimensions of a matrix, it loses its contents, so you will need to click in the three <o>multislider</o>s again to fill the matrix anew. You are still sending a 64-element <m>list</m> to each of the <o>jit.fill</o> objects, and they fill each of the eight rows of the matrix with eight elements.</bullet>

<techdetail>Important: Although we don't demonstrate the use of the <m>offset</m> attribute with a 2D matrix in this patch, it's worth mentioning that when the <m>name</m> attribute of <o>jit.fill</o> names a 2D matrix, the <m>offset</m> attribute requires <i>two</i> arguments: one for the <i>x</i> offset and one for the <i>y</i> offset.</techdetail>
<techdetail><o>jit.fill</o> <i>only works for 1D and 2D matrices.</i></techdetail>

<illustration><img src="images/jitterchapter11i.png"/>The same example, with each list wrapped around in an 8x8 matrix (shown uninterpolated)</illustration>

<illustration><img src="images/jitterchapter11j.png"/>The same example, displayed with interpolation</illustration>

<h2>jit.spill</h2>
<p>The complementary object to <o>jit.fill</o> is <o>jit.spill</o>. It takes a <m>jit_matrix</m> message in its inlet, and sends the matrix values out its left outlet as a Max <m>list</m>.  You may have noticed that while you were using the red <o>multislider</o> the <o>jit.spill</o> object below was sending the values of plane 1 (red) out its left outlet and setting the contents of a <o>message</o> box.</p>


<illustration><img src="images/jitterchapter11k.png"/>The contents of plane 1 of the "colorbox" matrix, displayed as a Max list</illustration>

<techdetail>Although not demonstrated in the patch, <o>jit.spill</o> also has <m>listlength</m> and <m>offset</m> attributes that let you specify exactly <i>how many</i> values you want to list, and from exactly <i>what location</i> in the matrix.</techdetail>

<p>If you need to have the values as an immediate series of individual number messages rather than as a single list message, you can send the list to the Max <o>iter</o> object.</p>


<illustration><img src="images/jitterchapter11l.png"/>Get a few values from the matrix and make them into separate messages</illustration>

<h2>jit.iter</h2>
<bullet>Open the <m>individual_values</m> subpatch.</bullet>

<p>For times when you need to retrieve <i>every</i> value in a matrix, there is an object called <o>jit.iter</o>. When it receives a <m>jit_matrix</m> message in its inlet, it sends out an as-fast-as-possible sequence of messages: the cell index (out its middle outlet) followed by the value(s) in that cell (out its left outlet) for every cell of the matrix in order. For a large matrix, this can be an awful lot of Max messages to try to send out in a single tick of Max's scheduler, so when it's done reporting all of the values in a matrix <o>jit.iter</o> sends a <m>done</m> message out its right outlet.</p>


<p>In the <m>individual_values</m> subpatch there is a <o>jit.iter</o> object which receives the matrix information from the <o>jit.matrix </o><m>readbox 1 char 256</m> object. We use a <o>swap</o> object to switch the order of the cell index (coming out the middle outlet of <o>jit.iter</o>) and the cell value (coming out the left outlet of <o>jit.iter</o>). We then use the value of that cell  as the <i>y</i>-value we want to store in a <o>table</o> object, and we use the cell index as the <i>x</i>-axis index for  the <o>table</o> .</p>


<bullet>Click on the <o>multislider</o> object to send its contents to <o>jit.fill</o> (which will in turn <m>bang</m> the <o>jit.matrix</o> object and communicate its contents to <o>jit.iter</o>. Then double-click the <o>table</o> object to open its graphic window and see that it contains the same values as the  <m>readbox</m> matrix.</bullet>
<br/>
<p>Note that this technique of using <o>jit.iter</o> to fill a <o>table</o> works well with a modest-sized one-dimensional one-plane matrix because a <o>table</o> is a one-dimensional array. However, the matrix of a <o>jit.movie</o> object, for example, has two dimensions and four planes, so in that case the output of <o>jit.iter</o>'s middle (cell index) outlet would be a two-element list, and the output of the left (value) outlet would be a four-element list.</p>


<illustration><img src="images/jitterchapter11m.png"/>What are ya gonna do with all those numbers?</illustration>

<p>Still, for one-dimensional matrices, or small 2D matrices, or even for searching for a particular value or pattern in a larger matrix, <o>jit.iter</o> is useful for scanning an entire matrix.</p>


<h2>Summary</h2>
<p>For placing individual values in a matrix, or retrieving individual values from a matrix, you can use the <m>setcell</m> and <m>getcell</m> messages to <o>jit.matrix</o> (as was demonstrated in <i><link type="tutorial" module="jit" name="jitterchapter02">Jitter Tutorial 2</link></i>). For placing a whole  list of values in a matrix, or retrieving a list of values from a matrix, use the objects <o>jit.fill</o> and <o>jit.spill</o>. These objects work well for addressing any plane of a 1D or 2D matrix, and they allow you to address any list length at any starting cell location in the matrix.</p>


<p>The <o>multislider</o> and <o>zl</o> objects are useful for building Max list messages in real time. With <o>multislider</o> you can draw a list by dragging on the sliders with the mouse. With <o>zl</o> <m>group</m> you can collect many individual numeric values into a single list, then send them all to <o>jit.fill</o> at one time.</p>


<p>You specify the starting cell location in the matrix by setting the <m>offset</m> attribute of <o>jit.fill</o> (or <o>jit.spill</o>). The <o>jit.fill</o> object requires that you set its <m>name</m> attribute (either by sending it a <m>name [name]</m> message or by typing in a <m>[name]</m> argument), specifying the name of the matrix it will fill. It accesses the matrix using this name, and sends a <m>bang</m> out its outlet whenever it has written a list into the matrix. You can use that <m>bang</m> to trigger other actions. In <i>Tutorials 12</i>, <i>16</i>, and <i>17</i> we show some practical uses of accessing a matrix by its name.</p>

<p>To output every value in an entire matrix, you can send the matrix to <o>jit.iter</o>.</p>

	<seealsolist>
		<seealso name="ctlin">Output received MIDI control values</seealso>
		<seealso name="jit.fill">Fill a matrix with a list</seealso>
		<seealso name="jit.iter">Iterate a matrix as a series of Max lists/values</seealso>
		<seealso name="jit.matrix">The Jitter Matrix!</seealso>
		<seealso name="jit.print">Print a matrix as text in the Max Console</seealso>
		<seealso name="jit.pwindow">In-Patcher Window</seealso>
		<seealso name="jit.movie">Play or edit a movie</seealso>
		<seealso name="jit.spill">Unroll a matrix into a list</seealso>
		<seealso name="metro">send bangs at regular intervals</seealso>
		<seealso name="multislider">Multiple slider and scrolling display</seealso>
		<seealso name="prepend">Place one message at the beginning of another</seealso>
		<seealso name="random">Generate a random number</seealso>
		<seealso name="slider">Output numbers by moving a slider onscreen</seealso>
		<seealso name="zl">Multi-purpose list processor</seealso>
	</seealsolist>
	</chapter>
