<?xml version="1.0" encoding="UTF-8"?>
<!-- generator="wordpress/2.3.3" -->
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	>

<channel>
	<title>{ P I X E L W E L D E R S } &#187; ActionScript 3.0</title>
	<link>http://pixelwelders.com/blog</link>
	<description>Flash + Flex + Game Dev + Grammar?</description>
	<pubDate>Mon, 16 Nov 2009 14:28:25 +0000</pubDate>
	<generator>http://wordpress.org/?v=2.3.3</generator>
	<language>en</language>
			<item>
		<title>AS3 RPG-Style Stats System</title>
		<link>http://pixelwelders.com/blog/game-design/2009/as3-rpg-style-stats-system/</link>
		<comments>http://pixelwelders.com/blog/game-design/2009/as3-rpg-style-stats-system/#comments</comments>
		<pubDate>Mon, 16 Nov 2009 14:27:18 +0000</pubDate>
		<dc:creator>Zack Jordan</dc:creator>
		
		<category><![CDATA[ActionScript 3.0]]></category>

		<category><![CDATA[Game Design]]></category>

		<guid isPermaLink="false">http://pixelwelders.com/blog/game-design/2009/as3-rpg-style-stats-system/</guid>
		<description><![CDATA[For the past two months or so, I've been hard at work on a game that I hope to unleash upon the world next month. Truth be told, I'm a bit nervous since I've been getting more and more ambitious as I develop. That's something they tell you never to do. Choose a scope and stick with it, they say. It's great advice, but I have so far failed to follow it.]]></description>
			<content:encoded><![CDATA[<h3>Background</h3>
<p><img style="margin-left:10px; float:right;" src='http://pixelwelders.com/blog/wp-content/uploads/2009/11/babystats_full.jpg' alt='Baby Stats' /><br />
For the past two months or so, I&#8217;ve been hard at work on a game that I hope to unleash upon the world next month. Truth be told, I&#8217;m a bit nervous since I&#8217;ve been getting more and more ambitious as I develop. That&#8217;s something they tell you never to do. Choose a scope and stick with it, they say. It&#8217;s great advice, but I have so far failed to follow it.</p>
<p>	I&#8217;ve also recently become involved with <a href="http://gademo.wordpress.com" onclick="javascript:pageTracker._trackPageview('/outbound/article/http://gademo.wordpress.com');">GaDeMo</a>, which is kinda like <a href="http://nanowrimo.com" onclick="javascript:pageTracker._trackPageview('/outbound/article/http://nanowrimo.com');">NaNoWriMo</a> for games. Right now it&#8217;s just a few of us from the <a href="http://gamedev.meetup.com/174" onclick="javascript:pageTracker._trackPageview('/outbound/article/http://gamedev.meetup.com/174');">Chicago Experimental Game Meetup</a>, but I&#8217;m guessing it&#8217;ll grow. Anyway, working on two games at once naturally makes you think a bit differently. You build things a bit more generically because you want to cram it into two different projects simultaneously. At least I do.</p>
<p>	All the GaDeMo stuff will eventually be open-sourced, but I figured I&#8217;d get a head start on it here and on the GaDeMo blog. I&#8217;ve published this over there already, but why not put it here too? Surely someone here will find this useful as well.</p>
<h3>The System</h3>
<p>	This is a stats system for RPG-like tracking of character or item characteristics. It&#8217;s half a dozen simple classes, but it&#8217;s built to be expanded in the future. Here&#8217;s an example use. Say I&#8217;ve got a party of characters. Programmatically speaking, each one is probably an instance of some kind of Character class, and each one will have a variety of stats. One solution would be to extend the Character class in various directions and just add your stats as properties of those descendant classes. Of course, then you have a lot of classes that do nearly the same thing, and you have nothing reusable for future games.</p>
<p>	A better solution would be to have some sort of object that each Character could instantiate, which would then hold all that Character&#8217;s stats. You could do this with a generic Object if you wanted; however, then all manipulation of stats would have to be done either in the Character or in some external class that has access to the Character&#8217;s stats. Then you&#8217;ve got logic spread all over the place, which is again not a good solution.</p>
<h3>Implementation</h3>
<p>	But what if this stats object could take care of stat management too? For example:</p>

<div class="wp_syntax"><div class="code"><pre class="actionscript">	<span style="color: #000000; font-weight: bold;">var</span> stats:Stats = <span style="color: #000000; font-weight: bold;">new</span> Stats<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
	stats.<span style="color: #006600;">addStat</span><span style="color: #66cc66;">&#40;</span> <span style="color: #000000; font-weight: bold;">new</span> Stat<span style="color: #66cc66;">&#40;</span> StandardStats.<span style="color: #006600;">HP</span>, <span style="color: #cc66cc;">0</span>, <span style="color: #cc66cc;">100</span> <span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#41;</span>;</pre></div></div>

<p>	This creates a stats object, and then adds a stat called HP with a lower limit of 0 and an upper limit of 100. Now, anytime you want to see how many hit points this character has, you can call:</p>

<div class="wp_syntax"><div class="code"><pre class="actionscript">	stats.<span style="color: #006600;">getStat</span><span style="color: #66cc66;">&#40;</span> StandardStats.<span style="color: #006600;">HP</span> <span style="color: #66cc66;">&#41;</span>;</pre></div></div>

<p>	Okay, that&#8217;s pretty simple stuff. It&#8217;s one step up from a generic object. But in your typical RPG, you&#8217;ll notice that pretty much everything affects your stats. Most of the items in your inventory probably affect them one way or another, battle affects them, spells affect them, the list goes on. Say, for example, our Character has armor that adds 10% to his HP, and a sword that adds +2 HP.</p>

<div class="wp_syntax"><div class="code"><pre class="actionscript">	stats.<span style="color: #006600;">getStat</span><span style="color: #66cc66;">&#40;</span> StandardStats.<span style="color: #006600;">HP</span> <span style="color: #66cc66;">&#41;</span>.<span style="color: #006600;">addAffector</span><span style="color: #66cc66;">&#40;</span> <span style="color: #000000; font-weight: bold;">new</span> AdditionAffector<span style="color: #66cc66;">&#40;</span> <span style="color: #ff0000;">&quot;Sword of Justice +2 HP&quot;</span>, <span style="color: #cc66cc;">2</span> <span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#41;</span>;
	stats.<span style="color: #006600;">getStat</span><span style="color: #66cc66;">&#40;</span> StandardStats.<span style="color: #006600;">HP</span> <span style="color: #66cc66;">&#41;</span>.<span style="color: #006600;">addAffector</span><span style="color: #66cc66;">&#40;</span> <span style="color: #000000; font-weight: bold;">new</span> MultiplierAffector<span style="color: #66cc66;">&#40;</span> <span style="color: #ff0000;">&quot;Armor of Punctuality +10%&quot;</span>, <span style="color: #cc66cc;">0.1</span> <span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#41;</span>;</pre></div></div>

<p>	Now there are two ways to check your stat.</p>

<div class="wp_syntax"><div class="code"><pre class="actionscript">	stats.<span style="color: #006600;">getStat</span><span style="color: #66cc66;">&#40;</span> StandardStats.<span style="color: #006600;">HP</span> <span style="color: #66cc66;">&#41;</span>.<span style="color: #006600;">baseValue</span> 	<span style="color: #808080; font-style: italic;">// before Affectors</span>
	stats.<span style="color: #006600;">getStat</span><span style="color: #66cc66;">&#40;</span> StandardStats.<span style="color: #006600;">HP</span> <span style="color: #66cc66;">&#41;</span>.<span style="color: #006600;">totalValue</span>		<span style="color: #808080; font-style: italic;">// after Affectors</span></pre></div></div>

<p>	This gives you the freedom to specify how items affect stats. Perhaps a certain curse ignores all Affectors. Maybe an item does something randomly using a base stat instead of a total stat. Whatever. It&#8217;s up to the the developer.</p>
<h3>Future Plans</h3>
<p>	Now obviously this is a ridiculously simple implementation. I imagine it will grow quite a bit as I develop these two games, and probably future games as well. The next steps, I think, would involve integrating an Inventory system and maybe a Skills system of some sort. The end dream would be to just add an item or skill or whatever you want and the stats just kinda take care of themselves. A system like this, really fleshed out, could save a game developer a lot of time.</p>
<h3>Download</h3>
<p><a href="http://pixelwelders.com/downloads/StatsSystem/PXW_StatsSystem.zip" onclick="javascript:pageTracker._trackPageview('/downloads/downloads/StatsSystem/PXW_StatsSystem.zip');">PXW Stats System v0.1</a></p>
]]></content:encoded>
			<wfw:commentRss>http://pixelwelders.com/blog/game-design/2009/as3-rpg-style-stats-system/feed/</wfw:commentRss>
		</item>
		<item>
		<title>Barebones! - AS3 Skeletal Animation System</title>
		<link>http://pixelwelders.com/blog/game-design/2008/barebones-as3-skeletal-animation-system/</link>
		<comments>http://pixelwelders.com/blog/game-design/2008/barebones-as3-skeletal-animation-system/#comments</comments>
		<pubDate>Tue, 04 Nov 2008 14:18:04 +0000</pubDate>
		<dc:creator>Zack Jordan</dc:creator>
		
		<category><![CDATA[ActionScript 3.0]]></category>

		<category><![CDATA[Game Design]]></category>

		<category><![CDATA[Projects]]></category>

		<guid isPermaLink="false">http://pixelwelders.com/blog/game-design/2008/barebones-as3-skeletal-animation-system/</guid>
		<description><![CDATA[I&#8217;ve been spending a lot of time lately working on a fighting game for a client.  It&#8217;s pretty standard Street Fighter fare, only much simplified due to time and budget restrictions.  However, it made me start thinking about the limitations of the old 2D fighters and what a more powerful processor, faster graphics, [...]]]></description>
			<content:encoded><![CDATA[<p>I&#8217;ve been spending a lot of time lately working on a fighting game for a client.  It&#8217;s pretty standard Street Fighter fare, only much simplified due to time and budget restrictions.  However, it made me start thinking about the limitations of the old 2D fighters and what a more powerful processor, faster graphics, and a WYSIWYG animation editor could do for them.  I went to my lab immediately.</p>
<p>The first thing I wanted to know was, is there a way to make an animation that can be shared among characters in a game?  And could characters be &#8220;skinned,&#8221; so the same character could change appearances, add/remove body parts or attachments, etc. and retain the same animations?  I see it all the time in big-budget 3D games; each character has a skeleton, to which animations may be applied.  Each animation can be applied to any character, and each character can use any 3D character model (each of which can of course be &#8220;skinned&#8221;).  So you have three components in the system:</p>
<ul>
<li>Skeleton</li>
<li>Animation</li>
<li>Skin</li>
</ul>
<p>Never having been involved with a big-budget game, I can&#8217;t tell you the best way to design a system like that.  However, as a Flash developer, I <em>can</em> find a good way to do it in 2D, in your browser.</p>

<object	type="application/x-shockwave-flash"
			data="http://pixelwelders.com/experiments/barebones/v3/barebones.swf"
			width="750"
			height="300">
	<param name="movie" value="http://pixelwelders.com/experiments/barebones/v3/barebones.swf" />
</object>
<p>This is a quick example of the system (v0.1) in action.  This looks like a timeline animation, but it&#8217;s actually done with code.  To prove it, click the stage to toggle the animation speed.  Notice that it slows down to &#8220;bullet time,&#8221; but totally smoothly, without the jerkiness of a frame-based animation going down to 3 fps.  Also, because of how the system is designed, it can be combined with a physics engine (Box2D, for example) for ragdoll falls from any point in the animation.  Think of the possibilities!</p>
<p>Anyway, just wanted to put that out there.  I&#8217;ve got a couple projects in line first, but I&#8217;d like to explore this further to see what kind of gameplay could come of it.</p>
]]></content:encoded>
			<wfw:commentRss>http://pixelwelders.com/blog/game-design/2008/barebones-as3-skeletal-animation-system/feed/</wfw:commentRss>
		</item>
		<item>
		<title>Flash/Flex Integration: SWFLibrary v1.5</title>
		<link>http://pixelwelders.com/blog/best-practices/2008/flashflex-integration-swflibrary-v15/</link>
		<comments>http://pixelwelders.com/blog/best-practices/2008/flashflex-integration-swflibrary-v15/#comments</comments>
		<pubDate>Wed, 20 Aug 2008 01:28:48 +0000</pubDate>
		<dc:creator>Zack Jordan</dc:creator>
		
		<category><![CDATA[ActionScript 3.0]]></category>

		<category><![CDATA[Best Practices]]></category>

		<category><![CDATA[Flex]]></category>

		<category><![CDATA[Actionscript]]></category>

		<category><![CDATA[Flash/Flex Integration]]></category>

		<guid isPermaLink="false">http://pixelwelders.com/blog/best-practices/2008/flashflex-integration-swflibrary-v15/</guid>
		<description><![CDATA[
Usually I like to post glamorous stuff, like 3D swirly things and experiments.  Occasionally, however, I feel the need to release a little code in the interest of helping a few people out.  This code is a review of sorts, since I already posted a similar utility back in June.  However, since [...]]]></description>
			<content:encoded><![CDATA[<p><img src="http://pixelwelders.com/blog/wp-content/themes/tma/images/latest/SWFLibrary_470x175.jpg"/ style="float:none"></p>
<p>Usually I like to post glamorous stuff, like 3D swirly things and experiments.  Occasionally, however, I feel the need to release a little code in the interest of helping a few people out.  This code is a review of sorts, since I already posted a <a href="http://pixelwelders.com/blog/best-practices/2008/runtime-libraries-in-as3/" >similar utility</a> back in June.  However, since then I have been expanding my code library and I thought I&#8217;d share the latest and much improved version.  It&#8217;s really a simple concept, but having this in my toolbox has lightened my workload as an ActionScripter considerably.</p>
<h3>Advantages</h3>
<p>This utility allows you to publish any symbol from Flash and access it at runtime from an ActionScript-only project, such as in Flex Builder.  This has a few advantages:</p>
<ul>
<li>Easy storage of many assets in one file</li>
<li>Ability to change graphics without recompiling the main application</li>
<li>Faster load times with only one HTTP request (as opposed to many separate images and sounds)</i>
<li>Ability to import vector graphics and animations at runtime</li>
<li>Smaller main SWF size</li>
</ul>
<p>The one disadvantage that I can think of is that you&#8217;ll need to recompile your library SWF every time you make a change.  However, I think the advantages above outweigh this.</p>
<h3>Differences in v1.5</h3>
<p>Here are the main differences from the last version:</p>
<ul>
<li>The class is no longer static.  This allows for more than one instance of SWFLibrary at a time.</li>
<li>The class can now return instances of Sprites, MovieClips, and Sounds from a library SWF.</li>
</ul>
<h3>Usage</h3>
<p>1 - In Flash, select &#8220;Export for ActionScript&#8221; in the symbol&#8217;s Linkage settings in the Library (ex. &#8216;Character&#8217;).<br />
2 - Publish the Flash file as a SWF.<br />
3 - Load the SWF into an instance of SWFLibrary<br />
4 - Access the symbol through SWFLibrary, using the class name chosen in Step 1.</p>
<p>A SWFLibrary can be used with four lines of code.  Here&#8217;s what you&#8217;ll need:</p>

<div class="wp_syntax"><div class="code"><pre class="actionscript"><span style="color: #808080; font-style: italic;">// creates an instance of SWFLibrary, adds a listener, and loads a SWF</span>
<span style="color: #000000; font-weight: bold;">var</span> gameAssets:SWFLibrary = <span style="color: #000000; font-weight: bold;">new</span> SWFLibrary
gameAssets.<span style="color: #006600;">addEventListener</span><span style="color: #66cc66;">&#40;</span> Event.<span style="color: #006600;">COMPLETE</span>, handleAssetsLoaded <span style="color: #66cc66;">&#41;</span>;
gameAssets.<span style="color: #0066CC;">load</span><span style="color: #66cc66;">&#40;</span> <span style="color: #ff0000;">&quot;myCustomGameAssets.swf&quot;</span> <span style="color: #66cc66;">&#41;</span>;
&nbsp;
<span style="color: #808080; font-style: italic;">// accesses the asset (assumes there is a symbol exported as 'Character' in the loaded SWF, as seen in step 1 above)</span>
<span style="color: #808080; font-style: italic;">// this code should run after the Event above has fired</span>
<span style="color: #000000; font-weight: bold;">var</span> mySprite:Sprite = gameAssets.<span style="color: #006600;">getSprite</span><span style="color: #66cc66;">&#40;</span> <span style="color: #ff0000;">&quot;Character&quot;</span> <span style="color: #66cc66;">&#41;</span>;
addChild<span style="color: #66cc66;">&#40;</span> mySprite <span style="color: #66cc66;">&#41;</span>;
&nbsp;
<span style="color: #808080; font-style: italic;">// gets the asset as a MovieClip (assuming, of course, that it actually is a movieclip)</span>
<span style="color: #000000; font-weight: bold;">var</span> myMC:<span style="color: #0066CC;">MovieClip</span> = gameAssets.<span style="color: #006600;">getSprite</span><span style="color: #66cc66;">&#40;</span> <span style="color: #ff0000;">&quot;Character&quot;</span> <span style="color: #66cc66;">&#41;</span>;
addChild<span style="color: #66cc66;">&#40;</span> myMC <span style="color: #66cc66;">&#41;</span>;
&nbsp;
<span style="color: #808080; font-style: italic;">// getting a sound</span>
<span style="color: #000000; font-weight: bold;">var</span> mySound:<span style="color: #0066CC;">Sound</span> = gameAssets.<span style="color: #006600;">getSound</span><span style="color: #66cc66;">&#40;</span> <span style="color: #ff0000;">&quot;SoundLinkageNameHere&quot;</span> <span style="color: #66cc66;">&#41;</span>;
mySound.<span style="color: #0066CC;">play</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
<span style="color: #808080; font-style: italic;">// === ===</span></pre></div></div>

<p>After a symbol has been retrieved from SWFLibrary, it may be treated like any other object.</p>
<h3>Download</h3>
<p><a href="http://pixelwelders.com/open_source/SWFLibrary/SWFLibrary.zip" onclick="javascript:pageTracker._trackPageview('/downloads/open_source/SWFLibrary/SWFLibrary.zip');">DOWNLOAD SOURCE</a></p>
<p>So have fun with this.  Hopefully it saves you as much time as it saves me.</p>
]]></content:encoded>
			<wfw:commentRss>http://pixelwelders.com/blog/best-practices/2008/flashflex-integration-swflibrary-v15/feed/</wfw:commentRss>
		</item>
		<item>
		<title>FIVe3D Custom Primitive: VectorCube Class</title>
		<link>http://pixelwelders.com/blog/actionscript-3/2008/five3d-custom-primitive-vectorcube-class/</link>
		<comments>http://pixelwelders.com/blog/actionscript-3/2008/five3d-custom-primitive-vectorcube-class/#comments</comments>
		<pubDate>Thu, 17 Jul 2008 22:48:09 +0000</pubDate>
		<dc:creator>Zack Jordan</dc:creator>
		
		<category><![CDATA[3D]]></category>

		<category><![CDATA[ActionScript 3.0]]></category>

		<category><![CDATA[FIVe3D]]></category>

		<guid isPermaLink="false">http://pixelwelders.com/blog/actionscript-3/2008/five3d-custom-primitive-vectorcube-class/</guid>
		<description><![CDATA[After a long Papervision-induced hiatus, I've come back to FIVe3D- mainly because I still think it's a great library.  Since it's still relatively new, however, there's not a lot of example code out there.  Thus, here's another chunk from your friends here at Pixelwelders.]]></description>
			<content:encoded><![CDATA[<p>After a long Papervision-induced hiatus, I&#8217;ve come back to FIVe3D- mainly because I still think it&#8217;s a great library.  Since it&#8217;s still relatively new, however, there&#8217;s not a lot of example code out there.  Thus, here&#8217;s another chunk from your friends here at Pixelwelders.  This class creates a cube out of Sprite3D planes.</p>
<h3>Fig. 1: 27 Cubes</h3>

<object	type="application/x-shockwave-flash"
			data="http://pixelwelders.com/experiments/FIVe3D_cube/RubiksCube.swf"
			width="700"
			height="450">
	<param name="movie" value="http://pixelwelders.com/experiments/FIVe3D_cube/RubiksCube.swf" />
</object>
<h3>Fig.2: The VectorCube Class</h3>

<div class="wp_syntax"><div class="code"><pre class="actionscript"><span style="color: #808080; font-style: italic;">/**
 * A vector Cube class for Mathieu Badimon's excellent FIVe3D library
 * @author Zack Jordan
 * { P I X E L W E L D E R S . C O M }
 */</span>
package com.<span style="color: #006600;">pixelwelders</span>.<span style="color: #006600;">five3d</span>
<span style="color: #66cc66;">&#123;</span>
	<span style="color: #0066CC;">import</span> five3D.<span style="color: #006600;">display</span>.<span style="color: #006600;">Sprite3D</span>;
&nbsp;
	<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">class</span> VectorCube <span style="color: #0066CC;">extends</span> Sprite3D
	<span style="color: #66cc66;">&#123;</span>
&nbsp;
		<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">var</span> faces		: <span style="color: #0066CC;">Array</span>;
&nbsp;
		<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">function</span> VectorCube<span style="color: #66cc66;">&#40;</span> <span style="color: #0066CC;">size</span>:<span style="color: #0066CC;">Number</span>, colors:<span style="color: #0066CC;">Array</span> = <span style="color: #000000; font-weight: bold;">null</span> <span style="color: #66cc66;">&#41;</span>
		<span style="color: #66cc66;">&#123;</span>
			<span style="color: #0066CC;">super</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
&nbsp;
			<span style="color: #b1b100;">if</span> <span style="color: #66cc66;">&#40;</span> <span style="color: #66cc66;">!</span>colors <span style="color: #66cc66;">&#41;</span> colors = <span style="color: #66cc66;">&#91;</span> 0xFF0000, 0xFF0000, 0xFF0000, 0xFF0000, 0xFF0000, 0xFF0000 <span style="color: #66cc66;">&#93;</span>;
			createCube<span style="color: #66cc66;">&#40;</span> <span style="color: #0066CC;">size</span>, colors <span style="color: #66cc66;">&#41;</span>;
		<span style="color: #66cc66;">&#125;</span>
&nbsp;
		<span style="color: #808080; font-style: italic;">/**
		 * Creates a new cube at the size specified
		 * 
		 * @param		size			Size of the cube to be created
		 * @return					The new cube
		 */</span>
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">function</span> createCube<span style="color: #66cc66;">&#40;</span> <span style="color: #0066CC;">size</span>:<span style="color: #0066CC;">Number</span>, colors:<span style="color: #0066CC;">Array</span> <span style="color: #66cc66;">&#41;</span>: <span style="color: #0066CC;">void</span>
		<span style="color: #66cc66;">&#123;</span>
			faces = <span style="color: #000000; font-weight: bold;">new</span> <span style="color: #0066CC;">Array</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
&nbsp;
			<span style="color: #000000; font-weight: bold;">var</span> xP:<span style="color: #0066CC;">Array</span> = <span style="color: #000000; font-weight: bold;">new</span> <span style="color: #0066CC;">Array</span><span style="color: #66cc66;">&#40;</span>	<span style="color: #cc66cc;">0</span>, <span style="color: #0066CC;">size</span> <span style="color: #66cc66;">/</span> <span style="color: #cc66cc;">2</span>,	<span style="color: #cc66cc;">0</span>, -<span style="color: #0066CC;">size</span> <span style="color: #66cc66;">/</span> <span style="color: #cc66cc;">2</span>, <span style="color: #cc66cc;">0</span>, <span style="color: #cc66cc;">0</span> <span style="color: #66cc66;">&#41;</span>;
			<span style="color: #000000; font-weight: bold;">var</span> yP:<span style="color: #0066CC;">Array</span> = <span style="color: #000000; font-weight: bold;">new</span> <span style="color: #0066CC;">Array</span><span style="color: #66cc66;">&#40;</span>	<span style="color: #cc66cc;">0</span>, <span style="color: #cc66cc;">0</span>,	<span style="color: #cc66cc;">0</span>, <span style="color: #cc66cc;">0</span>,	-<span style="color: #0066CC;">size</span> <span style="color: #66cc66;">/</span> <span style="color: #cc66cc;">2</span>, <span style="color: #0066CC;">size</span> <span style="color: #66cc66;">/</span> <span style="color: #cc66cc;">2</span> <span style="color: #66cc66;">&#41;</span>;
			<span style="color: #000000; font-weight: bold;">var</span> zP:<span style="color: #0066CC;">Array</span> = <span style="color: #000000; font-weight: bold;">new</span> <span style="color: #0066CC;">Array</span><span style="color: #66cc66;">&#40;</span>	-<span style="color: #0066CC;">size</span> <span style="color: #66cc66;">/</span> <span style="color: #cc66cc;">2</span>, <span style="color: #cc66cc;">0</span>, <span style="color: #0066CC;">size</span> <span style="color: #66cc66;">/</span> <span style="color: #cc66cc;">2</span>, <span style="color: #cc66cc;">0</span>, <span style="color: #cc66cc;">0</span>, <span style="color: #cc66cc;">0</span>	<span style="color: #66cc66;">&#41;</span>;
			<span style="color: #000000; font-weight: bold;">var</span> xR:<span style="color: #0066CC;">Array</span> = <span style="color: #000000; font-weight: bold;">new</span> <span style="color: #0066CC;">Array</span><span style="color: #66cc66;">&#40;</span>	<span style="color: #cc66cc;">0</span>, <span style="color: #cc66cc;">0</span>,	<span style="color: #cc66cc;">0</span>, <span style="color: #cc66cc;">0</span>, <span style="color: #cc66cc;">-90</span>, <span style="color: #cc66cc;">90</span> <span style="color: #66cc66;">&#41;</span>;
			<span style="color: #000000; font-weight: bold;">var</span> yR:<span style="color: #0066CC;">Array</span> = <span style="color: #000000; font-weight: bold;">new</span> <span style="color: #0066CC;">Array</span><span style="color: #66cc66;">&#40;</span>	<span style="color: #cc66cc;">0</span>, <span style="color: #cc66cc;">-90</span>, <span style="color: #cc66cc;">180</span>, <span style="color: #cc66cc;">90</span>,	<span style="color: #cc66cc;">0</span>, <span style="color: #cc66cc;">0</span> <span style="color: #66cc66;">&#41;</span>;
			<span style="color: #000000; font-weight: bold;">var</span> zR:<span style="color: #0066CC;">Array</span> = <span style="color: #000000; font-weight: bold;">new</span> <span style="color: #0066CC;">Array</span><span style="color: #66cc66;">&#40;</span>	<span style="color: #cc66cc;">0</span>, <span style="color: #cc66cc;">0</span>,	<span style="color: #cc66cc;">0</span>, <span style="color: #cc66cc;">0</span>, <span style="color: #cc66cc;">0</span>, <span style="color: #cc66cc;">0</span> <span style="color: #66cc66;">&#41;</span>;
&nbsp;
			<span style="color: #b1b100;">for</span> <span style="color: #66cc66;">&#40;</span> <span style="color: #000000; font-weight: bold;">var</span> i:<span style="color: #0066CC;">int</span> = <span style="color: #cc66cc;">0</span>; i <span style="color: #66cc66;">&lt;</span> <span style="color: #cc66cc;">6</span>; i++ <span style="color: #66cc66;">&#41;</span>
			<span style="color: #66cc66;">&#123;</span>
				<span style="color: #000000; font-weight: bold;">var</span> face:Sprite3D = <span style="color: #000000; font-weight: bold;">new</span> Sprite3D<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
				face.<span style="color: #006600;">graphics3D</span>.<span style="color: #0066CC;">lineStyle</span><span style="color: #66cc66;">&#40;</span> <span style="color: #cc66cc;">1</span>, 0x000000, <span style="color: #cc66cc;">1</span> <span style="color: #66cc66;">&#41;</span>;
				face.<span style="color: #006600;">graphics3D</span>.<span style="color: #0066CC;">beginFill</span><span style="color: #66cc66;">&#40;</span> colors<span style="color: #66cc66;">&#91;</span> i <span style="color: #66cc66;">&#93;</span> <span style="color: #66cc66;">&#41;</span>;
				face.<span style="color: #006600;">graphics3D</span>.<span style="color: #006600;">drawRect</span><span style="color: #66cc66;">&#40;</span> -<span style="color: #0066CC;">size</span> <span style="color: #66cc66;">/</span> <span style="color: #cc66cc;">2</span>, -<span style="color: #0066CC;">size</span> <span style="color: #66cc66;">/</span> <span style="color: #cc66cc;">2</span>, <span style="color: #0066CC;">size</span>, <span style="color: #0066CC;">size</span> <span style="color: #66cc66;">&#41;</span>;
				face.<span style="color: #006600;">graphics3D</span>.<span style="color: #0066CC;">endFill</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
				face.<span style="color: #006600;">singleSided</span> = <span style="color: #000000; font-weight: bold;">true</span>;
&nbsp;
				face.<span style="color: #006600;">x</span> = xP<span style="color: #66cc66;">&#91;</span> i <span style="color: #66cc66;">&#93;</span>;
				face.<span style="color: #006600;">y</span> = yP<span style="color: #66cc66;">&#91;</span> i <span style="color: #66cc66;">&#93;</span>;
				face.<span style="color: #006600;">z</span> = zP<span style="color: #66cc66;">&#91;</span> i <span style="color: #66cc66;">&#93;</span>;
				face.<span style="color: #006600;">rotationX</span> = xR<span style="color: #66cc66;">&#91;</span> i <span style="color: #66cc66;">&#93;</span>;
				face.<span style="color: #006600;">rotationY</span> = yR<span style="color: #66cc66;">&#91;</span> i <span style="color: #66cc66;">&#93;</span>;
				face.<span style="color: #006600;">rotationZ</span> = zR<span style="color: #66cc66;">&#91;</span> i <span style="color: #66cc66;">&#93;</span>;
&nbsp;
				faces<span style="color: #66cc66;">&#91;</span> i <span style="color: #66cc66;">&#93;</span> = face;
				addChild<span style="color: #66cc66;">&#40;</span> face <span style="color: #66cc66;">&#41;</span>;
			<span style="color: #66cc66;">&#125;</span>
&nbsp;
		<span style="color: #66cc66;">&#125;</span>
&nbsp;
	<span style="color: #66cc66;">&#125;</span>
<span style="color: #66cc66;">&#125;</span></pre></div></div>

<p>So what is this good for?  Really, it&#8217;s just an easy way to create six faces and arrange them into a cube.  You don&#8217;t have to worry about depth sorting or any of that stuff because each of the faces is one-sided.  However, if you are using more than one of these in your presentation, make sure you specify that <code>container.childrenSorted = true</code>, where <code>container</code> is the Sprite3D containing your Cubes.  Otherwise you&#8217;ll get some weird results.</p>
<p>Another note: the <code>faces</code> Array is public so you can continue to draw on each face of the cube, and even add children.  So really, this is just a starting point; I&#8217;ll let you find something useful to do with it.</p>
]]></content:encoded>
			<wfw:commentRss>http://pixelwelders.com/blog/actionscript-3/2008/five3d-custom-primitive-vectorcube-class/feed/</wfw:commentRss>
		</item>
		<item>
		<title>Speed Tests: Objects vs. Arrays vs. Dictionaries</title>
		<link>http://pixelwelders.com/blog/best-practices/2008/speed-tests-objects-vs-arrays-vs-dictionaries/</link>
		<comments>http://pixelwelders.com/blog/best-practices/2008/speed-tests-objects-vs-arrays-vs-dictionaries/#comments</comments>
		<pubDate>Tue, 08 Jul 2008 09:27:12 +0000</pubDate>
		<dc:creator>Zack Jordan</dc:creator>
		
		<category><![CDATA[ActionScript 3.0]]></category>

		<category><![CDATA[Best Practices]]></category>

		<guid isPermaLink="false">http://pixelwelders.com/blog/best-practices/2008/speed-tests-objects-vs-arrays-vs-dictionaries/</guid>
		<description><![CDATA[	I’ve been taking buses around Europe for a couple weeks now, and sometimes those trips get extremely long.  Yesterday I took a bus from Venice to Seefeld (Austria), a trip that would have taken about five hours if not for the hurricane-like downpour they were having in Italy.  Seriously, it was ridiculous- all traffic was on the side of the highway, and all the motorcyclists were huddled under the overpasses.  But on the bright side, it did give me a lot of time to try out some things that I normally wouldn’t take the time to do, such as this experiment.]]></description>
			<content:encoded><![CDATA[<p>	I’ve been taking buses around Europe for a couple weeks now, and sometimes those trips get extremely long.  Yesterday I took a bus from Venice to Seefeld (Austria), a trip that would have taken about five hours if not for the hurricane-like downpour they were having in Italy.  Seriously, it was ridiculous- all traffic was on the side of the highway, and all the motorcyclists were huddled under the overpasses.  But on the bright side, it did give me a lot of time to try out some things that I normally wouldn’t take the time to do, such as this experiment.</p>
<p>	I make a lot of decisions daily based on things I think I know, but really have just always assumed.  And so, on this bus ride, I decided to get to the bottom of a few of them.  The first experiment I tried was with the read and write speeds of Objects, Arrays, and Dictionaries.  In the past, I have always used Arrays when I need all the nifty sorting and organization methods, Dictionaries when I need fast access, object keys, or weak references, and Objects pretty much never (because they’re messy and slow).  So yesterday I decided to see if my assumptions were actually valid, or if I had been doing things wrong this whole time.</p>
<p>	So I set up a quick class to test.  I created a Dictionary, an Object, and an Array, and then I put 100,000 integers in each one for the write test, and read them back out for the read test.  This is what I got (all times are average and in milliseconds).</p>
<table>
<tr>
<th/>
<th>Object</th>
<th>Array</th>
<th>Dictionary</th>
</tr>
<tr>
<th>Read (integer key)</th
<td>868</td>
<td>19</td>
<td>573</td>
</tr>
<tr>
<th>Write (integer key)</th>
<td>24</td>
<td>17</td>
<td>22</td>
</tr>
<tr>
<th>Read (string key)</th>
<td>586</td>
<td>N/A</td>
<td>573</td>
</tr>
<tr>
<th>Write (string key)</th>
<td>329</td>
<td>N/A</td>
<td>333</td>
</tr>
</table>
<p>	Obviously there are many more benchmarks that I could have run, but I also had a pretty good book on that bus.  I think I’ve done enough experimentation to prove that, once again, my assumptions are invalid.</p>
]]></content:encoded>
			<wfw:commentRss>http://pixelwelders.com/blog/best-practices/2008/speed-tests-objects-vs-arrays-vs-dictionaries/feed/</wfw:commentRss>
		</item>
		<item>
		<title>AS3 Broadcaster Class</title>
		<link>http://pixelwelders.com/blog/best-practices/2008/as3-broadcaster-class/</link>
		<comments>http://pixelwelders.com/blog/best-practices/2008/as3-broadcaster-class/#comments</comments>
		<pubDate>Mon, 23 Jun 2008 14:52:31 +0000</pubDate>
		<dc:creator>Zack Jordan</dc:creator>
		
		<category><![CDATA[ActionScript 3.0]]></category>

		<category><![CDATA[Best Practices]]></category>

		<category><![CDATA[AS2 vs AS3]]></category>

		<category><![CDATA[Broadcaster]]></category>

		<guid isPermaLink="false">http://pixelwelders.com/blog/best-practices/2008/as3-broadcaster-class/</guid>
		<description><![CDATA[This is something simple enough that I hesitate to post it, but maybe someone else can benefit.  Plus, I always try to have something new on Mondays.  Anyway, this a technique I once used back in the dark ages of ActionScript development (meaning AS2).  Last week, however, I suddenly had need of it again.]]></description>
			<content:encoded><![CDATA[<p><img src="http://pixelwelders.com/blog/wp-content/themes/tma/images/latest/satellite_470x175.jpg" style="float:none"/></p>
<p>This is something simple enough that I hesitate to post it, but maybe someone else can benefit.  Plus, I always try to have something new on Mondays.  Anyway, this a technique I once used back in the dark ages of ActionScript development (meaning AS2).  Last week, however, I suddenly had need of it again.</p>
<h3>The Scenario</h3>
<p>The AS3 event model is a pretty slick deal- much better than the six different ways we used to do it back in AS2.  However, I ran into a spot last week in which it failed me.  I had several different components in completely different parts of an application, and I wanted them all to listen to each other.  That in itself is no problem.  The problem was that I also wanted them to be completely <em>unaware</em> of each other, in hopes of keeping the code a bit more encapsulated.  So how does one listen for an event that comes from a source whose very existence is unknown?</p>
<h3>Option #1</h3>
<p>Option #1 was to make all my events bubble, and have each component add event listeners to some display list parent that all the components shared.  This would ensure that everyone got their events, but it makes everyone dependent on the current setup.  What if I wanted to move a component elsewhere and now it didn&#8217;t share that parent?  Plus, it&#8217;s not a solution that is guaranteed to work in a different app.  <em>Plus</em>, it involves children referencing their parent, which I am against on a fundamental, perhaps even a <em>spiritual</em> level.  So, scratch Option #1.</p>
<h3>Option #2</h3>
<p>Then I thought maybe each component should store a reference to all the other components.  But once again, you can throw the whole “loosely-coupled” idea out the window.  Something about this solution just didn’t feel right.</p>
<h3>Option #3</h3>
<p>Option #3 was the old AS2 method of creating a central static Broadcaster class and telling everyone to listen to <em>it</em>.  Now the only dependency each component had was to one static communication class.  Everything else could change as long as they were listening to the Broadcaster.  And so, as my great-grandmother has told me, sometimes the old ways are best.</p>
<h3>Source</h3>
<p>There’s really not much to explain with this class.  The only challenge was making a static class into an EventDispatcher, but that turned out to be pretty easy (thanks to <a href="http://gskinner.com/" onclick="javascript:pageTracker._trackPageview('/outbound/article/http://gskinner.com/');">G. Skinner</a>, who originally gave me the idea for a static EventDispatcher).  Behold:</p>
<pre lang=”Actionscript”>
/**
 * A central event broadcaster
 *
 * @author	Zack Jordan
 * 			{ P I X E L W E L D E R S . C O M }
 */
package com.pixelwelders.events
{
	import flash.events.Event;
	import flash.events.EventDispatcher;

	public class Broadcaster
	{

		private static var eventDispatcher			: EventDispatcher;

		/**
		 * Broadcasts an event to all listeners
		 * To listen to any and all events, use Broadcaster.addEventListener()
		 *
		 * @param	event		The Event to broadcast
		 * @return				nothing
		 */
		public static function broadcast( event:Event ): void
		{
			dispatchEvent( event );
		}

		// === S T A T I C   E V E N T   D I S P A T C H E R ===
		public static function addEventListener( type:String, listener:Function, useCapture:Boolean=false,
			priority:int=0, useWeakReference:Boolean=true ):void
		{
			if ( !eventDispatcher ) eventDispatcher = new EventDispatcher();
			eventDispatcher.addEventListener( type, listener, useCapture, priority, useWeakReference );
		}

		public static function removeEventListener( type:String, listener:Function, useCapture:Boolean=false ):void
		{
			if ( eventDispatcher ) eventDispatcher.removeEventListener( type, listener, useCapture );
  	    	}

		public static function dispatchEvent( p_event:Event ):void
		{
			if ( eventDispatcher ) eventDispatcher.dispatchEvent( p_event );
		}

	}
}
</pre>
<p>As you can see, this is just a static wrapper for an instance of EventDispatcher.  I just route all the methods of the EventDispatcher to static methods, and voilá.  As always, if you can think of a better way, just drop it in the comments.</p>
]]></content:encoded>
			<wfw:commentRss>http://pixelwelders.com/blog/best-practices/2008/as3-broadcaster-class/feed/</wfw:commentRss>
		</item>
		<item>
		<title>Custom Shapes in FIVe3D: The Arc</title>
		<link>http://pixelwelders.com/blog/actionscript-3/2008/custom-shapes-in-five3d-the-arc/</link>
		<comments>http://pixelwelders.com/blog/actionscript-3/2008/custom-shapes-in-five3d-the-arc/#comments</comments>
		<pubDate>Thu, 19 Jun 2008 05:38:24 +0000</pubDate>
		<dc:creator>Zack Jordan</dc:creator>
		
		<category><![CDATA[3D]]></category>

		<category><![CDATA[ActionScript 3.0]]></category>

		<category><![CDATA[FIVe3D]]></category>

		<guid isPermaLink="false">http://pixelwelders.com/blog/actionscript-3/2008/custom-shapes-in-five3d-the-arc/</guid>
		<description><![CDATA[The beauty of FIVe3D (other than its size, ease of use, and a few other things) is how easily extendable it is.  For a <a href="http://pixelwelders.com/blog/actionscript-3/2008/best-five3d-experiment-yet-seriously-its-awesome/">previous experiment</a>, I needed a way to draw an arc in 3D space.  This isn't something that FIVe3D provides, and in fact it was a little challenging to find the math I needed.  However!  Once I found it, I was able to easily use FIVe3D's drawing API to put it into action.]]></description>
			<content:encoded><![CDATA[<p>The beauty of FIVe3D (other than its size, ease of use, and a few other things) is how easily extendable it is.  For a <a href="http://pixelwelders.com/blog/actionscript-3/2008/best-five3d-experiment-yet-seriously-its-awesome/" >previous experiment</a>, I needed a way to draw an arc in 3D space.  This isn&#8217;t something that FIVe3D provides, and in fact it was a little challenging to find the math I needed.  However!  Once I found it, I was able to easily use FIVe3D&#8217;s drawing API to put it into action.  </p>
<p>The arc code, by the way, is from an ancient AS2 function called drawWedge() by Ric Ewing, which drew pizza-style wedges.  Close enough.  With a little elbow grease I managed to bend it to my will.  Here&#8217;s an example of a bunch of arcs doing their thing:</p>

<object	type="application/x-shockwave-flash"
			data="http://pixelwelders.com/experiments/FIVe3D_Arc/FIVe3D_Arc.swf"
			width="750"
			height="400">
	<param name="movie" value="http://pixelwelders.com/experiments/FIVe3D_Arc/FIVe3D_Arc.swf" />
</object>
<p>And here is the code that draws the arc, which extends FIVe3D&#8217;s Drawing class.  This could probably be cleaned up a bit, since I run through Ric&#8217;s arc code twice to create the thing; it wasn&#8217;t originally that way, but getting the fill on the <em>inside</em> of the arc proved more difficult than I originally thought.</p>

<div class="wp_syntax"><div class="code"><pre class="actionscript"><span style="color: #808080; font-style: italic;">/**
 * An extension of Mathieu Badimon's FIVe3D Drawing class.
 * This class draws an additional shape onto a FIVe3D Graphics3D instance.
 * This class includes code from by Ric Ewing.
 * 
 * @author 	Zack Jordan
 * 			{ P I X E L W E L D E R S }
 */</span>
package com.<span style="color: #006600;">pixelwelders</span>.<span style="color: #006600;">five3d</span>
<span style="color: #66cc66;">&#123;</span>
	<span style="color: #0066CC;">import</span> five3D.<span style="color: #006600;">display</span>.<span style="color: #006600;">Graphics3D</span>;
	<span style="color: #0066CC;">import</span> five3D.<span style="color: #006600;">utils</span>.<span style="color: #006600;">Drawing</span>;
&nbsp;
	<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">class</span> PXWDrawing <span style="color: #0066CC;">extends</span> Drawing
	<span style="color: #66cc66;">&#123;</span>
&nbsp;
		<span style="color: #808080; font-style: italic;">/**
		 * Draws a wedge shape onto a Graphics3D instance.
		 * 
		 * @param 	graphics		a Graphics3D instance on which to draw
		 * @param 	x				x position of the center of this wedge
		 * @param	y				y position of the center of this wedge
		 * @param	startAngle		the angle of one straight line of this wedge
		 * @param	arc				the angle (in degrees) of the total arc of this wedge
		 * @param	xRadius			the external radius along the x axis
		 * @param	yRadius			the external radius along the y axis
		 * @param	innerXRadius	the internal radius along the x axis
		 * @param	innerYRadius	the internal radius along the y axis
		 * @param	color			the color of the wedge fill
		 * @param	fillAlpha		the alpha value of the wedge fill
		 * 
		 * @return					nothing
		 */</span>
		<span style="color: #0066CC;">static</span> <span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">function</span> drawWedge<span style="color: #66cc66;">&#40;</span> 
			graphics:Graphics3D, 
			x:<span style="color: #0066CC;">Number</span>, 
			y:<span style="color: #0066CC;">Number</span>, 
			startAngle:<span style="color: #0066CC;">Number</span>, 
			arc:<span style="color: #0066CC;">Number</span>, 
			xRadius:<span style="color: #0066CC;">Number</span>, 
			yRadius:<span style="color: #0066CC;">Number</span>, 
			innerXRadius:<span style="color: #0066CC;">Number</span>, 
			innerYRadius:<span style="color: #0066CC;">Number</span>, 
			<span style="color: #0066CC;">color</span>:uint = 0xFF0000, 
			fillAlpha:<span style="color: #0066CC;">Number</span> = .<span style="color: #cc66cc;">5</span> 
		<span style="color: #66cc66;">&#41;</span>: <span style="color: #0066CC;">void</span>
		<span style="color: #66cc66;">&#123;</span>
			<span style="color: #000000; font-weight: bold;">var</span> segAngle	: <span style="color: #0066CC;">Number</span>
			<span style="color: #000000; font-weight: bold;">var</span> theta		: <span style="color: #0066CC;">Number</span>
			<span style="color: #000000; font-weight: bold;">var</span> angle		: <span style="color: #0066CC;">Number</span>
			<span style="color: #000000; font-weight: bold;">var</span> angleMid	: <span style="color: #0066CC;">Number</span>
			<span style="color: #000000; font-weight: bold;">var</span> segs		: <span style="color: #0066CC;">Number</span>
			<span style="color: #000000; font-weight: bold;">var</span> bx		: <span style="color: #0066CC;">Number</span>
			<span style="color: #000000; font-weight: bold;">var</span> by		: <span style="color: #0066CC;">Number</span>
			<span style="color: #000000; font-weight: bold;">var</span> cx		: <span style="color: #0066CC;">Number</span>
			<span style="color: #000000; font-weight: bold;">var</span> cy		: <span style="color: #0066CC;">Number</span>;
&nbsp;
			segs = <span style="color: #0066CC;">Math</span>.<span style="color: #0066CC;">ceil</span><span style="color: #66cc66;">&#40;</span> <span style="color: #0066CC;">Math</span>.<span style="color: #0066CC;">abs</span><span style="color: #66cc66;">&#40;</span> arc <span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">/</span> <span style="color: #cc66cc;">45</span> <span style="color: #66cc66;">&#41;</span>;
			segAngle = arc <span style="color: #66cc66;">/</span> segs;
			theta = -<span style="color: #66cc66;">&#40;</span> segAngle <span style="color: #66cc66;">/</span> <span style="color: #cc66cc;">180</span> <span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">*</span> <span style="color: #0066CC;">Math</span>.<span style="color: #0066CC;">PI</span>;
			angle = -<span style="color: #66cc66;">&#40;</span> startAngle <span style="color: #66cc66;">/</span> <span style="color: #cc66cc;">180</span> <span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">*</span> <span style="color: #0066CC;">Math</span>.<span style="color: #0066CC;">PI</span>;
&nbsp;
			graphics.<span style="color: #0066CC;">lineStyle</span><span style="color: #66cc66;">&#40;</span> <span style="color: #cc66cc;">1</span>, 0x000000, <span style="color: #cc66cc;">1</span> <span style="color: #66cc66;">&#41;</span>;
			graphics.<span style="color: #0066CC;">beginFill</span><span style="color: #66cc66;">&#40;</span> <span style="color: #0066CC;">color</span>, fillAlpha <span style="color: #66cc66;">&#41;</span>;
			graphics.<span style="color: #0066CC;">moveTo</span><span style="color: #66cc66;">&#40;</span> 
				x + <span style="color: #0066CC;">Math</span>.<span style="color: #0066CC;">cos</span><span style="color: #66cc66;">&#40;</span> startAngle <span style="color: #66cc66;">/</span> <span style="color: #cc66cc;">180</span> <span style="color: #66cc66;">*</span> <span style="color: #0066CC;">Math</span>.<span style="color: #0066CC;">PI</span> <span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">*</span> innerXRadius,
				y + <span style="color: #0066CC;">Math</span>.<span style="color: #0066CC;">sin</span><span style="color: #66cc66;">&#40;</span> -startAngle<span style="color: #66cc66;">/</span><span style="color: #cc66cc;">180</span> <span style="color: #66cc66;">*</span> <span style="color: #0066CC;">Math</span>.<span style="color: #0066CC;">PI</span> <span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">*</span> innerYRadius 
			<span style="color: #66cc66;">&#41;</span>;
&nbsp;
			<span style="color: #808080; font-style: italic;">// line 1</span>
			graphics.<span style="color: #0066CC;">lineTo</span><span style="color: #66cc66;">&#40;</span> 
				x + <span style="color: #0066CC;">Math</span>.<span style="color: #0066CC;">cos</span><span style="color: #66cc66;">&#40;</span> startAngle <span style="color: #66cc66;">/</span> <span style="color: #cc66cc;">180</span> <span style="color: #66cc66;">*</span> <span style="color: #0066CC;">Math</span>.<span style="color: #0066CC;">PI</span> <span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">*</span> xRadius,
				y + <span style="color: #0066CC;">Math</span>.<span style="color: #0066CC;">sin</span><span style="color: #66cc66;">&#40;</span> -startAngle <span style="color: #66cc66;">/</span> <span style="color: #cc66cc;">180</span> <span style="color: #66cc66;">*</span> <span style="color: #0066CC;">Math</span>.<span style="color: #0066CC;">PI</span> <span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">*</span> yRadius 
			<span style="color: #66cc66;">&#41;</span>;
&nbsp;
			<span style="color: #808080; font-style: italic;">// outer arc</span>
			<span style="color: #b1b100;">for</span> <span style="color: #66cc66;">&#40;</span> <span style="color: #000000; font-weight: bold;">var</span> i:<span style="color: #0066CC;">int</span> = <span style="color: #cc66cc;">0</span>; i <span style="color: #66cc66;">&lt;</span> segs; i++ <span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#123;</span>
				angle += theta;
				angleMid = angle - <span style="color: #66cc66;">&#40;</span> theta <span style="color: #66cc66;">/</span> <span style="color: #cc66cc;">2</span> <span style="color: #66cc66;">&#41;</span>;
				bx = x + <span style="color: #0066CC;">Math</span>.<span style="color: #0066CC;">cos</span><span style="color: #66cc66;">&#40;</span> angle <span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">*</span> xRadius;
				by = y + <span style="color: #0066CC;">Math</span>.<span style="color: #0066CC;">sin</span><span style="color: #66cc66;">&#40;</span> angle <span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">*</span> yRadius;
				cx = x + <span style="color: #0066CC;">Math</span>.<span style="color: #0066CC;">cos</span><span style="color: #66cc66;">&#40;</span> angleMid <span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">*</span> <span style="color: #66cc66;">&#40;</span> xRadius <span style="color: #66cc66;">/</span> <span style="color: #0066CC;">Math</span>.<span style="color: #0066CC;">cos</span><span style="color: #66cc66;">&#40;</span> theta <span style="color: #66cc66;">/</span> <span style="color: #cc66cc;">2</span> <span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#41;</span>;
				cy = y + <span style="color: #0066CC;">Math</span>.<span style="color: #0066CC;">sin</span><span style="color: #66cc66;">&#40;</span> angleMid <span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">*</span> <span style="color: #66cc66;">&#40;</span> yRadius <span style="color: #66cc66;">/</span> <span style="color: #0066CC;">Math</span>.<span style="color: #0066CC;">cos</span><span style="color: #66cc66;">&#40;</span> theta <span style="color: #66cc66;">/</span> <span style="color: #cc66cc;">2</span> <span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#41;</span>;
				graphics.<span style="color: #0066CC;">curveTo</span><span style="color: #66cc66;">&#40;</span> cx, cy, bx, by <span style="color: #66cc66;">&#41;</span>;
			<span style="color: #66cc66;">&#125;</span>
&nbsp;
			<span style="color: #808080; font-style: italic;">// line 2</span>
			graphics.<span style="color: #0066CC;">lineTo</span><span style="color: #66cc66;">&#40;</span> 
				x + <span style="color: #0066CC;">Math</span>.<span style="color: #0066CC;">cos</span><span style="color: #66cc66;">&#40;</span> <span style="color: #66cc66;">&#40;</span> startAngle + arc <span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">/</span> <span style="color: #cc66cc;">180</span> <span style="color: #66cc66;">*</span> <span style="color: #0066CC;">Math</span>.<span style="color: #0066CC;">PI</span> <span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">*</span> innerXRadius, 
				y + <span style="color: #0066CC;">Math</span>.<span style="color: #0066CC;">sin</span><span style="color: #66cc66;">&#40;</span> -<span style="color: #66cc66;">&#40;</span> startAngle + arc <span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">/</span> <span style="color: #cc66cc;">180</span> <span style="color: #66cc66;">*</span> <span style="color: #0066CC;">Math</span>.<span style="color: #0066CC;">PI</span> <span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">*</span> innerYRadius 
			<span style="color: #66cc66;">&#41;</span>;
&nbsp;
			theta = -<span style="color: #66cc66;">&#40;</span> segAngle <span style="color: #66cc66;">/</span> <span style="color: #cc66cc;">180</span> <span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">*</span> <span style="color: #0066CC;">Math</span>.<span style="color: #0066CC;">PI</span>;
			angle = -<span style="color: #66cc66;">&#40;</span> <span style="color: #66cc66;">&#40;</span> startAngle + arc <span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">/</span> <span style="color: #cc66cc;">180</span> <span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">*</span> <span style="color: #0066CC;">Math</span>.<span style="color: #0066CC;">PI</span>;
&nbsp;
			<span style="color: #808080; font-style: italic;">// inner arc</span>
			<span style="color: #b1b100;">for</span> <span style="color: #66cc66;">&#40;</span><span style="color: #000000; font-weight: bold;">var</span> j:<span style="color: #0066CC;">int</span> = <span style="color: #cc66cc;">0</span>; j <span style="color: #66cc66;">&lt;</span> segs; j++ <span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#123;</span>
				angle -= theta;
				angleMid = angle + <span style="color: #66cc66;">&#40;</span> theta <span style="color: #66cc66;">/</span> <span style="color: #cc66cc;">2</span> <span style="color: #66cc66;">&#41;</span>;
				bx = x + <span style="color: #0066CC;">Math</span>.<span style="color: #0066CC;">cos</span><span style="color: #66cc66;">&#40;</span> angle <span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">*</span> innerXRadius;
				by = y + <span style="color: #0066CC;">Math</span>.<span style="color: #0066CC;">sin</span><span style="color: #66cc66;">&#40;</span> angle <span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">*</span> innerYRadius;
				cx = x + <span style="color: #0066CC;">Math</span>.<span style="color: #0066CC;">cos</span><span style="color: #66cc66;">&#40;</span> angleMid <span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">*</span> <span style="color: #66cc66;">&#40;</span> innerXRadius <span style="color: #66cc66;">/</span> <span style="color: #0066CC;">Math</span>.<span style="color: #0066CC;">cos</span><span style="color: #66cc66;">&#40;</span> theta <span style="color: #66cc66;">/</span> <span style="color: #cc66cc;">2</span> <span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#41;</span>;
				cy = y + <span style="color: #0066CC;">Math</span>.<span style="color: #0066CC;">sin</span><span style="color: #66cc66;">&#40;</span> angleMid <span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">*</span> <span style="color: #66cc66;">&#40;</span> innerYRadius <span style="color: #66cc66;">/</span> <span style="color: #0066CC;">Math</span>.<span style="color: #0066CC;">cos</span><span style="color: #66cc66;">&#40;</span> theta <span style="color: #66cc66;">/</span> <span style="color: #cc66cc;">2</span> <span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#41;</span>;
				graphics.<span style="color: #0066CC;">curveTo</span><span style="color: #66cc66;">&#40;</span> cx, cy, bx, by <span style="color: #66cc66;">&#41;</span>;
			<span style="color: #66cc66;">&#125;</span>			
			graphics.<span style="color: #0066CC;">endFill</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;			
		<span style="color: #66cc66;">&#125;</span>
	<span style="color: #66cc66;">&#125;</span>		
<span style="color: #66cc66;">&#125;</span></pre></div></div>

<p>Another note on this experiment: the SWF is 16k.  Holy crap.</p>
]]></content:encoded>
			<wfw:commentRss>http://pixelwelders.com/blog/actionscript-3/2008/custom-shapes-in-five3d-the-arc/feed/</wfw:commentRss>
		</item>
		<item>
		<title>Runtime Libraries in Flex ActionScript Projects</title>
		<link>http://pixelwelders.com/blog/best-practices/2008/runtime-libraries-in-as3/</link>
		<comments>http://pixelwelders.com/blog/best-practices/2008/runtime-libraries-in-as3/#comments</comments>
		<pubDate>Mon, 16 Jun 2008 09:15:33 +0000</pubDate>
		<dc:creator>Zack Jordan</dc:creator>
		
		<category><![CDATA[ActionScript 3.0]]></category>

		<category><![CDATA[Best Practices]]></category>

		<guid isPermaLink="false">http://pixelwelders.com/blog/best-practices/2008/runtime-libraries-in-as3/</guid>
		<description><![CDATA[When working with Flash, there is really only one vector format worth worrying about, and that is SWF.  And furthermore, it turns out that there is a kinda slick way to import all the assets contained in a SWF into a Flex ActionScript project.  In the following class, I've just smoothed the process a little bit.]]></description>
			<content:encoded><![CDATA[<p><img src="http://pixelwelders.com/blog/wp-content/themes/tma/images/latest/library_470x175.jpg" alt="Runtime library" style="float:none"/></p>
<p>This is something I&#8217;ve begun using recently, and I thought I would post about it to see if I can help anyone else who&#8217;s been thinking about this.  I&#8217;ve seen some other articles on this, but they&#8217;ve had some shortcomings that I think I have improved on.  Of course, there&#8217;s room for tons of improvement on my class as well, so feel free to extend this to your little collective hearts&#8217; content.  The source is downloadable at the bottom of the page, or you can continue to the second page of this article to view it all without downloading.  Anyway: onward!</p>
<h3>The Need</h3>
<p>Okay, so: as a Flex developer who does a lot of ActionScript-only projects, I often run into situations in which I need to import some artwork.  This artwork may be in any number of formats, and they all require different solutions.  However, for a project that I&#8217;m working on now (which I would expound upon if it wasn&#8217;t [apparently] top-secret), I needed to import hundreds of little images in a vector format.  Furthermore, the client hinted that it would be nice, if not mandatory, to be able to swap out images later without sending it back to me for a recompile.  So, I had to do a bit of thinking.</p>
<p>However, it turns out that the solution is really not that hard.  When working with Flash, there is really only one vector format worth worrying about, and that is SWF.  And furthermore, it turns out that there is a kinda slick way to import all the assets contained in a SWF into a Flex ActionScript project.  In the following class, I&#8217;ve just smoothed the process a little bit.</p>
<h3>The Theory</h3>
<p>1- Create a MovieClip in Flash CS3 and check Export for ActionScript in its linkage properties.  Remember the class name that you give it, because you&#8217;re going to need that to pull this asset back out of its mother SWF.</p>
<p>2- Publish your SWF.  Make a note of where it&#8217;s going so you can load it in Flex.</p>
<p>3- In Flex, set up a Loader with the typical listeners (see my source below for details) and load the SWF.</p>
<p>4- Once the Loader has successfully loaded the SWF, the part you are interested in is the Loader&#8217;s contentLoaderInfo property (which is an instance of the LoaderInfo class, if you&#8217;d like to check the Flash help files for more information).  This property now contains the data from your Flash CS3 SWF.  Interestingly enough, a LoaderInfo class contains an instance of the ApplicationDomain class, which in turns contains all class definitions that are contained in that SWF.  Since you checked Export for ActionScript on your MovieClip, that means there is a definition for it in the ApplicationDomain of this LoaderInfo.  You just need to pull it out and instantiate it.</p>
<p>5- You have to do a little dancing around with types to get your MovieClip back out, since you will be pulling it out as an instance of Class, not as an instance of MovieClip.  However, with a couple lines of code, it&#8217;s easy enough to actually create an instance of your original Flash CS3-authored MovieClip.</p>
<h3>The Code</h3>
<p>Here are the vital parts of the code, as seen below in the source download link at the bottom of the page.  These are contained in a wrapper class that I wrote that surrounds Loader.contentLoaderInfo.</p>
<p>This is the handler that is called when the Loader successfully loads the SWF.  Notice that we save the LoaderInfo (called &#8220;contentLoaderInfo&#8221;) for later use.  This is the package of all the assets we have just imported.</p>

<div class="wp_syntax"><div class="code"><pre class="actionscript"><span style="color: #0066CC;">private</span> <span style="color: #0066CC;">static</span> <span style="color: #000000; font-weight: bold;">function</span> handleLoadComplete<span style="color: #66cc66;">&#40;</span> event:Event <span style="color: #66cc66;">&#41;</span>: <span style="color: #0066CC;">void</span>
<span style="color: #66cc66;">&#123;</span>
	loaderInfo = loader.<span style="color: #006600;">contentLoaderInfo</span>;
	dispatchEvent<span style="color: #66cc66;">&#40;</span> <span style="color: #000000; font-weight: bold;">new</span> Event<span style="color: #66cc66;">&#40;</span> Event.<span style="color: #006600;">COMPLETE</span> <span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#41;</span>;
<span style="color: #66cc66;">&#125;</span></pre></div></div>

<p>And here is where the real magic happens, and it must be called after the above handler.  Notice how we get a real live Sprite instance from the definition in our LoaderInfo instance.  Plus, it looks just like the asset you created in Flash at the beginning of this article.</p>

<div class="wp_syntax"><div class="code"><pre class="actionscript"><span style="color: #0066CC;">public</span> <span style="color: #0066CC;">static</span> <span style="color: #000000; font-weight: bold;">function</span> getAsset<span style="color: #66cc66;">&#40;</span> id:<span style="color: #0066CC;">String</span> <span style="color: #66cc66;">&#41;</span>: Sprite
<span style="color: #66cc66;">&#123;</span>
	<span style="color: #000000; font-weight: bold;">var</span> Asset:<span style="color: #000000; font-weight: bold;">Class</span> = loaderInfo.<span style="color: #006600;">applicationDomain</span>.<span style="color: #006600;">getDefinition</span><span style="color: #66cc66;">&#40;</span> id <span style="color: #66cc66;">&#41;</span> as <span style="color: #000000; font-weight: bold;">Class</span>;			
	<span style="color: #b1b100;">return</span> Sprite<span style="color: #66cc66;">&#40;</span> <span style="color: #000000; font-weight: bold;">new</span> Asset<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#41;</span>;
<span style="color: #66cc66;">&#125;</span></pre></div></div>

<h3>Summary</h3>
<p>This is as basic as it gets.  My source below extends this enough for me to use it in the aforementioned project (as well as adding some basic error handling), but this could be extended for all types of applications.  For instance, my class only returns instances of Sprites because that is what I am interested in.  However, you could also return the class itself (un-instantiated), or anything that you might find in LoaderInfo.applicationDomain.  The possibilities are&#8230; well, not limitless.  But more than you might think.</p>
<h3>Source</h3>
<p>The zip contains a RuntimeLibrary class (shown below), an example using it, and some sample assets in a SWF (with the matching FLA so you can see that they are nothing special- just Exported for ActionScript).  As you can see, I&#8217;m doing some basic error handling, but you may want to do something a little more robust; or, you may want the error.  Feel free to change whatever you want- that&#8217;s the beauty of open-source!</p>
<p><a href="http://pixelwelders.com/downloads/RuntimeLibrary/Pixelwelders_RuntimeLibrary.zip" onclick="javascript:pageTracker._trackPageview('/downloads/downloads/RuntimeLibrary/Pixelwelders_RuntimeLibrary.zip');">DOWNLOAD SOURCE</a></p>

<div class="wp_syntax"><div class="code"><pre class="actionscript"><span style="color: #808080; font-style: italic;">/**
 * A utility to load a SWF at runtime.
 * This makes all definitions in the loaded SWF available.
 * You can use this to load graphics elements created in Flash CS3 into Flex ActionScript projects
 * 
 * @author	Zack Jordan
 * 			{ P I X E L W E L D E R S }
 * 			pixelwelders.com/blog
 */</span>
package com.<span style="color: #006600;">pixelwelders</span>.<span style="color: #006600;">graphics</span>
<span style="color: #66cc66;">&#123;</span>
	<span style="color: #0066CC;">import</span> flash.<span style="color: #006600;">display</span>.<span style="color: #006600;">Loader</span>;
	<span style="color: #0066CC;">import</span> flash.<span style="color: #006600;">display</span>.<span style="color: #006600;">LoaderInfo</span>;
	<span style="color: #0066CC;">import</span> flash.<span style="color: #006600;">display</span>.<span style="color: #006600;">Sprite</span>;
	<span style="color: #0066CC;">import</span> flash.<span style="color: #006600;">events</span>.<span style="color: #006600;">ErrorEvent</span>;
	<span style="color: #0066CC;">import</span> flash.<span style="color: #006600;">events</span>.<span style="color: #006600;">Event</span>;
	<span style="color: #0066CC;">import</span> flash.<span style="color: #006600;">events</span>.<span style="color: #006600;">EventDispatcher</span>;
	<span style="color: #0066CC;">import</span> flash.<span style="color: #006600;">events</span>.<span style="color: #006600;">IOErrorEvent</span>;
	<span style="color: #0066CC;">import</span> flash.<span style="color: #006600;">net</span>.<span style="color: #006600;">URLRequest</span>;
&nbsp;
	<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">class</span> RuntimeLibrary <span style="color: #0066CC;">extends</span> EventDispatcher
	<span style="color: #66cc66;">&#123;</span>
&nbsp;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> request				: URLRequest;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> loader				: Loader;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">var</span> loaderInfo			: LoaderInfo;
&nbsp;
		<span style="color: #808080; font-style: italic;">/**
		 * Constructor- creates a new RuntimeLibrary
		 * 
		 * @param			nothing
		 * @return			The newly-created RuntimeLibrary 
		 */</span>
		<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">function</span> RuntimeLibrary<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>
		<span style="color: #66cc66;">&#123;</span>
			request = <span style="color: #000000; font-weight: bold;">new</span> URLRequest<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
			loader = <span style="color: #000000; font-weight: bold;">new</span> Loader<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
			loader.<span style="color: #006600;">contentLoaderInfo</span>.<span style="color: #006600;">addEventListener</span><span style="color: #66cc66;">&#40;</span> Event.<span style="color: #006600;">INIT</span>, handleLoadComplete <span style="color: #66cc66;">&#41;</span>;
			loader.<span style="color: #006600;">contentLoaderInfo</span>.<span style="color: #006600;">addEventListener</span><span style="color: #66cc66;">&#40;</span> IOErrorEvent.<span style="color: #006600;">IO_ERROR</span>, handleIOError <span style="color: #66cc66;">&#41;</span>;
		<span style="color: #66cc66;">&#125;</span>
&nbsp;
		<span style="color: #808080; font-style: italic;">// === A P I ===</span>
		<span style="color: #808080; font-style: italic;">/**
		 * Loads a swf into this RuntimeLibrary
		 * 
		 * @param	url		the URL of the SWF to load
		 * @return			nothing
		 */</span>
		<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">function</span> <span style="color: #0066CC;">load</span><span style="color: #66cc66;">&#40;</span> <span style="color: #0066CC;">url</span>:<span style="color: #0066CC;">String</span> <span style="color: #66cc66;">&#41;</span>: <span style="color: #0066CC;">void</span>
		<span style="color: #66cc66;">&#123;</span>
			request.<span style="color: #0066CC;">url</span> = <span style="color: #0066CC;">url</span>;
			loader.<span style="color: #0066CC;">load</span><span style="color: #66cc66;">&#40;</span> request <span style="color: #66cc66;">&#41;</span>;
		<span style="color: #66cc66;">&#125;</span>
&nbsp;
		<span style="color: #808080; font-style: italic;">/**
		 * Creates and returns an instance of the specified class from the loaded SWF
		 * If the specified class does not exist, dispatches an ErrorEvent and returns an empty Sprite
		 * 
		 * @param	id		Name of the class in the loaded SWF
		 * @return			An instance of the specified class, or an empty Sprite if the class is not found
		 */</span>
		<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">function</span> getAsset<span style="color: #66cc66;">&#40;</span> id:<span style="color: #0066CC;">String</span> <span style="color: #66cc66;">&#41;</span>: Sprite
		<span style="color: #66cc66;">&#123;</span>
			<span style="color: #0066CC;">try</span>
			<span style="color: #66cc66;">&#123;</span>
				<span style="color: #000000; font-weight: bold;">var</span> Asset:<span style="color: #000000; font-weight: bold;">Class</span> = loaderInfo.<span style="color: #006600;">applicationDomain</span>.<span style="color: #006600;">getDefinition</span><span style="color: #66cc66;">&#40;</span> id <span style="color: #66cc66;">&#41;</span> as <span style="color: #000000; font-weight: bold;">Class</span>;
			<span style="color: #66cc66;">&#125;</span> <span style="color: #0066CC;">catch</span> <span style="color: #66cc66;">&#40;</span> <span style="color: #0066CC;">error</span>:ReferenceError <span style="color: #66cc66;">&#41;</span>
			<span style="color: #66cc66;">&#123;</span>
				<span style="color: #0066CC;">trace</span><span style="color: #66cc66;">&#40;</span> <span style="color: #ff0000;">&quot;Asset not found.&quot;</span> <span style="color: #66cc66;">&#41;</span>;
				dispatchEvent<span style="color: #66cc66;">&#40;</span> <span style="color: #000000; font-weight: bold;">new</span> ErrorEvent<span style="color: #66cc66;">&#40;</span> ErrorEvent.<span style="color: #0066CC;">ERROR</span> <span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#41;</span>;
			<span style="color: #66cc66;">&#125;</span>
&nbsp;
			<span style="color: #b1b100;">return</span> Asset ? Sprite<span style="color: #66cc66;">&#40;</span> <span style="color: #000000; font-weight: bold;">new</span> Asset<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#41;</span> : <span style="color: #000000; font-weight: bold;">new</span> Sprite<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
		<span style="color: #66cc66;">&#125;</span>
&nbsp;
		<span style="color: #808080; font-style: italic;">// === E V E N T   H A N D L E R S ===</span>
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">function</span> handleLoadComplete<span style="color: #66cc66;">&#40;</span> event:Event <span style="color: #66cc66;">&#41;</span>: <span style="color: #0066CC;">void</span>
		<span style="color: #66cc66;">&#123;</span>
			loaderInfo = loader.<span style="color: #006600;">contentLoaderInfo</span>;
			dispatchEvent<span style="color: #66cc66;">&#40;</span> <span style="color: #000000; font-weight: bold;">new</span> Event<span style="color: #66cc66;">&#40;</span> Event.<span style="color: #006600;">COMPLETE</span> <span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#41;</span>;
		<span style="color: #66cc66;">&#125;</span>
&nbsp;
		<span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">function</span> handleIOError<span style="color: #66cc66;">&#40;</span> event:IOErrorEvent <span style="color: #66cc66;">&#41;</span>: <span style="color: #0066CC;">void</span>
		<span style="color: #66cc66;">&#123;</span>
			<span style="color: #0066CC;">trace</span><span style="color: #66cc66;">&#40;</span> <span style="color: #ff0000;">&quot;load error: &quot;</span> + event.<span style="color: #0066CC;">text</span> <span style="color: #66cc66;">&#41;</span>;
		<span style="color: #66cc66;">&#125;</span>
&nbsp;
	<span style="color: #66cc66;">&#125;</span>
<span style="color: #66cc66;">&#125;</span></pre></div></div>

]]></content:encoded>
			<wfw:commentRss>http://pixelwelders.com/blog/best-practices/2008/runtime-libraries-in-as3/feed/</wfw:commentRss>
		</item>
		<item>
		<title>Son of Papervision! (VectorVision vs. FIVe3D)</title>
		<link>http://pixelwelders.com/blog/actionscript-3/2008/son-of-papervision-vectorvision-vs-five3d/</link>
		<comments>http://pixelwelders.com/blog/actionscript-3/2008/son-of-papervision-vectorvision-vs-five3d/#comments</comments>
		<pubDate>Sun, 01 Jun 2008 00:05:02 +0000</pubDate>
		<dc:creator>Zack Jordan</dc:creator>
		
		<category><![CDATA[3D]]></category>

		<category><![CDATA[ActionScript 3.0]]></category>

		<category><![CDATA[Actionscript]]></category>

		<category><![CDATA[FIVe3D]]></category>

		<category><![CDATA[Papervision3D]]></category>

		<category><![CDATA[VectorVision]]></category>

		<guid isPermaLink="false">http://pixelwelders.com/blog/actionscript-3/2008/son-of-papervision-vectorvision-vs-five3d/</guid>
		<description><![CDATA[The first thing that people do when they see FIVe3D is compare it to Papervision.  In my opinion, this is a pretty useless exercise... except that now it's not, thanks to some folks from Amsterdam...]]></description>
			<content:encoded><![CDATA[<p><strong>ASIDE:</strong> So, the original theme of this article was a head to head between PV3D/VectorVision and FIVe3D, but then I realized that an offspring metaphor was really more apt, as explained below.  Nonetheless, the following picture is too awesome not to use.</p>
<div class="captioned_image" style="float:none">
<img src="http://pixelwelders.com/blog/wp-content/themes/tma/images/latest/kingkong_470x175.jpg" alt="Papervision vs. FIVe3D" /></p>
<p>An awesome picture.</p>
</div>
<p>If you&#8217;ve been following this site for any amount of time, you&#8217;ve probably noticed that I&#8217;ve been spending quite a bit of time with Mathieu Badimon&#8217;s excellent <a href="http://five3d.mathieu-badimon.com/" onclick="javascript:pageTracker._trackPageview('/outbound/article/http://five3d.mathieu-badimon.com/');">FIVe3D</a> engine.  Probably too much time, in fact.  I&#8217;ve talked about the features in other posts, so I won&#8217;t go into it here.  If this is the first you&#8217;ve heard of it, go take a look at Mathieu&#8217;s examples, or click &#8216;FIVe3D&#8217; in the tag cloud to the right to see what it is and some of the things it&#8217;s capable of.</p>
<p>It seems that the first thing people do when they see this engine is compare it with Papervision3D.  I&#8217;ve resisted this for a long time; in my opinion, bitmap-based and vector-based 3D engines seem to be pretty close to the proverbial apples and oranges.  However!  As of sometime last week, Papervision and FIVe3D have been combined into some sort of (proverbial?) fruit punch, which means that inter-species comparisons make a lot more sense.  It&#8217;s called VectorVision, and the men responsible for this unholy union are <a href="http://blog.barcinski-jeanjean.com/2008/05/16/vectorsvision-vectors-in-papervision3d/" onclick="javascript:pageTracker._trackPageview('/outbound/article/http://blog.barcinski-jeanjean.com/2008/05/16/vectorsvision-vectors-in-papervision3d/');">Barcinski &#038; Jean-Jean</a>, two mad scientists from Amsterdam.</p>
<p>Based on my earlier experiments, I&#8217;ve been kicking around the idea of a 3D tag cloud for this blog.  FIVe3D, of course, seemed like the obvious man for the job due to its simplicity and the fact that Papervision hasn&#8217;t had anything in the way of quality text rendering.  However, the experiments of the aforementioned Dutchmen made me wonder how Papervision would handle the task.  So, I created a similar application using each library.  You can see the results below; each image is a separate SWF- just click one to activate it.</p>
<table>
<tr>
<th>FIVe3D</th>
<th>Papervision3D</th>
</tr>
<tr>
<td>
<span id="five3d"/>
<object	type="application/x-shockwave-flash"
			data="http://pixelwelders.com/experiments/FIVe2D_vs_PV3D/FIVe3D_vs_Papervision3D.swf"
			width="350"
			height="400">
	<param name="movie" value="http://pixelwelders.com/experiments/FIVe2D_vs_PV3D/FIVe3D_vs_Papervision3D.swf" />
</object>
		</td>
<td>
<span id="pv3d"/>
<object	type="application/x-shockwave-flash"
			data="http://pixelwelders.com/experiments/FIVe2D_vs_PV3D/FIVe3D_vs_Papervision3D_2.swf"
			width="350"
			height="400">
	<param name="movie" value="http://pixelwelders.com/experiments/FIVe2D_vs_PV3D/FIVe3D_vs_Papervision3D_2.swf" />
</object>
		</td>
</tr>
<tr>
<td>SWF size: 32k</td>
<td>SWF size: 60k</td>
</tr>
</table>
<h3>Findings</h3>
<p>As you can see, there are some differences; and of course, this is as basic as either engine gets.  But in terms of pure capability, it looks like the offspring of PV3D and FIVe3D is indeed greater than either.  Post your machine/browser and frame rates; I&#8217;d like to see what everyone else is getting.</p>
]]></content:encoded>
			<wfw:commentRss>http://pixelwelders.com/blog/actionscript-3/2008/son-of-papervision-vectorvision-vs-five3d/feed/</wfw:commentRss>
		</item>
		<item>
		<title>FIVe3D Cheat Sheet: The Display Classes</title>
		<link>http://pixelwelders.com/blog/actionscript-3/2008/five3d-cheat-sheet-the-display-classes/</link>
		<comments>http://pixelwelders.com/blog/actionscript-3/2008/five3d-cheat-sheet-the-display-classes/#comments</comments>
		<pubDate>Tue, 27 May 2008 14:31:44 +0000</pubDate>
		<dc:creator>Zack Jordan</dc:creator>
		
		<category><![CDATA[3D]]></category>

		<category><![CDATA[ActionScript 3.0]]></category>

		<category><![CDATA[Actionscript]]></category>

		<category><![CDATA[cheat sheet]]></category>

		<category><![CDATA[FIVe3D]]></category>

		<guid isPermaLink="false">http://pixelwelders.com/blog/actionscript-3/2008/five3d-cheat-sheet-the-display-classes/</guid>
		<description><![CDATA[Here's a quick summary and comparison of the FIVe3D display classes.  Hopefully this will help tide a few people over until Mathieu releases the real documentation (which will certainly be much more exhaustive than my little effort).]]></description>
			<content:encoded><![CDATA[<p>As should be obvious, I&#8217;ve been pretty fascinated with <a href="http://mathieu-badimon.com" onclick="javascript:pageTracker._trackPageview('/outbound/article/http://mathieu-badimon.com');">Mathieu Badimon</a>&#8217;s elegant little 3D vector engine <a href="http://five3d.mathieu-badimon.com" onclick="javascript:pageTracker._trackPageview('/outbound/article/http://five3d.mathieu-badimon.com');">FIVe3D</a> for some time now:</p>
<p><a href="http://pixelwelders.com/blog/3d/2008/experiments-in-the-third-dimension-five3d/" >Experiments in the Third Dimension: FIVe3D</a><br />
<a href="http://pixelwelders.com/blog/actionscript-3/2008/five3d-and-tweenlite-text-cloud/" >FIVe3D and TweenLite: Text Cloud</a><br />
<a href="http://pixelwelders.com/blog/actionscript-3/2008/best-five3d-experiment-yet-seriously-its-awesome/" >Best FIVe3D Experiment Yet</a><br />
<a href="http://pixelwelders.com/blog/actionscript-3/2008/five3d-textcloud-as3-tutorial-and-source/" >FIVe3D TextCloud: AS3 Tutorial and Source</a></p>
<p>And as I&#8217;ve mentioned, FIVe3D is in my opinion the easiest Flash 3D engine to pick up and play with.  In my tutorial above (link #4), I am able to get a little demo running in just a few lines of ActionScript.  However, my tutorial only covers the DynamicText3D class (and to a lesser extent, the Sprite3D class).  Thus, as a companion work, I&#8217;ve put up a quick summary and comparison of the FIVe3D display classes below.  Hopefully this will help tide a few people over until Mathieu releases the real documentation (which will certainly be much more exhaustive than my little effort).</p>
<h3>Display Classes</h3>
<table>
<tr>
<th>
			Class
		</th>
<th>
			Extends
		</th>
<th>
			Description and Notes
		</th>
<th>
			Dispatches MouseEvents?
		</th>
</tr>
<tr>
<td>
			Scene3D
		</td>
<td>
			Sprite
		</td>
<td>
			This is the base display class for the FIVe3D display list.  It corresponds to the Stage in the normal Flash display list.  Put simply, if it ain&#8217;t on here, it ain&#8217;t getting rendered.
		</td>
<td>
			Yes
		</td>
</tr>
<tr>
<td>
			Graphics3D
		</td>
<td>
			N/A
		</td>
<td>
			This is the FIVe3D equivalent to the AS3 Graphics class.  All FIVe3D display objects (with the exception of Scene3D and Sprite2D) have one, with the instance name of <code>graphics3D</code>.  It has many of the same methods as the normal Graphics class, and you can also send an instance to the <code>Drawing</code> class if you want to draw additional shapes.  Take a look at the example that comes with FIVe3D to see this in action.
		</td>
<td>
			N/A
		</td>
</tr>
<tr>
<td>
			Shape3D
		</td>
<td>
			Shape
		</td>
<td>
			This is as basic (and as lightweight) as FIVe3D gets.  Sprite3D and Shape3D share the same relationship as Sprite and Shape in AS3:  both have a Graphics3D instance for drawing, but Shape3D is non-interactive and cannot have children.
		</td>
<td>
			No
		</td>
</tr>
<tr>
<td>
			Sprite3D
		</td>
<td>
			Sprite
		</td>
<td>
			Just like a Sprite, but in three dimensions.  Unlike Shape3D, this class can have children, each of which adopts its parents&#8217; positions and rotations.  It is also interactive.
		</td>
<td>
			Yes
		</td>
</tr>
<tr>
<td>
			Sprite2D
		</td>
<td>
			Sprite
		</td>
<td>
			Sprite2Ds may be placed in three dimensions (that is, they have x, y, and z coordinates), but they can only rotate around the z axis.  In other words, they&#8217;re just like normal Sprites with a &#8220;z&#8221; coordinate.  Also, Sprite2Ds do not have a <code>graphics3D</code> object- just the plain old <code>graphics</code>.  This means that you can&#8217;t use the methods in the <code>Drawing</code> class with this (unless you tweak the Drawing class).
		</td>
<td>
			Yes
		</td>
</tr>
<tr>
<td>
			DynamicText3D
		</td>
<td>
			Sprite3D
		</td>
<td>
			This is a Sprite3D that displays font glyphs.  Think of it as a 3D TextField.  You can set the size, color, font (&#8221;typography&#8221;), and letter spacing.  Fonts are kept in the <code>typography</code> package.
		</td>
<td>
			Yes
		</td>
</tr>
<tr>
<td>
			Bitmap3D
		</td>
<td>
			Shape
		</td>
<td>
			This is analogous to a Shape3D that displays Bitmaps instead of vector graphics.  Take a look at the <a href="http://five3d.mathieu-badimon.com/gallery/earth/", target="_blank" onclick="javascript:pageTracker._trackPageview('/outbound/article/http://five3d.mathieu-badimon.com/gallery/earth/');">Earth Cube</a> source for an example of this in action.</p>
</td>
<td>
			No
		</td>
</tr>
<tr>
<td>
			Video3D
		</td>
<td>
			Bitmap3D
		</td>
<td>
			Video3D is a dynamic Bitmap3D, and a shell for a Video object.  Just like a Video instance, you can use <code>attachNetStream()</code> or <code>attachCamera()</code> to set the video source.
		</td>
<td>
			No
		</td>
</tr>
</table>
<p>So let me know if this is useful to you- or if not, what would make it useful (more examples?  benchmarks?).  Hopefully it will at least give a little clarity to those who are curious about this engine.</p>
]]></content:encoded>
			<wfw:commentRss>http://pixelwelders.com/blog/actionscript-3/2008/five3d-cheat-sheet-the-display-classes/feed/</wfw:commentRss>
		</item>
	</channel>
</rss>
