improved rotation performance

extras/Studio.framer/framer/style.css

@@ -7,7 +7,7 @@
}

body {
	background-color: #fff;
	background-color: #000;
	font: 28px/1em "Helvetica";
	color: #FFF;
	overflow: hidden;

framer/Components/DeviceComponent.coffee

@@ -99,7 +99,7 @@ class exports.DeviceComponent extends BaseClass
		@content.originX = 0
		@content.originY = 0

		Framer.CurrentContext.domEventManager.wrap(window).addEventListener("resize", @_update)
		Framer.CurrentContext.domEventManager.wrap(window).addEventListener("resize", @_update) unless Utils.isMobile()

		# This avoids rubber banding on mobile
		for layer in [@background, @phone, @viewport, @content, @screen]
@@ -140,11 +140,11 @@ class exports.DeviceComponent extends BaseClass
				@_device.screenWidth / contentScaleFactor,
				@_device.screenHeight / contentScaleFactor)

			@screen.width  = @_device.screenWidth
			@screen.height = @_device.screenHeight
			@screen.width  = @viewport.width = @_device.screenWidth
			@screen.height = @viewport.height = @_device.screenHeight

			@viewport.width  = @content.width  = width
			@viewport.height = @content.height = height
			@content.width  = width
			@content.height = height
			@screen.center()

			@setHand(@selectedHand) if @selectedHand && @_orientation == 0
@@ -437,22 +437,27 @@ class exports.DeviceComponent extends BaseClass
			scale: @_calculatePhoneScale()

		[width, height] = @_getOrientationDimensions(@_device.screenWidth, @_device.screenHeight)
		[x, y] = [(@screen.width - width) / 2, (@screen.height - height) / 2]

		@content.width = width
		@content.height = height

		offset = (@screen.width - width) / 2
		offset *= -1 if @_orientation == -90

		[x, y] = [0, 0]

		if @isLandscape()
			x = offset
			y = offset

		contentProperties =
			rotationZ: @_orientation
			width:  width
			height: height
			x: x
			y: y

		@hands.animateStop()
		@viewport.animateStop()

		# FIXME: After a rotation we call _update() again to set all the right
		# dimensions, but these should be correctly animated instead of set after
		# the animation.

		if animate
			animation = @hands.animate _.extend @animationOptions,
				properties: phoneProperties
@@ -472,9 +477,10 @@ class exports.DeviceComponent extends BaseClass
		@emit("change:orientation", @_orientation)

	_orientationChange: =>
		@_update()
		@emit("change:orientation", window.orientation)

	isPortrait: -> Math.abs(@_orientation) != 90
	isPortrait: -> Math.abs(@_orientation) == 0
	isLandscape: -> !@isPortrait()

	@define "orientationName",

framer/Framer.coffee

@@ -59,6 +59,7 @@ Defaults.setup()
Framer.resetDefaults = Defaults.reset

Framer.DefaultContext = new Framer.Context(name:"Default")
Framer.DefaultContext.backgroundColor = "white"
Framer.CurrentContext = Framer.DefaultContext

Framer.Extras.MobileScrollFix.enable() if Utils.isMobile()