Scrolling with the mouse now zooms based on mouse position.

This commit is contained in:
Scott Erickson 2014-02-15 13:45:16 -08:00
parent 72712a349c
commit 8f938bf6fc
2 changed files with 21 additions and 2 deletions

View file

@ -148,7 +148,21 @@ module.exports = class Camera extends CocoClass
onMouseScrolled: (e) -> onMouseScrolled: (e) ->
ratio = 1 + 0.05 * Math.sqrt(Math.abs(e.deltaY)) ratio = 1 + 0.05 * Math.sqrt(Math.abs(e.deltaY))
ratio = 1 / ratio if e.deltaY > 0 ratio = 1 / ratio if e.deltaY > 0
@zoomTo @target, @zoom * ratio, 0 newZoom = @zoom * ratio
if e.surfacePos
# zoom based on mouse position, adjusting the target so the point under the mouse stays the same
mousePoint = @canvasToSurface(e.surfacePos)
ratioPosX = (mousePoint.x - @surfaceViewport.x) / @surfaceViewport.width
ratioPosY = (mousePoint.y - @surfaceViewport.y) / @surfaceViewport.height
newWidth = @canvasWidth / newZoom
newHeight = @canvasHeight / newZoom
newTargetX = mousePoint.x - (newWidth * ratioPosX) + (newWidth / 2)
newTargetY = mousePoint.y - (newHeight * ratioPosY) + (newHeight / 2)
target = {x: newTargetX, y:newTargetY}
else
target = @target
@zoomTo target, newZoom, 0
onLevelRestarted: -> onLevelRestarted: ->
@setBounds(@firstBounds) @setBounds(@firstBounds)

View file

@ -433,6 +433,7 @@ module.exports = Surface = class Surface extends CocoClass
# uh # uh
onMouseMove: (e) => onMouseMove: (e) =>
@mouseSurfacePos = {x:e.stageX, y:e.stageY}
return if @disabled return if @disabled
Backbone.Mediator.publish 'surface:mouse-moved', x: e.stageX, y: e.stageY Backbone.Mediator.publish 'surface:mouse-moved', x: e.stageX, y: e.stageY
@ -445,7 +446,11 @@ module.exports = Surface = class Surface extends CocoClass
# https://github.com/brandonaaron/jquery-mousewheel # https://github.com/brandonaaron/jquery-mousewheel
e.preventDefault() e.preventDefault()
return if @disabled return if @disabled
Backbone.Mediator.publish 'surface:mouse-scrolled', deltaX: e.deltaX, deltaY: e.deltaY unless @disabled event =
deltaX: e.deltaX
deltaY: e.deltaY
surfacePos: @mouseSurfacePos
Backbone.Mediator.publish 'surface:mouse-scrolled', event unless @disabled
hookUpChooseControls: -> hookUpChooseControls: ->
chooserOptions = stage: @stage, surfaceLayer: @surfaceLayer, camera: @camera, restrictRatio: @options.choosing is 'ratio-region' chooserOptions = stage: @stage, surfaceLayer: @surfaceLayer, camera: @camera, restrictRatio: @options.choosing is 'ratio-region'