drop() Method Solution

Great work, I hope you enjoyed the jQuery animation challenge. 0:00 Let's dive right into the solution for the drop method. 0:03 Navigate over to your token.js file. 0:06 This is the final method we'll be adding to the token class. 0:09 Right before the }, you can see I've added my method documentation and declaration. 0:13 This method receives two arguments, target, and reset. 0:18 Target is the actual space object that the token is being dropped into. 0:23 That means we can access all of its properties and 0:27 methods inside this drop method. 0:29 Reset is a callback function. 0:32 This is added into the code for the animation. 0:34 When the animation has finished and the HTML token has visually dropped into 0:37 the space on the board, this function will be called. 0:41 It won't be called until the animation is complete. 0:44 You haven't written the reset callback function yet. 0:47 This will come up in the future step, so don't worry about it now. 0:49 But like its name suggests, the reset callback function resets the board and 0:52 gets the game ready for the next player's turn. 0:57 After all, when a token is dropped, that player's turn is over. 0:59 Remember, this drop method is called on the active token when the player 1:04 presses the arrow down key. 1:08 So before we get to the animation, 1:10 let's be sure to change the value of the active tokens dropped property to true. 1:12 By doing this we ensure that the next time the game needs to find the active player's 1:18 unused tokens, this token won't be included anymore. 1:23 Now below that we have the jQuery animation code. 1:28 I won't go through this in too much detail. 1:31 jQuery and 1:33 animation aren't things that you need to know to be successful in this course. 1:34 It does add a really neat effect for the players, 1:38 which is why it's included, but don't get to hung up on it. 1:40 Basically, the active token's HTML counterpart is animated so 1:44 that its top position value is changed to a value equal 1:48 to the target spaces row, times the target space's diameter. 1:53 For instance, if the target space is in the fourth row of the board from the top, 1:58 and its diameter is 76 pixels, the token needs to move down 2:03 4 times 76 pixels to be inside the target space. 2:08 The number 750 is how many milliseconds the animation should take. 2:13 And the easeOutBounce describes how the animation looks. 2:17 Finally, you see your callback function reset at the end. 2:21 Okay, great work, take a beat to match up your code and go ahead and 2:25 discuss any questions you have in the Treehouse community. 2:29 In the next step you'll be flushing out a method called play token 2:32 in the game class. 2:35 And then finally we get to demo the game so far. 2:36