2

So,

I'm just starting to learn CreateJS and I encountered my first problem: I can't get tweening to work (as I expect it should work).

Here is the example: http://www.hakoniemi.net/labs/createjs-test/

I want to get that cloud to move from right to left - at the moment it only jumps to the target.

The code looks:

 createjs.Tween.get(stack["cloud"]).to({"x":25}, 1000).call(test);

where createjs.Tween.get(stack["cloud"]) is valid and function test is executed. However there's no visual effect of 1000ms taking place at all.

I've looked through the tutorials and this is how things should work, but they're not. What am I doing wrong?

Edit: if I re-execute code in console with different value, then tweening and visual effect happens normally (here's a version where setTimeout is used: http://www.hakoniemi.net/labs/createjs-test/index2.html)

Samuli Hakoniemi
  • 18,740
  • 1
  • 61
  • 74

1 Answers1

2

You have a type problem when setting the initial x value in 

if (this.getAttribute("x")) {
  ref.x = this.getAttribute("x");
}

The problem is that getAttribute() returns a string, which you can verify outputing Object.prototype.toString.call(ref.x). This way, it seems the first time the tween tries to run it can't do the proper math. In the end, it correctly updates the value to the end value as a number and that's why next calls to the same method work properly.

You can fix this just by making sure that ref.x is a number. For example:

if (this.getAttribute("x")) {
  ref.x = parseInt(this.getAttribute("x"));
}

You can see it working in this fiddle.

One last thing, BitmapImageLoaded is adding the assets to the stage as soon as they are loaded. If your clouds image gets loaded before the background, it will be placed under it and you won't be able to see them. (just in case :))

jbalsas
  • 3,484
  • 22
  • 25
  • Hello, and thanks for your answer. This seems to work. Rather strange that such trivial issues aren't handled by the framework :). I noticed also that asset loading and placing order issue, and will fix that with preloaderJS or other way, thanks for mentioning tho. – Samuli Hakoniemi Sep 03 '12 at 07:19