Skip to content
Samm Cooper edited this page Aug 25, 2016 · 4 revisions

Patch

In Loopin, operatives and data are the same thing. A Loopin stack has a rough global state, which is altered using the verb patch. Patches are easily representable as YAML data, and this convention is used everywhere.

For example:

# Set the resolution of the buffer 'foo' to VGA
buffer/foo:
  width: 640
  height: 480

The same could be written in Javascript as:

loopin.patch( { width: 640, height: 480 }, 'buffer/foo' ) 

Note that for convenience, keys are expanded to multi-level paths using / as a delimiter. Leading and trailing slashes and blank components are ignored, so the following paths are equivalent:

  • /buffer/foo/
  • buffer//foo/
  • ///buffer/foo

Internally, this patch would be flattened to the following JSON:

{"buffer":{"foo":{"width":640,"height":640}}}

Cheat Sheet

Here is a contrived example of a Loopin state, using every possible feature:

# Turn off the osd when things start working. 
osd:
  enabled: false 

# Set window settings 
window:
  title: Foo Bar Demo 
  width: 640
  height: 480
  fullscreen: false

# The resolution of the buffer should be set before rendering.
buffer/composite:
    width: 640
    height: 480

# Load image files to buffers 
image/background: image/background.png
image/displace: image/displace.png

# Load shaders 
shader/dazzle:
  vert: shader/dazzle.vert 
  frag: // Shader source can be sent directly.

# Create a plane mesh. 
mesh/chessboard:
  plane: 
    cols: 8
    rows: 8
    split: true
    weave: false

# Create a scatter mesh
mesh/starfield/scatter: 1024

# The default mesh is a quad.
# This is defined by default.
mesh/default:
  grid: 1 

# Render stuff. This is where everything comes together.
render:
  composite:
    # Settings for this layer:
    src: background 
    # Some shaders are loaded by default. 
    shader: rainbow 

    # Sub-layers are rendered after the parent layer, to the same buffer. 
    layer:
      # Sub-layers are rendered in alphabetical order rather than 
      # order of creation, so it's helpful prefix their keys.
      1_foreground:
        passes: 1
        # Blendmode: alpha, add, subtract, mult, none 
        blend: alpha

        # References to render elements. 
        shader: dazzle
        mesh: chessboard

        # Layer uniforms.
        tex/displace: displace
        float/someUniformName: 0.9 

        # 2D transform of layer. 
        transform:
          x: 0.5 
          y: 0.5 
          aspect: 1.333
          scale: 0.5 
          rotate: 45 

    # Another layer.
    layer/2_starfield:
      mesh: starfield

# Patch the uniform of an inner layer.
render/composite/layer/float/anotherUniformName: 3.1415 

# Clock settings 
clock:
  # Default 
  mode: sync
  # Lower frame rate.
  rate: 24.0
  # Slow things down.
  speed: 0.5

# Save the composite to the disk.
save/composite:
    dest: tmp/output-file.png
    format: png

Elements

Buffer elements

This elements read and write to a single Buffer object, mapped by the second component of their path. For instance text/foo/ is used to render text to the Buffer named foo. Multiple elements can access the same Buffer.

  • Render /render/:buffer_id - Render Layers to buffers. This is the most important element in Loopin!
  • Buffer /buffer/:buffer_id - Control of buffer parameters such as resolution and format.
  • Kinect /kinect/:buffer_id - Takes images from Kinect.
  • Text /text/:buffer_id - Render text to buffers.
  • Image /image/:buffer_id - Load images from disk to buffers.
  • Save /save/:buffer_id - Save buffers as still images to disk.

Render elements

These elements are referenced by Layer elements, and orthogonally affect all rendering. Many Layer elements may use the same element.

  • Mesh /mesh/:mesh_id/ - Lists of vertices and indices, which may be 3D models.
  • Shader /shader/:shader_id - GLSL shaders.

Global elements

These elements control the global operation of the Loopin device outside of rendering.

  • Clock /clock/ - Control of time and frame parameters.
  • Input /input/ - Mouse, keyboard and touch inputs.
  • OSD /osd/ - On-screen display.
  • Show /show/ - Which buffer to show on screen.
  • Window /window/ - Window parameters such as window size, title and fullscreen.
Clone this wiki locally