Lissajous

_.md

[ Launch: Lissajous ] 6381367 by enjalot
[ Launch: Lissajous ] 6381091 by zeffii
[ Launch: Lissajous ] 6378631 by slembcke

config.json

{"description":"Lissajous","endpoint":"","display":"canvas","public":true,"require":[],"fileconfigs":{"inlet.js":{"default":true,"vim":false,"emacs":false,"fontSize":12},"_.md":{"default":true,"vim":false,"emacs":false,"fontSize":12},"config.json":{"default":true,"vim":false,"emacs":false,"fontSize":12},"inlet.coffee":{"default":true,"vim":false,"emacs":false,"fontSize":12},"style.css":{"default":true,"vim":false,"emacs":false,"fontSize":12}},"fullscreen":false,"play":true,"loop":false,"restart":false,"autoinit":true,"pause":true,"loop_type":"period","bv":false,"nclones":15,"clone_opacity":0.4,"duration":3000,"ease":"linear","dt":0.01,"thumbnail":"http://i.imgur.com/iQYREX3.png"}

inlet.coffee

#by @slembcke
circle = (x, y, r) ->
  context.beginPath()
  context.arc x, y, r, 0, 2.0 * Math.PI, false
  context.fill()
  
context = tributary.ctx
context.fillStyle = "black"
context.globalCompositeOperation = "xor"

tributary.run = (unused, t) ->
  liss = (count, rate, phase, c_rep, s_rep, c_scr, s_scr, length) ->
    i = 0

    while i < count
      alpha = i / count
      a = phase + t * rate + length * alpha
      x = 0.5 * Math.cos(c_rep * a + c_scr * t) + 0.5
      y = 0.5 * Math.sin(s_rep * a + s_scr * t) + 0.5
      r_coef = 1 - Math.pow(1 - 2 * alpha, 2)
      circle x * size + offset, y * size + offset, radius * r_coef
      i++

  size = 300
  offset = 100
  radius = 20
  max = size + offset + radius
  context.clearRect 0, 0, max, max
  liss 10, 1.0, 0, 2, 3, 0, 0, 0.5

style.css

.cm-s-elegant.CodeMirror { background: #1e2426; color: #696969;  }
.cm-s-elegant div.CodeMirror-selected {background: #064968 !important;} /* 33322B*/
.cm-s-elegant span.cm-variable { color:#22EFFF; }
.cm-s-elegant span.cm-variable-2 { color: #FFCCB4; }
.cm-s-elegant span.cm-variable-3 { color: white; }
.cm-s-elegant span.cm-string { color: Chartreuse; }
.cm-s-elegant span.cm-string-2 {color: Chartreuse;}
.cm-s-elegant span.cm-def {color: #FFCCB4; opacity: 1.0}
.cm-s-elegant span.cm-bracket { color: #EBEFE7; }
.cm-s-elegant pre { color:#FFF; }
.cm-s-elegant span.cm-qualifier { color:#C0C0C0; }
.cm-s-elegant span.cm-comment { color: #AFB4B4;}
.cm-s-elegant span.cm-property {color: #FDA676;}
.cm-s-elegant span.cm-number { color: #FF92EE;}
.cm-s-elegant span.cm-keyword { color: #FFFF18; }
.cm-s-elegant .CodeMirror-cursor { border-left: 1px solid white !important; }
.cm-s-elegant .CodeMirror-gutters {background: #505050;}
.cm-s-elegant .CodeMirror-linenumber {color: #D3D3D3;}