Seeking fancy new contraptions for your decks? Seek no further, friend! Have a look at my wares, ready to copy and paste right into Decker:

The "marquee" contraption:

Configure your choice of text and size! Respects the "font" setting for contraption instances.

%%WGT0{"w":[{"name":"marquee1","type":"contraption","size":[100,100],"pos":[391,195],"def":"marquee","widgets":{"canvas1":{},"text":{}}}],"d":{"marquee":{"name":"marquee","size":[100,100],"resizable":1,"margin":[5,5,5,5],"description":"A horizontally-scrolling text marquee.","script":"on set_text x do text.value:x end\non get_text do text.value end","attributes":{"name":["text"],"label":["Text"],"type":["rich"]},"widgets":{"canvas1":{"type":"canvas","size":[100,100],"pos":[0,0],"locked":1,"animated":1,"script":"on view do\n me.font:card.font\n t:me.font.textsize[text.text][0]\n w:me.size[0]+t\n me.clear[]\n me.text[text.text (me.size/1,2)-(w%sys.ms/10),0 \"center_left\"]\nend","scale":1},"text":{"type":"field","size":[27,25],"pos":[1,-57],"locked":1,"show":"none","value":"Your Text Here!"}}}}}

The "flag" contraption:

Add your favorite horizontally-striped flags to your deck, big or small, square or rectangular. The color list may use any of the built-in named colors ( white, black, yellow, orange, red, magenta, purple, blue, cyan, green, darkgreen, brown, tan, lightgray, mediumgray, darkgray ) or pattern indices (0-47).

%%WGT0{"w":[{"name":"flag1","type":"contraption","size":[100,100],"pos":[206,121],"def":"flag","widgets":{"canv":{},"val":{}}}],"d":{"flag":{"name":"flag","size":[100,100],"resizable":1,"margin":[9,9,9,9],"description":"a resizable flag made of multicolored horizontal strips.","script":"on get_value do val.text end\non set_value x do val.text:x view[] end\non view do\n c:each c in \",\" split val.text\n  (0+c) unless colors[c]\n end\n canv.clear[]\n s:canv.size[1]/count c\n each v i in c\n  canv.pattern:v\n  canv.rect[0,s*i 1+canv.size[0],s] \n end\nend","attributes":{"name":["value"],"label":["Colors\n(Comma\nSeparated)"],"type":["code"]},"widgets":{"canv":{"type":"canvas","size":[100,100],"pos":[0,0],"pattern":37,"scale":1},"val":{"type":"field","size":[90,20],"pos":[1,-31],"locked":1,"border":0,"style":"plain","align":"center","value":"red,orange,yellow,green,blue,purple"}}}}}

The "patternPicker" contraption:

A grid of swatches- click one to choose a pattern and fire a change[] event! Configurable to include or exclude colors. If you're looking for a little scripting exercise, try using a patternPicker to make a fancier editor for the flag contraption!

%%WGT0{"w":[{"name":"patternPicker1","type":"contraption","size":[100,100],"pos":[48,107],"def":"patternPicker","widgets":{"c":{},"v":{},"cc":{}}}],"d":{"patternPicker":{"name":"patternPicker","size":[100,100],"resizable":1,"margin":[10,10,10,10],"description":"a palette of patterns and (optionally) colors.","script":"on get_value do v.value end\non set_value x do v.value:x view[] end\non get_color do cc.value end\non set_color x do cc.value:x view[] end\n\nb:5\nr:4+2*cc.value\ns:floor(c.size-2*b)/8,r\n\non boxes do\n flip b+s*flip 8 cross r\nend\n\non view do\n o:-50\n c.clear[]\n each p i in boxes[]\n  c.pattern:i\n  c.rect[p s]\n  c.pattern:1\n  c.box[p s+1]\n  if i=v.value o:p end\n end\n c.pattern:0\n c.box[o-1 s+3]\n c.pattern:1\n c.box[o-2 s+5]\nend\n\non inside p r do\n min(p>r)&(r+s>p)\nend\non click pos do\n each p i in boxes[]\n  if inside[pos p]\n   set_value[i]\n   card.event[\"change\" i]\n  end\n end\nend\n","template":"on change val do\n \nend","attributes":{"name":["value","color"],"label":["Value","Color"],"type":["number","bool"]},"widgets":{"c":{"type":"canvas","size":[100,100],"pos":[0,0],"locked":1,"border":0,"scale":1},"v":{"type":"slider","size":[60,25],"pos":[2,-41],"locked":1,"show":"none","interval":[0,47]},"cc":{"type":"button","size":[14,20],"pos":[73,-40],"locked":1,"show":"none","style":"check","value":1}}}}}

Have some contraptions of your own to share? There's plenty of room in the Bazaar!

Behold the beauty of

The eye contraption:

A configurable pupil image follows the pointer around the card, constrained by an oval inscribed within the contraption's bounding box. In most cases, you'll want this contraption to be shown in "transparent" mode, with the rest of the eyeball drawn on the card background, but there are also interesting possibilities for placing eyes behind partially-transparent canvases. (Note: make sure you upgrade to Decker v1.13 before using this contraption!)

To specify the pupil image, copy an image using the "select" tool and paste it into the "pupil image" rich-text field in the "Eye Properties" panel as shown above. You may want to use the "View -> Transparency Mask" setting to make parts of the pupil opaque white.

%%WGT0{"w":[{"name":"eye1","type":"contraption","size":[100,100],"pos":[88,220],"show":"transparent","def":"eye","widgets":{"pupil":{},"img":{}}}],"d":{"eye":{"name":"eye","size":[100,100],"resizable":1,"margin":[0,0,0,0],"description":"An animated eyeball that follows the user's pointer around the card. Best shown \"transparent\" with a blank eye underneath.","script":"on get_pupil do\n img.value\nend\n\non set_pupil x do\n img.value:x\n view[]\nend\n\non view do\n i:first extract arg where arg..type=\"image\" from img.value\n pupil.size:i.size\n pupil.clear[]\n pupil.paste[i 0,0 1]\n \n c:card.size/2\n p:pupil.size/2\n d:pointer.pos-card.offset+c\n m:(c-p)&mag d\n pupil.pos:(c-p)+m*unit heading d\nend","attributes":{"name":["pupil"],"label":["Pupil\nImage"],"type":["rich"]},"widgets":{"pupil":{"type":"canvas","size":[22,23],"pos":[110,44],"locked":1,"animated":1,"show":"transparent","border":0,"image":"%%IMG0ABYAFwAAAAH8AAf/AA//gB//wD//4H//8H//8P//+P//+P//+P//+P//+P//+P//+H//8H//8D//4B//wA//gAf/AAH8AAAAAA==","scale":1},"img":{"type":"field","size":[27,28],"pos":[-47,-56],"locked":1,"border":0,"value":{"text":["","i"],"font":["",""],"arg":["","%%IMG0ABYAFwAAAAH8AAf/AA//gB//wD//4H//8H//8P//+P//+P//+P//+P//+P//+P//+H//8H//8D//4B//wA//gAf/AAH8AAAAAA=="]}}}}}}

Hey kid, want a chicken? Chickens float. They all float when you're using

The "bob" Contraption:

Works much like the "eye" contraption: copy and paste a (probably transparent) image into the properties panel of the bob widget and your image will hover ominously above a shadow. Adjust the size of the contraption to control how vigorously the object bobs.

%%WGT0{"w":[{"name":"bob1","type":"contraption","size":[100,126],"pos":[305,100],"def":"bob","widgets":{"bg":{"size":[100,126],"image":"%%IMG2AGQAfgD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wDpAQ8ATwEbAEYBIQBBASUAPgEnAD0BJwA+ASUAQQEhAEcBGQBRAQ0A/wD/AOk="},"spr":{"size":[51,91],"pos":[24,20]},"img":{"value":{"text":["","i"],"font":["",""],"arg":["","%%IMG2ADMAWwDvIAQALyADAQIALSADAQEgAwAqIAYBAiABACggAwEBIAQBASACACYgBwEBIAIBASACAQEAJCADAQEgBQECIAIBASABACIgAwEBIAIBASAFAQEgAgEBIAEAIiAFAQEgAwECIAIBAiABAQEgAQAgIAEBASAFAQEgAgEBIAEBAiACAQEgAgAgIAQBAyABAQEgCAEBIAEAHyAEAQEgAwEBIAIBASABAQEgAQECIAIBAQAfIAEBASABAQIgAQECIAEBASABAQIgBAEBIAMAHiADAQIgAgEEIAIBBCAEAB0gAgECIAEBASACAQEgAwEBIAEBAyACACABASADAQEgAQECIAEBASABAQEgAQEBIAIBAgAgIAMBASACAQIgAgEDIAIBAyABAQEAHyABAQEgAgEFIAEBAyABAQEgAgECIAEAHwECIAEBAiABAQEgAgEEIAIBBCABAB8gAgEDIAEBCyABAQIAHgECIAEBBSABAQogAQEBAB4gAgEFIAEBASABAQogAQAeIAEBFAAeIAEBCCABAQYgAQEEAB0BCCABAQogAQECABsBASACAQMgAQEGIAEBCgAZAQEgAgECIAEBCiABAQMgAQEBIAIBAgAXAQEgAwEBIAEBAiABAQ0gAQEEIAEAFiAFAQEgAQETIAIBAQAVIAcBBSABARAgAQAVIAEBASABAQEgAwEBIAEBFgATIAEBASABAQIgAwEBIAEBASABAQggAQELABIgAwECIAIBAiABAQEgAgEDIAEBEQAQAQEgAgEBIAEBASACAQMgAQEKIAEBDAAPAQEgAQECIAEBASABAQIgAgEEIAEBASACAQIgAQEOAA8BASACAQIgAQEBIAEBASABAQMgAQEHIAEBByABAQYgAQAOIAEBAyABAQEgAQEEIAEBAiABAQogAQELIAEADQEBIAEBASADAQEgAgEHIAEBFCABAA0gAQEBIAEBASABAQIgAgEdIAEADAEDIAEBASABAQMgAQEBIAEBGSABAQEADAEDIAIBASABAQcgAQEWIAEBAgALAQEgAgEjIAEBAQALAQwgAQEaAAwBJwAMARkgAQEMAA0BJgANAQEgAQEkAAwBBCABASIACwEDIAEBIwAMIAEBJSABAAwBASACASQACwECIAIBIwAMAScADAECIAEBJAAMIAEBAiABASMADAEVIAEBEAANASYADQEFIAEBIAAOASUADgEUIAEBDwAQASMAEQEhABMgAQEQIAEBDQAVIAMBCyABAQ8AGQEYABsgAQEWAB0gAQETACABDiABAQMAISABAQIAAiABAQUABQECACEgAQECAA0BAwAgIAEBAgAOAQIAIQEDAA0gAQECACAgAQECAA0gAQECACAgAQECAA0gAQEDAB4BBQAMIAEBBAAcIAEBBgAKAQcAGyABAQMgAQEDAAggAQEIABoBAwACIAEBAgAHIAEBAyABAQYAGQEDAAIgAQEDAAYgAQEDAAEBAyABAQMAGAECAAQBAwAGIAEBAgACAQIAAiABAQIAGCABAAUBAgAHIAEBAgACAQIAAwECAB4BAgAIIAEAAiABAQIAAwECAB4BAgAMAQIAAwECAB8BAQALIAEBAgAkAQEACyABAQIAMCABAQEAMSACABA="]}}}}],"d":{"bob":{"name":"bob","size":[100,100],"resizable":1,"margin":[5,5,5,5],"description":"Animate an object bobbing in midair with a shadow.","script":"on get_object do img.value end\non set_object x do img.value:x view[] end\n\non oval pos size do\n flip pos+size*flip unit 2*pi*(range 20)/20\nend\n\non view do\n i:first extract arg where arg..type=\"image\" from get_object[]\n spr.size:i.size\n spr.clear[]\n spr.paste[i]\n \n bh:.9*bg.size[1]\n sh:spr.size[1]\n sy:.5*bh-sh\n t:(card.index)+sys.ms*0.002\n spr.pos:(.5*bg.size[0]-spr.size[0]),sy+sy*sin t\n\n bg.clear[]\n bg.poly[oval[bg.size*.5,.9 (.4+.2*1+sin t)*(.5*spr.size[0]),.05*bg.size[1]]]\nend","attributes":{"name":["object"],"label":["Object"],"type":["rich"]},"widgets":{"bg":{"type":"canvas","size":[100,100],"pos":[0,0],"locked":1,"show":"transparent","border":0,"scale":1},"spr":{"type":"canvas","size":[23,23],"pos":[38,63],"locked":1,"animated":1,"show":"transparent","border":0,"scale":1},"img":{"type":"field","size":[26,23],"pos":[0,-46],"locked":1,"value":{"text":["","i"],"font":["",""],"arg":["","%%IMG2ABcAFwBIAREABgEBDQ8BAQAGAQENDwEBAAYBAQ0PAQEABgEBDQ8BAQAGAQENDwEBAAYBAQ0PAQEABgEBDQ8BAQAGAQENDwEBAAYBAQ0PAQEABgEBDQ8BAQAGAQENDwEBAAYBAQ0PAQEABgEBDQ8BAQAGAQENDwEBAAYBAQ0PAQEABgERAEg="]}}}}}}

Time zones are a drag. Banish them with

The .Beat Contraption:

A nice simple one. Display the current Swatch Internet Time.

%%WGT0{"w":[{"name":".beat1","type":"contraption","size":[96,28],"def":".beat","widgets":{"t":{"value":"@ 668.75"}}}],"d":{".beat":{"name":".beat","size":[96,28],"margin":[0,0,0,0],"description":"display the .beat time, also known as Swatch Internet Time.","image":"%%IMG2AGAAHAACAVwAAwECIFoBAgABAQIgAQFaIAEBAyABAVwgAQECIAEBXCABAQIgAQFcIAEBAiABAVwgAQECIAEBBiACAVQgAQECIAEBBiACAVQgAQECIAEBBiACAVQgAQECIAEBBiACARQgAgE+IAEBAiABAQYgAgEUIAIBPiABAQIgAQEGIAUBAyAEAQMgAwEBIAEBASAEAT0gAQECIAEBBiAGAQEgBgEBIAYBASAEAT0gAQECIAEBBiACAQIgAgEBIAIBAiACAQEgAgECIAIBAiACAT4gAQECIAEBBiACAQIgAgEBIAIBAiACAQEgAgECIAIBAiACAT4gAQECIAEBBiACAQIgAgEBIAYBASACAQIgAgECIAIBPiABAQIgAQEGIAIBAiACAQEgAgEFIAIBAiACAQIgAgE+IAEBAiABAQYgBgEBIAYBASAGAQIgAgE+IAEBAiABAQQgAQEBIAUBAyAEAQMgAwEBIAEBAyACAT0gAQECIAEBXCABAQIgAQFcIAEBAiABAVwgAQECIAEBXCABAQIgAQFcIAEBAyABAVogAQECAAEBAiBaAQIAAwFcAAI=","widgets":{"t":{"type":"field","size":[54,15],"pos":[39,7],"locked":1,"animated":1,"script":"on view do\n p:\"%p\" parse \"%e\" format sys.now\n b:(1/86.4)*(3600*24%p.hour+1)+(60*p.minute)+p.second\n me.text:\"@ %4.2f\" format b\nend","font":"mono","show":"invert","border":0,"style":"plain"}}}}}

No configuration options for this one. It might be a fun exercise to try creating an enhanced version that fires an event when the .beat advances!

Tired of inert masses? Why not bring them to life with

The Pulse Contraption

Turn your favorite image into a pulsating mass! Works much like the Eye Contraption; copy and paste an image of your choice into an instance of the Pulse Contraption and it will begin to writhe and stretch, scaling from its initial size to the bounds of the contraption. It is also possible to adjust the speed and whether the axes scale in sync, or offset with one another.

%%WGT0{"w":[{"name":"Pulse1","type":"contraption","size":[100,100],"pos":[49,189],"def":"Pulse","widgets":{"c":{},"o":{},"i":{},"s":{}}}],"d":{"Pulse":{"name":"Pulse","size":[100,100],"resizable":1,"margin":[5,5,5,5],"description":"A quivering, pulsating mass.","script":"on get_sprite   do i.value   end\non set_sprite x do i.value:x end\non get_axes     do o.value   end\non set_axes   x do o.value:x end\non get_speed    do s.text+0  end\non set_speed  x do s.text:x  end\n\non view do\n img:first extract arg where arg..type=\"image\" from i.value\n scl:.5*1+sin(o.value*pi*0,1)+(.02*s.text)*sys.frame\n size:img.size+scl*c.size-img.size\n pos:.5*c.size-size\n c.clear[]\n c.paste[img pos,size 1]\nend","attributes":{"name":["sprite","axes","speed"],"label":["Image","Offset Axes?","Speed"],"type":["rich","bool","number"]},"widgets":{"c":{"type":"canvas","size":[100,100],"pos":[0,0],"locked":1,"animated":1,"show":"transparent","border":0,"scale":1},"o":{"type":"button","size":[99,20],"pos":[131,-30],"locked":1,"show":"none","text":"Offset Axes?","style":"check","value":0},"i":{"type":"field","size":[100,20],"pos":[130,-1],"locked":1,"show":"none","value":{"text":["","i"],"font":["",""],"arg":["","%%IMG2ABIAEgAGAQYACgEKAAcBDAAFAQUNBAEFAAMBBA0IAQQAAgEDDQoBAwABAQQNCgEHDQwBBg0MAQYNDAEGDQwBBw0KAQQAAQEDDQoBAwACAQQNCAEEAAMBBQ0EAQUABQEMAAcBCgAKAQYABg=="]}},"s":{"type":"field","size":[100,20],"pos":[130,28],"locked":1,"show":"none","style":"plain","value":"1"}}}}}

Note: large pulsating images may cause Web-Decker to bog down on slower machines, and line drawings generally produce better-looking results than dithered images.

Make your deck teem with activity using

The Turtle Contraption:

Just like its namesake animal, the Turtle Contraption is a little triangular critter that moves around. If you drag them around manually you can reposition them on the card.

The behavior of each turtle is controlled by their script. The "move" function is given a dictionary containing the turtle's "pos" (position) and "dir" (direction). This function should return a modified dictionary containing a new position and direction, and can optionally set "pat" (a pattern number for drawing the turtle in) and "fd" (a number of pixels to move forward in the current direction). From these building blocks, many interesting behaviors can be built, as demonstrated above:

The definition below is pre-loaded with the last of the above behaviors, which is perhaps the most interesting: it wanders around and avoids any "walls" that have been drawn on the card background. These turtles aren't extremely good at solving mazes, but perhaps you could improve their performance?

%%WGT0{"w":[{"name":"flatlander","type":"contraption","size":[30,30],"pos":[219,59],"script":"on move x do\n d:0 while (d<30)&!card.image[floor x.pos+d*unit x.dir] d:d+1 end\n x.dir:x.dir+if d<20 .01 else .001 end*random[100]-50\n x.fd :d>10\n x.pat:8+d<10\nend","show":"transparent","def":"turtle","widgets":{"c":{},"s":{}}}],"d":{"turtle":{"name":"turtle","size":[30,30],"margin":[0,0,0,0],"description":"a programmable embodied agent.","script":"on get_state   do s.text   end\non set_state x do s.text:x end\n\non view do\n # state management\n os:\"%j\" parse s.text\n offset:card.size/2\n center:card.pos+offset\n is.pos :os.fp+center\n is.dir :os.dir\n is:card.event[\"move\" is]\n c.pattern:os.pat:32 unless is.pat\n if \"fd\" in is is.pos:is.pos+is.fd*unit is.dir end\n os.dir :is.dir\n os.fp  :is.pos-floor is.pos\n card.pos:(512,342)%is.pos-offset\n s.text:\"%j\" format os\n \n # rendering\n tri:4 take flip offset+flip(14,10,10)*unit os.dir+(.666*pi)*range 3\n c.clear[]\n c.poly[tri]\n c.pattern:1\n c.line[tri]\nend","template":"on move x do\n x\nend","attributes":{"name":["state"],"label":["State"],"type":["code"]},"widgets":{"c":{"type":"canvas","size":[30,30],"pos":[0,0],"locked":1,"animated":1,"script":"on drag do\n card.pos:pointer.pos-me.size/2 \n me.pos:0\nend","show":"transparent","border":0,"draggable":1,"scale":1},"s":{"type":"field","size":[100,20],"pos":[57,-4],"show":"none"}}}}}

Another palette-related editor,

The AnimEdit Contraption:

This contraption provides an editor for the four animated pattern "slots". Clicking "Read" will load the sequences of patterns in each slot into the text field, and clicking "Write" will apply the contents of the text field to the deck. The slider and canvas above provide a quick reference for all the currently defined colors and patterns, by index.

Each animated pattern (slots 28, 29, 30, and 31) consists of up to 8 indices into other patterns, shown comma-separated, one pattern per line.

%%WGT0{"w":[{"name":"animEdit1","type":"contraption","size":[155,99],"pos":[248,51],"def":"animEdit","widgets":{"v":{},"r":{},"w":{},"p":{},"c":{}}}],"d":{"animEdit":{"name":"animEdit","size":[155,99],"margin":[0,0,0,0],"description":"an editor for the animated pattern sequences.","image":"%%IMG2AJsAYwADAZYABAEBDZYBAQACAQENmAECDZkBAg2ZAQINmQECDZkBAg2ZAQINmQECDZkBAg2ZAQINmQECDZkBAg2ZAQINmQECDZkBAg2ZAQINmQECDZkBAg2ZAQINmQECDZkBAg2ZAQINmQECDZkBAg2ZAQINmQECDZkBAg2ZAQINmQECDZkBAg2ZAQINmQECDZkBAg2ZAQINmQECDZkBAg2ZAQINmQECDZkBAg2ZAQINmQECDZkBAg2ZAQINmQECDZkBAg2ZAQINmQECDZkBAg2ZAQINmQECDZkBAg2ZAQINmQECDZkBAg2ZAQINmQECDZkBAg2ZAQINmQECDZkBAg2ZAQINmQECDZkBAg2ZAQINmQECDZkBAg2ZAQINmQECDZkBAg2ZAQINmQECDZkBAg2ZAQINmQECDZkBAg2ZAQINmQECDZkBAg2ZAQINmQECDZkBAg2ZAQINmQECDZkBAg2ZAQINmQECDZkBAg2ZAQINmQECDZkBAg2ZAQINmQECDZkBAg2ZAQINmQEBAAEBAQ2XAQEAAwEBDZUBAQAFAZUAAw==","widgets":{"v":{"type":"field","size":[149,49],"pos":[3,25],"style":"code"},"r":{"type":"button","size":[72,20],"pos":[3,76],"script":"on click do\n v.text:\"\\n\" fuse each v in 28,29,30,31\n  \",\" fuse patterns[v]\n end\nend","text":"Read"},"w":{"type":"button","size":[74,20],"pos":[78,76],"script":"on click do\n each l i in 4 limit \"\\n\" split v.text\n  patterns[28+i]:0+\",\" split l\n end\nend","text":"Write"},"p":{"type":"slider","size":[72,20],"pos":[3,3],"script":"on change val do\n c.clear[]\n c.pattern:val\n c.fill[]\nend","interval":[0,47],"style":"compact"},"c":{"type":"canvas","size":[74,20],"pos":[78,3],"scale":1}}}}}

You spin me right round baby, like

The Rotor Contraption:

A rotor continuously rotates an image at a configurable speed. Rotors support transparency and can optionally be made draggable, like a canvas.

When pasting your image in, be sure to leave a sufficient margin: rotors spin around the centerpoint of the image, and only the circular part at the center of a rectangular image will spin "cleanly":

%%WGT0{"w":[{"name":"rotor1","type":"contraption","size":[100,100],"pos":[152,53],"show":"transparent","def":"rotor","widgets":{"c":{},"s":{},"i":{}}}],"d":{"rotor":{"name":"rotor","size":[100,100],"resizable":1,"margin":[5,5,5,5],"description":"Animate an image by making it spin!","script":"on get_speed   do 0+s.text  end\non set_speed x do s.text:x  end\non get_img   do i.value   end\non set_img x do i.value:x end\non get_draggable   do c.draggable   end\non set_draggable x do c.draggable:x end\n\non view do\n img:first extract arg where arg..type=\"image\" from get_img[]\n rot:(sys.frame/60)*2*pi*get_speed[]\n c.clear[]\n c.paste[img.copy[].rotate[rot] (c.size/2)-(img.size/2) 1]\nend","attributes":{"name":["speed","img","draggable"],"label":["Rotation Speed","Image","Draggable"],"type":["number","rich","bool"]},"widgets":{"c":{"type":"canvas","size":[100,100],"pos":[0,0],"locked":1,"animated":1,"script":"on drag do\n if me.draggable\n   card.pos:pointer.pos-me.size/2 \n   me.pos:0\n end\nend","show":"transparent","border":0,"scale":1},"s":{"type":"field","size":[23,20],"pos":[117,2],"show":"none","style":"plain","value":"0.5"},"i":{"type":"field","size":[23,20],"pos":[117,33],"show":"none","value":{"text":["","i"],"font":["",""],"arg":["","%%IMG2AEUAQwD/AP8A/wD/AHUBAQBDAQMAQgEEAEEBBABBAQUAPwEGAD8BBgA+AQcAPgEDDQEBAwA+AQMNAQEDAD4BAw0CAQMAPQEDDQIBAwA8AQMNAwEDADwBAw0DAQMAPAEDDQQBAwA6AQQNBAEDADoBAw0GAQMAOQEDDQYBAwA4AQMNBwEDADgBAw0IAQMANwEDDQkBAwA2AQMNCgEDADQBAw0MAQMAMgEDDQ0BAwAyAQMNDQEEADEBAw0OAQMAMQEDDQ4BAwAwAQMNDwEDADABAw0QAQMALwEWADABFQAvARUAMQEDAP8A/wD/AP8A/wAI"]}}}}}}

The rotor is also available in a variant,

The SeekRotor Contraption:

A seekRotor rotates to point toward something. By default, that "something" is the user's pointer. If you provide a "target[]" event handler on the contraption instance you can tell it to point toward any position you like. For example, pointing at the center of a field:

This behavior pairs nicely with making the source or target draggable, as seen above! Images for the seekRotor should face to the right in their initial view.

%%WGT0{"w":[{"name":"seekRotor1","type":"contraption","size":[100,100],"pos":[351,79],"show":"transparent","def":"seekRotor","widgets":{"c":{},"i":{}}}],"d":{"seekRotor":{"name":"seekRotor","size":[100,100],"resizable":1,"margin":[5,5,5,5],"description":"Animate an image by making turn toward the cursor.","script":"on get_img   do i.value   end\non set_img x do i.value:x end\non get_draggable   do c.draggable   end\non set_draggable x do c.draggable:x end\n\non view do\n img:first extract arg where arg..type=\"image\" from get_img[]\n trg:pointer.pos unless card.event[\"target\"]\n rot:heading trg-card.offset+card.size/2\n c.clear[]\n c.paste[img.copy[].rotate[rot] (c.size/2)-(img.size/2) 1]\nend","template":"on target do\n pointer.pos\nend","attributes":{"name":["img","draggable"],"label":["Image","Draggable"],"type":["rich","bool"]},"widgets":{"c":{"type":"canvas","size":[100,100],"pos":[0,0],"locked":1,"animated":1,"script":"on drag do\n if me.draggable\n   card.pos:pointer.pos-me.size/2 \n   me.pos:0\n end\nend\n","show":"transparent","border":0,"scale":1},"i":{"type":"field","size":[23,20],"pos":[117,33],"show":"none","value":{"text":["","i"],"font":["",""],"arg":["","%%IMG2AEUAQgD/AP8A/wD/AP8AfQEBAEMBBABBAQkAPAELADoBAwkBAQwANQEDCQYBCwAxAQMJCAEMAC4BAwkNAQkALAEDCREBCAApAQMJFAEJACUBAwkWAQgAJAEDCRkBBQAkAQMJFgEHACUBAwkTAQkAJgEDCQ8BCgApAQMJBgEQACwBAwkEAQ8ALwEDCQIBDQAzAQoAPAEGAD4BBgBAAQMA/wD/AP8A/wD/AP8ArA=="]}}}}}} EDCRkBBQAkAQMJFgEHACUBAwkTAQkAJgEDCQ8BCgApAQMJBgEQACwBAwkEAQ8ALwEDCQIBDQAzAQoAPAEGAD4BBgBAAQMA/wD/AP8A/wD/AP8ArA=="]}}}}}}

bored of base 10? how about

The BitField Contraption:

The bitField contraption (shown here linked to an ordinary field widget), stores a numeric value and allows it to be viewed and edited as binary digits. Clicking toggles a bit, and dragging can set multiple bits quickly. The "width" (in bits) can be configured to any value between 1 and 32. Like a Field widget, it fires an "on change" event, and it respects the "show", "font", and "locked" common attributes.

%%WGT0{"w":[{"name":"bitField","type":"contraption","size":[216,31],"pos":[176,159],"def":"bitField","widgets":{"c":{"size":[216,31],"pattern":0},"v":{"size":[65,31],"pos":[234,0],"value":"0"},"w":{"pos":[234,45]},"d":{"pos":[234,79]}}}],"d":{"bitField":{"name":"bitField","size":[101,20],"resizable":1,"margin":[5,5,5,5],"description":"a visual, interactive display of an integer as its bits, shown from most to least significant.","script":"on get_value   do 0+v.text end\non get_width   do 0+w.text end\non set_value x do v.text:((2^w.text)-1)&0|x view[] end\non set_width x do w.text:32&1|x             view[] end\n\nbw:get_width[]\nbv:get_value[]\n\non unpack do\n t:bv each v in range bw\n  r:2%t t:floor t/2 r\n end\nend\n\non view do\n c.clear[]\n c.font:card.font\n c.show:card.show\n cell:card.size/bw,1\n t:bv\n each bit i in unpack[]\n  r:cell*((bw-1)-i),0\n  c.pattern:1\n  if bit c.rect[r cell+1] end\n  c.pattern:!bit\n  c.text[bit r+cell/2 \"center\"]\n end\nend\n\non drag pos do\n bit:(bw-1)-floor pos[0]/card.size[0]/bw\n if !card.locked\n  set_value[if d.value\n   bits.and[bv bits.xor[(2^bw)-1 2^bit]]\n  else\n   bits.or[bv 2^bit]\n  end]\n  card.event[\"change\" get_value[]]\n end\nend\n\non click pos do\n bit:(bw-1)-floor pos[0]/card.size[0]/bw\n d.value:bits.and[bv 2^bit]\n drag[pos]\nend\n\non release pos do\n drag[pos]\nend","template":"on change val do\n \nend","attributes":{"name":["value","width"],"label":["Value","Width"],"type":["number","number"]},"widgets":{"c":{"type":"canvas","size":[101,20],"pos":[0,0],"locked":1,"border":1,"scale":1},"v":{"type":"field","size":[65,20],"pos":[119,0],"show":"none","style":"plain","value":"0"},"w":{"type":"field","size":[65,20],"pos":[119,34],"show":"none","style":"plain","value":"8"},"d":{"type":"button","size":[60,20],"pos":[119,68],"show":"none","style":"check","value":0}}}}}

Trying to make a jump-scare, or at least a nice cupholder? Look no further than

The PopOut Contraption:

The PopOut Contraption behaves like a two-position switch, animating a configurable image in a smooth tween from one position to another when the image is clicked (or if anything else modifies its ".value" attribute). The contraption will automatically choose a vertical or horizontal orientation based on the bounding box of the contraption and the size of the source image, favoring the axis which allows the image more freedom of movement.

%%WGT0{"w":[{"name":"popOut1","type":"contraption","size":[45,84],"pos":[428,40],"script":"on click do\n popOut2.value:!popOut2.value\nend","show":"transparent","def":"popOut","widgets":{"c":{"size":[12,15],"pos":[16,0],"show":"transparent","image":"%%IMG2AAwADwABAbM="},"v":{"size":[60,11],"pos":[58,1],"value":1},"t":{"size":[64,11],"pos":[57,18],"value":"1"},"i":{"size":[66,11],"pos":[57,35]},"s":{"size":[100,11],"pos":[56,51],"value":"1.5"}}}],"d":{"popOut":{"name":"popOut","size":[101,148],"resizable":1,"margin":[0,0,0,0],"description":"A sliding animated element that alternates between two positions when clicked.","script":"on get_value do v.value end\non set_value x do v.value:x view[] end\non get_img do i.value end\non set_img x do i.value:x view[] end\non get_speed do 0+s.text end\non set_speed x do s.text:0|x end\n\non click do\n set_value[!get_value[]]\n card.event[\"click\"]\nend\non tween a b t do\n # see easeInOutBack() from easings.net\n c1:1.70158 c2:1.525\n a+(b-a)*.5*if !t>.5\n    ((2*t    )^2)*((c2+1)*(   2*t))-c2\n else\n  2+(((2*t)-2)^2)*((c2+1)*(-2+2*t))+c2\n end\nend\non view do\n img:first extract arg where arg..type=\"image\" from i.value\n c.size:img.size\n c.show:card.show\n c.paste[img]\n tn:0+t.text\n chg:if tn>v.value -1 elseif v.value>tn 1 else 0 end\n t.text:0|1&tn+chg*0.03*s.text\n c.animated:!tn~v.value\n d:card.size-c.size\n a:d[1]>d[0]\n tw:tween[2 d[a]-2 tn]\n ct:d[!a]/2\n c.pos:if a ct,tw else tw,ct end\nend","template":"on click do\n \nend","attributes":{"name":["img","speed","value"],"label":["Image","Speed","Value"],"type":["rich","number","bool"]},"widgets":{"c":{"type":"canvas","size":[26,26],"pos":[37,0],"locked":1,"border":0},"v":{"type":"button","size":[60,20],"pos":[114,2],"show":"none","style":"check","value":0},"t":{"type":"field","size":[64,20],"pos":[113,31],"show":"none","style":"plain","value":"0"},"i":{"type":"field","size":[66,20],"pos":[113,61],"show":"none","value":{"text":["","i"],"font":["",""],"arg":["","%%IMG2ABoAGgABARgAAQH/Af8BcgABARgAAQ=="]}},"s":{"type":"field","size":[100,20],"pos":[112,90],"show":"none","style":"plain","value":"1"}}}}}

PSA: several of the above contraption definitions were impacted by changes in Decker 1.32, and have been updated accordingly. If you're working on a deck that contains any of them (bouncer, eye, bob, pulse, rotor, seekRotor, interior, popOut), please refer to the release notes for help migrating.

dialogizer styler

A contraption to quickly generate style code snippets for Dialogizer. Get what you need then delete it when you're done.

%%WGT0{"w":[{"name":"dialogizer styler1","type":"contraption","size":[289,187],"pos":[49,48],"show":"transparent","def":"dialogizer styler","widgets":{"fontlist":{},"fct":{},"bct":{},"fclr":{"value":"47"},"bclr":{"value":"32"},"tft":{},"tfnt":{},"patpal":{},"traplist":{"row":18},"tbr":{},"brdr":{},"button1":{},"idi":{"value":"p"},"result":{},"sti":{}}}],"d":{"dialogizer styler":{"name":"dialogizer styler","size":[289,187],"margin":[0,0,0,0],"description":"generate style code","script":"on view do\nfontlist.value:select name:key from deck.fonts\nfprv.font:first fontlist.rowvalue\nfprv.text:first fontlist.rowvalue\ntfnt.font:first fontlist.rowvalue\ntfnt.text:first fontlist.rowvalue\ntraplist.value:select name:key from deck.contraptions\nbrdr.text:first traplist.rowvalue\nend","image":"%%IMG2ASEAuwD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wAUIQEA/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wD/AP8A/wDZ","widgets":{"fontlist":{"type":"grid","size":[97,176],"pos":[96,11],"locked":1,"script":"on click row do\n view[]\nend","headers":0,"value":{"name":["body","menu","mono"]},"row":0},"fct":{"type":"field","size":[48,16],"pos":[0,11],"locked":1,"font":"mono","border":0,"align":"right","value":"fcolor:"},"bct":{"type":"field","size":[48,16],"pos":[0,25],"locked":1,"font":"mono","border":0,"align":"right","value":"bcolor:"},"fclr":{"type":"field","size":[49,16],"pos":[48,11],"font":"mono","border":1,"value":"32"},"bclr":{"type":"field","size":[49,16],"pos":[48,26],"font":"mono","border":1,"value":"47"},"tft":{"type":"field","size":[48,16],"pos":[0,40],"locked":1,"font":"mono","border":0,"align":"right","value":"tfont:"},"tfnt":{"type":"field","size":[49,16],"pos":[48,41],"border":1,"value":"body"},"patpal":{"type":"canvas","size":[288,10],"pos":[0,1],"locked":1,"border":0,"image":"%%IMG2ASAACiASARMhESISIxIkEiUSJhInEigSKRIqEisSLBItEi4SIBIBEyERIhIjEiQSJRImEicSKBIpEioSKxIsEi0SLhIgBAEEIAIBBCAEAQQgAQEFIAUBBCEDAQQhAgEEIQQiBAEEIgIBASIHIwQBBCMDAQMjBCQEAQQkAgEBJAclBAEEJQIBBSUDJgQBBCYDAQImBScEAQQnAgEEJwQoBAEBKAUBBCgEKQQBASkFAQMpBSoEAQEqBQEEKgQrBAEBKwUBBCsELAQBASwFAQEsBy0EAQEtBgEDLQQuBAEBLgUBAS4HIAcBASAFAQEgBAEEIAEBASABAQcgAQEEIQYBASEFAQEhBCIHAQEiAgEBIgEBASIFIwcBASMDAQEjBiQHAQEkAgEBJAclBwEBJQYBASUDJgcBASYDAQImBScHAQEnAgEBJwIBAScEKAQBASgBAQEoAwEBKAIBASgEKQQBASkBAQEpBQEBKQUqBAEBKgEBASoGAQEqBCsEAQErAQEBKwYBASsELAQBASwBAQEsAwEBLAEBASwFLQQBAS0BAQEtBAEBLQYuBAEBLgEBAS4DAQEuByAHAQEgBQEBIAQBBCABAQEgAQEHIAEBBCEGAQEhBQEBIQQiBwEBIgIBASIBAQEiBSMHAQEjAwEBIwYkBwEBJAIBASQHJQcBASUGAQElAyYHAQEmAwECJgUnBwEBJwIBBCcEKAQBASgBAQEoAwEBKAIBASgEKQQBASkBAQEpBQEBKQUqBAEBKgEBASoGAQEqBCsEAQErAQEBKwYBASsELAQBASwBAQEsAwEBLAEBASwFLQQBAS0BAQEtBAEBLQYuBAEBLgEBAS4DAQEuByAFAQIgAwEEIAQBBCADAQUgAgEFIQQBAiEEAQIhBSIFAQIiAwEDIgUjBQECIwQBAyMEJAUBAiQDAQQkBCUFAQIlBQECJQQmBQECJgMBBCYEJwUBAicGAQEnBCgEAQMoAwEBKAIBASgEKQQBAykFAQEpAQEBKQMqBAEDKgMBBCoEKwQBAysEAQIrBSwEAQMsAwEDLAUtBAEDLQQBAy0ELgQBAy4DAQQuBCAHAQEgAgEBIAcBBiABAQUgAQEGIQYBASEFAQEhBCIHAQEiBAEBIgUjBwEBIwUBASMEJAcBASQCAQEkAgEBJAQlBwEBJQQBASUFJgcBASYCAQEmAgEBJgQnBwEBJwUBAScEKAYBASgDAQEoAgEBKAQpBgEBKQUBASkBAQEpAyoGAQEqAwEBKgcrBgEBKwYBASsELAYBASwFAQEsBS0GAQEtBgEBLQQuBgEBLgMBAS4CAQEuBCAEAQQgAgEEIAQBBiABAQUgAQEGIQMBBCECAQQhBCIEAQQiBAEBIgUjBAEEIwIBBCMEJAQBBCQCAQQkBCUEAQQlBAEBJQUmBAEEJgIBBCYEJwQBBCcFAQEnBCgGAQEoAwEEKAQpBgEBKQMBBSkDKgYBASoDAQQqBCsGAQErAwEEKwQsBgEBLAUBASwFLQYBAS0DAQQtBC4GAQEuAwEELgQgEgETIREiEiMSJBIlEiYSJxIoEikSKhIrEiwSLRIuEiASARMhESISIxIkEiUSJhInEigSKRIqEisSLBItEi4S","scale":1},"traplist":{"type":"grid","size":[96,176],"pos":[192,11],"locked":1,"script":"on click row do\n view[]\nend","headers":0,"value":{"name":["dialogizer styler"]},"row":2},"tbr":{"type":"field","size":[48,16],"pos":[0,55],"locked":1,"font":"mono","border":0,"align":"right","value":"border:"},"brdr":{"type":"field","size":[49,16],"pos":[48,56],"border":1,"value":"dialogizer styler"},"button1":{"type":"button","size":[96,16],"pos":[0,89],"script":"on click do\nresult.text:\"%s:()\n%s.fcolor:%s\n%s.bcolor:%s\n%s.tfont:%s\n%s.border:deck.contraptions.%s\ndd.style[%s]\" format idi.text,idi.text,fclr.text,idi.text,bclr.text,idi.text,tfnt.text,idi.text,brdr.text,idi.text\nend","text":"generate","style":"rect"},"idi":{"type":"field","size":[49,16],"pos":[48,71],"font":"mono","border":1,"value":"o"},"result":{"type":"field","size":[97,80],"pos":[0,107],"script":"on change val do\n \nend"},"sti":{"type":"field","size":[48,16],"pos":[0,70],"locked":1,"font":"mono","border":0,"align":"right","value":"ID:"}}}}}

Feel like your life just isn't sliding into place? Experience catharsis with

ThatPuzzle Contraption

The ThatPuzzle contraption is a classic sliding tile puzzle often called a "15-puzzle", in contraption form. Configure its dimensions from 2x2 to 10x10 tiles, and it will automatically display an image sliced up from the card background it's placed over. There are even event hooks and attributes for recognizing a successful solution!

• thatpuzzle.dim : r/w integer from 2 to 10; the number of tiles per axis.
• thatpuzzle.solved: read-only bool; is the puzzle currently solved?
• thatpuzzle.reset[] : reset the tiles to a solved configuration.
• thatpuzzle.scramble[] : randomize the tiles. for large puzzles you may need to repeat this a few times for a thorough mixing.
• on change do .. end : fired whenever a user moves a tile.

%%WGT0{"w":[{"name":"thatpuzzle1","type":"contraption","size":[100,100],"pos":[199,126],"script":"on change do\n won.value:me.solved\nend","def":"thatpuzzle","widgets":{"c":{},"s":{"value":"[]"},"dim":{"value":"3"}}}],"d":{"thatpuzzle":{"name":"thatpuzzle","size":[100,100],"resizable":1,"margin":[5,5,5,5],"description":"the classic sliding-tile puzzle. you know, that one.","script":"BG:image[\"%%IMG2AAYABgEIDQMBAiABAQENAgECIAIBBCACAQEMAQEH\"]\nFG:image[\"%%IMG2AAkACQEGAAMBASAEAQIAAgEBIAQBASABAQEAAQEBIAQBASACAQIgBAEBIAIBByACAQEAAQEBDQQBASABAQEAAgEBDQQBAgADAQY=\"]\nBG_M:4,4,1,1\nFG_M:4,4,4,4\nDELTAS:\"%j\" parse \"[[-1,0],[0,-1],[1,0],[0,1]]\"\nSTEPS:30\n\non get_dim do 0+dim.text end\non set_dim x do dim.text:10&2|x end\n\non swap a x y do t:a[x] a[x]:a[y] a[y]:t a end\non initstate do d:get_dim[] (d^2)%1+range d^2 end\non setstate x do s.text:\"%j\" format list x end\non getstate do\n d:get_dim[]\n r:\"%j\" parse s.text\n if (d^2)~count r r else initstate[] end\nend\n\non view do\n d:get_dim[]\n b:getstate[]\n cell:c.size/d\n c.segment[BG 0,0,c.size BG_M]\n o:d cross d\n tiles:select orderby p asc where v from select v:b p:o from ()\n each row in rows tiles\n  c.segment[FG (row.p*cell),(cell+2 drop FG_M) FG_M]\n  bg:deck.card.image.copy[card.pos+o[row.v-1]*cell (cell,cell)-1]\n  c.paste[bg (1+row.p*cell)]\n end\nend\n\non click pos do\n d:get_dim[]\n b:nb:getstate[]\n o:(d cross d) dict range d^2\n p:floor pos/c.size/d\n each delta in DELTAS\n  t:p+delta\n  if (0~b[o[t]])&(!max(t<0)|(t>d-1)) nb:swap[b o[t] o[p]] end\n end\n setstate[nb]\n view[]\n if !nb~b card.event[\"change\"] end\nend\n\non get_reset do\n on reset do\n  setstate[()]\n  view[]\n end\nend\n\non get_scramble do\n on scramble do\n  d:get_dim[]\n  b:getstate[]\n  o:(d cross d) dict range d^2\n  p:first extract key where 0=b from o\n  each in range 100\n   t:p+random[DELTAS]\n   if !max(t<0)|(t>d-1) b:swap[b o[t] o[p]] p:t end\n  end\n  setstate[b]\n  view[]\n end\nend\n\non get_solved do\n getstate[]~initstate[]\nend","template":"on change do\n \nend","attributes":{"name":["dim"],"label":["Dim"],"type":["number"]},"widgets":{"c":{"type":"canvas","size":[100,100],"pos":[0,0],"locked":1,"volatile":1,"scale":1},"s":{"type":"field","size":[100,20],"pos":[117,13],"show":"none"},"dim":{"type":"field","size":[100,20],"pos":[117,47],"show":"none","value":"4"}}}}}

Tired of having boring checkboxes? Tired of having a boring life? Spice things up with

The ToggleButton Contraption

The toggleButton contraption behaves as a drop-in replacement for a "checkbox"-styled button widget, using customizable graphics instead of a textual label. Just like a Button widget, this produces click[] events when clicked, exposes a boolean .value attribute, and respects .show for transparency. If provided with a single image, the image will be displayed only if the value is 1. Otherwise, the first image will be used to indicate a value of 0 and the last image will be used to indicate a value of 1. If images are smaller than the bounding box of the contraption, they will be drawn centered.

%%WGT0{"w":[{"name":"toggleSwitch","type":"contraption","size":[53,31],"pos":[155,141],"show":"transparent","def":"toggleButton","widgets":{"c":{"size":[53,31],"show":"transparent"},"b":{"size":[53,31]},"ims":{"size":[100,6],"pos":[74,2],"value":{"text":["","i","i"],"font":["","",""],"arg":["","%%IMG2ADMAHQAoAQIALwECIAIBAQAsAQIgBAECACkBAiAGAQIAJwECIAQNAiACAQEMAQEBAAgBHiAGDQIgAgEBDAEBBQADAQEgGQEDIAUNASACDQIgAgEBDAIBASADAQEAAQEBIBcBAyAHDQMgAQ0CIAIBAQwDAQEgAwECIAMBFCAHDQEgAg0GIAIBAQwDAQEgAwECIAIBFCAGDQQgAQ0GIAIBAQwEAQEgAgECIAIBAiAXDQUgAQ0GIAIBAQwEAQEgAgECIAIBASAYDQIgAQ0CIAENBiACAQEMBAEBIAIBAiACAQEgGA0CIAENAiABDQIgAQ0DIAIBAQwEAQEgAgECIAIBASADAQMgAgEEIAEBBCAHDQIgAQ0CIAENAiACDQIgAgEBDAQBASACAQIgAgEBIAIBBSABAQQgAQEEIAcNAiABDQIgAQ0CIAMNASACAQEMBAEBIAIBAiACAQEgAgECIAEBAiABAQIgAwECIAkNAiABDQIgAQ0CIAYBAQwEAQEgAgECIAIBASACAQIgAQECIAEBBCABAQQgBw0FIAkBAQwEAQEgAgECIAIBASACAQIgAQECIAEBBCABAQQgBw0FIAcBAwwEAQEgAgECIAIBASACAQIgAQECIAEBAiADAQIgCg0CIAcBAg0DAQEMAwEBIAIBAiACAQEgAgECIAEBAiABAQIgAwECIBEBAg0FAQEMAwEBIAIBAiACAQEgAgEFIAEBAiADAQIgDwECDQgBAQwCAQEgAgECIAIBASADAQMgAgECIAMBAiANAQINCgEBDAIBASACAQIgAgEBIBoBAg0NAQEMAQEBIAIBAiACAQEgFwEDDQ8BAQwBAQEgAgECIAIBASAUAQMNEwECIAIBAiADASsgAwECIDEBAQABAQEgLwEBAAMBLwAC","%%IMG2ADMAHQAJAQIAMAEBIAIBAgAtAQIgBAECACsBAiAGAQIAKAEBDAEBASAIAQIAIgEFDAEBASADDQIgBQEeAAMBASADAQEMAgEBIAINBCAGAQMgGQEBAAEBASADAQEMAwEBIAINAiABDQIgAQ0BIAYBAyAXAQIgAwEBDAMBASACDQIgAQ0CIAENAiAIARQgAwECIAIBAQwEAQEgAg0CIAENAiABDQMgAQ0BIAYBFCACAQIgAgEBDAQBASACDQIgAQ0CIAENAyABDQIgFwECIAIBAiACAQEMBAEBIAINAiABDQIgAQ0CIAINAyAXAQEgAgECIAIBAQwEAQEgAg0CIAENAiABDQMgAQ0DIBcBASACAQIgAgEBDAQBASACDQIgAQ0CIAENAyABDQIgCwEDIAIBAiACAQIgAgEBIAIBAiACAQEMBAEBIAINBSABDQMgAQ0DIAkBBSABAQMgAQECIAIBASACAQIgAgEBDAQBASAEDQIgAg0CIAINAyAJAQIgAQECIAEBAyABAQIgAgEBIAIBAiACAQEMBAEBIAgNAiACDQIgCgECIAEBAiABAQYgAgEBIAIBAiACAQEMBAEDIAcNASACDQIgCgECIAEBAiABAQYgAgEBIAIBAiACAQEMAwEBDQMBAiAIDQIgCgECIAEBAiABAQIgAQEDIAIBASACAQIgAgEBDAMBAQ0FAQIgBw0BIAoBAiABAQIgAQECIAEBAyACAQEgAgECIAIBAQwCAQENCAECIBABBSABAQIgAgECIAIBASACAQIgAgEBDAIBAQ0KAQIgDwEDIAIBAiACAQIgAgEBIAIBAiACAQEMAQEBDQ0BAiAaAQEgAgECIAIBAQwBAQENDwEDIBcBASACAQIgAgECDRMBAyAUAQEgAgECIAMBKyADAQIgMQEBAAEBASAvAQEAAwEvAAI="]}}}}],"d":{"toggleButton":{"name":"toggleButton","size":[100,100],"resizable":1,"margin":[1,1,1,1],"description":"A graphical drop-in replacement for checkboxes.","script":"on view do\n i:extract arg where arg..type=\"image\" from ims.value\n c.show:card.show\n c.clear[]\n if 1~count i\n  f:first i\n  if b.value c.paste[f .5*c.size-f.size] end \n end\n if 2~count i\n  f:i[b.value]\n  c.paste[f .5*c.size-f.size]\n end\nend\n\non click do\n set_value[!get_value[]]\n card.event[\"click\"]\nend\n\non get_value do b.value end\non set_value x do b.value:x view[] end\non get_images do ims.value end\non set_images x do ims.value:x end","template":"on click do\n \nend","attributes":{"name":["value","images"],"label":["Value","Images"],"type":["bool","rich"]},"widgets":{"c":{"type":"canvas","size":[100,100],"pos":[0,0],"locked":1,"volatile":1,"border":0,"scale":1},"b":{"type":"button","size":[100,100],"pos":[0,0],"script":"on click do\n \nend","show":"transparent","style":"invisible"},"ims":{"type":"field","size":[100,20],"pos":[121,5],"show":"none","border":1,"value":{"text":["","i"],"font":["",""],"arg":["","%%IMG2AA8ADwACAQsAAwEBIAsBAQABAQEgDQECIA0BAiANAQIgDQECIA0BAiANAQIgDQECIA0BAiANAQIgDQECIA0BAQABAQEgCwEBAAMBCwAC"]}}}}}}

Do you want the Juice? Do you need the Juice? Juice it or lose it with

The AnimButton Contraption

The animButton is another drop-in replacement for button widgets, this time for ordinary buttons. Just like a Button widget, this produces click[] events when clicked,  and respects .show for transparency. The first image is the default appearance of the button. When clicked, the button will cycle forward-and-back through the provided images. For example, if there are 3 images {0,1,2}, they will be displayed in the order {0,1,2,1,0}. If images are smaller than the bounding box of the contraption, they will be drawn centered.

%%WGT0{"w":[{"name":"animButton1","type":"contraption","size":[29,27],"pos":[61,81],"show":"transparent","def":"animButton","widgets":{"c":{"size":[29,27],"show":"transparent"},"b":{"size":[29,27]},"ims":{"size":[100,6],"pos":[50,1],"value":{"text":["","i","i","i","i"],"font":["","","","",""],"arg":["","%%IMG2ABkAGQABARcAAQEBIBcBAiAXAQIgFwECIBcBAiAXAQIgFwECIBcBAiAXAQIgFwECIBcBAiAXAQIgFwECIBcBAiAXAQIgFwECIBcBAiAXARsNFwECDRcBAg0XAQINFwECDRcBGg==","%%IMG2ABkAGQBMARcAAQEBDBcBAgwXAQIMFwECDBcBAgwXAQIMFwECDBcBAgwXAQIMFwECDBcBAgwXAQIMFwECDBcBAgwXAQIMFwECDBcBAgwXARsNFwECDRcBGg==","%%IMG2ABkAGQCWARoMFwECDBcBAgwXAQIMFwECDBcBAgwXAQIMFwECDBcBAgwXAQIMFwECDBcBAgwXAQIMFwECDBcBAgwXAQIMFwECDBcBGg==","%%IMG2ABkAGQCWAWYMFQEDDBcBAgwXAQIMFwECDBcBAgwXAQIMFwECDBcBAgwXAQIMFwECDBcBAgwXAQIMFwECDBcBGg=="]}},"ai":{"size":[100,5],"pos":[50,10],"value":"12"}}}],"d":{"animButton":{"name":"animButton","size":[100,100],"resizable":1,"margin":[1,1,1,1],"description":"A graphical drop-in replacement for buttons.","script":"on rev x do x @ (-1+count x)-range count x end\n\non view do\n i:extract arg where arg..type=\"image\" from ims.value\n f:first i\n c.show:card.show\n c.clear[]\n if c.animated\n  s:(range count i),1 drop rev[range count i]\n  a:floor ai.text/2\n  f:f unless i[s[a]]\n  if a~(count s)-1 c.animated:b.locked:0 else ai.text:1+ai.text end\n end\n c.paste[f .5*c.size-f.size]\nend\n\non click do\n if !b.locked\n  ai.text:0\n  c.animated:b.locked:1\n  view[]\n  card.event[\"click\"]\n end\nend\n\non get_images do ims.value end\non set_images x do ims.value:x end","template":"on click do\n \nend","attributes":{"name":["images"],"label":["Images"],"type":["rich"]},"widgets":{"c":{"type":"canvas","size":[100,100],"pos":[0,0],"locked":1,"volatile":1,"border":0,"scale":1},"b":{"type":"button","size":[100,100],"pos":[0,0],"show":"transparent","style":"invisible"},"ims":{"type":"field","size":[100,20],"pos":[121,5],"show":"none","border":1},"ai":{"type":"field","size":[100,20],"pos":[121,37],"show":"none","style":"plain"}}}}}

Do you like car analogies for your UI components? Indulge yourself with

The RadioButton Contraption:

RadioButtons behave like checkboxes, but only one of the RadioButtons on a card with the same .group property may have a truthy .value. This contraption respects the standard .font, .show, and .locked attributes and fires a click[] event when clicked.

%%WGT0{"w":[{"name":"radio","type":"contraption","size":[134,18],"pos":[58,82],"font":"menu","show":"transparent","def":"radioButton","widgets":{"c":{"show":"transparent"},"l":{"font":"menu","show":"transparent","value":"First"},"b":{},"g":{"value":"a"}}}],"d":{"radioButton":{"name":"radioButton","size":[134,18],"resizable":1,"margin":[20,1,4,1],"description":"a selectable button which permits only a single selection within a group.","version":1,"script":"on get_label do l.text end\non set_label x do l.text:x view[] end\non get_group do g.text end\non set_group x do g.text:x end\non get_value do b.value end\non set_value_raw x do b.value:x view[] end\ndot:image[\"%%IMG0ABAADgAAAAAAAAAAB4APwA/AD8APwAeAAAAAAAAAAAA=\"]\noutline:image[\"%%IMG2ABAADgAVAQQACgECIAQBAgAHAQEgCAEBAAYBASAIAQEABQEBIAoBAQAEAQEgCgEBAAQBASAKAQEABAEBIAoBAQAFAQEgCAEBAAYBASAIAQEABwECIAQBAgAKAQQAFw==\"]\non view do\n l.font:       card.font\n l.show:c.show:card.show\n b.locked:card.locked\n if card.locked (outline,dot)..map[1 dict 13] end # gray out\n c.clear[]\n c.paste[outline]\n if b.value c.paste[dot 0,0 1] end\nend\non set_value x do\n gr:extract value where value..group=g.text from card.parent.widgets\n if x gr.  .value_raw:0\n else gr[0].value_raw:1\n end\n set_value_raw[x]\nend\non click do\n if !card.locked\n  set_value[1]\n  card.event.click\n end\nend","template":"on click do\n \nend","attributes":{"name":["label","group"],"label":["Label","Group"],"type":["string","string"]},"widgets":{"c":{"type":"canvas","size":[16,14],"pos":[1,2],"locked":1,"volatile":1,"border":0,"scale":1},"l":{"type":"field","size":[114,16],"pos":[19,1],"locked":1,"border":0,"style":"plain"},"b":{"type":"button","size":[134,18],"pos":[0,0],"style":"invisible"},"g":{"type":"field","size":[100,20],"pos":[149,-60],"locked":1,"show":"none"}}}}}

This has been useful for me so I might as well put it here.

Palette Adjuster

A sort of supplement to Palette Import. If you only want to adjust certain colors this thing will let you change them one-by-one by entering individual hexcodes. The color boxes are previews of what you'll be replacing.

Be a little careful if you want to reverse or otherwise dramatically change the 1-bit color slots. This does not have the color sorting feature that PalImport does. Decker's user interface will be very difficult to navigate if you set both of the 1-bit colors to the same hexcode. :)

%%WGT0{"w":[{"name":"PaletteAdjuster","type":"contraption","size":[316,211],"pos":[98,66],"def":"PaletteAdjuster","widgets":{"field1":{},"button99":{},"button0":{},"whitehex":{},"blackhex":{},"yellowhex":{},"button1":{},"button2":{},"button3":{},"orangehex":{},"redhex":{},"magentahex":{},"button4":{},"button5":{},"purplehex":{},"bluehex":{},"button6":{},"button7":{},"button8":{},"cyanhex":{},"greenhex":{},"darkgreenhex":{},"button9":{},"button17":{},"button18":{},"brownhex":{},"tanhex":{},"lightgrayhex":{},"button19":{},"button20":{},"mediumgrayhex":{},"darkgrayhex":{},"button21":{},"orangepreview":{},"blackpreview":{},"whitepreview":{},"yellowpreview":{},"redpreview":{},"magentapreview":{},"purplepreview":{},"bluepreview":{},"cyanpreview":{},"greenpreview":{},"darkgreenpreview":{},"brownpreview":{},"tanpreview":{},"lightgraypreview":{},"mediumgraypreview":{},"darkgray":{}}}],"d":{"PaletteAdjuster":{"name":"PaletteAdjuster","size":[316,211],"margin":[0,0,0,0],"description":"Modify each color of your palette individually.","version":1,"image":"%%IMG2ATwA0wH/Af8BfACcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFABIBSQBBAQMAmAEFABIBSQBBAQMAmAEFABIBAgBFAQIAQQEDAJgBBQASAQIARQECAEEBAwCYAQUAEgECAEUBAgBBAQMAmAEFABIBAgBFAQIAQQEDAJgBBQASAQIARQECAEEBAwCYAQUAEgECAEUBAgBBAQMAmAEFABIBAgBFAQIAQQEDAJgBBQASAQIARQECAEEBAwCYAQUAEgECAEUBAgBBAQMAmAEFABIBAgBFAQIAQQEDAJgBBQASAQIARQECAEEBAwCYAQUAEgECAEUBAgBBAQMAmAEFABIBAgBFAQIAQQEDAJgBBQAGAZIABAEDAJgBBQAGAZIABAEDAJgBBQAGAQIUjgECAAQBAwCYAQUABgECFI4BAgAEAQMAmAEFAAYBAhSOAQIABAEDAJgBBQAGAQIUjgECAAQBAwCYAQUABgECFI4BAgAEAQMAmAEFAAYBAhSOAQIABAEDAJgBBQAGAQIUjgECAAQBAwCYAQUABgECFI4BAgAEAQMAmAEFAAYBAhSOAQIABAEDAJgBBQAGAQIUjgECAAQBAwCYAQUABgECFI4BAgAEAQMAmAEFAAYBAhSOAQIABAEDAJgBBQAGAQIUjgECAAQBAwCYAQUABgECFI4BAgAEAQMAmAEFAAYBAhSOAQIABAEDAJgBBQAGAQIUjgECAAQBAwCYAQUABgECFI4BAgAEAQMAmAEFAAYBAhSOAQIABAEDAJgBBQAGAQIUjgECAAQBAwCYAQUABgECFI4BAgAEAQMAmAEFAAYBAhSOAQIABAEDAJgBBQAGAQIUjgECAAQBAwCYAQUABgECFI4BAgAEAQMAmAEFAAYBAhSOAQIABAEDAJgBBQAGAQIUjgECAAQBAwCYAQUABgECFI4BAgAEAQMAmAEFAAYBAhSOAQIABAEDAJgBBQAGAQIUjgECAAQBAwCYAQUABgECFI4BAgAEAQMAmAEFAAYBAhSOAQIABAEDAJgBBQAGAQIUjgECAAQBAwCYAQUABgECFI4BAgAEAQMAmAEFAAYBAhSOAQIABAEDAJgBBQAGAQIUjgECAAQBAwCYAQUABgECFI4BAgAEAQMAmAEFAAYBAhSOAQIABAEDAJgBBQAGAQIUjgECAAQBAwCYAQUABgECFI4BAgAEAQMAmAEFAAYBAhSOAQIABAEDAJgBBQAGAQIUjgECAAQBAwCYAQUABgECFI4BAgAEAQMAmAEFAAYBAhSOAQIABAEDAJgBBQAGAQIUjgECAAQBAwCYAQUABgECFI4BAgAEAQMAmAEFAAYBkgAEAQMAmAEFAAYBkgAEAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAQUAnAEDAJgBBQCcAQMAmAEFAJwBAwCYAf8B/wH/Abo=","attributes":{"name":[],"label":[],"type":[]},"widgets":{"field1":{"type":"field","size":[74,12],"pos":[21,8],"locked":1,"show":"transparent","border":0,"value":"1-Bit  Patterns"},"button99":{"type":"button","size":[40,18],"pos":[60,25],"script":"on click do\n  patterns[colors.white]:\"%h\" parse whitehex.text\nend","text":"Apply"},"button0":{"type":"button","size":[40,18],"pos":[60,47],"script":"on click do\n  patterns[colors.black]:\"%h\" parse blackhex.text\nend","text":"Apply"},"whitehex":{"type":"field","size":[44,18],"pos":[12,25],"style":"code","align":"center"},"blackhex":{"type":"field","size":[44,18],"pos":[12,47],"align":"center"},"yellowhex":{"type":"field","size":[44,18],"pos":[12,73],"style":"code","align":"center"},"button1":{"type":"button","size":[40,18],"pos":[60,73],"script":"on click do\n  patterns[colors.yellow]:\"%h\" parse yellowhex.text\nend","text":"Apply"},"button2":{"type":"button","size":[40,18],"pos":[60,95],"script":"on click do\n  patterns[colors.orange]:\"%h\" parse orangehex.text\nend","text":"Apply"},"button3":{"type":"button","size":[40,18],"pos":[60,117],"script":"on click do\n  patterns[colors.red]:\"%h\" parse redhex.text\nend","text":"Apply"},"orangehex":{"type":"field","size":[44,18],"pos":[12,95],"style":"code","align":"center"},"redhex":{"type":"field","size":[44,18],"pos":[12,117],"align":"center"},"magentahex":{"type":"field","size":[44,18],"pos":[12,139],"style":"code","align":"center"},"button4":{"type":"button","size":[40,18],"pos":[60,139],"script":"on click do\n  patterns[colors.magenta]:\"%h\" parse magentahex.text\nend","text":"Apply"},"button5":{"type":"button","size":[40,18],"pos":[60,161],"script":"on click do\n  patterns[colors.purple]:\"%h\" parse purplehex.text\nend","text":"Apply"},"purplehex":{"type":"field","size":[44,18],"pos":[12,161],"align":"center"},"bluehex":{"type":"field","size":[44,18],"pos":[12,183],"style":"code","align":"center"},"button6":{"type":"button","size":[40,18],"pos":[60,183],"script":"on click do\n  patterns[colors.blue]:\"%h\" parse bluehex.text\nend","text":"Apply"},"button7":{"type":"button","size":[40,18],"pos":[215,29],"script":"on click do\n  patterns[colors.cyan]:\"%h\" parse cyanhex.text\nend","text":"Apply"},"button8":{"type":"button","size":[40,18],"pos":[215,51],"script":"on click do\n  patterns[colors.green]:\"%h\" parse greenhex.text\nend","text":"Apply"},"cyanhex":{"type":"field","size":[44,18],"pos":[167,29],"style":"code","align":"center"},"greenhex":{"type":"field","size":[44,18],"pos":[167,51],"align":"center"},"darkgreenhex":{"type":"field","size":[44,18],"pos":[167,73],"script":"on change val do\n \nend","style":"code","align":"center"},"button9":{"type":"button","size":[40,18],"pos":[215,73],"script":"on click do\n  patterns[colors.darkgreen]:\"%h\" parse darkgreenhex.text\nend","text":"Apply"},"button17":{"type":"button","size":[40,18],"pos":[215,95],"script":"on click do\n  patterns[colors.brown]:\"%h\" parse brownhex.text\nend","text":"Apply"},"button18":{"type":"button","size":[40,18],"pos":[215,117],"script":"on click do\n  patterns[colors.tan]:\"%h\" parse tanhex.text\nend","text":"Apply"},"brownhex":{"type":"field","size":[44,18],"pos":[167,95],"style":"code","align":"center"},"tanhex":{"type":"field","size":[44,18],"pos":[167,117],"align":"center"},"lightgrayhex":{"type":"field","size":[44,18],"pos":[167,139],"script":"on change val do\n \nend","style":"code","align":"center"},"button19":{"type":"button","size":[40,18],"pos":[215,139],"script":"on click do\n  patterns[colors.lightgray]:\"%h\" parse lightgrayhex.text\nend","text":"Apply"},"button20":{"type":"button","size":[40,18],"pos":[215,161],"script":"on click do\n  patterns[colors.mediumgray]:\"%h\" parse mediumgrayhex.text\nend","text":"Apply"},"mediumgrayhex":{"type":"field","size":[44,18],"pos":[167,161],"align":"center"},"darkgrayhex":{"type":"field","size":[44,18],"pos":[167,183],"style":"code","align":"center"},"button21":{"type":"button","size":[40,18],"pos":[215,183],"script":"on click do\n  patterns[colors.darkgray]:\"%h\" parse darkgrayhex.text\nend","text":"Apply"},"orangepreview":{"type":"canvas","size":[46,18],"pos":[104,95],"locked":1,"image":"%%IMG2AC4AEiL/Iv8i/yI/","scale":1},"blackpreview":{"type":"canvas","size":[46,18],"pos":[104,47],"locked":1,"image":"%%IMG2AC4AEgH/Af8B/wE/","scale":1},"whitepreview":{"type":"canvas","size":[46,18],"pos":[104,25],"locked":1,"image":"%%IMG2AC4AEiD/IP8g/yA/","scale":1},"yellowpreview":{"type":"canvas","size":[46,18],"pos":[104,73],"locked":1,"image":"%%IMG2AC4AEiH/If8h/yE/","scale":1},"redpreview":{"type":"canvas","size":[46,18],"pos":[104,117],"locked":1,"image":"%%IMG2AC4AEiP/I/8j/yM/","scale":1},"magentapreview":{"type":"canvas","size":[46,18],"pos":[104,139],"locked":1,"image":"%%IMG2AC4AEiT/JP8k/yQ/","scale":1},"purplepreview":{"type":"canvas","size":[46,18],"pos":[104,161],"locked":1,"image":"%%IMG2AC4AEiX/Jf8l/yU/","scale":1},"bluepreview":{"type":"canvas","size":[46,18],"pos":[104,183],"locked":1,"image":"%%IMG2AC4AEib/Jv8m/yY/","scale":1},"cyanpreview":{"type":"canvas","size":[46,18],"pos":[259,27],"locked":1,"image":"%%IMG2AC4AEif/J/8n/yc/","scale":1},"greenpreview":{"type":"canvas","size":[46,18],"pos":[259,49],"locked":1,"image":"%%IMG2AC4AEij/KP8o/yg/","scale":1},"darkgreenpreview":{"type":"canvas","size":[46,18],"pos":[259,71],"locked":1,"image":"%%IMG2AC4AEin/Kf8p/yk/","scale":1},"brownpreview":{"type":"canvas","size":[46,18],"pos":[259,93],"locked":1,"image":"%%IMG2AC4AEir/Kv8q/yo/","scale":1},"tanpreview":{"type":"canvas","size":[46,18],"pos":[259,115],"locked":1,"image":"%%IMG2AC4AEiv/K/8r/ys/","scale":1},"lightgraypreview":{"type":"canvas","size":[46,18],"pos":[259,137],"locked":1,"image":"%%IMG2AC4AEiz/LP8s/yw/","scale":1},"mediumgraypreview":{"type":"canvas","size":[46,18],"pos":[259,161],"locked":1,"image":"%%IMG2AC4AEi3/Lf8t/y0/","scale":1},"darkgray":{"type":"canvas","size":[46,18],"pos":[259,183],"locked":1,"image":"%%IMG2AC4AEi7/Lv8u/y4/","scale":1}}}}}