Skip to main content
Participant
November 15, 2020
Question

Set starting position of objects on stage

  • November 15, 2020
  • 1 reply
  • 463 views

I'm new to JavaScript and Adobe Animate. I have a rather involved project going you can view the current working version at Digital Magnet Board

 

The concept is a magnet board that allows the user to manipulate the tiles to spell words. We will be using this to teach students to read during distance learning. It is functional right now with my current code. I'm guessing there will be 100 more tiles added to the board by the time I'm done. I've got the items dragging and dropping. If there's a simpler way I'd love some feedback.

 

 

Is there a way to set the start positions of the tiles when the animation loads so I can have the reset button return the tiles when the button is clicked?

 

Right now I'm accomplishing the reset with a ClicktoPosition function, but I'm also having to put individual coordinates in for every tile which is cumbersome and time consuming. I've also tried resetting with keyframes and having the button reload the webpage but then you have to navigate back to the section. 

 

    this.resetButton.on("click", fl_ClickToPosition.bind(this));
            function fl_ClickToPosition()
            {
                           this.cardA.x = 32;
                           this.cardA.y = 66;
                           this.cardB.x = 83.45;
                           this.cardB.y = 66;
                           this.cardC.x = 134.85;
                           this.cardC.y = 66;
    }

 

 

Right now this is the code I'm using for the drag and drop functionality - I'm manually adding this with each tile. 

this.prefixSUB.on("pressmove", function(evt){
var p = stage.globalToLocal(evt.stageX, evt.stageY);
evt.currentTarget.x = p.x;
evt.currentTarget.y = p.y;
});

Thank you for any assistance you can provide.

Erin

    This topic has been closed for replies.

    1 reply

    Legend
    November 15, 2020

    You really, really need to learn about JavaScript arrays and bracket notation. You should never have to manually duplicate identical code for multiple entities.

     

    Anyway...

     

    var _this = this;
    var myClips = ["cardA", "cardB", "cardC", "cardigan", "cardsagainsthumanity", "hereacardthereacardeverywhereacardcard"];
    
    function saveStartPositions() {
    	var i, clip;
    	for (i = 0; i < myClips.length; i++) {
    		clip = _this[myClips[i]];
    		clip.origX = clip.x;
    		clip.origY = clip.y;
    	}
    }
    
    function restoreStartPositions() {
    	var i, clip;
    	for (i = 0; i < myClips.length; i++) {
    		clip = _this[myClips[i]];
    		clip.x = clip.origX;
    		clip.y = clip.origY;
    	}
    }

     

    Not tested, but something like that should work.

    Participant
    November 16, 2020

    Thank you so much!

     

    I kind of just found something that accomplished what I wanted and went with it.  I knew there was a better way.