Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
kaotix

Potential port to Google Dart?

Recommended Posts

Hey there, been using TweenMax for flash for a long time and am looking forward to learning it for javascript it's my number 1 library.

 

My question is, do you think a version of any of the greensock libraries will ever come out for Google Dart? (the potential successor to javascript)

 

I'm learning Dart at the moment and it's much nicer to use and would love something like TweenLite to aid in games development.

 

thank you,

Adam.

Link to comment
Share on other sites

It is certainly possible at some point, sure, but there are no plans to do so in the immediate future. Sorry. JavaScript seems pretty firmly embedded in the web's ecosystem for the foreseeable future :)

Link to comment
Share on other sites

  • 6 months later...

Anyone have any experience with if it's straightforward using the Dart<-->JS bridge to just wrap the TweenMax functions for use in Dart?

Link to comment
Share on other sites

  • 10 months later...

It's actually extremely easy.

Just import the dart:js library, and then you would call greensock like this:

 

context['TweenMax'].callMethod("to",["#myDiv", 0.15, new JsObject.jsify({x:100})]);
  • Like 2
Link to comment
Share on other sites

  • 2 months later...

I wanted to use SplitText in a Google Dart app but had problems using the staggerFrom method as described in the examples. I didn't get errors, it just wouldn't work. Maybe it's a scope issue? I used a timeline instead. Here is my working code.
 
On load, set up the text so it can be animated in

 

 

JsObject splitText;
JsArray splitChars;
 
 

void setupAnimation(){

// setup tagline
splitText = new JsObject(context['SplitText'], ["#tagline", {"type":"words,chars"}]);
splitChars = splitText["chars"];


for (var i = 0; i < splitChars.length; i++) {
var setArgs = new JsObject.jsify({"perspective" : 400, "opacity": 0, "scale": 0, "y": 80, "rotationX":180, "transformOrigin":"0% 50% -50" });
context['TweenLite'].callMethod("set",[splitChars, setArgs]);
}

}
 
When you want to run the animation:

void animateTagline(){

var completeArgs = new JsObject.jsify({"onComplete": taglineAnimationComplete });
var timeline = new JsObject(context['TimelineMax'], [completeArgs]);

for (var i = 0; i < splitChars.length; i++) {
num delay = i*.035;
var tweenArgs = new JsObject.jsify({"opacity":1, "scale":1, "y":0, "rotationX":0, "ease":"Back.easeOut"});
var tween = new JsObject(context['TweenLite'], [splitChars, 1, tweenArgs]);
timeline.callMethod("insert", [tween, delay]);
}

timeline.callMethod("play", []);

}

 

void taglineAnimationComplete(){
  splitText.callMethod("revert", []);
}
Link to comment
Share on other sites

Hm, unfortunately I'm not at all familiar with Dart and this certainly sounds like it's a Dart-specific issue. Can you recreate the issue in "plain" JS/HTML/CSS? If you could create a simple codepen example, that'd be fantastic. Otherwise maybe check with some Dart experts who can tell you what you may be doing wrong on the Dart side of things. 

 

You may be right about the scope issue - make sure that the methods are being called directly on the proper objects so that "this" inside the methods has the correct meaning. Again, I'm not sure how exactly you do that in Dart, nor do I have time to research it at the moment :(

 

Please do let us know if you figure it out. 

Link to comment
Share on other sites

Hi,

 

If you can post a complete system example of what you're trying to do working without Dart and the function you're trying to call from within Dart we can help test the Dart/JS interrop for you.

  • Like 1
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×