app.coffee

background = new BackgroundLayer
	backgroundColor: "#fff"

cook_statusbar = new Layer
	x: 0
	y: 0
	width: 1776
	height: 72
	image: "images/cook-statusbar.png"

cook_appbar = new Layer
	x: 0
	y: 0
	width: 1791
	height: 264
	image: "images/cook-appbar.png"

cook_navbar = new Layer
	x: 1776
	y: 0
	width: 144
	height: 1080
	opacity: 0.9
	image: "images/cook-navbar.png"

cook_statusbar.placeBefore(cook_appbar)

page = new PageComponent
	scrollVertical: false
	x: 0
	y: 276
	width: 1920
	height: 768

page.on "change:currentPage", ->
	page.previousPage.animate
		opacity: 0.2
	page.currentPage.animate
		opacity: 1
	page.nextPage
		opacity: 0.2

layer = new Layer
	parent: page.content
	size: 1452
	y: 0
	x: 162
	width: 1452
	height: 768
	image: "images/step 0.png"

for index in [1...9]
	layer = new Layer
		parent: page.content
		size: 1452
		y: 0
		x: 162 + ((1452 + 4) * index)
		width: 1452
		height: 768
		image: "images/step " + index + ".png"
		opacity: 0.2

cook_navbar.placeBefore(page)