code

codeset 54× in templates and rigs

A node built by an ES module in the promo's `code/` folder (`src=<name>` runs code/<name>.js): the host owns its transform, opacity, motion and keys, the module owns what is inside and the channels it declares. Every other attribute is a param of the module; a `ui#id` child is a real screen the module samples as a texture.

code#s1-globe(src=data-globe radius=118 arcs="CAI>LHR,LHR>JFK,JFK>SFO,CAI>DXB,DXB>SIN,SIN>SYD" face="20 28" position="95 0 -20")

Attributes

srctextThe module's name: code/<name>.js in the promo's folder.54×

sizenumber"x y"21×

sidetexte.g. rightleft18×

position"x y z"17×

forearmnumber13×

radiusnumber11×

widthnumber10×

pennumber8×

look_attextTurns the node every frame so its face (+z; a device's screen, a laptop's front) points at a target: a point `x y z` (mm, world), `#node-id` (that node, live) or `camera` (the lens, live). Its `rotation` and rotation keys are an offset on top of the aim.7×

countnumber6×

kindtexte.g. scopelampfunnel6×

linesnumberstext6×

ring_widthnumber5×

beatsnumbers4×

wanumber4×

wbnumber4×

anglenumber3×

colorcolour #rrggbb3×

gainnumber3×

normal"x y z"3×

boardnumber2×

crownnumber2×

depthnumber2×

hnumber2×

heightnumber2×

lipnumber2×

page_hnumber2×

page_wnumber2×

pathnumbers2×

periodnumber2×

ring_startnumber2×

rotation"x y z"2×

spacingnumber2×

thinnumber2×

tipnumber2×

wnumber2×

wobblenumber2×

alwaystrue / false1×

arcstext1×

barnumber1×

barsnumber1×

blocks"x y"1×

bpmnumber1×

cell"x y"1×

colsnumber1×

curl-radiusnumber1×

eye"x y z"1×

face"x y"1×

fade_farnumber1×

fade_nearnumber1×

floor_colorcolour #rrggbb1×

from"x y z"1×

fronttexte.g. curl-a1×

gapnumber1×

inktrue / false1×

jagnumber1×

lengthnumber1×

parenttexte.g. s4-phone1×

phasenumber1×

ringstrue / false1×

routenumbers1×

seednumberSeed of the module's random generator (default: drawn from the node id).1×

slacknumber1×

speednumber1×

spreadnumber1×

strengthnumber1×

surgenumber1×

target"x y z"1×

texttexte.g. 2,481|BOOKED TODAY1×

thicknessnumber1×

to"x y z"1×

valuesnumbers1×

uptextWith `look_at`: the world direction kept as the node's up, `x y z` (default `0 1 0`).0×

Where it goes

Written under

scene 35g 19

Holds

rotation 4flow 3ring 3scale 3progress 3position 2opacity 2grow 2position.y 2highlight 1template 1position.z 1flip 1blur 1gather 1motion 1talk 1level 1rotation.z 1send 1rotation.y 1

Examples

code#s1-globein code/codeOpen and play →

code#s1-globe(src=data-globe radius=118 arcs="CAI>LHR,LHR>JFK,JFK>SFO,CAI>DXB,DXB>SIN,SIN>SYD" face="20 28" position="95 0 -20")
  // host channels: the node fades and scales in, and leans as a whole
  opacity
    0 0
    0.6 easeOutQuad 1
  scale
    0 0.86
    1.4 easeOutCubic 1
  rotation
    0 0 0 -8
    6 easeInOutSine 0 0 6
  progress
    0.6 0
    4.8 easeInOutSine 1

code#s2-chartin code/codeOpen and play →

code#s2-chart(src=data-skyline values="42 55 48 63 71 66 84 92 88 104 118 131" height=125 bar=13 gap=5 position="200 0 50" rotation="0 -14 0")
  // host channels: the plinth slides forward on the desk and turns toward the camera
  position
    0 0 0 -90
    1.2 easeOutCubic 0 0 0
  rotation
    0 0 -16 0
    5 easeInOutSine 0 6 0
  grow
    0.8 0
    3.8 easeInOutCubic 1
  highlight
    3.9 0
    4.5 easeOutQuad 1

code#s3-cityin code/codeOpen and play →

code#s3-city(src=route-map blocks="8 6" route="0 0 3 0 3 3 6 3 6 5 8 5" position="-20 0 0")
  // host channels: the whole city turns slowly and settles up into place
  rotation
    0 0 -12 0
    6 easeInOutSine 0 8 0
  position.y
    0 -30
    1 easeOutCubic 0
  progress
    0.5 0
    4.8 easeInOutSine 1