3 Replies Latest reply on Oct 24, 2017 7:48 AM by keelym35886708

    Event listener works on Stage but not on Movieclip (createjs, HTML5)

    keelym35886708 Level 1

      Hi,

       

      I'm working on an HTML5 Canvas project in Adobe Animate CC and coding it in javascript. I have a movieclip that I would like to rotate and thanks to previous forum posts and users I was able to get my movieclip to rotate - however the event seems to be happening on the stage, which was fine for my other projects, but on this project I have multiple movieclips that need to move in different ways. So with my code as it is currently, the movieclip I want to rotate will rotate, however it will rotate no matter where you are clicking on the stage or on other movieclips.

       

      The instance name of the movieclip I want to rotate is "collective" here is my code for rotating it currently (also I am not a coder by any means, so many thanks to forum users who have helped me get this far):

       

      var middle = this.collective;
      var mouseMoveTwo = function () {
      var rads_two = Math.atan2(stage.mouseY - middle.y, stage.mouseX - middle.x);
      var angle_two = rads_two * (180 / Math.PI) - offset_two;
      middle.rotation = angle_two;
      console.log("angle_two:" + angle_two);
      } 
      
      
      var offset_two = 10;
      
      
      stage.addEventListener("stagemousedown", function(){
      stage.addEventListener("stagemousemove",mouseMoveTwo);
      var rads_two = Math.atan2(stage.mouseY - middle.y, stage.mouseX - middle.x);
      offset_two = rads_two * (180 / Math.PI) - middle.rotation;
      mouseMoveTwo();
      });
      
      
      stage.addEventListener("stagemouseup", function (){
      stage.removeEventListener("stagemousemove",mouseMoveTwo);
      });
      

       

      This works, however I'd like to be able to move all my movieclips on the stage independently of one another. My attempt to make this event just fire off when press moving the mouse over "collective" didn't work - I'd click and drag on "collective" and nothing would happen - this was my attempt at that:

      var middle = this.collective;
      var mouseMoveTwo = function () {
      var rads_two = Math.atan2(stage.mouseY - middle.y, stage.mouseX - middle.x);
      var angle_two = rads_two * (180 / Math.PI) - offset_two;
      middle.rotation = angle_two;
      console.log("angle_two:" + angle_two);
      } 
      
      
      var offset_two = 10;
      
      
      this.collective.addEventListener("mousedown", function(){
      this.collective.addEventListener("mousemove", mouseMoveTwo);
      var rads_two = Math.atan2(stage.mouseY - middle.y, stage.mouseX - middle.x);
      offset_two = rads_two * (180 / Math.PI) - middle.rotation;
      mouseMoveTwo();
      });
      
      
      this.collective.addEventListener("mouseup", function(){
      this.collective.removeEventListener("mousemove",mouseMoveTwo);
      
      });
      

       

      I've tried a couple of other things too - but I have been unsuccessful at getting the "collective" movieclip to rotate just when the mouse is "press moving" (click and drag) on top of it.

       

      Any help is much appreciated!

       

      Thanks.