koenbok

layerA = new Layer

# Check the force value
layerA.on Events.ForceTap, (event) ->
	print event.force

koenbok

layerA = new Layer

# Enable pinching & panning
layerA.pinchable.enabled = true
layerA.draggable.enabled = true

koenbok

# Current click event
layerA.on Events.Click, -> ...

# With a shortcut
layerA.onClick -> ...

koenbok

layerA = new Layer
layerB = new Layer

# The old way
layerB.superLayer = layerA
print layerA.subLayers

# The new way
layerB.parent = layerA
print layerA.children

koenbok

Advanced Programming

Programming setup

• Instant visual output.
• Fast startup time, fast execution.
• Sensible errors, with code locations.
• Easy to set up and get working.

Architecture

koenbok

# Preferred way to deal with subprojects, because we want to avoid submodules.
# This way we do everything explicitly, and can verify everything in commits.
# We need to always keep master in good condition.

TMP = ./tmp
PROJECT_TEMP = $(TMP)/FramerSketch
PROJECT_GIT = git@github.com:motif/FramerSketch2.git

update%project:
	@mkdir -p $(TMP)

koenbok

# Hello Jordan!

koenbok

layer = new Layer

koenbok

interface Node {
	id: string
	type: string
	children: List<Node>
}

class Tree {

	// Create and remove (updates root)
	create(type: string, parent: string|null|Node= null, attributes: any = {}): Node {}

koenbok

// Internal types

interface NodeType {
	id: string
	type: string
	attributes: Map<string, any>
	children: List<NodeType>
}