Recently in Flash Category

AS3ScribdLib has been updated to version 0.90.
With this release, the API is completely supported.

Changelog:
* Fixed docs.upload() functionality.
* Fixed user.signup() functionality.
* Fixed request signing to follow API signature guidelines.
* Fixed success and error responses.

Links:
* Main Page
* Download
* Source
* Docs

Dependencies:
* as3corelib
* as3flexunitlib (Only necessary for running unit tests for the library)

AS3ScribdLib Update 0.85

| | Comments (0)

AS3ScribdLib has been updated to version 0.85.

Changelog:
* Fixed docs.uploadFromUrl().
* Added documentation.
* Added a download link (includes docs, src, and swc).

Links:
* Main Page
* Download
* Source
* Docs

Dependencies:
* as3corelib
* as3flexunitlib (Only necessary for running unit tests for the library)

TODO:
* docs.upload()
* user.signup()

Language Reference Updates

| | Comments (0)

I've updated my Language References post with the latest and greatest since Flex 3 and AIR were officially released.

I've also added a subheading for Flash library language references.
If you've created a library with public facing docs let me know.

I'll continue to try and update the post.

AS3ScribdLib Released

| | Comments (1)

I just finished AS3ScribdLib, the AS3 API for Scribd.

The source code can be found on Google Code: http://code.google.com/p/as3scribdlib

The project has the following dependencies:

* http://code.google.com/p/as3corelib
* http://code.google.com/p/as3flexunitlib (Only necessary for running unit tests for the library)

The project has the following known issues:

* docs.upload() and docs.uploadFromUrl() not functioning properly
* user.signup() not functioning properly

After committing to creating the API I quickly realized that it is not the API for iPaper, but the actual API for handling document upload and management and user registration for the overall Scribd service.
Once I get upload and signup functioning 100%, I'll move onto iPaper to see what API might be available for it.

iPaper... the new FlashPaper?

| | Comments (4)

A little over a month ago I wrote about how FlashPaper seemed like it was taking its last dying breath. After reading the comments and doing some searching on my own,
Share currently seems to be the only continuation of FlashPaper in any form by Adobe. This was a little disappointing since Share is definitely not FlashPaper. Share (much like its name states) is basically a document sharing product that offers an embeddable preview of the document that you can embed on your site. The keyword there is "preview". The preview is very basic and doesn't give you any controls besides changing the page. The only way to actually look at the document in all of its glory, with some of the old FlashPaper controls, is to click on the preview which links the user back to Share's website where the actual document is hosted. Unfortunately this is very limiting and annoying to people who are used to being able to embed the entire FlashPaper application in their own page.

A month and a half later and along comes a new tool to possibly fill the void left by FlashPaper.

Scribd, another document sharing website competing with Share, has released their own version of FlashPaper called iPaper. At first glance, iPaper seems to be everything I was hoping FlashPaper 3 would be. It offers all of the tools that FlashPaper 2 offered, including embedding the entire application, plus some:

  • iPaper can convert PDFs, Word docs, Powerpoint docs, OpenOffice docs, and more to Flash.
  • You can integrate Google ads into your documents.
  • Security... which I still need to look into.
  • Very light... only 96 KB.
  • Sharing features built in.

But the thing that caught my eye the most (that I still need to investigate further) is that Scribd offers a full API.

From their site: "Use the Scribd API to harness the full power of Scribd's scalable conversion system, storage system, ad network, search engine, and iPaper viewer on your website at no cost to you."
Looks like you will be able to control all of iPaper's controls through an API much like FlashPaper allowed.
This is very exciting and I can't wait to dig deeper into it and see if there is a need for a component at all anymore. One thing I do see the need for though is an AS3 library to communicate with Scribd's API.

So I started AS3ScribdLib.
Nothing has been added yet, but keep your eye out and hopefully it will be coming soon.

navigateToURL() Static Window Constants

| | Comments (3)

Not that its a big deal at all, but since almost every constant string value in AS3 is provided in a class as a static constant property, why is there no class that contains the constant window values for navigateToURL()?

Shouldn't there be a class that provides the following?:


public static const SELF:String = "_self";
public static const BLANK:String = "_blank";
public static const PARENT:String = "_parent";
public static const TOP:String = "_top";

Like I said, its not a big deal, since its simple enough to do. Just seems like something left out from the AS3 classes.

FlashPaper in 2008: Dead or Alive?

| | Comments (18)

As my first post of 2008, I thought I would ask this question and see what people thought.

Since Adobe took over Macromedia, FlashPaper seems to have been put on the backburner or quite possibly extinguished all together. Adobe already has the pdf format and now seems focused on a new xml-based representation of pdf, the Mars Project. With CS3, Adobe did not include FlashPaper with any of the suites and has pulled FlashPaper from Contribute.
You can of course still buy FlashPaper 2 from the Adobe store, but it is still v2 and does not work with Vista or Intel Macs. I have heard a few rumors that FlashPaper might be included as an export option in Acrobat, but so far thats just that... a rumor.

So what do you think... will FlashPaper be revived in 2008 or has it gasped its last dying breath?

Papervision3D: Lava Rock

| | Comments (7)


I have to say Papervision3D really is great.

I've had my eye on it for a while but just never seemed to find the time to start playing around with it.
I actually come from a 3D background (which you can see if you go way back in my blog) but slowly found myself creeping into the Flash world and haven't had a chance to look back. The opportunity to combine these two interests is hard to resist, but up until Papervision wasn't very viable.

With the advent of Papervision3D 2 and Andy Zupko's effects addition, 3D in Flash is not only viable but seems to really be taking off.

When I heard there was going to be a Papervision class in NYC, I couldn't pass it up. Since the class, I've been digging in and messing around and once Andy added his effects classes to SVN I jumped and started working on the lava rock at the top of the page.

Its basically a sphere primitive with a video texture applied to it.
I created a procedural texture in 3ds Max and applied it to a sphere primitive until I was happy with this:

lava

Once I had the look I was happy with, I animated the texture. From there, I rendered out the texture as a flat series of images. I then created a Photoshop action that took the flat texture and created a seamless spherical texture. I then took the series of spherical images and created an flv. Once there, I applied that texture to the primitive sphere in Papervision.

To top it all off, I used some of Andy's effect classes and created steam that seems to come from the actual cracks in the lava rock.

It took a little while to get it all setup and learn the ins and outs of Papervision, but now I'm hooked and can't wait to keep messing around with it.

For some reason or another selection color is not an option on dynamic TextFields in Flash.
This has been one of those issues that I've just accepted up until now.

I'm currently working on a project that has a design featuring white text over a black background. The caveat was that the text needed to be selectable as well. As anyone working with selectable text knows, the selection color is always black. This posed a problem... the user couldn't actually tell when the text was selected or what characters were actually selected. I remembered a while ago reading about applying a color transform to the text field to change the selection color. Only problem with that solution is that it applies the transform to the entire field as a whole, which means the text color and background color are affected by the transform as well.

I played around with this solution for quite a while and came up with a fairly reliable way of changing the selection color and maintaining the text and background colors that you initially chose. There are still some hiccups, but so far this is the best solution that I've found. First download the SelectionColor class and then test it with:

package
{
 	import com.digitalflipbook.text.SelectionColor;
 	import flash.display.Sprite;
 	import flash.text.TextField;
 	
 	/**
 	 * The SelectionColorTest class runs a simple test changing a TextField selection color.
 	 * 
 	 * @author Mark Walters
 	 * @since 2007.08.13
 	 */
 	public class SelectionColorTest extends Sprite
 	{
  		
  		public function SelectionColorTest()
  		{
   			var tf:TextField = new TextField();
   			this.addChild( tf );
   			tf.width = 180;
   			tf.height = 20;
   			tf.text = "Here's some text to try selecting.";
   			tf.background = true;
   			tf.backgroundColor = 0x000000;
   			tf.border = true;
   			tf.borderColor = 0x000000;
   			tf.textColor = 0xFFFFFF;
   			
   			SelectionColor.setFieldSelectionColor( tf, 0xD3D3D3 );
   		}
  		
  	}
 	
}

Now, this works with many color choices, but it is not a full proof solution. I have seen certain colors, depending on the colors chosen, not work out exactly as expected. If anyone notices anything in the code that could be perfected let me know and I will post an update. This seems to be one of those annoying things about Flash that would be nice to have a solid solution.

Language References

| | Comments (1)

These should always be one click away:


CORE LANGUAGE REFERENCES

Flex 3 and AIR 1

AIR 1 JavaScript

Flash 9 and AIR 1 (ActionScript 3.0)


LIBRARY LANGUAGE REFERENCES

AS3CoreLib

Cairngorm

FlexLib

PureMVC


ARCHIVED CORE LANGUAGE REFERENCES

Flex 2

Flash 8 (ActionScript 2.0)


I'll try and keep this page updated.

Craziness...

| | Comments (1)

Its been way too long since I got a post up here, but I thought I would quickly let you know I wasn't dead and give you a few of the reasons why it has been that long:

1) Buying a new place in Jersey City. Sooo much more time consuming, difficult, and expensive than buying in Atlanta.
2) Training our new french bulldog puppy (Jacques Francois ).
3) Trying to spend as much time as possible with my wife.
4) Work, work and more work.
5) Freelance, freelance and you get the point.
6) Tech-editing the upcoming AS3 Bible.

One thing I have been meaning to write about, that I'll quickly touch on, is FlashDevelop 3. The 2nd beta has already been released and I've been using it for all of my development for the past month and a half, building from the source daily. It is very stable and so much better to work with than FD2... and I was a big proponent of that.
So go download it, try it out, and shoot Philippe, Nick and the rest of the FD crew your comments and thank yous because its a great app for flash, and now flex, development.

FlashPaper Component 0.8

| | Comments (31)

Surprisingly enough, I actually get a lot of hits on this site for my FlashPaper component.
What's funny is that I've never once thought about charging for it, but today I realized that another company was charging an outlandish amount of money for much less functionality.
The company is Zanzibar Fiction and here is their pricelist. And yes... that's up to $500 that they're charging for deactivating the select and print buttons!! I just don't get it.
But anyway, one thing that they added that my component didn't have was color schemes for the FlashPaper interface. So to hopefully prevent anyone from spending that crazy amount of money, I decided to add it to my component... but make it even better. They offer 8 color choices (and they are all very ugly) and my component now lets you select any tint color and percentage that you like for the interface.
Oh and by the way it's still free! :)

However, if for some reason you feel like donating a little something because this component saved you time or money to Zanzibar I will happily accept. :)

Description:
The FlashPaper component simplifies the process of working with the FlashPaper API and adds functionality either not documented or not provided in the API.

Installation:
- Unzip FlashPaper_0.8.zip
- DoubleClick on FlashPaper.mxp to install with the Extension Manager.

Documentation:
FlashPaper Component Documentation

Download FlashPaper

Keith Peters had a couple of posts a little while ago about embedding assets in as3 (1 and 2). One thing that came up in both of them that could not be resolved was how to associate a custom class with an embedded symbol. The example given was:

...create a movie clip in the Flash 9 IDE, give it a class of “Star”, and you have an actual class written, called “Star” that has some functionality that is really cool. Now, you embed that star symbol in your AS3 application, but you can only type it as Sprite or MovieClip. How to get it to be a “Star”? I finally got to dig in to this a bit more, and sadly, I don’t think there is a way to do this. When you embed a Sprite asset, it comes in as an instance of SpriteAsset

I was trying to do the same thing and found out that there actually is a way to do this. Instead of adding the embed tag above a variable like so:

package
{
 	import flash.display.Sprite;
 	
 	public class Application extends Sprite
 	{
  		[Embed(source="library.swf", symbol="Star")]
  		private var Star:Class;
  		
  		public function Application()
  		{
   			var star:Sprite = new Star();
   			addChild(star);
   		}
  	}
}

...which only allows you to type it as Sprite or MovieClip. You can instead create the Star class and add the embed tag directly above the class declaration:

package
{
 	import flash.display.*;
 	
 	[Embed(source="library.swf", symbol="Star")]
 	public class Star extends Sprite
 	{
  		public function Star()
  		{
   			
   		}
  	}
}

and implement it in the main class with:

package
{
 	import flash.display.Sprite;
 	
 	public class Application extends Sprite
 	{
  		private var star:Star;
  		
  		public function Application()
  		{
   			star = new Star();
   			addChild(star);
   		}
  	}
}

Now you have a custom Star class you can do anything you want with associated with an embedded asset!
Yay! Problem solved.

FlashDevelop 3 Prerelease Test Drive

| | Comments (0)

Since its been quiet on the FlashDevelop front regarding version 3, I decided to update the repository and see if I could compile the source to see the progress. First things first, with FD2 you could compile it with SharpDevelop version 1.1 (for .NET Framework 1.1), but to compile FD3 you need to use MS Visual C# Express Edition (for .NET Framework 2.0). I'm not positive, but I would assume you could also use version 2.1 of SharpDevelop.

Once Visual C# was installed, I built the solution and everything compiled with no problems.

So now to see what's new (noting that this is not a release at all, so I am expecting bugs and a completely unpolished product):

- Once open, FD3 looks very similar to the layout of FD2 except slightly slicker. A little more gray that once was white and an added gradient to the toolbar.

- The tabs on the documents have a corner bent down instead of the straight squares they were in FD2 which makes it a little more obvious which tab is on top. Speaking of tabs, when you click to drag one the page turns blue with 5 icons in the center. What I've discovered is that if you drag the tab into one of the icons the page tries to fill the related section of the interface; top icon fills the top half of the document interface, left fills left half, etc, with center filling the entire document interface again. Notice I said "tries to fill", it doesn't currently work but the blue area shows what is intended.

- The Find tool looks to have been improved significantly. No longer is there a separate Replace tool, it has been combined into the default Find (Ctrl+F). It has also added an additional dropdown, "Look in". Look in has the choices of "Full Source Code", "Code and Strings", "Comments Only", and "Strings Only".

- (Ctrl+I) still brings up the Find in Files, but this seems to have improved even more than the Find tool. First it also adds Replace so you can easily replace throughout several files. A results panel has also been added to the bottom of the tool so you can easily see all of the found files and easily open them without going to the Results panel at the bottom of FD.

- You no longer have to have a project open to get code completion. It seems to work just as well on an individual as file.

- A very cool feature that I stumbled upon and loved in PrimalScript is a built in browser! If you go to help and click on "FlashDevelop Home", the FD forum will load up in a new tab right in the interface.

- Under help there is a new link added as well, "Online Documentation". Looks like eventually we might have true documentation for FD :) The link (which hasn't added any real documentation yet) is: http://www.flashdevelop.org/wikidocs/index.php/Main_Page.

- File New adds the ability to choose the type of file you want to create, including different files for as3 and as2. It looks like you will be able to customize the default template of each eventually as well, but not positive at this point.

- Nothing seems to have been added to the Project panel yet. Can't wait for this one.

- Not seeing anything about svn or cvs integration.

- Quick MTASC Build is now called Quick Build. I'm assuming we'll be able to use it for mtasc builds for as2 and ant builds for as3, but not positive just guessing.

- A new tool has been added, "Application Files". Not exactly sure what it does yet, but it seems to default to opening up the FirstRun directory in an explorer window.

- Global Classpaths is removed from the Tools menu.

- All of the windows just seem so much nicer and more organized. A good example is the Program Settings window. It's no longer just a long list, but nicely sectioned off with shorter more standard names. Still no settings for code coloring, but we can hope.

- The panel on the right has added a Layouts tab, which I'm not sure about yet and the ActionScript tab has been renamed Outline which makes more sense. Maybe it will support other languages as well.

And that about covers it for now. There will definitely be more to talk about once the Project Panel supports as3 and flex... which looking at the TODO doc seems to be one of the major things left to implement. All in all it seems to be really shaping up and I can't wait until they release an actual alpha version to the public. Good job guys!

AS3 LuminicBox - ( Update )

| | Comments (3)

I didn't have strict mode errors turned on in the Flash 9 preview, so I didn't realize that the last release was giving a status event error when connecting to FlashInspector. I've updated the code to fix the problem. I've also added default values to the methods that were optional in the as2 version to make them optional in the as3 version as well.

Download it here.

LuminicBox.Log - AS3 Update

| | Comments (7)

I use LuminicBox.Log all of the time for AS2 projects and as I'm transitioning more and more to AS3 projects, I realized I really missed it. I took some time today and updated the classes and even the FlashInspector to AS3 (hopefully Pablo Costantini doesn't mind). I needed to update FlashInspector so that it could interpret some of the new AS3 types: root, stage, DisplayObject, XMLList, SimpleButton, etc). The documentation has been updated with asdoc as well. The flash example files that are included have been updated and only work from the Flash 9 Preview. Let me know if there's anything I missed or if you notice any bugs.

Updated AS3 version.

Original AS2 version.

charsets (for use with swfmill)

| | Comments (3)

I'm embedding fonts using swfmill in a project I'm currently working on and one of the more tedious tasks I went through was copying and pasting the individual characters I needed to make up the character sets to be used. Because of this, I thought it might be helpful to others to post the charsets in a way that would be easy to copy and paste. I will try to keep this page up to date and add more sets as I get the time.

Note: The sets are accurate to the best of my knowledge, but please use at your own risk.


ISO/IEC 8859-1:1998 Latin Alphabet No. 1

 !"#$%&'()*+,-./0123456789:;<=>?@ABCDEFGHIJKLMNOPQRSTUVWXYZ[\]^_`abcdefghijklmnopqrstuvwxyz{|}~ ¡¢£¤¥¦§¨©ª«¬­®¯°±²³´µ¶·¸¹º»¼½¾¿ÀÁÂÃÄÅÆÇÈÉÊËÌÍÎÏÐÑÒÓÔÕÖרÙÚÛÜÝÞßàáâãäåæçèéêëìíîïðñòóôõö÷øùúûüýþÿ


ISO/IEC 8859-2:1999 Latin Alphabet No. 2

 !"#$%&'()*+,-./0123456789:;<=>?@ABCDEFGHIJKLMNOPQRSTUVWXYZ[\]^_`abcdefghijklmnopqrstuvwxyz{|}~ Ą˘Ł¤ĽŚ§¨ŠŞŤŹ­Ž­Ż°ą˛ł´ľśˇ¸šşťź˝žżŔÁÂĂÄĹĆÇČÉĘËĚÍÎĎĐŃŇÓÔŐÖ×ŘŮÚŰÜÝŢßŕáâăäĺćçčéęëěíîďđńňóôőö÷řůúűüýţ˙

Made a few minor updates to my "Trace from the browser, using standard trace()" tutorial.

Metaliq Components and MTASC

| | Comments (4)

In my last post I briefly mentioned that I would discuss how to tweak the classes that are shipped with the latest version of the Metaliq component set to be compliant with mtasc. The steps that I will take assume that you have purchased a license of the Metaliq component set and have the latest version with the source code. It also assumes you already have mtasc and swfmill setup. If you don't know what these tools are, or how to set them up, you can go to their respective homepage or find numerous tutorials to help you get up to speed. I actually use FlashDevelop which comes pre setup with both of these tools. The following steps will create a project in FlashDevelop and allow you to start compiling the Metaliq components with mtasc. You should be able to easily translate this to Eclipse or other script editor of choice.

1) Create a new Library Project and name it "Metaliq". Make sure to check "Create directory for project".

2) In the Project Explorer, open up the properties panel for the project. Under "Test Movie", change the pulldown option to "New Window".

3) Go to the Build tab and delete the Post-Build Command Line text and hit Apply.

4) Go to the Compiler Options tab and click on IncludePackages. A button with a "..." will appear, click on that. Delete the text in that window and hit OK.

5) Set UseMain to true.

6) Set TraceMode to FlashOut. Hit OK and close out of the properties panel.

7) Find where your Metaliq source code is and copy the "com" folder over to the "classes" directory of your new project. Make sure to copy it and not move it since we will be editing the source.

8) From the Metaliq source, go to the "flas" directory and copy Button.fla to the "library" directory of your new project.

9) Open Button.fla in Flash (there should be nothing on the stage). Go to the publish settings and add the following class path: "../classes/" (without the quotes). Save, compile and close.

10) In the "classes" directory of your project, create a new class named "ButtonTest.as" and add the following code:

import com.metaliq.controls.Button;
import com.metaliq.skins.FocusRect;
import com.metaliq.skins.gskin1.ButtonBackground;
 
class ButtonTest {
 	// content holder
 	var content:MovieClip;
 	
 	function ButtonTest() {
  		// create dummy variables to pull in required classes for mtasc
  		var fr:FocusRect;
  		delete fr;
  		var bb:ButtonBackground;
  		delete bb;
  		
  		content = ButtonTest.parent.createEmptyMovieClip("content", 0);
  		
  		var sample_btn:Button = content.createClassObject(Button, "sample_btn", content.getNextHighestDepth(), {
   			icon:"icon1",
   			label:"Hello world!",
   			labelPlacement:"right",
   			selected:false,
   			toggle:true,
   			enabled:true,
   			visible:true,
   			minWidth:15,
   			minHeight:15,
   			_x:10,
   			_y:10,
   			_width:150
   		});
  		
  		configButton();
  	}
 	
 	private function configButton():Void {
  		content.sample_btn.addEventListener("click", onButtonClick);
  	}
 	
 	private function onButtonClick(evtObj:Object):Void {
  		if (evtObj.target._name == "sample_btn") {
   			trace("you clicked the button");
   		}
  	}
 	
 	
 	//{ APPLICATION INITIALIZATION
 	
 	static var application:ButtonTest;
 	static var parent:MovieClip
 	
 	/**
 	* Application entry point
 	*/
 	static function main(scope:MovieClip) {
  		parent = scope;
  		
  		// create the content
  		application = new ButtonTest();
  	}
}

If you look at the class above, you will notice a main method that gets called by mtasc. This main method creates an instance of the ButtonTest class which in turn begins the setup for instantiating a Metaliq component through code. We are using the createClassObject method to instantiate the Button component. The parameters passed are className, instanceName, depth, and an initObject which sets the defaults for the component. Besides the Button class, two other classes are imported in for mtasc. Once you get through with the following steps, remove those imports and the instantiations of those classes to see the error that mtasc throws. It will clearly ask you to force compilation of those classes. The easiest way to do that is by adding in the import statement for each class and then creating a reference to the class by instantiating it. I immediately delete the instance so it doesn't take up memory.

11) In FlashDevelop's Project Explorer, right-click on ButtonTest.as and select "Always Compile". And right-click on Button.swf and select "Add to Library".

These previous steps are the basis for setting up a project in FlashDevelop to compile with mtasc and swfmill. The next steps will be getting the Metaliq classes to compile with mtasc.

1) Hit F5 (Test Movie). You should see an error pop up. Double click on the error to bring up the class that is causing the error.

2) The error is "unknown variable" in FocusRect.as. If you look in the constructor, there is an onEnterFrame function. Within this function, a call to the draw method is made. The simplest way to fix this is to add "this." in front of "draw()" to scope the method properly.

3) Hit F5 again and then do the same for the next error.

4) The next error is "return type cannot be Void". If you double click on this error, it will open up UIObject to around line 90 within the glicInit method. If you notice, the return type for glicInit is Boolean but the first line returns nothing. mtasc doesn't like this. To fix it, change if (initted) to if (!initted) , delete the return and put the rest of the method within the brackets.

5) Your next error will go back to "unknown variable". You know how to fix these.

6) Another error you will get is "Object should be MovieClip". This is an easy one to fix. Wrap the object that is causing the error in MovieClip() to typecast it.

7) The next error is "Object should be String". Just add String() around the offending objects.

8) The next error is "unknown variable m". If you look above the error, you will see that m gets declared within an if statement. To fix the error, declare the m above the if statement and set m in the if statement.

9) The next time you hit F5, mtasc should finally compile nicely. The button probably will just be text at this point (text acting as a button with no background). To see the background behind the button, you have to do something very random. I have gone through and converted all of the classes to be mtasc-friendly and this was the only part that still doesn't make complete sense to me, but it works. In BaseButton.as, add the following code to around line 88:

public function set background(p_bg:String):Void { super.background = p_bg; };

For some reason, even though BaseButton extends UIObject, without the above statement the call to set background does not automatically go up the chain to UIObject without explicitly forcing it to. If you compile now, you should see the background behind the button. You now have a fully working example of a Metaliq component being compiled with mtasc.

10) Continue along with these steps and slowly and surely you will start to make headway through the rest of the classes. Be forewarned there are a lot of errors to fix to make the entire component set mtasc compliant. But once you do, your life will be much simpler and your compiling will be MUCH faster.

Enjoy and feel free to comment with questions below.

When the Metaliq components were first released, I quickly encouraged my company at the time to fork over the $400 so that we could FINALLY have some solid, light-weight Flash components. While, yes, they were light-weight and even pretty solid, I was extremely disappointed to find out that the source code was not included. What quickly became even more frustrating was that Metaliq, at the time, was not actively supporting the components. The documentation was sparse and, more importantly, Metaliq was not responding to any support questions or comments that quickly came up around the Flash community. Oh well... the purchase was already made and we needed to use the components so I made the best of it.

Close to a year later, I suddenly got an email in my inbox from someone at Metaliq. I quickly looked it over and found out that they were updating the documentation and asked if I wanted to review it. Nice..., a year late, but none-the-less nice. What's more, I could send questions and comments and he was responding... wow actual customer service... unbelievable.

This at least renewed my interest in the Metaliq components. So, when I got to my new company and we needed to work on a Flash 8 project (how it hurts to move backwards), I again encouraged the purchase of the set since the project called for several existing components and there's no need to use the bloated v2 set. And if nothing else, at least they're simple to skin. Once the purchase was approved and the components were delivered, I quickly opened them up and noticed something different... a folder labeled source. Could it be? Yes, It was! The latest release of the components comes with all of the classes and all of the flash source files! How nice!

Once I started looking through the source, I wondered something.... could we now compile the mCOM set with MTASC? I quickly set a project up in my editor of choice, FlashDevelop, hit compile and, unfortunately, MTASC complained. I looked at the error, decided to make a fix to the source, and tried again... another error. Damn. Oh well.

A couple of days later, I was talking with my friend Mark Llobrera and lo and behold, he was having the same problem. We quickly started tearing through the code, passing tips back and forth over IM, and within a few minutes had Button compiling with MTASC. Once we realized the MTASC-related problems in the code, they were simple to fix.

This post will not go into the details of how to fix the code, I'll cover that in my next post. I just wanted to let people know if they already own the component set, and have not done so yet, to request the latest from Metaliq. And, if you've been scared off in the past on purchasing the components and still have a lot of pre-Flash 9 work to do, I suggest giving them another try.

As of Flash Player version 9,0,28,0, Adobe has stopped using the mm.cfg file and changed the location of flashlog.txt.
I've updated my "Trace from the browser, using standard trace()" tutorial to reflect this change.

As I'm sure most people know, Fuse is finally out of beta.
I've been using the beta Fuse for a while now and its a great way to create advanced Flash motion tweens in no time.

One comment that seems to come up regularly in the forum and mailing list is that Fuse is too heavy. If not checked, Fuse can quickly get hefty, but if you follow a few guidelines you can easily keep Fuse at quite a small size for its amount of features.

The first thing to note about Fuse is that it provides a modular mix & match format with its classes. What this means is that it allows you to only publish and use the classes that you need. You can test this out by creating a new Flash movie and adding a square MovieClip with an instance name of "box" to the stage. Then add the following code on a new layer:

import com.mosesSupposes.fuse.*;
 
ZigoEngine.doTween(box, '_scale', 20, 2, mx.transitions.easing.Elastic.easeOut);

By not registering any additional classes, you have just compiled your movie with the basic classes needed to get started animating with Fuse (well technically ZigoEngine). This file should come out around 13kb. 13kb is not too shabby for the amount of functionality that ZigoEngine provides.

According to Moses, the brains behind Fuse, you should be able to get this filesize even smaller (to around 10kb) by excluding the trace actions in your publish settings. I personally haven't been able to successfully see a decrease, but if your under tight size constraints its a good tip to know about anyway.

In the example above, you should note that the easing function that I used is from the mx.transitions.easing set. By doing it this way, you only import the easing function that you will be using. This works with the com.robertpenner.easing classes as well. But if you think you will be using many different types of easing functions in your project, an easier way to import and use them is by registering all of the PennerEasing classes. Use the previous example and replace the code with the following:

import com.mosesSupposes.fuse.*;
 
ZigoEngine.register(PennerEasing);
ZigoEngine.doTween(box, '_scale', 20, 2, 'easeOutElastic');

This allows you to use a simpler syntax to call the easing methods, but does however add a bit more overhead to the swf. If you check the file now, it should be around 15kb. If you're under a tight size constraint and only need a couple of easing functions, go the first route, otherwise use this way for simplicity.

Another nice thing to know about is that you can use the FuseFMP functionality without using Fuse at all. FuseFMP allows you to quickly setup filters on your clips. To try this, use the same file as above but replace the code with the following:

import com.mosesSupposes.fuse.*;
 
FuseFMP.writeFilter(box, 'Blur', {blurX:10, blurY:0});
FuseFMP.setFilterProps(box, 'DropShadow', {distance:20, alpha:.5});

If you check out your filesize now, you'll be at around 6kb. If you only need to setup filters on your objects and not do any animation, this is a great way to go.

If you like the Fuse object syntax, but don't need all of Fuse's functionality you can register FuseItem much like you registered PennerEasing above. As a quick example, take the same file and replace the code with the following:

import com.mosesSupposes.fuse.*;
 
ZigoEngine.register(FuseItem);
ZigoEngine.doTween({ target:box, scale:20, ease:mx.transitions.easing.Elastic.easeOut, time:"02:00"});

This opens up some of Fuse's power, but also begins to open up some of Fuse's filesize as well. If you look at the file in finder or explorer now, the filesize should be around 22kb. Once you start getting up here though, you might as well start using the full functionality of Fuse. The next section is about that and how you can use Fuse in multiple swfs but only see the filesize hit once.

Once you decide to register Fuse and start using its full functionallity, you are instantly at 27k. This in itself wouldn't be too big of a deal if you had a large animation in a single Flash movie, but what if you are like me and build your sites and Flash projects using multiple swfs... if you want to use Fuse in all of those swfs you are instantly dealing with 27k in each and every swf. This adds up very quickly.

What if I told you there's a way to only get the 27k hit once but use Fuse in all of the swfs in your project? There is... using exclude xml files.

To test this, setup a new Flash movie and add a movieclip with a circle in it and name it "circle_mc". Place the circle somewhere in the center of the flash movie. On a new layer add the following code:

import com.mosesSupposes.fuse.*;
 
ZigoEngine.register(Fuse);
ZigoEngine.register(PennerEasing);
var f:Fuse = new Fuse();
f.push({target:circle_mc, x:-100, y:-100, seconds:.5, ease:"easeOutQuad"});
//f.push({scope:this, func:"loadSection"});
f.start();
 
function loadSection ():Void {
 	this.loadMovie("section.swf");
}

Ignore the commented line and the function for now and compile the movie. What you should see is a circle tweening off the stage to the top left. If you look at the swf in finder or explorer, you should see the filesize around 27 or 28k.

Please note, Fuse is a VERY advanced motion sequencer and the example I am showing you is VERY basic, for something this basic you would not even want to use Fuse.

Now, create another Flash movie and this time add a square in it and name it "square_mc". Place the square somewhere in the center of the flash movie. On a new layer add the following code:

import com.mosesSupposes.fuse.*;
 
ZigoEngine.register(Fuse);
ZigoEngine.register(PennerEasing);
var f:Fuse = new Fuse();
f.push({target:square_mc, x:Stage.width, y:Stage.height, seconds:1, ease:"easeOutBounce"});
f.start();

Make sure to save this movie as "section.fla" and compile it. This time you should see a square tween off to the bottom right. Again if you look in finder or explorer you will see section.swf weighing in around 27 or 28k. Now go back to the first movie and uncomment the commented line and recompile the movie. Now you should see the circle go off to the top left and then you should see the square go off to the bottom right.

Everythings working great, right? One problem... we're now dealing with Fuse in two seperate swfs but one project and the total weight is around 54 or 56k. Now imagine loading in 10 swfs all using Fuse... adds up pretty quick doesn't it?

The solution is to use an exclude xml file. An exclude xml file allows you to compile a swf without specific classes knowing that it will be able to pull those classes in from a container movie.
To make the exclude xml file, create an xml file and add the following into it:

<excludeAssets>
	<asset name="com.mosesSupposes.fuse.Fuse"/>
	<asset name="com.mosesSupposes.fuse.FuseFMP"/>
	<asset name="com.mosesSupposes.fuse.FuseItem"/>
	<asset name="com.mosesSupposes.fuse.FuseKitCommon"/>
	<asset name="com.mosesSupposes.fuse.PennerEasing"/>
	<asset name="com.mosesSupposes.fuse.Shortcuts"/>
	<asset name="com.mosesSupposes.fuse.ZigoEngine"/>
	<asset name="com.mosesSupposes.fuse.ZManager"/>
</excludeAssets>

Save the xml file as "section_exclude.xml". If you are going to use an exclude xml file it needs to be named exactly what the flash movie that you are trying to exclude classes from is named plus "_exclude.xml". Inside of the file, each Fuse class is listed as an asset to exclude from section.swf. Now compile section.fla. It compiles but no longer works. Go back to the first circle Flash movie and compile it again. Everything should work now. Circle moves off top left and square moves off bottom right. The square movie is able to pull in the Fuse classes from the circle container movie. Now look at finder or explorer and check out the filesize. The first movie is still around 27 or 28k but check out section.swf... it should be around 2k!! Not too shabby. This is a much more efficient way of loading multiple swfs using Fuse then the first option.

To make working with exclude xml files easier, check out the commands from Martijn Devisser. These commands allow you to compile without using the exclude xml file for testing purposes and then allow you to compile with the exclude xml file when you're ready to finalize the project. Makes life nice and easy :).

Penner AS2 ProFMX: Complete!!!

| | Comments (7)

Well, that's it!
I've made my way through Robert Penner's Programming Flash MX to the end and survived.
Every class from the book has now been converted from AS1 to AS2 and every example from the book has been shown working with these new classes.
It has taken me exactly 73 days (in my spare time) to complete since announcing the project on June 27th earlier this summer. A lot of times I thought about shelving it, but I really wanted to see it through to completion and I'm glad I did.
I hope that everyone out there gets some use out of these classes and I'll try and post some of my personal examples using them in a little while.
Thanks to Robert Penner for writing the book and giving me the green light on the project and thanks to everyone out there that has emailed or commented with your support. It was quite an undertaking but well worth it in the end.

Download:
Complete Penner AS2 ProFMX Classes and Documentation

Penner AS2 ProFMX: Cyclone Example

| | Comments (2)


After the cyclone above builds out, click and drag the small rotating plus sign to direct the storm. The Cyclone example uses the classes from the Chapter 14 Penner AS2 post.

To replicate this example:

1) Create a new Flash movie and then create a new Graphic named "particleGraphic".
2) Inside the Graphic, add a square 10px wide by 10px high. Rotate the square 45 degrees and then resize it to 3px wide by 11px high, x and y position at 0.
3) Outside the Graphic, select it on the Stage, center it over the registration point, give it a tint of 153, 153, 153, and convert it to a MovieClip so that the Graphic is now within a MovieClip. Name this MovieClip "Particle" and give it an instance name of "particle".
4) Select this MovieClip on the stage and convert it to another MovieClip. Name this clip "CyclonePath" and add the class linkage of "com.robertpenner.profmx.cyclone.CyclonePath". Also, give it an instance name of "path".
5) Within the CyclonePath MovieClip, add a layer above the particle named "actions" and put the following code:

this.init();

6) Back outside of the CyclonePath MovieClip, convert it to another MovieClip. Name this clip "CycloneOval" and add the class linkage of "com.robertpenner.profmx.cyclone.CycloneOval".
7) Within the CycloneOval MovieClip, add a layer above the path named "actions" and put the following code:

this.init();

8) Close all of these MovieClips and create a new MovieClip named "CycloneDragger" with a class linkage of "com.robertpenner.profmx.cyclone.CycloneDragger".
9) Within this MovieClip, add a 1px wide by 28px high line centered over the registration point. Duplicate this line and rotate it 90 degrees so you end up having crosshairs. Convert the crosshairs to a graphic named "crosshairs".
10) Outside of the crosshairs graphic, within the CycloneDragger MovieClip, give the crosshairs graphic an alpha of 65% and scale it to 70%. Add a new layer with a fully transparent oval centered over the registration point and crosshairs, 28px wide by 39px high. This will be used as the button for the dragger.
11) Outside of the CycloneDragger MovieClip, scale the clip to 35%, centered over the registration point horizontally, and vertically placed at 106 with an instance name of "p0".
12) Convert the CycloneDragger MovieClip to a new MovieClip named "Cyclone" with a class linkage of "com.robertpenner.profmx.cyclone.Cyclone".
13) You will now convert this Cyclone MovieClip to a component. Right-click on it in the library and select "Component Definition". In the window that pops up add the same class to the area that says "AS 2.0 Class:".
14) Give the Cyclone component that is currently on the stage an instance name of "cyclone" and scale it to 150% wide by 110% high and center it on the Stage so that both the registration point and dragger can be seen. Click on the Parameters tab to see the following component options: funnelHeight, maxParticles, speed, and stiffness. Play around with these options.
15) On the root timeline add the following code and compile:

this.cyclone.init();


Penner AS2 ProFMX: Chapter 14: Cyclone

| | Comments (0)

Chapter 14 of Robert Penner's Programming Flash MX is the final chapter of the book. This chapter includes classes to develop a cyclone particle system that bends towards a user-controlled dragger.

This chapter contains four classes: CyclonePath, CycloneOval, Cyclone and CycloneDragger, which will be included in the com.robertpenner.profmx.cyclone namespace.

Documentation:
com.robertpenner.profmx.cyclone.CyclonePath
com.robertpenner.profmx.cyclone.CycloneOval
com.robertpenner.profmx.cyclone.Cyclone
com.robertpenner.profmx.cyclone.CycloneDragger

Source:
Penner AS2 ProFMX: Chapter 14 Classes

Penner AS2 ProFMX: Fractal Dancer Example

| | Comments (1)


Click around above while the counter moves up to 150. Once it reaches 150, let go and the fractal tree will repeat the motions that you created as it recursively creates new branches. You can also change the 150 number to any other number that you would like. This is the Fractal Dancer example using the classes from the Chapter 13 Penner AS2 post.

You can download this example here.


Penner AS2 ProFMX: MotionCamera Example

| | Comments (0)


Click around above and then let go, whatever motion you created will be repeated until you start clicking again. This is an example using the MotionCamera class from the Chapter 13 Penner AS2 post

To replicate this example, add an oval shaped MovieClip to the stage with an instance name of "oval".
Then on the root timeline add the following code:

import com.robertpenner.effects.MotionCamera;
 
var xmouse_cam:MotionCamera = new MotionCamera (oval, "_xscale");
var ymouse_cam:MotionCamera = new MotionCamera (oval, "_y");
 
xmouse_cam.setActor (this, "_xmouse");
xmouse_cam.looping = true;
ymouse_cam.setActor (this, "_ymouse");
ymouse_cam.looping = true;
 
this.onMouseDown = function () {
 	with (xmouse_cam) {
  		eraseFilm();
  		rewind();
  		start();
  		startRecord();
  	}
 	with (ymouse_cam) {
  		eraseFilm();
  		rewind();
  		start();
  		startRecord();
  	}
};
 
this.onMouseUp = function () {
 	with (xmouse_cam) {
  		stopRecord();
  		cutFilm();
  		rewind();
  	}
 	with (ymouse_cam) {
  		stopRecord();
  		cutFilm();
  		rewind();
  	}
};
 
stop();


Penner AS2 ProFMX: Chapter 13: Fractal Dancer

| | Comments (0)

Chapter 13 of Robert Penner's Programming Flash MX is the third of the final four chapters of the book. This chapter includes a class that records motion and two other classes to develop a recursive fractal tree that bends and sways with user interaction.

This chapter contains three classes: MotionCamera, which will be included in the com.robertpenner.effects namespace, and FractalBranch and FractalTree, which will be included in the com.robertpenner.profmx.fractalTree namespace.

Documentation:
com.robertpenner.effects.MotionCamera
com.robertpenner.profmx.fractalTree.FractalBranch
com.robertpenner.profmx.fractalTree.FractalTree

Source:
Penner AS2 ProFMX: Chapter 13 Classes

Dependencies:
mx.transitions.Tween
mx.utils.Delegate

Penner AS2 ProFMX: Snowstorm Example

| | Comments (2)


Move around above and you will see the Snowstorm example using the classes from the Chapter 12 Penner AS2 post.

To replicate this example:

1) Create a new Flash movie and then create a MovieClip at (0, 0).
2) In this MovieClip, add a rectangle 400px wide by 300px high with the registration point at the top left of the rectangle.
3) This will be the boundingBox of the snow component. Give the MovieClip an instance name of "boundingBox".
4) Select this MovieClip on the stage and convert it to another MovieClip. Name this clip "snow" and add the class linkage of "com.robertpenner.profmx.snow.Snow". Also, give it an instance name of "snow".
5) You will now convert this MovieClip to a component. Right-click on it and select "Component Definition". In the window that pops up add the same class to the area that says "AS 2.0 Class:".
6) Click on the Parameters tab to see the following component options: fallSpeed, friction, maxFlakes, and zDepth. Play around with these options.
7) On the root timeline add the following code and compile:

this.snow.init();


Penner AS2 ProFMX: Chapter 12: Snowstorm

| | Comments (0)

Chapter 12 of Robert Penner's Programming Flash MX is the second of the final four chapters of the book. This chapter includes classes to develop a 3d snowstorm particle system with user controlled wind.

This chapter contains three classes: Snowflake, Snowstorm and Snow, which will be included in the com.robertpenner.profmx.snow namespace.

Documentation:
com.robertpenner.profmx.snow.Snowflake
com.robertpenner.profmx.snow.Snowstorm
com.robertpenner.profmx.snow.Snow

Source:
Penner AS2 ProFMX: Chapter 12 Classes

Dependencies:
Penner AS2 ProFMX: Chapter 5 Classes
Penner AS2 ProFMX: Chapter 3 Classes
mx.transitions.OnEnterFrameBeacon

Penner AS2 ProFMX: Aurora Borealis Example

| | Comments (0)


Move around above and you will see the Aurora Borealis example using the classes from the Chapter 11 Penner AS2 post.

To replicate this example:

1) Create a new Flash movie and then create a MovieClip.
2) In this MovieClip, add a rectangle 2.5px wide by 100px high with the registration point at the top center of the rectangle.
3) Fill the rectangle with a gradient 50% white alpha at the top and 0% white alpha at the bottom. This will be the Aurora Borealis particle.
4) Remove this MovieClip from the stage so that it is only in the library and then name it "auroraParticle" and add a class linkage of "com.robertpenner.profmx.auroraBorealis.AuroraParticle" to it.
5) Now add another blank MovieClip to the library and name it "auroraBorealis" and add the class linkage of "com.robertpenner.profmx.auroraBorealis.AuroraBorealis" to it.
6) You will now convert this MovieClip to a component. Right-click on it and select "Component Definition". In the window that pops up add the same class to the area that says "AS 2.0 Class:".
7) Now drag this component to the stage and place it at the top center.
8) Add an instance name of "auroraBorealis" to the component MovieClip and then click on the Parameters tab to see the component options. Play around with these options.
9) On the root timeline add the following code and compile:

this.auroraBorealis.init();


Penner AS2 ProFMX: PhysicsParticle Example

| | Comments (0)


Click around above and you will see an example using the ElasticForce, Force, and PhysicsParticle classes from the Chapter 11 Penner AS2 post

To replicate this example, add a circle MovieClip to the stage with an instance name of "ball".
Then on the root timeline add the following code:

import com.robertpenner.physics.PhysicsParticle;
import com.robertpenner.physics.forces.ElasticForce;
 
var p:PhysicsParticle = new PhysicsParticle(ball, ball._x, ball._y);
p.setFriction(.1);
var eForce:ElasticForce = new ElasticForce(130, 70, .2);
p.addForce("elastic", eForce);
 
this.onMouseDown = function() {
 	eForce.setAnchor(this._xmouse, this._ymouse);
}
 
stop();


Penner AS2 ProFMX: Chapter 11: Aurora Borealis

| | Comments (0)

Chapter 11 of Robert Penner's Programming Flash MX is the first of the final four chapters of the book and they are devoted to case studies. With each of these four chapters I will post about the converted classes and then follow it up with a post showcasing the case study. Chapter 11 builds upon the physics concepts from Chapter 8 and includes classes that help to encapsulate many of the physical forces that act upon objects and then builds upon those classes creating an effect that closely resembles the Aurora Borealis.

This chapter contains five classes: PhysicsParticle and Force, which will be included in the com.robertpenner.physics namespace, ElasticForce, which will be included in the com.robertpenner.physics.forces namespace, and AuroraParticle and AuroraBorealis, which will be included in the com.robertpenner.profmx.auroraBorealis namespace.

Documentation:
com.robertpenner.physics.PhysicsParticle
com.robertpenner.physics.Force
com.robertpenner.physics.forces.ElasticForce
com.robertpenner.profmx.auroraBorealis.AuroraParticle
com.robertpenner.profmx.auroraBorealis.AuroraBorealis

Source:
Penner AS2 ProFMX: Chapter 11 Classes

Dependencies:
Penner AS2 ProFMX: Chapter 4 Classes
Penner AS2 ProFMX: Chapter 3 Classes
mx.transitions.OnEnterFrameBeacon

Penner AS2 ProFMX: Minor Class Updates

| | Comments (0)

I made some minor updates to a few of the previous Penner AS2 classes:

Changes:
1) MathUtil added two new methods from the final chapters: randRangeFloat and randRangeInt.
2) Graphic3d added getter setter methods for the scale property.
3) WaveMotion fixed minor bug.
4) DrawingClip fixed minor bug.

Chapter 10 of Robert Penner's Programming Flash MX provides an extensive collection of custom methods that extends upon Flash's Drawing API, allowing for more complex shapes, including triangles, rectangles, polygons, and cubic beziers. Wrapping up this chapter completes the bulk of the book, with only the Case Studies left to convert.

This chapter contains one class: DrawingClip, which will be included in the com.robertpenner.display namespace.

Documentation:
com.robertpenner.display.DrawingClip

Source:
Penner AS2 ProFMX: Chapter 10 Classes

Update:
Please note: I also made a few minor updates to the color classes so if you already downloaded those, please download them again.

Chapter 9 of Robert Penner's Programming Flash MX provides an extensive collection of custom methods that allow for more intuitive color manipulation.

I have gone through and converted all of Penner's work to support not only the Color object, but also the ColorTransform object. So if you are using Flash 8, you have the choice of either workflows.
I have also tried to make the classes as flexible as possible to allow you to work with the Color and ColorTransform classes the way you like. For example, Color and ColorTransform each have a util class that allows you to pass in your respective object and decorate it with the new methods. They also each have an extended class that provides the new methods. And finally, they each have a class that allows you to decorate a particular MovieClip or all MovieClips with the new methods.

This chapter contains six classes, three based upon the Color object and another three based upon the ColorTransform object: ColorUtil and ColorTransformUtil, which will be included in the com.robertpenner.utils namespace, XColor and XColorTransform, which will be included in the com.robertpenner.graphics namespace, and ColorClip and ColorTransformClip, which will be included in the com.robertpenner.display namespace.

Documentation:
com.robertpenner.utils.ColorUtil
com.robertpenner.utils.ColorTransformUtil
com.robertpenner.graphics.XColor
com.robertpenner.graphics.XColorTransform
com.robertpenner.display.ColorClip
com.robertpenner.display.ColorTransformClip

Source:
Penner AS2 ProFMX: Chapter 9 Classes

Dependencies:
Color
flash.geom.ColorTransform

Penner AS2 ProFMX: Chapter 8: Physics

| | Comments (0)

We're moving directly from Chapter 5 to Chapter 8 of Robert Penner's Programming Flash MX.
We're skipping Chapter 6 because it's all about event-based programming and uses the old ASBroadcaster, so there's no need to go into it. If you're interested in event-based programming after reading the chapter and don't know much about it, look into mx.events.EventDispatcher, there's a ton of documentation out there on it.
We're also skipping Chapter 7 because it focuses on the Motion and Tween classes that Macromedia licensed from Penner and wrapped into one mx.transitions.Tween class, so no need to recreate that class, although we will need to use it for the class I have converted in Chapter 8. Penner himself converted the other classes from Chapter 7 to AS2: the now famous easing equations that you can download from his site.

Chapter 8 begins to delve into the world of physics. Most of the chapter focuses on using the Vector class with the core principles--velocity, acceleration, force--and the relationships between them.

This chapter contains only one class: WaveMotion, which will be included in the com.robertpenner.effects namespace.

Documentation:
com.robertpenner.effects.WaveMotion

Source:
Penner AS2 ProFMX: Chapter 8 Classes

Dependencies:
mx.transitions.Tween

Penner AS2 ProFMX: Updates Complete

| | Comments (1)

The packages for the Penner AS2 classes have been updated and my previous posts and documentation have been updated to reflect the changes. Below you will find a list of the changes that were made.

Changes:
1) The Vector and Vector3d classes have been moved from the com.robertpenner.vector package to the com.robertpenner.geom package.
2) There is no longer a com.robertpenner.vector package.
3) The Constant class no longer exists, it has been merged with the Utility class into the new MathUtil class.
4) The MathUtil, Degree, and Polar classes have been moved from the com.robertpenner.math package to the com.robertpenner.utils package.
5) There is no longer a com.robertpenner.math package.

Penner AS2 ProFMX: Package Updates

| | Comments (0)

There is always a fine line between how long you should devote to the planning stages of a project and when you just need to crank through stuff and get it out. With this Penner AS2 project that I've undertaken, I wanted to start releasing as soon as I made the announcement. Even though I had spent plenty of time up front thinking through the book and all the different classes that would need to be converted, I didn't give the package names that much forethought. Penner had already come up with most of the class names (although in certain circumstances I have tweaked the name where I thought appropriate), but in AS1 there was obviously no need to think through package names.

The package names I initially chose for the classes I've released to date made sense at first, but as I started moving my way through the book I found areas where I wasn't thinking broadly enough. I've decided to go back and update these packages to follow standards set in place by Macromedia (Adobe) for the naming conventions of their packages... and to be the most up-to-date, I have decided to follow the AS3 package conventions, which vary slightly from the Flash 8 package conventions.

The vector classes will now be under the geom package and the math classes will be under the utils package and some actual class names might be tweaked slightly as well.

As soon as I get everything updated (including the previous posts), I will make a new post with all of the details. Sorry for any inconvenience, but I think in the long-run this will make more sense and allow the robertpenner namespace to remain flexible.

Penner AS2 ProFMX: Vector3d Example

| | Comments (1)


Below you will find the updated code for the example at the end of Chapter 5 to show you how to use the two classes from the Chapter 5 Penner AS2 post.

Add the following code on the first frame of a blank MovieClip centered on the stage.
Make sure to have another MovieClip exported for ActionScript with the linkage name of "dot" in the library to be used as the actual 3d graphic.

import com.robertpenner.display.Graphic3d;
 
function getWallPoints (width:Number, height:Number, xDivisions:Number, yDivisions:Number):Array {
 	var x:Number;
 	var y:Number;
 	var z:Number;
 	var pts:Array = new Array();
 	var depth:Number = 0;
 	
 	for (var i:Number = 0; i <= xDivisions; i++) {
  		for (var j:Number = 0; j <= yDivisions; j++) {
   			x = width * (i / xDivisions - .5);
   			y = height * (j / yDivisions - .5);
   			z = 0;
   			pts.push(new Graphic3d(x, y, z, this, "dot", depth++));
   		}
  	}
 	return pts;
}
 
function arrayRotateXY (particleArr:Array, angleX:Number, angleY:Number):Void {
 	var i:Number = particleArr.length;
 	while (i--) {
  		particleArr[i].position.rotateXY(angleX, angleY);
  		particleArr[i].render();
  	}
}
 
var wall:Array = getWallPoints (100, 100, 4, 6);
 
this.onEnterFrame = function() {
 	this.arrayRotateXY (wall, _ymouse/20, _xmouse/20);
}


Chapter 5 of Robert Penner's Programming Flash MX extends upon what was learned in Chapter 4 by adding a third dimension to vectors.

This chapter contains two classes: Vector3d, which will be included in the com.robertpenner.geom namespace, and Graphic3d, which will be included in the com.robertpenner.display namespace.

Documentation:
com.robertpenner.geom.Vector3d
com.robertpenner.display.Graphic3d

Source:
Penner AS2 ProFMX: Chapter 5 Classes

Dependencies: