19 Replies Latest reply on Sep 18, 2017 7:18 AM by keelym35886708 Branched from an earlier discussion.

    mouse position problem with stage size changes - branched [kglad]

    montana321 Level 1

      Was getting a weird effect that I was hoping someone had some insight into.

       

      When published at smaller sizes the slider worked fantastic.

       

      However, when you'd go full screen, the slider jumps ahead of the mouse.  So if you click on the slider and start to drag the slider will hop ahead of the mouse on the scroll bar and there will be a gap between the mouse and the slider.  Here's the thing -- the gap between the mouse and slider increases proportionally as slide along the x axis.  So in at a lower x value, it's almost nothing, but the gap gets steadily worse and you move along.

       

      The slider keeps hopping ahead of itself, always to the right, and the severity increases proportionally the further you travel down the scrollbar.

       

      var handleDistance = 4; //half the width 
      var bounds = {x:20, y:367, width:610, height:20};

      var sliderBoundary = new createjs.Shape(); 
      sliderBoundary.graphics.beginStroke("#999") 
      .setStrokeStyle(2) 
      .drawRect(bounds.x, bounds.y, bounds.width, bounds.height); 
      this.stage.addChild(sliderBoundary);

      paramF(this.handle, 20, 0, 630, this.circuit.totalFrames-1);

       

      this.handle.addEventListener("pressmove", fl_MouseClickHandler_2.bind(this));
      function fl_MouseClickHandler_2(evt){
      evt.currentTarget.x = Math.max(bounds.x + handleDistance, Math.min(bounds.x + bounds.width - handleDistance, evt.stageX));
      this.circuit.gotoAndStop(Math.round(this.handle.m*this.handle.x+this.handle.b));
      }

        
      this.handle.y = 367 ; 
      this.handle.x = bounds.x + bounds.width / 2;

      this.stage.addEventListener("tick", moveslider.bind(this)); 
      function moveslider(){

      this.handle.x=(this.circuit.currentFrame-this.handle.b)/this.handle.m;

      }

       

      function paramF(mc,x1,y1,x2,y2){

      mc.m=(y1-y2)/(x1-x2);

      mc.b=y1-mc.m*x1
      }