       x: event.pageX - @_state.origin.x
       y: event.pageY - @_state.origin.y
 
+    #console.log("pointer vector norm")
+    #console.log(V.norm(vector))
+
+    localVector =
+      x: vector.x * Math.cos(@beta) + vector.y * Math.sin(@beta)
+      y: -vector.x * Math.sin(@beta) + vector.y * Math.cos(@beta)
+
+    #console.log("local vector norm")
+    #console.log(V.norm(localVector))
+
+    #console.log(V.norm(vector) - V.norm(localVector) < 0.00001)
+    #console.log("i",V.signedDir(localVector, 'x'))
+    #console.log("j",V.signedDir(localVector, 'y'))
+
+    console.log(localVector)
+
     style =
-      left :  coef[0] * vector.x + @_state.elPosition.left
-      top :   coef[1] * vector.y + @_state.elPosition.top
-      width:  coef[2] * vector.x + @_state.elDimension.width
-      height: coef[3] * vector.y + @_state.elDimension.height
+      left :  coef[0] * localVector.x + @_state.elPosition.left
+      top :   coef[1] * localVector.y + @_state.elPosition.top
+      width:  coef[2] * localVector.x + @_state.elDimension.width
+      height: coef[3] * localVector.y + @_state.elDimension.height
 
     @$el.css(style)
     @trigger 'change:resize', style


    @listenTo @contains.handlerContainer.rotateHandle, 'drag:start', (data)=>
      @trigger 'start:rotate'
      @setTransform fn: @rotate, end: @endRotate
      @listenMouse()
      @setState data

  listenMouse: ->
    @options.workspace.on 'mousemove', @_transform.fn

  rotate: (event)=>
    # v is the vector from the center of the content to
    # the pointer of the mouse
    direction =
      x: event.pageX
      y: event.pageY
    vector = V.vector(direction, @_state.rotatedCenter)
    # vn is v normalized
    normalized = V.normalized vector
    # "sign" is the sign of v.x
