EaselJS: Spritesheets

Still figuring this out myself, but here is what I have so far...

A sprite sheet is an image of all the frames of an animation, I'm not sure if it has to be a .png, but that will work.

In the example file, there were loads of scripts added, but I replaced it with the one script and it still worked for me...

Line 24: Create a 'spritesheet' - seems to be a way of telling the page which sections of the spritesheet are what, etc.
"animations" is, I think, used if you want to use your spritesheet as an animation? I don't know.

Lines 26 and 27: These two lines both define certain frames as part of a sequence. Sort of like if you had frames in Flash, and a frame had a name, and then when it reached a certain frame, it would loop back to the beginning, or go to another named frame.
On line 26, it's saying that the run sequence is to start from section 0 of the sprite sheet, and go through to section 25, and then, though I have commented this out, to go to the sequence of frames called 'jump', which is defined on the next line.

Line 28: Defines the source file for the image that is the spritesheet.

Lines 29 to 36: Tells it how to recognise what frames are on the sprite sheet.
"hieght" and "width" are how many pixels each section of the image is that should be taken as a frame. I'm not sure how you are supposed to know this, I made a sprite sheet using zoe, and it gave me a file that was 2048 by 512 pixels, with two rows of 7 frames. So I divided 2048 by 7 to get "width", and 512 by 2 to get "height". It worked for me. I suggest you try altering these values so you can see what goes wrong.
"regX" and "regY" are the registration co-ordinates for the animation that will result from the sprite sheet.
"count" is how many frames you have in total, I think.

Line 38: Assign your animation to a variable (a BitmapAnimation) that you can then position etc, and generally treat like a movie clip.

Line 61: If you use gotoAndPlay without any parameters, it will just play everything that the spritesheet is capable of. Or you can tell it which 'frame' to go to.

Line 64: You need the Ticker to get it to work, but strangely, it won't pause in the way a Tween will. So...

EaselJS: Text width

In order to get the width of a text field you have created, you are supposed to use:

txt.getMeasuredWidth();

I was trying to add line breaks, EaselJS doesn't support html tags, so I used the \n line break, which works.

Problem? Now getting the measured width doesn't work (although height is fine). In fact, the more line breaks you add, the wider it thinks the text box is!

For myself, I am going to print out my longest line, and measure it's width, then replace it with the full text.

TweenJS: Motion Guides

This one uses the MotionGuidePlugin. Apparently, this isn't as straightforward as adding the script as a source, you also have to sort of install it...

Line 14: This is how you 'install' the motion guide plugin

Line 26: I've drawn this line to show the path that the ball will be taking, and how it relates to the motion guide. For the curveTo, the first parameter sort of shows which direction the curve should head towards, the second parameter shows where the curve should end up.

Line 21: The example uses true in the third parameter (the plugin data), but when I set it to false, this still works...

Line 22: The path has six parameters, 1 and 2 are the x,y coordinates of where the object should start. 3 and 4 are the x,y coordinates of where the path should curve towards. 5 and 6 are the x,y coordinates of where the object should end up. Orient is whether or not you want your shape to turn as it moves along its path.