Show:

Encapsulates a stream of layout data (transform, origin, align, opacity). Listens on start/update/end events, batches them, and emits them downstream to descendant layout nodes.

Constructor

Core.LayoutNode

(
  • sources
)
private

Parameters:

  • sources Object

    Object of layout sources

    • [transform] Stream | Transform optional

      Transform source

    • [align] Stream | Array optional

      Align source

    • [origin] Stream | Array optional

      Origin source

    • [opacity] Stream | Number optional

      Opacity source

Example:

 var context = Context();
        
         var surface = new Surface({
             size : [100,100],
             properties : {background : 'red'}
         });
        
         var opacity = new Transitionable(1);
        
         var layout = new LayoutNode({
             transform : Transform.translateX(100),
             opacity : opacity
         });
        
         context.add(layout).add(surface);
         context.mount(document.body)
        
         opacity.set(0, {duration : 1000});

Item Index

Methods

Methods

compose

(
  • spec
  • parentSpec
  • size
)
Object private

Defines the rules for composing layout specs: transform, align, origin and opacity. Transform is multiplied by the parent's transform (matrix multiplication). Align is a proportional offset relative to the parent size. Origin is a proportional offset relative to the current size. Opacity is multiplied by the parent's opacity.

Parameters:

  • spec Object

    Object layout spec

  • parentSpec Object

    Parent layout spec

  • size Array

    Object size

Returns:

Object:

The composed layout spec

compose

(
  • spec
  • parentSize
)
Object private

Defines the rules for composing size specs (size, margin, proportions) into a new size. A margin array reduces the parent size by an amount specified in pixels. A proportions array scales the parent size by a provided ratio. A size array [width, height] can take true, undefined, or numeric values. undefined takes the parent value true takes the value defined by the DOM numeric values override parent values

Parameters:

  • spec Object

    Object size spec

  • parentSize Object

    Parent size

Returns:

Object:

size Composed size