Adrian Parr's Blog

Mr Jack “Green Sock” Doyle has just released version 12 of his GreenSock Animation Platform (GSAP) for Flash AS2 and AS3, but the big announcement is that it now supports JavaScript too!

This is awesome news, and the API for JavaScript is the same as we have been using all these years for Flash projects. Plus the performance is amazing! I’ve just quickly run a few tests on my computer and it is way faster than jQuery, YUI 3, MooTools and Zepto. Try running the speed test yourself to see just how fast it is. I’ll post some speed test figures here soon.

Jack has managed to include TweenLite, TweenMax, TimelineLite, and TimelineMax in to the JavaScript version, plus there is also a new CSSPlugin that enables css-related animations.

There have also been some other general improvements, changes and optimisations throughout the platform.

Great work Jack. If you use this library in your work why not help Jack to continue working on it by becoming a Club GreenSock member?

The GreenSock Tweening Platform (which includes TweenLite and TweenMax) has recently been updated to version 11. It is still available for AS2 and AS3 and claims to be faster and more capable. There is a huge list of improvements on the GreenSock website (it was great before, even better now) and it has now confirmed to me that it is the best ActionScript tweening engine out there. The website is full of loads of help, examples, documentation, tips, speed tests and faq. I’ve always found the interactive examples on the GreenSock website particularly useful.

Three great new additions to the platform are TweenNano, TimelineLite and TimelineMax. TweenNano is only 1.6k in size and designed to be used where filesize is at a premium (i.e. banner ads). TimelineLite and TimelineMax allow you to build and manage sequences of tweens.

There is a feature comparison on the site and a Getting Started Tweening guide which you may find handy.

Go and check it out, and start using it in your projects.

Great work Jack! Thanks.

I quite often find myself needing to find codes for special characters and then having to track down a website that lists the type of code I am after. Sometimes I need Unicode, other times I need ASCII, and other time I need URL Encoded values. Things like a list of key codes and escape sequences are also handy to have. So, to make mine (and your) life easier, I have put together a Special Characters Cheat Sheet (PDF) that lists all the characters from 0 – 255 (ASCII) and their other corresponding code values.

You can download the Special Characters Cheat Sheet (PDF) here

Here are some useful links to the Adobe Flash LiveDocs

• Keyboard Keys and Key Code Values on Adobe LiveDocs
• URL Encoding: Reading special characters from a text file

Here is a little Flash 8 (AS2) movie that displays charCodeAt, escape, getCode, getAscii and Key.CONST

Flash 8 AS2 Source Code here

In AS3 there are a few more event properties we can access such as ctrlKey, shiftKey and altKey. There are also many more static constants which are mapped to certain keys on the keyboard. Here is the Flash 9 AS3 version of the above movie.

Flash 9 AS3 Source Code here

UPDATE 20/03/09: Lee Brimlow has just made me aware of a useful online tool for converting between Unicode and other representations such as Hex, CSS Escape Sequences and Percent Encoding for URIs. The tool is called Unicode Code Converter v6 and has been written by Richard Ishida.

UPDATE 28/10/10: Another really useful tool I have found is from Till Schneidereit and it lets you convert text in to Unicode ranges (and vica-versa) which can be used in Flex Font Embed meta tags.

UPDATE 09/11/11: Here is another Unicode Range Generator created by Gen Ichino

Hooray, at last I have found a WordPress plugin that displays ActionScript just how I want. I’ve tried about four different plugins now and there was always something not quite right about them. What I wanted was;

• code to be displayed in a block
• ActionScript syntax highlighting (using something like GeSHi)
• line numbering
• ability to copy and paste the code without copying the line numbers
• long lines of code to not break out of the display block (to use horizontal scroll bars on long lines)
• ability to set a maximum height of display block (then use vertical scroll bars)
• keep code indented

Here are some of the plugins that I used at start with, and found that each of them had a problem with at least one of the above requirments;

• Dean’s Code Highlighter
• Code Snippet
• CodeHighlighter

Finally, the that I have settled on is called CodeColorer by Dmytro Shteflyuk. This seems to do all of the above, and was pretty easy to install and tweak. More info can be found on Dmytro’s personal site. So all the code blocks that you see on this blog are formatted using the CodeColorer plugin.

To use the CodeColorer plugin, simply wrap your code in the following tags …

<code lang=”actionscript”>

</code>

UPDATE 11/04/08

I have now turned off line numbering, because the numbers were being copied and pasted into peoples ActionScript editor when visitors tried to get the source code.

Also, there is still a slight issue with this plugin. When you want to go back and Edit a post, you are automatically taken to the ‘Visual’ editor. Switching between ‘Visual’ and ‘Code’ mode breaks the syntax highlighting.

So if anyone know of a really solid code syntax highlighter, then I’d still like to hear about it.