<?xml version="1.0" encoding="UTF-8"?>
<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/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>@Diacre &#187; Flash Friday</title>
	<atom:link href="http://ducharme.cc/category/flash-friday/feed/" rel="self" type="application/rss+xml" />
	<link>http://ducharme.cc</link>
	<description>father, francophile, former pro wrestler, improvisational comedian, coder and all around good guy ;)</description>
	<lastBuildDate>Fri, 03 Feb 2012 19:59:18 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.1.3</generator>
		<item>
		<title>Quick tip Ctrl+3</title>
		<link>http://ducharme.cc/quick-tip-ctrl3/</link>
		<comments>http://ducharme.cc/quick-tip-ctrl3/#comments</comments>
		<pubDate>Fri, 20 Jan 2012 08:00:46 +0000</pubDate>
		<dc:creator>Deacon</dc:creator>
				<category><![CDATA[Flash Friday]]></category>
		<category><![CDATA[Eclipse]]></category>
		<category><![CDATA[Flash Builder]]></category>
		<category><![CDATA[hidden gems]]></category>
		<category><![CDATA[keyboard shortcut]]></category>
		<category><![CDATA[tip]]></category>

		<guid isPermaLink="false">http://ducharme.cc/?p=841</guid>
		<description><![CDATA[<div class="addthis_toolbox addthis_default_style " addthis:url='http://ducharme.cc/quick-tip-ctrl3/' addthis:title='Quick tip Ctrl+3 '  ><a class="addthis_button_facebook_like" fb:like:layout="button_count"></a><a class="addthis_button_tweet"></a><a class="addthis_button_google_plusone" g:plusone:size="medium"></a><a class="addthis_counter addthis_pill_style"></a></div><img src="http://ducharme.cc/wp-content/uploads/2012/01/noMouse1.png" alt="" title="noMouse1" width="150" height="150" class="alignleft size-full wp-image-844" />There are shortcuts for Flash Builder common features but Project-->Clean... isn't one of them. Eclipse has an interesting Keyboard Shortcut in CTRL+3 - Quick Access. The Quick Access shortcut allows you to hit the shortcut then just start typing the name of the feature you want to use - and there is a big list available to you in Eclipse. A bonus to the Quick Access shortcut is that the last feature you used can be used by hitting return. So to set up a shortcut for Project-->Clean there are just a couple steps.]]></description>
			<content:encoded><![CDATA[<div class="addthis_toolbox addthis_default_style " addthis:url='http://ducharme.cc/quick-tip-ctrl3/' addthis:title='Quick tip Ctrl+3 '  ><a class="addthis_button_facebook_like" fb:like:layout="button_count"></a><a class="addthis_button_tweet"></a><a class="addthis_button_google_plusone" g:plusone:size="medium"></a><a class="addthis_counter addthis_pill_style"></a></div><p><a href="http://ducharme.cc/wp-content/uploads/2012/01/noMouse1.png"><img src="http://ducharme.cc/wp-content/uploads/2012/01/noMouse1.png" alt="" title="noMouse1" width="150" height="150" class="alignleft size-full wp-image-844" /></a>So lately I&#8217;ve been teaching myself how to use the Vim editor. If you know anything about Vim you know it is all about efficiency of keyboard usage. The more I&#8217;ve used Vim, the more I don&#8217;t want to move my hand to my mouse if I don&#8217;t have to. It&#8217;s not that I&#8217;m lazy, I just want to challenge myself to be more efficient.</p>
<p>If you&#8217;ve been reading my blog lately you may have read about me using embedded fonts via Resource Bundles. One problem I&#8217;ve always had with embedded fonts in Flash Builder is that some builds they work and some they don&#8217;t. I&#8217;m guessing its part of the incremental compilation process because doing a Project&#8211;>Clean&#8230; seems to fix the problem. It works but then I have to move my hand all the way over to my mouse to make it happen. I needed to find a good keyboard shortcut, for some reason I wanted it to be a default key binding.<br />
<a href="http://ducharme.cc/wp-content/uploads/2012/01/ctrl3Clean.png"><img src="http://ducharme.cc/wp-content/uploads/2012/01/ctrl3Clean-300x297.png" alt="" title="ctrl3Clean" width="300" height="297" class="aligncenter size-medium wp-image-842" /></a></p>
<h2>Enter CTRL+3</h2>
<p>There are shortcuts for Flash Builder common features but Project&#8211;>Clean&#8230; isn&#8217;t one of them. Eclipse has an interesting Keyboard Shortcut in CTRL+3 &#8211; Quick Access. The Quick Access shortcut allows you to hit the shortcut then just start typing the name of the feature you want to use &#8211; and there is a big list available to you in Eclipse. A bonus to the Quick Access shortcut is that the last feature you used can be used by hitting return. So to set up a shortcut for Project&#8211;>Clean there are just a couple steps.</p>
<ol>
<li>Hit Ctrl+3</li>
<li>type &#8216;Clean&#8230;&#8217; then press enter</li>
</ol>
<p>Now you can trigger a Project&#8211;>Clean&#8230; with just Ctrl+3 and Enter. The default for me is to clean all projects and I usually only have one project open at a time so I just enter through that as well.</p>
<p>Really, you can use this with just about any feature you&#8217;d like. Once you use it, the feature goes into your Quick Access list. Then its as easy as an arrow up or down (or a few keystrokes to type the action name) to get the feature back to the top of your list and use it.</p>
<p>For me this is one of the hidden gems of Flash Builder. You get this for free for using Eclipse. There&#8217;s plenty more where that came from too. Are there some hidden gems you use all the time? Please share them in the comments below. Flash Fridays are all about sharing knowledge with the community so that we become better developers.</p>
]]></content:encoded>
			<wfw:commentRss>http://ducharme.cc/quick-tip-ctrl3/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Setting up Resource Bundles</title>
		<link>http://ducharme.cc/setting-up-resource-bundles/</link>
		<comments>http://ducharme.cc/setting-up-resource-bundles/#comments</comments>
		<pubDate>Fri, 13 Jan 2012 08:01:32 +0000</pubDate>
		<dc:creator>Deacon</dc:creator>
				<category><![CDATA[Flash Friday]]></category>
		<category><![CDATA[Actionscript]]></category>
		<category><![CDATA[as3]]></category>
		<category><![CDATA[Flash]]></category>
		<category><![CDATA[flash player]]></category>
		<category><![CDATA[localization]]></category>
		<category><![CDATA[resource bundles]]></category>

		<guid isPermaLink="false">http://ducharme.cc/?p=789</guid>
		<description><![CDATA[<div class="addthis_toolbox addthis_default_style " addthis:url='http://ducharme.cc/setting-up-resource-bundles/' addthis:title='Setting up Resource Bundles '  ><a class="addthis_button_facebook_like" fb:like:layout="button_count"></a><a class="addthis_button_tweet"></a><a class="addthis_button_google_plusone" g:plusone:size="medium"></a><a class="addthis_counter addthis_pill_style"></a></div><a href="http://ducharme.cc/wp-content/uploads/2012/01/rollsOfCoins.jpg"><img src="http://ducharme.cc/wp-content/uploads/2012/01/rollsOfCoins-150x150.jpg" alt="" title="rollsOfCoins" width="150" height="150" class="alignleft size-thumbnail wp-image-803" /></a>In <a href="/?p=745">last week's Flash Friday post</a> I wrote about using resource bundles to handle embedded fonts. I also left out any instructions about how to set up your project to use resource bundles, instead telling the reader to search the interwebs. I also said I would provide one of my own instructions so here it is.]]></description>
			<content:encoded><![CDATA[<div class="addthis_toolbox addthis_default_style " addthis:url='http://ducharme.cc/setting-up-resource-bundles/' addthis:title='Setting up Resource Bundles '  ><a class="addthis_button_facebook_like" fb:like:layout="button_count"></a><a class="addthis_button_tweet"></a><a class="addthis_button_google_plusone" g:plusone:size="medium"></a><a class="addthis_counter addthis_pill_style"></a></div><p><a href="http://ducharme.cc/wp-content/uploads/2012/01/rollsOfCoins.jpg"><img src="http://ducharme.cc/wp-content/uploads/2012/01/rollsOfCoins-150x150.jpg" alt="" title="rollsOfCoins" width="150" height="150" class="alignleft size-thumbnail wp-image-803" /></a>In <a href="http://ducharme.cc/?p=745">last week&#8217;s Flash Friday post</a> I wrote about using resource bundles to handle embedded fonts. I also left out any instructions about how to set up your project to use resource bundles, instead telling the reader to search the interwebs. I also said I would provide one of my own instructions so here it is.</p>
<h2>Project Setup</h2>
<p>Your project needs to be able to find your resource bundles so they need to live in your source path. You could place the bundles in the same folder as your source code, but I find that feels a little disorganized. Instead create a folder for your resource bundles and add it to your source path.</p>
<p>In other tutorials they talk about using resource bundles for localization. If that is the case you can add the files as follows. I&#8217;ll assume you are using the <i>en_US</i> locale, otherwise replace all instances of <i>en_US</i> with the locale you are using.</p>
<ol>
<li>create folder path in your project of: <i>locale\en_US</i></li>
<li>add the source folder <i>locale\{locale}</i></li>
<li>add the following to your compiler arguments: <i>-locale=en_US</i></li>
</ol>
<p>Now you can place your resource bundles in the <i>locale\en_US</i> folder.</p>
<h2>Property Files</h2>
<p>Resource bundles are sometimes referred to as property files because you create them in files with a <i>.properties</i> extenstion. The part before the extension is the bundle name, and you would use that to get the information you wanted. For example, you you had a bundle named <i>fonts</i> you would create a file called <i>fonts.properties</i>. If you were paying attention to <a href="http://ducharme.cc/?p=745">my previous article</a> you probably saw me use this same bundle name.</p>
<h3>Inside the property file</h3>
<p>The property file is fairly simple. It is just a key/value pair separated by an equal sign(=). A simple resource bundle that stores text strings might be called <i>text.properties</i> and look like the following.</p>

<div class="wp_syntax"><div class="code"><pre class="actionscript3" style="font-family:monospace;"># <span style="color: #004993;">text</span><span style="color: #000066; font-weight: bold;">.</span>properties
&nbsp;
hello=Hello World<span style="color: #000066; font-weight: bold;">!</span>
goodbye=Good<span style="color: #000066; font-weight: bold;">-</span>bye cruel world<span style="color: #000066; font-weight: bold;">!</span></pre></div></div>

<p>You can look back at my font embedding article to see how I embedded fonts. You can use the same method to embed anything that you can embed using the <i>Embed</i> metatag.</p>
<h3>Using the properties in the file</h3>
<p>The first thing you need to do is add the <i>Resource Bundle</i> metatag somewhere in your project. You only need to use it once per project for every bundle you are going to use. However, once you do this it gets compiled into the project, even if you don&#8217;t use the resources. So I would recommend using it in the class(es) that use(s) the bundle.</p>

<div class="wp_syntax"><div class="code"><pre class="actionscript3" style="font-family:monospace;">	<span style="color: #000000;">&#91;</span>ResourceBundle<span style="color: #000000;">&#40;</span><span style="color: #990000;">&quot;fonts&quot;</span><span style="color: #000000;">&#41;</span><span style="color: #000000;">&#93;</span>
	<span style="color: #0033ff; font-weight: bold;">public</span> <span style="color: #9900cc; font-weight: bold;">class</span> MyFontsBundleUsingClass <span style="color: #000000;">&#123;</span>
		<span style="color: #000066; font-weight: bold;">...</span></pre></div></div>

<p>Then to use the resources you just need to get an instance of the ResourceManager use one of its functions to get the resource. Here is an example for grabbing a String from my text.properties file I created earlier.</p>

<div class="wp_syntax"><div class="code"><pre class="actionscript3" style="font-family:monospace;">	<span style="color: #6699cc; font-weight: bold;">var</span> resources<span style="color: #000066; font-weight: bold;">:</span>IResourceManager = ResourceManager<span style="color: #000066; font-weight: bold;">.</span>getInstance<span style="color: #000000;">&#40;</span><span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>
	<span style="color: #6699cc; font-weight: bold;">var</span> hello<span style="color: #000066; font-weight: bold;">:</span><span style="color: #004993;">String</span> = resources<span style="color: #000066; font-weight: bold;">.</span>getString<span style="color: #000000;">&#40;</span><span style="color: #990000;">&quot;text&quot;</span><span style="color: #000066; font-weight: bold;">,</span> <span style="color: #990000;">&quot;hello&quot;</span><span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>
	<span style="color: #6699cc; font-weight: bold;">var</span> goodbye<span style="color: #000066; font-weight: bold;">:</span><span style="color: #004993;">String</span> = resources<span style="color: #000066; font-weight: bold;">.</span>getString<span style="color: #000000;">&#40;</span><span style="color: #990000;">&quot;text&quot;</span><span style="color: #000066; font-weight: bold;">,</span> <span style="color: #990000;">&quot;goodbye&quot;</span><span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span></pre></div></div>

<ul>Of course you can get more than just strings from a property file. Just choose from the following list of functions in the <i>IResourceManager</i> interface.</p>
<li>getString</li>
<li>getBoolean</li>
<li>getInt</li>
<li>getUint</li>
<li>getNumber</li>
<li>getStringArray</li>
<li>getClass</li>
<li>getObject</li>
</ul>
<p>And that is my basic primer on using ResourceBundles in actionscript projects. In the grand tradition of this line of posts I am leaving out many important bits of information. Loading resource bundles at runtime is one of them. I&#8217;ll leave that as a web search exercise for the reader until I write an article on that in the future. If there are other bits of information you would like clarity on let me know in the comments.</p>
]]></content:encoded>
			<wfw:commentRss>http://ducharme.cc/setting-up-resource-bundles/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Resource Bundles and Fonts</title>
		<link>http://ducharme.cc/resource-bundles-and-fonts/</link>
		<comments>http://ducharme.cc/resource-bundles-and-fonts/#comments</comments>
		<pubDate>Fri, 06 Jan 2012 09:00:52 +0000</pubDate>
		<dc:creator>Deacon</dc:creator>
				<category><![CDATA[Flash Friday]]></category>
		<category><![CDATA[embedding]]></category>
		<category><![CDATA[Flash]]></category>
		<category><![CDATA[Flex]]></category>
		<category><![CDATA[Fonts]]></category>
		<category><![CDATA[resource bundles]]></category>

		<guid isPermaLink="false">http://ducharme.cc/?p=745</guid>
		<description><![CDATA[<div class="addthis_toolbox addthis_default_style " addthis:url='http://ducharme.cc/resource-bundles-and-fonts/' addthis:title='Resource Bundles and Fonts '  ><a class="addthis_button_facebook_like" fb:like:layout="button_count"></a><a class="addthis_button_tweet"></a><a class="addthis_button_google_plusone" g:plusone:size="medium"></a><a class="addthis_counter addthis_pill_style"></a></div><a href="http://ducharme.cc/wp-content/uploads/2012/01/font_paper.jpg"><img src="http://ducharme.cc/wp-content/uploads/2012/01/font_paper-150x150.jpg" alt="" title="font_paper" width="150" height="150" class="alignleft size-thumbnail wp-image-746" /></a>If you've been working with Flash for a while, especially FlashBuilder, you've probably heard of resource bundles. If you are like me you heard they had something to do with localization. Then you quickly forgot about them. The truth is they aren't only for localization. In fact, they are a really good way to centralize and manage resources in actionscript project. They also happen to work really well for localization. So if they do more than just localization, what are resource bundles.]]></description>
			<content:encoded><![CDATA[<div class="addthis_toolbox addthis_default_style " addthis:url='http://ducharme.cc/resource-bundles-and-fonts/' addthis:title='Resource Bundles and Fonts '  ><a class="addthis_button_facebook_like" fb:like:layout="button_count"></a><a class="addthis_button_tweet"></a><a class="addthis_button_google_plusone" g:plusone:size="medium"></a><a class="addthis_counter addthis_pill_style"></a></div><p><a href="http://ducharme.cc/wp-content/uploads/2012/01/font_paper.jpg"><img src="http://ducharme.cc/wp-content/uploads/2012/01/font_paper-150x150.jpg" alt="" title="font_paper" width="150" height="150" class="alignleft size-thumbnail wp-image-746" /></a>If you&#8217;ve been working with Flash for a while, especially FlashBuilder, you&#8217;ve probably heard of resource bundles. If you are like me you heard they had something to do with localization. Then you quickly forgot about them. The truth is they aren&#8217;t only for localization. In fact, they are a really good way to centralize and manage resources in actionscript project. They also happen to work really well for localization. So if they do more than just localization, what are resource bundles.</p>
<h2>What are Resource Bundles</h2>
<p>I hate to state the obvious, but resource bundles are bundles of&#8230;wait for it&#8230;resources! So with that the next question is, &#8220;What is a resource?&#8221;</p>
<ul>A resource could be a&#8230;</p>
<li>&#8230;String</li>
<li>&#8230;Image</li>
<li>&#8230;Config Value</li>
<li>&#8230;Font</li>
</ul>
<h2>Why would you want to use them?</h2>
<p>Okay, now you know what resources are. You&#8217;ve managed these <i>resources</i> in other ways. Why would you want to use resource bundles over the way you already do?</p>
<ul>Here are a few good reasons</p>
<li>2 words, cleaner code</li>
<li>easier localization</li>
<li>change text, configs, etc. in one spot</li>
</ul>
<h2>How to setup</h2>
<p>Before we get into using resource bundles with fonts, it is important to know how to set them up. Also you might want to know how to use them with the other, simpler types of resources. There are many great articles already available online if you want to search. I plan to write a <a href="http://ducharme.cc/?p=789">&#8220;how to setup resource bundles&#8221;</a> post next week so check back then.</p>
<h2>I hate fonts (but I understand they make stuff look good)</h2>
<p>I have always dreaded working with embedded fonts on a flash project. Even though I&#8217;ve done it many times, and should know how, each project has brought its own wrinkle that has caused grief for me. Embedding fonts via resource bundles gives you more control over the specifics of the font. Also, since it is built into development with the Flex SDK, you can more readily change them for your needs right in the project. Need to embed more characters? Change to/from CFF embedding? Just type in the appropriate text and you are done. Depending on your development environment you may need to clean your project.</p>
<p>One other point, I recently work on a localization project for game that was already live. Even though we had all the text strings externalized this project sucked and was slow going. If I had my strings, and other resources, setup in resource bundles I would have been halfway done with the project before I even started. So enough talk, how can we use resource bundles to help with font embedd?</p>
<h2>Embedding fonts with resource bundles</h2>
<p>A font gets embedded in a resource bundle much like an image get embedded, using the <i>Embed</i> metatag. In fact it is awfully similar to using the <i>Embed</i> metatag as you would in an actionscript file.</p>
<p>It might look something like this:</p>
<pre>
#a file called fonts.properties

AFontDesignersLove="ComicSans"
ComicSans=Embed(\
	source="./assets/fonts/comic.ttf", \
	fontName="ComicSans", \
	embedAsCFF="false", \
	mimeType="application/x-font", \
	advancedAntiAliasing="true", \
	unicodeRange="U+0020-007E")
</pre>
<p>The backslash(\) is useful in property files to make long entries more readable. I&#8217;m all about readable, editable code.</p>
<p>To use this font in its current form would work like this:</p>

<div class="wp_syntax"><div class="code"><pre class="actionscript3" style="font-family:monospace;"><span style="color: #000000;">&#91;</span>ResourceBundle<span style="color: #000000;">&#40;</span><span style="color: #990000;">&quot;fonts&quot;</span><span style="color: #000000;">&#41;</span><span style="color: #000000;">&#93;</span>
<span style="color: #0033ff; font-weight: bold;">public</span> <span style="color: #9900cc; font-weight: bold;">class</span> MyFontUsingClass <span style="color: #000000;">&#123;</span>
&nbsp;
<span style="color: #009900; font-style: italic;">// put some other code here</span>
&nbsp;
	<span style="color: #6699cc; font-weight: bold;">var</span> resources<span style="color: #000066; font-weight: bold;">:</span>IResourceManager = ResourceManager<span style="color: #000066; font-weight: bold;">.</span>getInstance<span style="color: #000000;">&#40;</span><span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>
	<span style="color: #6699cc; font-weight: bold;">var</span> <span style="color: #004993;">fontName</span><span style="color: #000066; font-weight: bold;">:</span><span style="color: #004993;">String</span> = resources<span style="color: #000066; font-weight: bold;">.</span>getString<span style="color: #000000;">&#40;</span><span style="color: #990000;">&quot;fonts&quot;</span><span style="color: #000066; font-weight: bold;">,</span> <span style="color: #990000;">&quot;AFontDesignersLove&quot;</span><span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>
	<span style="color: #6699cc; font-weight: bold;">var</span> format<span style="color: #000066; font-weight: bold;">:</span><span style="color: #004993;">TextFormat</span> = <span style="color: #0033ff; font-weight: bold;">new</span> <span style="color: #004993;">TextFormat</span><span style="color: #000000;">&#40;</span><span style="color: #004993;">fontName</span><span style="color: #000066; font-weight: bold;">,</span> FONT_SIZE<span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>
&nbsp;
	_questionField = <span style="color: #0033ff; font-weight: bold;">new</span> <span style="color: #004993;">TextField</span><span style="color: #000000;">&#40;</span><span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>
	_questionField<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">defaultTextFormat</span> = format<span style="color: #000066; font-weight: bold;">;</span>
	_questionField<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">embedFonts</span> = <span style="color: #0033ff; font-weight: bold;">true</span><span style="color: #000066; font-weight: bold;">;</span>
&nbsp;
<span style="color: #009900; font-style: italic;">// put some more code here</span></pre></div></div>

<p>You probably noticed a couple things here:</p>
<ul>
<li>I lied &#8211; designers hate Comic Sans</li>
<li>I also put the font name (string resource) in the property file and just used it to bring in the font.</li>
</ul>
<p>Once you use the resource bundle metatag in your code for a bundle that has fonts, those fonts are already embedded in your code. There is no need to do the old <code>Font.registerFont()</code> silliness. At least not when you compile the resource bundle into your swf.</p>
<p>The above code is still a bit heavy and I&#8217;d hate to have to write it every time. My advice is to clean it up into something that looks a bit more like this:</p>

<div class="wp_syntax"><div class="code"><pre class="actionscript3" style="font-family:monospace;">_questionField<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">defaultTextFormat</span> = Fonts<span style="color: #000066; font-weight: bold;">.</span>getFormat<span style="color: #000000;">&#40;</span><span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>
_questionField<span style="color: #000066; font-weight: bold;">.</span><span style="color: #004993;">embedFonts</span> = <span style="color: #0033ff; font-weight: bold;">true</span><span style="color: #000066; font-weight: bold;">;</span></pre></div></div>

<p>Depending on what type of format data is used, you might need to make this a little more robust than this but aiming towards this will make you enjoy the benefits gained from embedding fonts this way. For now, I leave this as an exercise for the reader. I plan to write an article on some resource bundle <i>good practices<super>*</super></i> in the future.</p>
]]></content:encoded>
			<wfw:commentRss>http://ducharme.cc/resource-bundles-and-fonts/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Under the mask but I didn&#8217;t ask &#8211; Flash Friday</title>
		<link>http://ducharme.cc/under-the-mask-but-i-didnt-ask-flash-friday/</link>
		<comments>http://ducharme.cc/under-the-mask-but-i-didnt-ask-flash-friday/#comments</comments>
		<pubDate>Fri, 28 Oct 2011 13:00:48 +0000</pubDate>
		<dc:creator>Deacon</dc:creator>
				<category><![CDATA[Flash Friday]]></category>
		<category><![CDATA[Actionscript]]></category>
		<category><![CDATA[as3]]></category>
		<category><![CDATA[Flash]]></category>
		<category><![CDATA[mask]]></category>
		<category><![CDATA[quirk]]></category>

		<guid isPermaLink="false">http://ducharme.cc/?p=706</guid>
		<description><![CDATA[<div class="addthis_toolbox addthis_default_style " addthis:url='http://ducharme.cc/under-the-mask-but-i-didnt-ask-flash-friday/' addthis:title='Under the mask but I didn&#8217;t ask &#8211; Flash Friday '  ><a class="addthis_button_facebook_like" fb:like:layout="button_count"></a><a class="addthis_button_tweet"></a><a class="addthis_button_google_plusone" g:plusone:size="medium"></a><a class="addthis_counter addthis_pill_style"></a></div>Masks in the flash IDE are an interesting thing. You may have noticed that masks created in the IDE are not found in the normal &#8220;mask&#8221; property found on a movieclip. This is because it isn&#8217;t a normal mask. The mask is working on a layer instead of on a single DisplayObject. This little quirk [...]]]></description>
			<content:encoded><![CDATA[<div class="addthis_toolbox addthis_default_style " addthis:url='http://ducharme.cc/under-the-mask-but-i-didnt-ask-flash-friday/' addthis:title='Under the mask but I didn&#8217;t ask &#8211; Flash Friday '  ><a class="addthis_button_facebook_like" fb:like:layout="button_count"></a><a class="addthis_button_tweet"></a><a class="addthis_button_google_plusone" g:plusone:size="medium"></a><a class="addthis_counter addthis_pill_style"></a></div><p>Masks in the flash IDE are an interesting thing. You may have noticed that masks created in the IDE are not found in the normal &#8220;mask&#8221; property found on a movieclip. This is because it isn&#8217;t a normal mask. The mask is working on a layer instead of on a single DisplayObject. This little quirk causes some interesting behavior that you may never have noticed before.<br />
<a href="http://ducharme.cc/wp-content/uploads/2011/10/timelineMask.jpg"><img src="http://ducharme.cc/wp-content/uploads/2011/10/timelineMask-300x91.jpg" alt="" title="timelineMask" width="300" height="91" class="aligncenter size-medium wp-image-707" /></a><br />
If you have a MovieClip with a mask as a top layer of the timeline there is some strange behavior when you addChild to that MovieClip. The added content gets placed under the mask. Wait! What? The added content gets placed under the mask. You may not have noticed this behavior in the past because you may never have done it, you may not have your item cut off by the mask or you just might not have been able to figure out why you couldn&#8217;t see your item.  However, it is happening.<br />
[ad#Google Adsense]<br />
Another twist on this phenomenon is that if the mask isn&#8217;t the top layer but your remove the items that are on the top layer then add a DisplayObject. Well, in that scenario your new DisplayObject is also placed under this &#8220;Layer Mask&#8221;. I found this out today when I had a top layer above a mask that was a TextField. For a localization project I&#8217;m working on I had to wrap the field in a wrapper class that then gets added back where the textfield was. I was trying to figure out why the textfield was now appearing like it was under the mask. The answer&#8230;because it now was.</p>
<p>So how did I deal with this? How can you deal with this if you find it happening? First off, it might be an easy thing to just restructure your timeline so the mask isn&#8217;t on top. If that isn&#8217;t possible, the <s>hack</s> easy fix is to add a blank MovieClip symbol to the layer above the mask layer. That is what I did for this asset and all is well.<br />
<a href="http://ducharme.cc/wp-content/uploads/2011/10/maskBufferTimeline.jpg"><img src="http://ducharme.cc/wp-content/uploads/2011/10/maskBufferTimeline-300x110.jpg" alt="" title="maskBufferTimeline" width="300" height="110" class="aligncenter size-medium wp-image-708" /></a></p>
<p>I haven&#8217;t extensively tested this but my guess is the quirk may exist if you add something to any layer right above a &#8220;Layer Mask&#8221; it will placed under the mask. Is this something you have experienced? How have you worked around it? Have you used it for any type of effect?</p>
<p>I don&#8217;t believe you really want to count on this behavior for anything as I don&#8217;t believe I&#8217;ve seen it documented anywhere. Someone at Adobe might read my blog <img src='http://ducharme.cc/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' />  and decide this isn&#8217;t appropriate behavior they might fix it in Flash Player 20 or something.</p>
]]></content:encoded>
			<wfw:commentRss>http://ducharme.cc/under-the-mask-but-i-didnt-ask-flash-friday/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Flash Friday &#8211; Version Control</title>
		<link>http://ducharme.cc/flash-friday-version-control/</link>
		<comments>http://ducharme.cc/flash-friday-version-control/#comments</comments>
		<pubDate>Fri, 29 Apr 2011 10:00:37 +0000</pubDate>
		<dc:creator>Deacon</dc:creator>
				<category><![CDATA[Flash Friday]]></category>
		<category><![CDATA[git]]></category>
		<category><![CDATA[svn]]></category>
		<category><![CDATA[version control]]></category>

		<guid isPermaLink="false">http://ducharme.cc/?p=639</guid>
		<description><![CDATA[<div class="addthis_toolbox addthis_default_style " addthis:url='http://ducharme.cc/flash-friday-version-control/' addthis:title='Flash Friday &#8211; Version Control '  ><a class="addthis_button_facebook_like" fb:like:layout="button_count"></a><a class="addthis_button_tweet"></a><a class="addthis_button_google_plusone" g:plusone:size="medium"></a><a class="addthis_counter addthis_pill_style"></a></div>When I first started my Flash Friday posts I wanted to write about the whole flash ecosystem. At the time I thought about Flash, Actionscript, Flex, Flex/FlashBuilder and a few other tools. Recently, I have realized that the ecosystem is much larger than just flash. For people to truly be well rounded flash and actionscript [...]]]></description>
			<content:encoded><![CDATA[<div class="addthis_toolbox addthis_default_style " addthis:url='http://ducharme.cc/flash-friday-version-control/' addthis:title='Flash Friday &#8211; Version Control '  ><a class="addthis_button_facebook_like" fb:like:layout="button_count"></a><a class="addthis_button_tweet"></a><a class="addthis_button_google_plusone" g:plusone:size="medium"></a><a class="addthis_counter addthis_pill_style"></a></div><p><img class="alignleft" title="Tortoise SVN logo" src="http://www.malblackshaw.com/images/icons/tsvn_logo.png" alt="" width="128" height="128" />When I first started my Flash Friday posts I wanted to write about the whole flash ecosystem. At the time I thought about Flash, Actionscript, Flex, Flex/FlashBuilder and a few other tools. Recently, I have realized that the ecosystem is much larger than just flash. For people to truly be well rounded flash and actionscript developers who make every other flash and actionscript developer look good its important to know about these non-flash things. One of the most important things to any developer is version control.</p>
<p>On the surface, version control seems simple enough. Save files in a way that allows me to go back in time if I make a mistake or forgot what I did in the past. Many people, a past version of myself included, think that&#8217;s all there is to version control and thus us backup folders or file naming conventions to achieve this goal. I am writing this article because version control is way more than just this and definitely more important. For those who really master it you can actually save yourself quite a bit of time.</p>
<h2>Why learn version control</h2>
<p>If version control is more than backing up files what is it? I&#8217;m glad you asked. Version control is a way to safely and elegantly work with multiple people on a project. The multiple people include people in the same office or people on the other side of the world. It also includes the multiple yous that you wish you could create so that you could finish that cool new feature but you just can&#8217;t take the time to hunker down and get it done all at once.</p>
<p>Version control is and/or allows:</p>
<ul>
<li>Saving a history of your work as it evolves</li>
<li>Keeping track of who did what</li>
<li>Trying things out that you might throw away
<ul>
<li>Without breaking working code</li>
<li>Keeping a history of that as well</li>
</ul>
</li>
<li>Working on a file without worrying if somebody else is</li>
<li>Taking someone else&#8217;s work in a different direction ( forking )</li>
</ul>
<h2>What should you learn</h2>
<ul>
<li>SVN &#8211; The most popular centralized version control system
<ul>
<li>Lots of great tools makes it easier to include artists in the version control system</li>
</ul>
</li>
<li>GIT &#8211; A very popular up and coming distrubuted version control system</li>
<li>Branching and Merging
<ul>
<li>Become a master at this for whichever version control systems you learn and it will make your professional life much simpler.</li>
</ul>
</li>
</ul>
<h2>Tools</h2>
<ul>
<li>Subclipse &#8211; a great eclipse SVN plugin you can use with Flashbuilder or FDT</li>
<li>EGit &#8211; a similar eclipse plugin for Git</li>
<li>TortoiseSVN/TortoiseGit  - two great sell extensions for version control in Windows explorer.</li>
<li>GitHub &#8211; If you are working with Git this is a great place to start putting your code. Lots of straightforward how-tos</li>
<li>Books &#8211; I&#8217;ve found the following two books to be extremely helpful in learning SVN and Git
<ul>
<li><a href="http://www.amazon.com/dp/0977616657/" target="_blank">Pragmatic Version Control: Using Subversion</a></li>
<li><a href="http://www.amazon.com/dp/1934356158" target="_blank">Pragmatic Version Control: Using Git</a></li>
</ul>
</li>
</ul>
<p>&nbsp;</p>
<h2>Final Notes</h2>
<p>I mentioned SVN and GIT because they are currently in such wide use. However, version control concepts can be learned from any version control system. If your company or project is using something else, such as CVS or Mercurial, learn it and master as much of it as you can. I can&#8217;t stress enough how important it is to master branching and merging. Get good at this and task switching will be much easier so you&#8217;ll be able to working on many projects at once.</p>
<p>What are your thoughts on version control? What problems have you had? What successes have you had?</p>
]]></content:encoded>
			<wfw:commentRss>http://ducharme.cc/flash-friday-version-control/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Flash Friday &#8211; A Simple List</title>
		<link>http://ducharme.cc/flash-friday-a-simple-list/</link>
		<comments>http://ducharme.cc/flash-friday-a-simple-list/#comments</comments>
		<pubDate>Fri, 18 Mar 2011 13:00:48 +0000</pubDate>
		<dc:creator>Deacon</dc:creator>
				<category><![CDATA[Flash Friday]]></category>
		<category><![CDATA[Alec McEachran]]></category>
		<category><![CDATA[Link]]></category>
		<category><![CDATA[Lists]]></category>

		<guid isPermaLink="false">http://ducharme.cc/?p=606</guid>
		<description><![CDATA[<div class="addthis_toolbox addthis_default_style " addthis:url='http://ducharme.cc/flash-friday-a-simple-list/' addthis:title='Flash Friday &#8211; A Simple List '  ><a class="addthis_button_facebook_like" fb:like:layout="button_count"></a><a class="addthis_button_tweet"></a><a class="addthis_button_google_plusone" g:plusone:size="medium"></a><a class="addthis_counter addthis_pill_style"></a></div>A few people who&#8217;ve worked with me in a programming job may have heard me talk about how a custom list should be done. For performance reasons you don&#8217;t want to recreate the visual &#8220;cell&#8221; n-times. That could lead to all sorts of unforeseen problems. Instead you want only enough cells to be visual during scrolling and [...]]]></description>
			<content:encoded><![CDATA[<div class="addthis_toolbox addthis_default_style " addthis:url='http://ducharme.cc/flash-friday-a-simple-list/' addthis:title='Flash Friday &#8211; A Simple List '  ><a class="addthis_button_facebook_like" fb:like:layout="button_count"></a><a class="addthis_button_tweet"></a><a class="addthis_button_google_plusone" g:plusone:size="medium"></a><a class="addthis_counter addthis_pill_style"></a></div><p><a href="http://alecmce.com/as3/a-simple-list"><img class="alignleft" title="Simple List Structure" src="http://alecmce.com/wp-content/uploads/2011/01/structure.png" alt="The structure of a simple list" width="318" height="240" /></a>A few people who&#8217;ve worked with me in a programming job may have heard me talk about how a custom list should be done. For performance reasons you don&#8217;t want to recreate the visual &#8220;cell&#8221; <em>n</em>-times. That could lead to all sorts of unforeseen problems. Instead you want only enough cells to be visual during scrolling and as you scroll through the list just bring the &#8220;cells&#8221; round to the other side.</p>
<p>One of the people I work with, <a title="About Alec" href="http://alecmce.com/about" target="_blank">Alec McEachran</a>, wrote a blog post  on just this topic. It is entitled &#8220;<a title="A Simple List" href="http://alecmce.com/as3/a-simple-list" target="_blank">A Simple List</a>&#8221; and I&#8217;ll let you read his article and code on the subject. What is interesting about his code  for a list is he does a great job keeping the list class very simple. It keeps to a pretty narrow responsibility. He&#8217;s quite good at solutions with well defined class responsibilities.</p>
<p>In our current project, <a title="Facebook Application page for Monster Galaxy" href="http://www.facebook.com/apps/application.php?id=129748227041755" target="_blank">Monster Galaxy</a>, we have used this code in a few places. It has been modified for our purposes but at the base level described in his article the code makes custom list designs easy to implement.</p>
<p>Alec is a very intelligent programmer and has some other great articles on <a title="Alec's Blog" href="http://alecmce.com" target="_blank">his blog</a>. If you like what you read there you might also like to follow him on twitter (<a href="http://twitter.com/alecmce" target="_blank">@alecmce</a>). Of course, his twitter feed carries a lot more of his opinions and personality. It&#8217;s quite fun though, I promise <img src='http://ducharme.cc/wp-includes/images/smilies/icon_wink.gif' alt=';)' class='wp-smiley' /> </p>
<p>Of course, I have a blog as well which you are reading now and thank you for that. If you haven&#8217;t done so already, follow me on twitter( <a title="My twitter feed" href="http://twitter.com/diacre" target="_blank">@diacre</a> ) to find out about new blog posts as well as my opinions and personality ( which you may or may not find as colorful as Alec&#8217;s ). Please let me know in the comments what you think of Alec&#8217;s list class. If you have a different solution that you like I&#8217;d love to hear that as well. Until next time&#8230;au revoir.</p>
<p>&nbsp;</p>
]]></content:encoded>
			<wfw:commentRss>http://ducharme.cc/flash-friday-a-simple-list/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>Flash Friday Refactored &#8211; IS_IN</title>
		<link>http://ducharme.cc/flash-friday-is-in-refactored/</link>
		<comments>http://ducharme.cc/flash-friday-is-in-refactored/#comments</comments>
		<pubDate>Fri, 11 Mar 2011 10:00:08 +0000</pubDate>
		<dc:creator>Deacon</dc:creator>
				<category><![CDATA[Flash Friday]]></category>
		<category><![CDATA[as3]]></category>
		<category><![CDATA[fdt]]></category>
		<category><![CDATA[Flash]]></category>
		<category><![CDATA[flexUnit]]></category>
		<category><![CDATA[flexUnit4]]></category>
		<category><![CDATA[prototype]]></category>
		<category><![CDATA[refactoring]]></category>
		<category><![CDATA[tdd]]></category>
		<category><![CDATA[test driven developement]]></category>
		<category><![CDATA[unit testing]]></category>

		<guid isPermaLink="false">http://ducharme.cc/?p=562</guid>
		<description><![CDATA[<div class="addthis_toolbox addthis_default_style " addthis:url='http://ducharme.cc/flash-friday-is-in-refactored/' addthis:title='Flash Friday Refactored &#8211; IS_IN '  ><a class="addthis_button_facebook_like" fb:like:layout="button_count"></a><a class="addthis_button_tweet"></a><a class="addthis_button_google_plusone" g:plusone:size="medium"></a><a class="addthis_counter addthis_pill_style"></a></div>A while back I wrote a proof of concept isIn functionality injector that seemed to work fairly decently. I even wrote some tests for it that it passed with flying colors. Being a proof of concept I never really used it and never ran into the danger of using that functionality. Recently I downloaded the trial [...]]]></description>
			<content:encoded><![CDATA[<div class="addthis_toolbox addthis_default_style " addthis:url='http://ducharme.cc/flash-friday-is-in-refactored/' addthis:title='Flash Friday Refactored &#8211; IS_IN '  ><a class="addthis_button_facebook_like" fb:like:layout="button_count"></a><a class="addthis_button_tweet"></a><a class="addthis_button_google_plusone" g:plusone:size="medium"></a><a class="addthis_counter addthis_pill_style"></a></div><p>A while back I wrote a <a href="http://ducharme.cc/testing-object-set/" target="_blank">proof of concept isIn functionality injector</a> that seemed to work fairly decently. I even wrote some tests for it that it passed with flying colors. Being a proof of concept I never really used it and never ran into the danger of using that functionality.</p>
<p>Recently I downloaded the trial for <a href="http://www.fdt.powerflasher.com/" target="_blank">FDT</a> and since it doesn&#8217;t have the same type of FlexUnit integration that <a href="http://www.adobe.com/products/flashbuilder/" target="_blank">FlashBuilder 4</a> has I had to get my tests working differently. When I got the tests up an running my tests for the isIn functionality blew up in spectacular fashion. They didn&#8217;t just fail, the took the whole unit test display down with them. This was the same class and tests that passed cleanly before. What happened?</p>
<p>It turns out messing with the prototype of Object to solve a problem is like fighting fire with a nuclear explosion. It will probably work but cause serious problems throughout the system. So, following the test driven development methodology of red, green, refactor I saw that it was a time for a refactor. Well that and it was now a red test that I wanted to make green.</p>
<p>I came up with a solution that I think is better. It is more flexible than before, since you can select the class you want to add the functionality to. Even better, you can remove the functionality after you add it. Since I&#8217;ve begun to move my code over to GitHub you can find the new code over at <a href="https://github.com/darylducharme/Ducharme-Media-Code/tree/master/src/cc/ducharme/utils">https://github.com/darylducharme/Ducharme-Media-Code/tree/master/src/cc/ducharme/utils</a>. The new test class is available at <a href="https://github.com/darylducharme/Ducharme-Media-Code/blob/master/test-src/utils/IsInTests.as">https://github.com/darylducharme/Ducharme-Media-Code/blob/master/test-src/utils/IsInTests.as</a></p>
<p>You may notice that the last test - dictionaryEnumerationTest()  at this time &#8211; is new. This is the test that checks the problem that I found that was not being tested before. If you are writing tests and find a hole in your tests later, it is always recommended to add new tests to keep you from having the same problem in the future.</p>
<p>Hopefully, someone out there can learn from my mistakes on this occasion. Also, the new isIn class and its static functions are a whole lot more useful than what I had written before. Perhaps someone out there can put it to good use.  What do you think?</p>
]]></content:encoded>
			<wfw:commentRss>http://ducharme.cc/flash-friday-is-in-refactored/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Flash Friday &#8211; Robotlegs Context</title>
		<link>http://ducharme.cc/robotlegs-context/</link>
		<comments>http://ducharme.cc/robotlegs-context/#comments</comments>
		<pubDate>Fri, 04 Mar 2011 10:00:02 +0000</pubDate>
		<dc:creator>Deacon</dc:creator>
				<category><![CDATA[Flash Friday]]></category>
		<category><![CDATA[Actionscript]]></category>
		<category><![CDATA[framework]]></category>
		<category><![CDATA[MVC pattern]]></category>
		<category><![CDATA[MVCS pattern]]></category>
		<category><![CDATA[Robotlegs]]></category>

		<guid isPermaLink="false">http://ducharme.cc/?p=551</guid>
		<description><![CDATA[<div class="addthis_toolbox addthis_default_style " addthis:url='http://ducharme.cc/robotlegs-context/' addthis:title='Flash Friday &#8211; Robotlegs Context '  ><a class="addthis_button_facebook_like" fb:like:layout="button_count"></a><a class="addthis_button_tweet"></a><a class="addthis_button_google_plusone" g:plusone:size="medium"></a><a class="addthis_counter addthis_pill_style"></a></div>A few weeks back I wrote an article saying that I was just starting to work with AS3 Signals and the Robotlegs framework at my new job. Since then I have written a post about AS3 Signals and now it is time to write about Robotlegs. Since there is so much to write about with [...]]]></description>
			<content:encoded><![CDATA[<div class="addthis_toolbox addthis_default_style " addthis:url='http://ducharme.cc/robotlegs-context/' addthis:title='Flash Friday &#8211; Robotlegs Context '  ><a class="addthis_button_facebook_like" fb:like:layout="button_count"></a><a class="addthis_button_tweet"></a><a class="addthis_button_google_plusone" g:plusone:size="medium"></a><a class="addthis_counter addthis_pill_style"></a></div><p style="text-align: left;">A few weeks back I wrote <a title="Robotlegs and Signals" href="http://ducharme.cc/robotlegs-signals/" target="_blank">an article saying that I was just starting to work with AS3 Signals and the Robotlegs framework at my new job</a>. Since then I have written a post about AS3 Signals and now it is time to write about <a href="http://www.robotlegs.org/" target="_blank">Robotlegs</a>. Since there is so much to write about with regards to <a href="http://www.robotlegs.org/" target="_blank">Robotlegs </a>I had to break out one chunk to discuss.</p>
<div id="attachment_552" class="wp-caption aligncenter" style="width: 610px"><a href="http://ducharme.cc/wp-content/uploads/2011/03/robotlegsDiagram.jpg"><img class="size-full wp-image-552" title="Robotlegs Flow Diagram" src="http://ducharme.cc/wp-content/uploads/2011/03/robotlegsDiagram.jpg" alt="Robotlegs Flow Diagram showing MVCS framework" width="600" height="405" /></a><p class="wp-caption-text">Central to the Robotlegs class diagram is the Context</p></div>
<p style="text-align: left;">In working with the framework, reading lots of documentation and finding it central in the diagram above, I thought it best to start with the Context class in the <a href="http://www.robotlegs.org/" target="_blank">Robotlegs </a>framework.</p>
<p style="text-align: left;"><a href="http://www.robotlegs.org/" target="_blank">Robotlegs </a>is an MVCS framework similar to Pure MVC that relies on metadata based dependency injection. On the surface the first cool thing is that you can use the <em>Inject</em> metatag to populate class fields automagically. More automagic part of the framework is that mediators automatically get created when the view they are mediating gets added to the stage. Finally it has a very elegant central event dispatcher and Command pattern model that you barely need to do anything to get working. All this is possible because of the Context.</p>
<h2 style="text-align: left;">Getting [Inject] to work</h2>

<div class="wp_syntax"><div class="code"><pre class="actionscript3" style="font-family:monospace;"><span style="color: #009900; font-style: italic;">// It really is just this easy</span>
<span style="color: #000000;">&#91;</span>Inject<span style="color: #000000;">&#93;</span> <span style="color: #0033ff; font-weight: bold;">public</span> <span style="color: #6699cc; font-weight: bold;">var</span> obj<span style="color: #000066; font-weight: bold;">:</span>MyClass<span style="color: #000066; font-weight: bold;">;</span></pre></div></div>

<p>Most of the power of <a href="http://www.robotlegs.org/" target="_blank">Robotlegs </a>comes from the use of the <em>Inject</em> metatags letting the framework. However, the framework can&#8217;t inject anything until it knows <strong>what</strong> to inject. This is almost entirely done in the Context and I am going to go through the main functions here. Keep in mind that all these methods also have their inverses to undo these acts but I&#8217;ll let you look those up on your own. For now I&#8217;ll keep it simple and we can get to more advanced usages in other articles.</p>
<h3>Injector methods</h3>
<p>injector.mapValue is used when you already have a class instantiated and you want to use that object as a singleton in this application context. The basic format is: injector.mapValue(whenAskedFor:Class, useValue:Object) and might look like this:</p>

<div class="wp_syntax"><div class="code"><pre class="actionscript3" style="font-family:monospace;"><span style="color: #6699cc; font-weight: bold;">var</span> myObject<span style="color: #000066; font-weight: bold;">:</span>MyClass = <span style="color: #0033ff; font-weight: bold;">new</span> MyClass<span style="color: #000000;">&#40;</span><span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>
injector<span style="color: #000066; font-weight: bold;">.</span>mapValue<span style="color: #000000;">&#40;</span> MyClass<span style="color: #000066; font-weight: bold;">,</span> myObject <span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span></pre></div></div>

<p>If you want to do something similar without first instantiating the object, you can use <em>mapSingleton</em>. The format for that is: injector.mapSingleton( whenAskedFor:Class ) and the above example would be changed to this.</p>

<div class="wp_syntax"><div class="code"><pre class="actionscript3" style="font-family:monospace;">injector<span style="color: #000066; font-weight: bold;">.</span>mapSingleton<span style="color: #000000;">&#40;</span> MyClass <span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span></pre></div></div>

<p>injector.mapClass is used when you want the injector to create a new instance of a class every time it is asked to inject that class somewhere. The format for this function is injector.mapClass( whenAskedFor:Class, instantiateClass:Class ) and if we decided against using a singleton for <em>MyClass</em> instances the above examples would become:</p>

<div class="wp_syntax"><div class="code"><pre class="actionscript3" style="font-family:monospace;">injector<span style="color: #000066; font-weight: bold;">.</span>mapClass<span style="color: #000000;">&#40;</span> MyClass<span style="color: #000066; font-weight: bold;">,</span> MyClass <span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span></pre></div></div>

<p>That last one may seem wierd because you type MyClass twice. However, this is because you could pass in any class that extends MyClass for the instantiateClass parameter ( or implements it if it were an interface ).</p>
<p>Once you&#8217;ve used one of these 3 commands ( or some of the others I can talk about at another time ) on all the values you want to inject in your application, anytime the framework creates or manages a class object it will have the information it needs to do just that. So how do you go about getting <a href="http://www.robotlegs.org/" target="_blank">Robotlegs </a>to create a class object? Automagic mediators are a perfect example.</p>
<h2>Automagic Mediators</h2>
<p>In Pure MVC like architectures the Mediator classes handle communication between their views and the rest of the application. Since <a href="http://www.robotlegs.org/" target="_blank">Robotlegs</a> is an MVCS framework based on Pure MVC this is a perfect opportunity to have the framework create the mediator for you. From the Context class you only have to write something similar to:</p>

<div class="wp_syntax"><div class="code"><pre class="actionscript3" style="font-family:monospace;">mediatorMap<span style="color: #000066; font-weight: bold;">.</span>mapView<span style="color: #000000;">&#40;</span> MyView<span style="color: #000066; font-weight: bold;">,</span> MyViewMediator <span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span></pre></div></div>

<p>In this MyView is a view class and MyViewMediator is the mediator designed for it. Now the application will automagically create a MyViewMediator object when any MyView object is added to the stage and inject a reference to the MyView object into it. It will also destroy the MyViewMediator object just as magically when the MyView object gets removed from the stage. I can write much more about this in an article on the Mediator/View relationship that I plan to write in the near future.</p>
<p>Since <a href="http://www.robotlegs.org/" target="_blank">Robotlegs </a>creates the mediator it can easily inject what it needs to after it creates the class. Another class type that <a href="http://www.robotlegs.org/" target="_blank">Robotlegs </a>creates are Command classes.</p>
<h2>Events, Commands and tying it all together</h2>
<p><a href="http://www.robotlegs.org/" target="_blank">Robotlegs </a>uses a centralized event dispatcher throughout to keep the model, view, controller and service sections decoupled from each other and yet tying them together at the same time. One major part of the centralized dispatcher is triggering Commands. If you&#8217;ve read this far, I thank you and I&#8217;m guessing you already know about the Command pattern.</p>
<p>To set up the command pattern in the your <a href="http://www.robotlegs.org/" target="_blank">Robotlegs </a>Context class just use the following format. commandMap.mapEvent( eventType:String, commandClass:Class ) which might look like this:</p>

<div class="wp_syntax"><div class="code"><pre class="actionscript3" style="font-family:monospace;">commandMap<span style="color: #000066; font-weight: bold;">.</span>mapEvent<span style="color: #000000;">&#40;</span> MyCustomEvent<span style="color: #000066; font-weight: bold;">.</span>SOMETHING_IMPORTANT<span style="color: #000066; font-weight: bold;">,</span> DoSomethingImportantCommand <span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span></pre></div></div>

<p>Now, whenever a class in the framework dispatches the <em>SOMETHING_IMPORTANT</em> custom event the DoSomethingImportantCommand will be created and executed. As a bonus, the specific instance of MyCustomEvent can be injected into the command with a single line:</p>

<div class="wp_syntax"><div class="code"><pre class="actionscript3" style="font-family:monospace;"><span style="color: #000000;">&#91;</span>Inject<span style="color: #000000;">&#93;</span> <span style="color: #0033ff; font-weight: bold;">public</span> <span style="color: #6699cc; font-weight: bold;">var</span> event<span style="color: #000066; font-weight: bold;">:</span>MyCustomEvent<span style="color: #000066; font-weight: bold;">;</span></pre></div></div>

<h2>Conclusion</h2>
<p>So this article did not have had any sexy embedded SWF files that use <a href="http://www.robotlegs.org/" target="_blank">Robotlegs</a>. However, this framework&#8217;s strength is not about sexy SWF files but its ease of use which should make creating that sexy file go quicker. The context file is the heart of <a href="http://www.robotlegs.org/" target="_blank">Robotlegs </a>and using the few methods I&#8217;ve written about here you can use it to make a fairly robust application linked together with dependency injection.</p>
<p>I&#8217;ve purposely left a lot out of this post. This is because I just want to wet your appetite to give it a shot as well. Also, I&#8217;d like to hear what kind of questions come up for you in the comments. Finally, I could write a lot more just about the context class and favoring configuration over convention( well sort of  ), but it would just turn into a mess of words and I&#8217;d be surprised if you read this far anyway. If you did, thank you. I&#8217;d love to hear what you think of <a href="http://www.robotlegs.org/" target="_blank">Robotlegs </a>if you&#8217;ve tried it out or even if you&#8217;ve decided not to.</p>
]]></content:encoded>
			<wfw:commentRss>http://ducharme.cc/robotlegs-context/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>Flash Friday &#8211; AS3 Signals Basics</title>
		<link>http://ducharme.cc/flash-friday-as3-signals-basics/</link>
		<comments>http://ducharme.cc/flash-friday-as3-signals-basics/#comments</comments>
		<pubDate>Fri, 11 Feb 2011 13:00:15 +0000</pubDate>
		<dc:creator>Deacon</dc:creator>
				<category><![CDATA[Flash Friday]]></category>
		<category><![CDATA[Actionscript]]></category>
		<category><![CDATA[as3 signals]]></category>
		<category><![CDATA[code]]></category>

		<guid isPermaLink="false">http://ducharme.cc/?p=536</guid>
		<description><![CDATA[<div class="addthis_toolbox addthis_default_style " addthis:url='http://ducharme.cc/flash-friday-as3-signals-basics/' addthis:title='Flash Friday &#8211; AS3 Signals Basics '  ><a class="addthis_button_facebook_like" fb:like:layout="button_count"></a><a class="addthis_button_tweet"></a><a class="addthis_button_google_plusone" g:plusone:size="medium"></a><a class="addthis_counter addthis_pill_style"></a></div>A short while back I mentioned a couple new open source projects I started working with at my new job. One of those projects was AS3 Signals. Since I&#8217;ve begun using it I&#8217;ve really grown to like it and I wanted to explain why. Hopefully my explanation of why will also include enough of the [...]]]></description>
			<content:encoded><![CDATA[<div class="addthis_toolbox addthis_default_style " addthis:url='http://ducharme.cc/flash-friday-as3-signals-basics/' addthis:title='Flash Friday &#8211; AS3 Signals Basics '  ><a class="addthis_button_facebook_like" fb:like:layout="button_count"></a><a class="addthis_button_tweet"></a><a class="addthis_button_google_plusone" g:plusone:size="medium"></a><a class="addthis_counter addthis_pill_style"></a></div><p><img class="alignleft" title="AS3 Signals" src="http://www.riactive.com/wp-content/uploads/2010/09/as3_signals1.png" alt="" width="210" height="90" />A short while back I mentioned <a href="http://ducharme.cc/robotlegs-signals/" target="_blank">a couple new open source projects I started working with at my new job</a>. One of those projects was <a href="https://github.com/robertpenner/as3-signals" target="_blank">AS3 Signals</a>. Since I&#8217;ve begun using it I&#8217;ve really grown to like it and I wanted to explain why. Hopefully my explanation of why will also include enough of the how.</p>
<p>First off, have been a big fan of the AS3 event model since it came out with flash player 9. It, like many other AS3 updates, was much cleaner than the ways we were doing things in AS1/2. However, there have always been a few things that have bugged me just a little about the native event model.</p>
<h3>I have to look at documentation to see what events a class object fires.</h3>
<p>I can&#8217;t count the number of times I am looking into a new framework, or even native classes, and I hope it fires an event but I can&#8217;t just tell by code completion alone. Worse yet, sometimes important events don&#8217;t even get documented so I have to search through source code to see what gets dispatched. On the flip side, if I&#8217;m writing custom classes I don&#8217;t like writing documentation. I like my code to be <a href="http://www.amazon.com/dp/0735619670/" target="_blank">readable like a good book</a>, if at all possible. The AS3 event model forces you to read and write documentation. How could AS3 Signals clear up this problem though?</p>
<p>AS3 Signals clears up the problem of needing the documentation by having you create individual signals as objects in a class. This allows the programmer the opportunity to name the signal appropriately, thus making it easy to understand for the user of this class. Thus eliminating the requirement for documentation.</p>
<p>Let&#8217;s give a simple example.  Let&#8217;s say you have a class that loads an external file and isn&#8217;t ready until that file is loaded and parsed. With AS3 Signals this is a relatively simple process.</p>
<p>First create the signal in the class:</p>

<div class="wp_syntax"><div class="code"><pre class="actionscript3" style="font-family:monospace;"><span style="color: #0033ff; font-weight: bold;">public</span> <span style="color: #6699cc; font-weight: bold;">var</span> becameReady<span style="color: #000066; font-weight: bold;">:</span>Signal<span style="color: #000066; font-weight: bold;">;</span>
<span style="color: #0033ff; font-weight: bold;">public</span> <span style="color: #339966; font-weight: bold;">function</span> MyFileLoader<span style="color: #000000;">&#40;</span> <span style="color: #004993;">url</span><span style="color: #000066; font-weight: bold;">:</span><span style="color: #004993;">String</span> <span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">:</span><span style="color: #0033ff; font-weight: bold;">void</span><span style="color: #000000;">&#123;</span>
	becameReady = <span style="color: #0033ff; font-weight: bold;">new</span> Signal<span style="color: #000000;">&#40;</span><span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>
	<span style="color: #009900; font-style: italic;">// you can come up with your own code here.</span>
<span style="color: #000000;">&#125;</span></pre></div></div>

<p>Now anyone wanting to use the <em>MyFileLoader </em>class can see that you have a signal called <em>becameReady</em>. Hopefully they can tell from just that info what it does. Or perhaps you can come up with better naming. Either way this is an improvement.</p>
<h3>Event types are strings</h3>
<p>Strings are flexible and easy to read ( such as in a trace or error message ). The other problem is that they are not type safe and I&#8217;ve had times where event type naming collisions do happen. AS3 signals takes care of this problem by both solving and circumventing the problem.</p>
<p>AS3 Signals circumvents the problem by having you create separate ISignal objects for each type of event you would have dispatched in the past. Even though they are all of type ISignal, they are each distinct fields on an object. For example, if I had a class controlling a form, some of its signals might look like this:</p>

<div class="wp_syntax"><div class="code"><pre class="actionscript3" style="font-family:monospace;"><span style="color: #0033ff; font-weight: bold;">public</span> <span style="color: #6699cc; font-weight: bold;">var</span> submitClick<span style="color: #000066; font-weight: bold;">:</span>NativeSignal<span style="color: #000066; font-weight: bold;">;</span>
<span style="color: #0033ff; font-weight: bold;">public</span> <span style="color: #6699cc; font-weight: bold;">var</span> clearClick<span style="color: #000066; font-weight: bold;">:</span>NativeSignal<span style="color: #000066; font-weight: bold;">;</span>
<span style="color: #0033ff; font-weight: bold;">public</span> <span style="color: #6699cc; font-weight: bold;">var</span> completed<span style="color: #000066; font-weight: bold;">:</span>Signal<span style="color: #000066; font-weight: bold;">;</span></pre></div></div>

<p>AS3 also solves the problem by having event type checking, if you are working with the native event model. I haven&#8217;t worked much with this at this point so I won&#8217;t get into this in this article. If you&#8217;d like to know more about this comment below and I can write about it in a future article.</p>
<h3>Custom events and event dispatcher classes take too much code for the simplest task</h3>
<p>We&#8217;ve all been there, we want to make a custom events for a project but we have to write a whole new class to encapsulate what we need. Also, if we want to dispatch these events from a class that doesn&#8217;t extend EventDispatcher we need to make sure to implement IEventDispatcher. Sure, these are relatively simple tasks but they take time and you are writing code that reeks of duplication.</p>
<p>As you have seen above, it is really simple to create a &#8220;custom&#8221; signal. Just define and initialize a new signal. Dispatching it is just as easy.</p>

<div class="wp_syntax"><div class="code"><pre class="actionscript3" style="font-family:monospace;"><span style="color: #0033ff; font-weight: bold;">public</span> <span style="color: #6699cc; font-weight: bold;">var</span> somethingHappened<span style="color: #000066; font-weight: bold;">:</span>Signal<span style="color: #000066; font-weight: bold;">;</span>
&nbsp;
<span style="color: #0033ff; font-weight: bold;">private</span> <span style="color: #339966; font-weight: bold;">function</span> <span style="color: #004993;">init</span><span style="color: #000000;">&#40;</span><span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">:</span><span style="color: #0033ff; font-weight: bold;">void</span> <span style="color: #000000;">&#123;</span>
	somethingHappened = <span style="color: #0033ff; font-weight: bold;">new</span> Signal<span style="color: #000000;">&#40;</span><span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>
<span style="color: #000000;">&#125;</span>
&nbsp;
<span style="color: #0033ff; font-weight: bold;">private</span> <span style="color: #339966; font-weight: bold;">function</span> doSomething<span style="color: #000000;">&#40;</span><span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">:</span><span style="color: #0033ff; font-weight: bold;">void</span> <span style="color: #000000;">&#123;</span>
	<span style="color: #009900; font-style: italic;">// custom code that does something ;)</span>
	somethingHappened<span style="color: #000066; font-weight: bold;">.</span>dispatch<span style="color: #000000;">&#40;</span><span style="color: #000000;">&#41;</span><span style="color: #000066; font-weight: bold;">;</span>
<span style="color: #000000;">&#125;</span></pre></div></div>

<p>Too make the signal more custom you can send as many objects as you want in the dispatch call. I&#8217;ll leave that as an exercise for the reader ( or you can exercise the comments section and I&#8217;ll show you what I mean below ).</p>
<h3>If you just want to listen once you have to write extra code</h3>
<p>The native event model doesn&#8217;t make it easy to listen once. Perhaps you want to listen to a view&#8217;s close button for just one click. With the native event model you have to remember to call removeEventListener in you event handler or else your program may not work as expected and it will likely create a nasty memory leak. AS3 Signals simplifies the process with the addOnce() call.</p>

<div class="wp_syntax"><div class="code"><pre class="actionscript" style="font-family:monospace;"><span style="color: #0066CC;">private</span> <span style="color: #000000; font-weight: bold;">function</span> init<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span> <span style="color: #66cc66;">&#123;</span>
	doSomething<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
	view.<span style="color: #006600;">closeButtonClick</span>.<span style="color: #006600;">addOnce</span><span style="color: #66cc66;">&#40;</span> onCloseButtonClick <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> onCloseButtonClick<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span><span style="color: #66cc66;">&#123;</span>
	view.<span style="color: #0066CC;">close</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
<span style="color: #66cc66;">&#125;</span></pre></div></div>

<p>The previous <em>addOnce</em> call was so minor you might not have noticed it in the code. Really, that&#8217;s all it takes. Signals are really quite easy to clean up.</p>
<h3>Cleaning up listeners is difficult</h3>
<p>When trying to find memory leaks, the first thing I look for is calls to <em>addEventListener</em>. They are usually the major culprit because it is so easy to lose track of which listeners were added to an object and for which event type. As you saw above, Signal objects have a built in mechanism for removing listeners after a single call if you want. They also have a simple way to remove all listeners from themselves, the aptly named <em>removeAll</em> function.</p>

<div class="wp_syntax"><div class="code"><pre class="actionscript" style="font-family:monospace;"><span style="color: #000000; font-weight: bold;">function</span> <span style="color: #0066CC;">close</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">void</span> <span style="color: #66cc66;">&#123;</span>
	closeButtonClick.<span style="color: #006600;">removeAll</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
	otherSignal.<span style="color: #006600;">removeAll</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
<span style="color: #66cc66;">&#125;</span></pre></div></div>

<h3>Conclusion</h3>
<p>This article was much longer than I thought it would be. If you made it this far, thank you for reading. I hope you see how <a href="https://github.com/robertpenner/as3-signals" target="_blank">AS3 Signals</a> is an improvement over the native event model. Once you start using Signals you&#8217;ll likely find yourself using events less and less. The event model is still core to AS3 though so there are some good ways to use them together. I plan to write a ( hopefully shorter ) article on using <a href="https://github.com/robertpenner/as3-signals">AS3 Signals</a> with the native event model in the future. If you have any questions, comments or requests regarding AS3 Signals please let me know in the comments below.</p>
]]></content:encoded>
			<wfw:commentRss>http://ducharme.cc/flash-friday-as3-signals-basics/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Robotlegs and Signals</title>
		<link>http://ducharme.cc/robotlegs-signals/</link>
		<comments>http://ducharme.cc/robotlegs-signals/#comments</comments>
		<pubDate>Fri, 07 Jan 2011 10:00:52 +0000</pubDate>
		<dc:creator>Deacon</dc:creator>
				<category><![CDATA[Flash Friday]]></category>

		<guid isPermaLink="false">http://ducharme.cc/?p=504</guid>
		<description><![CDATA[<div class="addthis_toolbox addthis_default_style " addthis:url='http://ducharme.cc/robotlegs-signals/' addthis:title='Robotlegs and Signals '  ><a class="addthis_button_facebook_like" fb:like:layout="button_count"></a><a class="addthis_button_tweet"></a><a class="addthis_button_google_plusone" g:plusone:size="medium"></a><a class="addthis_counter addthis_pill_style"></a></div>Just a short note for this, the first Flash Friday post of 2011. Just last week I started a new job in the social game space. It is a very exciting opportunity to work with some new people and learn new things. One thing to learn is the code base that they use, some which [...]]]></description>
			<content:encoded><![CDATA[<div class="addthis_toolbox addthis_default_style " addthis:url='http://ducharme.cc/robotlegs-signals/' addthis:title='Robotlegs and Signals '  ><a class="addthis_button_facebook_like" fb:like:layout="button_count"></a><a class="addthis_button_tweet"></a><a class="addthis_button_google_plusone" g:plusone:size="medium"></a><a class="addthis_counter addthis_pill_style"></a></div><p><a href="http://www.robotlegs.org/"><img class="alignleft" title="Robotlegs logo" src="http://www.robotlegs.org/images/rl-header-logo-310-253.png" alt="Robotlegs logo" width="186" height="152" /></a>Just a short note for this, the first Flash Friday post of 2011. Just last week I started a new job in the social game space. It is a very exciting opportunity to work with some new people and learn new things. One thing to learn is the code base that they use, some which is open source. Two OS projects that I am now working with that I&#8217;ve never worked with before have caught my eye. These two projects are <a href="http://www.robotlegs.org/" target="_blank">Robotlegs</a> and <a href="https://github.com/robertpenner/as3-signals" target="_blank">Signals</a>.</p>
<p>First there is Robotlegs, an MVCS framework that is similar to PureMVC but if you&#8217;ve used any MVCS framework ( such as Cairngorm ) the concepts are similar. Robotlegs is cool because it does a really good job of keeping classes well decoupled through the use of metatags and injection. If you code any games or rich internet applications with flash I highly recommend giving it a look to see what you can use from it.</p>
<p>Second is AS3 Signals. Signals is an Observer pattern framework that you can use instead, or in conjunction with, the actionscript event model. I&#8217;ve been a fan of the <a href="http://en.wikipedia.org/wiki/Observer_pattern" target="_blank">observer pattern</a> for a while, using the <a href="http://www.senocular.com/flash/tutorials/listenersasbroadcaster/" target="_blank">AsBroadcaster class</a> back in AS2. When AS3 came around I relished in its event model, not because it was perfect but because it was better than using AsBroadcaster ( or rolling your own setup ). <a href="http://www.peterelst.com/blog/2010/01/22/as3-signals-the-best-thing-since-sliced-bread/" target="_blank">Signals improves upon some of the shortcomings of the AS3 event model in a few different ways</a>.</p>
<p>All in all these are the two big new frameworks I am using at my new gig and I plan to share some lessons as I learn them.  There is also much more that I&#8217;ll learn about as well and I plan to share them as well. For now, check out Robotlegs and AS3 Signals and see what bits of them you can use or just get some good ideas for your own code.  I hope if you do you&#8217;ll share them in the comments.</p>
<p>Have you used either of of these frameworks? What do you think? Any gotchas you need to watch out for?  I&#8217;d love to hear what you&#8217;ve encountered in the comments below.</p>
]]></content:encoded>
			<wfw:commentRss>http://ducharme.cc/robotlegs-signals/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
	</channel>
</rss>

