GreenSock


Utilities for Code Hinting and Strict Typing in TweenLite/Filter/Max

Posted in Tweening by jack on the July 15th, 2008
Version 0.96, Updated 8/15/2008
  • Compatibility: Flash Player 9 and later (ActionScript 3.0)
  • File Size added to published SWF: About 1.5Kb - 4Kb

Download Now
 
Donate

I created some AS3 utility classes that can (optionally) be used with TweenLite, TweenFilterLite, or TweenMax that address two requests:

  1. Code hinting - Sometimes it's hard to remember all the special properties that are available in the tweening classes, so code hinting would be very useful. In most decent code editors like Flex Builder, FDT, etc. (NOT the Flash Authoring tool), these classes will trigger code hinting (see screen capture below).
  2. Strict data typing - Some developers are extremely passionate about strict data typing and they're scared away by TweenLite/Filter/Max's "loosey-goosey" treatment of the vars Object. Many others love the flexibility, efficiency, and readability of that same feature. This utility should make it easier on the strict data typing folks.

The utilities are included in the AS3 TweenMax download.

USAGE

Basically, the idea is that you use a TweenLiteVars for the 3rd parameter in TweenLite.to() or TweenLite.from() calls. Here's a quick comparison:

WITHOUT UTILITY:

  1. import gs.TweenLite;
  2. import gs.easing.*;
  3.  
  4. TweenLite.to(my_mc, 2, {x:300, y:"100", ease:Elastic.easeOut, onComplete:myFunction});

WITH UTILITY:

  1. import gs.TweenLite;
  2. import gs.utils.tween.TweenLiteVars;
  3. import gs.easing.*;
  4.  
  5. var v:TweenLiteVars = new TweenLiteVars();
  6. v.addProps("x", 300, false, "y", 100, true); //with addProps(), you can add up to 15 dynamic properties at a time. addProp() adds one at a time.
  7. v.ease = Elastic.easeOut;
  8. v.onComplete = myFunction;
  9.  
  10. TweenLite.to(my_mc, 2, v);

So there is a bit more code to write, but for some developers, the strict typing and code hinting may be well worth the tradeoff. I personally prefer the shorter, more flexible loose style, but several well-respected developers have said that strict data typing is an absolute must-have for them, and it's the only thing that keeps 'em away from TweenLite/Filter/Max. Well, now there are no excuses :)

addProp(name:String, value:Number, relative:Boolean=false):void
  • Description: Adds a dynamic property to the TweenLiteVars instance. This is necessary to define the various properties that you'd like to tween in your TweenLite/Filter/Max target and their end values, as well as whether or not the value should be relative. This is NOT to be used to set values of "special properties" that exist in the class already, like ease, delay, onComplete, frame, etc. You must set those directly.
  • Parameters:
    1. name: Name of the property (like "x" or "y" or "scaleX", etc.).
    2. value: The end value that you'd like the property tweened to (or from in the case of TweenLite.from() calls)
    3. relative: If true, the value will be relative to the target's current value. For example, if my_mc.x is currently 300 and you do addProp("x", 200, true), the end value will be 500.
addProps(name1:String, value1:Number, relative1:Boolean=false, name2:String=null, value2:Number=0, relative2:Boolean=false, ...):void
  • Description: Adds multiple dynamic properties at once to the TweenLiteVars instance. It's exactly the same as addProp() but it allows you to add up to 15 properties at once.
  • Parameters: (same as addProp(), but with multiple sets in a row, one after the other. For example, if i wanted to do the same thing as {x:300, y:"100"} (y has a relative value of 100), it would look like addProps("x", 300, false, "y", 100, true);

FAQ

  1. Do I have to use this utility in order for TweenLite/Filter/Max to work?
    Absolutely not. It is completely optional.
  2. Does this utility only work with TweenLite? What about TweenFilterLite and TweenMax?
    Don't fret - there is a TweenLiteVars class for use with TweenLite, a TweenFilterLiteVars class for use with TweenFilterLite, and a TweenMaxVars class for use with TweenMax. All are included in the AS3 TweenMax download.
  3. Can I use the shorter (not strictly-typed) way to define dynamic variables but still use this class for its code hinting benefits?
    Sure, if you prefer, you can pass in variables to the constructor in the short-hand fashion, like so:

    1. var v:TweenLiteVars = new TweenLiteVars({x:300, y:"100", onComplete:myFunction, ease:Elastic.easeOut});

  4. What about filter tweens?
    As of version 0.95, there is a utility class for each type of filter (like BlurFilterVars, ColorMatrixFilterVars, etc.) which can be used like:

    1. import gs.TweenMax;
    2. import gs.utils.tween.*;
    3.  
    4. var myVars:TweenMaxVars = new TweenMaxVars();
    5. myVars.blurFilter = new BlurFilterVars(10, 10);
    6. myVars.colorMatrixFilter = new ColorMatrixFilterVars(0xFF0000);
    7. TweeenMax.to(my_mc, 2, myVars);

To download the code, you must agree to the following license:

Copyright 2008, GreenSock, Inc.

"NO CHARGE" NON-EXCLUSIVE SOFTWARE LICENSE AGREEMENT

-----------------------------------------------------------------------------
PLAIN ENGLISH SUMMARY:

  1. You may use the code at no charge in web sites, games, components, applications, and other software as long as end users are not charged a fee of any kind to use your product or gain access to it. It doesn’t matter if you are paid to create the site/product. If you charge end users a fee, you must sign up for a corporate Club GreenSock membership which comes with a commercial license granting you permission to do so. See http://blog.greensock.com/club/ for details.
  2. Since the code is updated frequently and developers are best served by having the latest version, please avoid (or at least minimize) distributing the source code outside your organization.
  3. Use at your own risk. I offer no warranties.
  4. Please respect the copyright.

-----------------------------------------------------------------------------

LEGALESE:

This is a legal agreement between you (either an individual or a single entity) and GreenSock, Inc. ("GREENSOCK") for the proprietary GreenSock ActionScript code known as TweenLite, TweenFilterLite, TweenMax, TweenGroup, OverwriteManager, and other code that is freely available for download at http://blog.greensock.com or http://www.greensock.com (this code and documentation, as well as any updates which may at GREENSOCK's sole discretion be provided to you from time to time, are referred to in this Agreement as "PROGRAM") By installing, copying, or otherwise using the PROGRAM, you agree to the terms and conditions of this Agreement. If you do not agree to the terms and conditions of this Agreement, please do not install or use the PROGRAM.

I. LICENSE
A. Subject to the terms and conditions of this Agreement, GREENSOCK hereby grants you a non-exclusive, worldwide, non-transferable right to use the PROGRAM in web sites, games, applications, components and other software for which the end user is NOT charged any fees. If you would like to use the code in a commercially licensed software product for which end users are charged a fee (either for usage or access), simply sign up for a corporate Club GreenSock membership at http://blog.greensock.com/club/.

II. LIMITATION OF LICENSE AND RESTRICTIONS
A. You agree that you will not disclose, sell, rent, license, or otherwise distribute the PROGRAM's source code or any derivative works thereof to any third party without the prior written consent of GREENSOCK. Derivative works are defined as modifications that add substantive functionality to the PROGRAM and do not include bug fixes or other minor modifications required to operate the PROGRAM as originally intended. Limited distribution of the source code to vendors as part of your Work Product is acceptable so long as they agree to the terms of this Agreement. You agree not to modify or delete GreenSock's existing copyright notice located in the source code.

B. You may use, duplicate, and distribute the compiled object code solely as embedded in a Work Product created by you, either for your own use or for distribution to a third party so long as end users of the Work Product are not charged a fee for usage. Please see http://blog.greensock.com/licensing/ for descriptions of Work Products that qualify for the "No Charge" license.

III. CONSIDERATION
A. The license rights granted to you under this Agreement are at no charge, but only in the following circumstances: If, either on your own behalf or on behalf of a third party, you incorporate the Software into a web site, software application, program or any component thereof (collectively, “Work Product”), which in the case of a web site, must be accessible to internet users without payment of a fee of any kind by a user, and in the case of a software application, program or component, neither you nor anyone to whom you distribute the Work Product charges a user a fee of any kind to use such Work Product or application, program or component into which such Work Product is embedded. The foregoing shall apply regardless of whether you are paid to create such Work Product and, under any circumstances, shall be subject to the prohibition against distribution of Source Code set forth in Section II.

B. In the event your intended use of the Software does not meet the criteria for the “no charge” license rights set forth in the immediately preceding paragraph, then you are not licensed to use the PROGRAM under this Agreement and must license the PROGRAM under GreenSock’s separate fee-based Software License Agreement which is granted to corporate Club GreenSock members (see http://blog.greensock.com/club/ for details).

IV. TITLE AND OWNERSHIP
A. The PROGRAM is licensed, not sold, and is protected by copyright laws and international treaty provisions. You acknowledge that no title to the intellectual property in the Software is transferred to you. You further acknowledge that title and full ownership rights to the PROGRAM, including all intellectual property rights therein, will remain the exclusive property of GreenSock and you will not acquire any rights to the PROGRAM except as expressly set forth in this Agreement. You agree that any copies of the PROGRAM you make will contain the same proprietary notices which appear on and in the PROGRAM.

V. DISCLAIMER OF WARRANTY AND LIMITATION OF LIABILITY
A. THE PROGRAM IS PROVIDED "AS IS" WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE. GREENSOCK DOES NOT WARRANT THAT THE FUNCTIONS CONTAINED IN THE PROGRAM WILL MEET YOUR REQUIREMENTS OR THAT OPERATION WILL BE UNINTERRUPTED OR ERROR FREE. GREENSOCK shall not be liable for special, indirect, incidental, or consequential damages with respect to any claim on account of or arising from this Agreement or use of the PROGRAM, even if GREENSOCK has been or is hereafter advised of the possibility of such damages. Because some states do not allow certain exclusions or limitations on implied warranties or of liability for consequential or incidental damages, the above exclusions may not apply to you. In no event, however, will GREENSOCK be liable to you, under any theory of recovery, in an amount in excess of the license fee paid by you under this Agreement. Notwithstanding anything else in this agreement, you agree to indemnify GREENSOCK, its assignees, and licensees, and hold each of them harmless from and against any and all claims, demands, losses, damages, liabilities, costs, and expenses, including legal fees.

B. GREENSOCK may, at its sole discretion, provide support services related to the PROGRAM, but has no obligation to do so.

VI. TERMINATION
GreenSock may terminate this Agreement at any time if you fail to comply with the terms and conditions of this Agreement.

VII. MISCELLANEOUS
A. This Agreement shall be construed in accordance with the laws of the State of Illinois. Should you for any reason bring a claim, demand, or other action against GREENSOCK, its agents or employees, arising out of this Agreement or the PROGRAM licensed herein, you agree to bring said claim only in the Illinois Court of Claims.

B. THIS AGREEMENT REPRESENTS THE COMPLETE AND EXCLUSIVE STATEMENT OF THE AGREEMENT BETWEEN GREENSOCK AND YOU AND SUPERSEDES ALL PRIOR AGREEMENTS, PROPOSALS, REPRESENTATIONS AND OTHER COMMUNICATIONS, VERBAL OR WRITTEN, BETWEEN THEM WITH RESPECT TO USE OF THE PROGRAM. THIS AGREEMENT MAY BE MODIFIED ONLY WITH THE MUTUAL WRITTEN APPROVAL OF AUTHORIZED REPRESENTATIVES OF THE PARTIES.

C. The terms and conditions of this Agreement shall prevail notwithstanding any different, conflicting, or additional terms or conditions which may appear in any purchase order or other document submitted by you. You agree that such additional or inconsistent terms are deemed rejected by GREENSOCK.

D. GREENSOCK and you agree that any xerographically or electronically reproduced copy of this Agreement shall have the same legal force and effect as any copy bearing original signatures of the parties.

I'd like to donate & get bonus classes, update notifications, SVN access, and more.

7 Responses to 'Utilities for Code Hinting and Strict Typing in TweenLite/Filter/Max'

Subscribe to comments with RSS


  1. on July 15th, 2008 at 2:41 pm

    Looks useful, but kind of amusing that you had to build this out to begin with. I guess some people are that hard core about strict typing eh.

  2. jack said,

    on July 15th, 2008 at 4:42 pm

    Yeah, Gabriel. I hear you. But you might be surprised by how passionately some developers argue the merits of strict data typing. I’m all for it, actually. There are certainly up sides. But there are down sides too.For example, strict datatyping requires more code and (depending on how it’s implemented) can be far less readable. For example:

    TweenLite.to(my_mc, 2, {x:300, y:100, scaleX:1.5, scaleY:2, rotation:90, onComplete:myFunction, ease:Elastic.easeOut});

    Is much more readable than:

    TweenLite.to(my_mc, 2, 300, 100, 1.5, 2, 90, myFunction, Elastic.easeOut);

    And it’s less code that an alternate way of strictly data typing:

    var myTween:TweenLite = new TweenLite();
    myTween.target = my_mc;
    myTween.duration = 2;
    myTween.x = 300;
    myTween.y = 100;
    myTween.scaleX = 1.5;
    myTween.scaleY = 2;
    myTween.rotation = 90;
    myTween.onComplete = myFunction;
    myTween.ease = Elastic.easeOut;

    But again, it’s just my personal opinion. I don’t think it’s a right vs. wrong issue, and I can see the benefits of using strict data typing when debugging very complex applications. Strict typing can also lead to better performance, but for TweenLite/Filter/Max, those speed benefits can’t be fully realized because they need to be able to tween ANY numeric property of ANY Object, dynamically.

    Hopefully these utilities will serve the stricter types among us well. :)

  3. Rich said,

    on July 16th, 2008 at 8:22 pm

    This is excellent, thank you. I have implemented it immediately. While the vars version may have longer code I feel it’s more flexible as I can have conditional values without having to create temp vars to hold them, i.e.:

    if (isGoingUp)
    {
    myTween.y = 0;
    } else {
    myTween.y = 300;
    }

    where-as before I would have to had either 2 complete TweenMax calls in there, or start creating a temp var for each value that may have been conditional.

    So, not just for the strict freaks at all :)

  4. mjamado said,

    on July 17th, 2008 at 5:45 am

    Good job (again)!

    Although I’m all for strict typing, I have a question… In my experience, class instantiation always come with a performance hit. Have you re-tested Tween Family performance with this? Is there a penalty, or is it negligible?

    On a side note, it’s amazing how some people just don’t use a package because it lacks strict typing… One might as well not use PHP, JavaScript… I’ve been working with strict typing since, well, forever (I come from desktop development, made the switch to Web Dev about a year ago), and even I’m not THAT freak…

    Keep up!

  5. jack said,

    on July 17th, 2008 at 7:09 am

    mjamado, yes, there is a slight performance hit when using the utility, but it’s negligible according to my tests. Even when doing 1500 every 0.5 seconds, it held up very well.

  6. Ash said,

    on September 8th, 2008 at 11:24 pm

    Good grief you have been busy!

    nice work

  7. Mikael said,

    on October 16th, 2008 at 2:06 am

    Yes this whole new package is amazing, a big steep forward and I have been waiting for the tweenmanager för AS3 since this spring. I have no problem paying for it. I know how long it takes to develop a application like that. sweet, nice work!

Leave a Reply