Robert Penner

"[Flash CS3 has a] lack of documentation on how to develop custom components ... Hopefully our screams for help will be heard."
-- Posted by SmackMe

Scream no more, Sir SmackMe. You just been smuck'd with an epic mini-series on component creation, now up on Adobe's Developer Center. My colleague Jeff Kamerer, engineer on the Flash Authoring team, has written basically a thesis, a small book on how to make your own AS3 components with the Flash CS3 framework. When Jeff sent me a draft six weeks ago, it was 32,000 words and 102 pages. He's not kidding around.

Here's the summary of what's covered:

Creating ActionScript 3.0 components in Flash

After following along with this series, you will learn how to do the following:

• Set up the layers and frames in your component movie clip symbol
• Implement Live Preview for your component
• Dispatch events
• Support styles and easily editable skins
• Manage drawing with the invalidation model
• Manage focus
• Handle keyboard input
• Create a compiled clip shim for your ActionScript definitions
• Deploy your component to the Components panel

http://www.adobe.com/devnet/flash/articles/creating_as3_components.html

For Flash CS3, we updated our JSFL engine to version 1.6 of SpiderMonkey. Firefox started using this version in Firefox 1.5. This is just the JavaScript interpreter, not the Document Object Model, which differs greatly between Firefox and Flash. (For those not familiar with JSFL, it's the JavaScript engine inside the Flash authoring tool; it's not in the Flash Player.)

SpiderMonkey 1.6 introduced JavaScript 1.6, which is JavaScript 1.5 plus several new features:

E4X

ECMAScript for XML (E4X) is a programming language extension that adds native XML support to JavaScript. It does this by providing access to the XML document in a form that feels natural for ECMAScript programmers. The goal is to provide an alternative, simpler syntax for accessing XML documents than via DOM interfaces.

E4X is standardized by Ecma International in ECMA-357 standard (currently in its second edition, December 2005).

E4X is implemented (at least partially) in SpiderMonkey (Gecko's JavaScript engine) and in Rhino (JavaScript engine written in Java).

Array Extras

There are seven new Array methods that can be separated into two categories, item location methods and iterative methods. The item location methods are:

• indexOf() - returns the index of the given item's first occurrence.
• lastIndexOf() - returns the index of the given item's last occurrence.

The iterative methods are:

• every() - runs a function on items in the array while that function is returning true. It returns true if the function returns true for every item it could visit.
• filter() - runs a function on every item in the array and returns an array of all items for which the function returns true.
• forEach() - runs a function on every item in the array.
• map() - runs a function on every item in the array and returns the results in an array.
• some() - runs a function on items in the array while that function returns false. It returns true if the function returns true for any item it could visit.

For more information, see Nicholas C. Zakas' article, Mozilla's New Array Methods.

Array and String Generics

Sometimes you would like to apply array methods to strings. By doing this, you treat a string as an array of characters. For example, in order to check that every character in the variable str is a letter, you would write:

function isLetter(character) {
 return (character >= "a" && character <= "z");
}

if (Array.prototype.every.call(str, isLetter))
 alert("The string '" + str + "' contains only letters!");

This notation is rather wasteful and JavaScript 1.6 introduces a generic shorthand:

if (Array.every(str, isLetter))
 alert("The string '" + str + "' contains only letters!");

Similarly you can easily apply String methods to any object:

var num = 15;
alert(String.replace(num, /5/, '2'));

[from http://developer.mozilla.org/en/docs/New_in_JavaScript_1.6]

Firefox 2 introduced JavaScript 1.7, which has some quite interesting features like generators and iterators. In the future, SpiderMonkey and Firefox will integrate the Tamarin virtual machine, which today runs ActionScript 3.

So JSFL developers gain some tools in Flash CS3 just from the SpiderMonkey update. As well, we added a number of new JSAPIs, which I'll talk about in a later post.

For those interested in the new Copy Motion as AS3 feature in Flash CS3, here are some good links to start you off:

Adobe Resources

• LiveDocs: Copy Motion as ActionScript 3
• Video Tutorial by Chris Georgenes
• Adobe Developer Center: Creating animation in ActionScript 3.0
• LiveDocs: Motion XML Elements
• LiveDocs: fl.motion package
• My FITC 2007 Presentation Slides
  

Blogs

• Kevin Hoyt: Copy Motion as AS3
• Galvan on Flash: Copy Motion to ActionScript 3
• Galvan on Flash: Using Copy Motion to ActionScript 3 with Flex

Enthusiasts

• MotionXML.com

... to my geosynchronous lair. Emerging from deep web hibernation, I've finally started my own blog.

Life at Adobe

In April 2006, I joined the Adobe Flash Authoring team as a software engineer, specializing in ActionScript and JSFL. I've always enjoyed creating tools for the Flash community. Now I have the privilege of expanding the Flash tool itself, together with a team of extremely talented people.

When your colleagues can add C++ and JSFL features for you on demand, and they say, "here, enjoy your new build of Flash"--now you're playing with power! At one point last year I said to my manager, "You know, I could really use some XML parsing in JSFL." Jethro says, "Sure, I'll look into that." Next thing I know, he's dropping in E4X himself. "Thanks, boss."

Areas of Interest

• In Flash CS3, Copy and Paste Motion and Copy Motion as ActionScript 3.0 were my main responsibilities. These features are fairly simple to use in their core use cases. But there are lot of subtleties once you dig a little deeper, which I'd like to explore.
• I've been working a lot with JSFL, XML, E4X and, of course, AS3.
  
• Tweening, easing and the Timeline are never boring.
  
• I majored in philosophy, so the occasional "analog moment" may sneak in. =)