Is there a simple way to adjust the detection of mouse cursor coordinates to account for changes in stageContainer.scale?

[eggborne]

I have a viewable game window sized 800 by 600, but a "map size" of 1920 by 1200. The WASD keys move a sprite onscreen, and it rotates to aim at the mouse pointer. This is working very smoothly until I zoom in or out (from center) by manipulating a displayObjectContainer (I meant to put that in the title instead of stageContainer, which is the variable I chose personally).
 
I have an inkling of what the problem is. When zoomed in or out, the upper left corner (e.g.) of the game window still registers as (0,0), but the sprite is pointing at what it originally considered to be (0,0) before the displayObjectContainer was scaled up or down. Thus it all goes out of whack unless the container is scaled (1,1).

 

I know I either need to change the sprite to be able to recognize the "new" location of (0,0) after scaling, or make the cursor coordinates appear relative to the unscaled container (as the sprite now "sees" them).
 
I'm adjusting the sprite's rotation according to cursor position as follows:

// using jQuery$( "#game-canvas" ).mousemove(function( event ) {      var parentOffset = $(this).parent().offset();      cursorX = (event.pageX-parentOffset.left);      cursorY = (event.pageY-parentOffset.top);      player.sprite.rotation = angleOfPointABFromXY(cursorX,cursorY,player.sprite.position.x,player.sprite.position.y);      console.log(cursorX + "," + cursorY + " | " + event.pageX + "," + event.pageY);});

and zooming thusly:

var zoom = function(direction,speed) {    if (direction === "in") {      stageContainer.scale.x += speed;      stageContainer.scale.y += speed;      stageContainer.position.x -= speed*gameWidth/2;      stageContainer.position.y -= speed*gameHeight/2;    } else {      stageContainer.scale.x -= speed;      stageContainer.scale.y -= speed;      stageContainer.position.x += speed*gameWidth/2;      stageContainer.position.y += speed*gameHeight/2;    };}

If anyone could give me some advice I would greatly appreciate it. Thanks!
 
An example of the problem is here (mouse wheel zooms in and out): http://belikewally.netai.net

 

[mwatt]

Hello eggborne,

 

I am not completely sure I follow correctly everything that you are saying, but I can tell you that in my own project, I do employ scaling, and in some instances I have to dynamically multiply the lengths I am using to set position by a factor of 1/scaleFactor (i.e. divide by scaleFactor).

 

For example, I use this function when I want to center a rectangular object:

 

  var centerScaledX = function (widthOfObjToBeCentered) {

      var centeredXPos = ( (rendererDims.width * (1 / rendererDims.scaleFactor)) -

                                         widthOfObjToBeCentered ) / 2;

      return Math.round(centeredXPos);

  };