<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

	<title> Charles @ Adobe</title>

	<link rel="alternate" type="application/rss+xml" title="Charles @ Adobe RSS Feed" href="http://blogs.adobe.com/charles/feed" />

	<link rel="alternate" type="application/atom+xml" title="Charles @ Adobe Atom Feed" href="http://blogs.adobe.com/charles/feed/atom" />

	<link rel="pingback" href="http://blogs.adobe.com/charles/xmlrpc.php" />

	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

        <meta name="description" content="Working on the Internet" />

        <meta name="keywords" content="" />

        <meta name="author" content="BlogConsulting.com" />

	<link href="http://blogs.adobe.com/charles/wp-content/themes/AdobeDefault/style.css" media="screen" rel="stylesheet" type="text/css" />

	<script src="http://blogs.adobe.com/charles/wp-content/themes/AdobeDefault/js/jquery.js" type="text/javascript"></script>

	<script src="http://blogs.adobe.com/charles/wp-content/themes/AdobeDefault/js/cufon-yui.js" type="text/javascript"></script>

	<script src="http://blogs.adobe.com/charles/wp-content/themes/AdobeDefault/js/Myriad_Pro_400.font.js" type="text/javascript">

</script>

	<script src="http://blogs.adobe.com/charles/wp-content/themes/AdobeDefault/js/Myriad_Pro_Semibold_600.font.js" type="text/javascript"></script>

	<script type="text/javascript">

		Cufon.replace('h1#header', { fontFamily: 'Myriad Pro' });

		Cufon.replace('h3#description', { fontFamily: 'Myriad Pro' });

	</script>

<script type="text/javascript" src="http://blogs.adobe.com/charles/wp-content/themes/AdobeDefault/js/domtab.js"></script>

<script>

function clearSearch() {

	document.search_form.s.value = "";

}</script>


<script type='text/javascript' src='http://blogs.adobe.com/charles/wp-includes/js/jquery/jquery.js?ver=1.7.1'></script>
<link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://blogs.adobe.com/charles/xmlrpc.php?rsd" />
<link rel="wlwmanifest" type="application/wlwmanifest+xml" href="http://blogs.adobe.com/charles/wp-includes/wlwmanifest.xml" /> 

<!-- Flexible Lightbox -->
<script type="text/javascript" src="http://blogs.adobe.com/charles/wp-content/plugins/flexible-lightbox/js/jquery.lightbox-0.5.pack.js"></script>
<script type="text/javascript">var path="http://blogs.adobe.com/charles/wp-content/plugins/flexible-lightbox/images/";</script>
<script type="text/javascript" src="http://blogs.adobe.com/charles/wp-content/plugins/flexible-lightbox/js/lightbox_call.js"></script>
	<link href="http://blogs.adobe.com/charles/wp-content/plugins/flexible-lightbox/css/jquery.lightbox-0.5.css" rel="stylesheet" type="text/css" />

	<!-- Add RSS feeds -->
				
	<!-- Add RSS (end) -->

<meta property="og:site_name" content="Charles @ Adobe" />
<meta property="og:type" content="article" />

<link rel="stylesheet" href="http://blogs.adobe.com/charles/wp-content/plugins/wp-syntax/wp-syntax.css" type="text/css" media="screen" />
	<style type="text/css">.recentcomments a{display:inline !important;padding:0 !important;margin:0 !important;}</style>

</head>

<body>



	<div id="page_container">

		

		<div id="header">

			<div class="search">

				<form action="http://blogs.adobe.com/charles" method="get" id="search_form" name="search_form" class="closed">

<a href="http://www.adobe.com">adobe.com</a> &nbsp; &nbsp; &nbsp;

					<input name="s" class="search" type="text" value="Search Blogs" onFocus="clearSearch()" />

					<input type="submit" class="search_icon_submit" value="" />

				</form>

			</div>



<div id="adobe-icon"><a href="http://www.adobe.com/"><img src="http://blogs.adobe.com/charles/wp-content/themes/AdobeDefault/images/adobe_logo.png" alt="Adobe" class="logo" /></a></div>






	<h1 id="header"><a href="http://blogs.adobe.com/charles">Charles @ Adobe</a></h1>

	<h3 id="description">Working on the Internet</h3>


		

		</div>

		

		<div id="content">
			
<div class="left">

<img src="http://blogs.adobe.com/charles/wp-content/themes/AdobeDefault/images/blog_1.png" alt="" class="photo" />
<div class="entries">
	<div class="entry" id="entry-695">
					
		<span class="date">December 16, 2011</span>
			<h2><a href="http://blogs.adobe.com/charles/2011/12/diff-library-for-actionscript.html">Diff Library for ActionScript</a></h2>
			<div class="entry-body">
				
<!-- Facebook Like Button v1.9.6 BEGIN [http://blog.bottomlessinc.com] -->
<iframe src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fblogs.adobe.com%2Fcharles%2F2011%2F12%2Fdiff-library-for-actionscript.html&amp;layout=standard&amp;show_faces=false&amp;width=450&amp;action=like&amp;colorscheme=light" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:450px; height: 30px; align: left; margin: 2px 0px 2px 0px"></iframe>
<!-- Facebook Like Button END -->
<div class="tweetmeme_button" style="float: right; margin-left: 10px;"><a class="tm_button" rel="&amp;source=charlesbihis&amp;style=normal&amp;service=bit.ly&amp;service_api=R_9d9bd149a2e37cd8e69d45dcddf5c08c&amp;b=2" href="http://blogs.adobe.com/charles/2011/12/diff-library-for-actionscript.html"></a></div>
<p>I was working on an interesting automation project here at Adobe recently.  In short, we wanted to have a utility that shows a particular set of configurations and settings on our various servers and indicates to us if any of the servers are different from the rest, configuration-wise.  Sounds simple, right?  Sure!  So, I thought it would be cool to enhance this a bit and instead of just indicating that yes, there is a difference, I would indicate exactly what that difference was.</p>
<p>Since I&#8217;m working predominately with text files, the first thing that came to mind was a diff algorithm. (D&#8217;uh!) The front-end for the tool that we use is built in Flex, and so I started looking for a diff algorithm implementation in ActionScript.  No luck.  Guess I&#8217;ll have to write my own :\  I started doing some research on the various approaches to diff algorithms and came to the consensus that the Myer&#8217;s diff algorithm<a href="#ref1"><sup>[1]</sup></a> is widely accepted as the best general-purpose diff algorithm around.  After about 6 pages into the research paper, though, I realized it would take too long to grok this all and implement it from scratch.  So, instead, I found an implementation of the Myer&#8217;s diff algorithm and ported it to ActionScript.  A few hours later, it was done!</p>
<p><center><object width="636" height="2281"><param name="src" value="http://blogs.adobe.com/charles/files/2011/12/actionscript-diff-demo.swf" /><embed type="application/x-shockwave-flash" width="636" height="281" src="http://blogs.adobe.com/charles/files/2011/12/actionscript-diff-demo.swf"></embed></object></center></p>
<p>As you can tell from the example above, text additions are green, and omissions are red.  Any text that is the same remains black.  And that&#8217;s it!</p>
<p>&nbsp;<br />
<strong>Usage</strong>:<br />
The usage is quite straightforward, too.  There is really only one API, diff(), and it takes two parameters, the before-text and after-text.  Done!</p>

<div class="wp_syntax"><div class="code"><pre class="actionscript" style="font-family:monospace;"><span style="color: #000000; font-weight: bold;">var</span> diffs:<span style="color: #0066CC;">Array</span> = <span style="color: #000000; font-weight: bold;">new</span> Diff<span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>.<span style="color: #006600;">diff</span><span style="color: #66cc66;">&#40;</span>beforeText.<span style="color: #0066CC;">text</span>, afterText.<span style="color: #0066CC;">text</span><span style="color: #66cc66;">&#41;</span>;</pre></div></div>

<p>The result that you get back is an Array of the different operations that it took to go from the original string to the modified string.  You can easily use this to display the differences in whatever way you want!</p>
<p>&nbsp;<br />
<strong>Code</strong>:<br />
The code is too long to post here, but you can find it in my GitHub project -> <a href="https://github.com/charlesbihis/actionscript-diff">https://github.com/charlesbihis/actionscript-diff</a></p>
<p>&nbsp;<br />
Enjoy!</p>
<p>&nbsp;<br />
Charles</p>
<p><a name="ref1"><sup>[1]</sup></a> <a href="http://neil.fraser.name/software/diff_match_patch/myers.pdf">&#8220;An O(ND) Difference Algorithm and Its Variations&#8221; by Eugene W. Myers</a></p>
			</div>

<ul class="tags">
<li><a href="http://blogs.adobe.com/charles/tag/actionscript-2">actionscript (5)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/algorithms">algorithms (1)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/diff">diff (1)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/library">library (2)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/opensource">opensource (2)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/programming-2">programming (9)</a></li> 
</ul>


						
			<div class="meta">
				<span>3:16 PM</span>
<span><a href="http://blogs.adobe.com/charles/2011/12/diff-library-for-actionscript.html#comments">Comments</a> (1)</span>				<span><a href="http://blogs.adobe.com/charles/2011/12/diff-library-for-actionscript.html">Permalink</a></span>
			</div>
			<div class="clear"></div>

						
	</div>
	
	
	<div class="entry" id="entry-665">
					
		<span class="date">May 18, 2011</span>
			<h2><a href="http://blogs.adobe.com/charles/2011/05/facebook-desktop-were-international-baby.html">Facebook Desktop &#8211; We&#8217;re international, baby!</a></h2>
			<div class="entry-body">
				
<!-- Facebook Like Button v1.9.6 BEGIN [http://blog.bottomlessinc.com] -->
<iframe src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fblogs.adobe.com%2Fcharles%2F2011%2F05%2Ffacebook-desktop-were-international-baby.html&amp;layout=standard&amp;show_faces=false&amp;width=450&amp;action=like&amp;colorscheme=light" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:450px; height: 30px; align: left; margin: 2px 0px 2px 0px"></iframe>
<!-- Facebook Like Button END -->
<div class="tweetmeme_button" style="float: right; margin-left: 10px;"><a class="tm_button" rel="&amp;source=charlesbihis&amp;style=normal&amp;service=bit.ly&amp;service_api=R_9d9bd149a2e37cd8e69d45dcddf5c08c&amp;b=2" href="http://blogs.adobe.com/charles/2011/05/facebook-desktop-were-international-baby.html"></a></div>
<p>Some of you might remember a side-project of mine that I <a title="Introducing “Facebook Desktop” – A Lightweight, Unobtrusive Notification Engine for Facebook Built on Adobe AIR" href="http://blogs.adobe.com/charles/2011/01/introducing-facebook-desktop-a-lightweight-unobtrusive-notification-engine-for-facebook-built-on-adobe-air.html">announced here</a> which I called <a title="Facebook Desktop - Bringing Facebook to your desktop, one notification at a time." href="http://www.facebookdesktop.com">Facebook Desktop</a>.  In short, it was a small application that I initially wrote for myself to help me stay in touch with my friends and family through Facebook.  It would sit in my system tray or dock and quietly push messenger-style toast notifications to my screen whenever something happened in my Facebook stream.  Neat, huh?  I thought so.  So, I built it out and eventually released it as a free app for everyone to use!  Since then, it&#8217;s actually picked up quite a bit of steam and now enjoys thousands of users from all over the world!</p>
<p><strong>Pleasantly Surprised</strong><br />
I&#8217;ve had a couple of releases since I first announced it, but this latest release is special and so I wanted to mention it here.  The popularity of the app, especially overseas, took me by surprise.  Considering this started out as a small utility I built for myself over a weekend, I didn&#8217;t anticipate it being used overseas.  But now, it&#8217;s actually used in over 20 countries all around the globe!  In fact, the bulk of our users are overseas!  After noticing this, I made the decision to devote the entire next release into adding language support for all of our international users.</p>
<p><center><img title="What's on your mind?" src="http://www.facebookdesktop.com/images/whats-on-your-mind-german.png" width="510" height="124" /></center></p>
<p>Technically, localizing the application wasn&#8217;t a problem (I&#8217;ve had <a title="Localization in Flex – Part 1: Compiling resources into an application " href="http://www.adobe.com/devnet/flex/articles/flex_localization_pt1.html">some</a> <a title="Localization in Flex – Part 2: Loading resources at runtime " href="http://www.adobe.com/devnet/flex/articles/flex-localization-pt2.html">experience</a> in the area).  The bigger problem was actually getting all of the text I use in the app translated to all of the various languages I wanted to support.  Then, someone posted a beautiful message on our <a title="Facebook Desktop" href="https://www.facebook.com/apps/application.php?id=95615112563">Facebook application page</a>.</p>
<p style="text-align: center;"><em>&#8220;Are you adding support for German?  If so, I volunteer to translate!&#8221;</em></p>
<p>Shortly after, a comment: &#8220;Me too, for Italian!&#8221;.  And another: &#8220;I can do Hindi&#8221;.  That&#8217;s when it hit me&#8230;<em>crowdsourcing</em>!</p>
<p><strong>The Power of the Community</strong><br />
I&#8217;ve never done it before, and there are plenty of ways that it can blow up in my face, but it was obvious to me that our users wanted it, but more importantly, were willing to help make it happen!  So, I took advantage of it!  The next day, I posted a message to our page asking if there is anyone willing to help translate Facebook Desktop in their native language.  The response was amazing!  At the end of the day, we had over 30 responses with people volunteering to translate in over a dozen languages!</p>
<p>I couldn&#8217;t ignore this, and so I took everyone up on their offer and started getting all of the text translated.  A couple of months later, a bit of coding, and a lot testing, it&#8217;s released!  Facebook Desktop v0.84 <a title="Facebook Desktop v0.84 - We're international, baby!" href="https://www.facebook.com/notes/desktop/facebook-desktop-v084-were-international-baby/201676706541273">went live last night</a> at midnight with support for a whopping SIXTEEN languages.</p>
<p><center><img title="Settings" src="http://www.facebookdesktop.com/images/settings-language.png" width="510" height="273" /></center></p>
<p><strong>Together is Better</strong><br />
This version of Facebook Desktop could not have been accomplished without the help of the community.  Plain and simple.  On top of that, engaging with the users in this way made this release that much more fun too!  In the future, I&#8217;ll definitely be looking to involve our users more.  It&#8217;s better for them, it&#8217;s better for me, and it&#8217;s better for the app!  To infinity, and beyond!</p>
<p>&nbsp;</p>
<p>Charles</p>
			</div>

<ul class="tags">
<li><a href="http://blogs.adobe.com/charles/tag/air-2">air (2)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/crowd-sourcing">crowd-sourcing (1)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/facebook-2">facebook (2)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/facebook-desktop-2">facebook desktop (2)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/internationalization">internationalization (3)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/localization">localization (3)</a></li> 
</ul>


						
			<div class="meta">
				<span>10:18 PM</span>
<span><a href="http://blogs.adobe.com/charles/2011/05/facebook-desktop-were-international-baby.html#comments">Comments</a> (0)</span>				<span><a href="http://blogs.adobe.com/charles/2011/05/facebook-desktop-were-international-baby.html">Permalink</a></span>
			</div>
			<div class="clear"></div>

						
	</div>
	
	
	<div class="entry" id="entry-629">
					
		<span class="date">May 3, 2011</span>
			<h2><a href="http://blogs.adobe.com/charles/2011/05/relative-time-library-for-actionscript.html">Relative Time Library for ActionScript</a></h2>
			<div class="entry-body">
				
<!-- Facebook Like Button v1.9.6 BEGIN [http://blog.bottomlessinc.com] -->
<iframe src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fblogs.adobe.com%2Fcharles%2F2011%2F05%2Frelative-time-library-for-actionscript.html&amp;layout=standard&amp;show_faces=false&amp;width=450&amp;action=like&amp;colorscheme=light" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:450px; height: 30px; align: left; margin: 2px 0px 2px 0px"></iframe>
<!-- Facebook Like Button END -->
<div class="tweetmeme_button" style="float: right; margin-left: 10px;"><a class="tm_button" rel="&amp;source=charlesbihis&amp;style=normal&amp;service=bit.ly&amp;service_api=R_9d9bd149a2e37cd8e69d45dcddf5c08c&amp;b=2" href="http://blogs.adobe.com/charles/2011/05/relative-time-library-for-actionscript.html"></a></div>
<p>While working on a <a title="Introducing Facebook Desktop - A Notification Engine for Facebook Built on Adobe AIR" href="http://blogs.adobe.com/charles/2011/01/introducing-facebook-desktop-a-lightweight-unobtrusive-notification-engine-for-facebook-built-on-adobe-air.html">side-project</a> of mine, I came across the need to display dates and times as relative instead of absolute.  You know, saying &#8220;two hours ago&#8221; instead of &#8220;Mon Jan 5 17:24:33 GMT-0700 2011&#8243;.  Since the web is going real-time these days, it just makes sense.  Besides, <a title="Facebook" href="http://www.facebook.com/">everyone&#8217;s</a> <a title="Twitter" href="http://www.twitter.com/">doing</a> <a title="FourSquare" href="http://www.foursquare.com/">it</a>, so it must be good!  Anyways, I wrote a library (really, just a simple class) that you can use to do this with ActionScript.  It&#8217;s really quite simple, but since I couldn&#8217;t find it anywhere else, I thought I&#8217;d contribute it here for everyone to use too.  Here it is in action&#8230;</p>
<p>&nbsp;</p>
<p><center><object width="500" height="250"><param name="src" value="http://blogs.adobe.com/charles/files/2011/05/relative-date-demo.swf" /><embed type="application/x-shockwave-flash" width="500" height="250" src="http://blogs.adobe.com/charles/files/2011/05/relative-date-demo.swf"></embed></object></center></p>
<p>If you&#8217;re wondering, I&#8217;ve tried to follow the convention that Facebook uses for what format to display and when.  Twitter has a very similar format, but I decided to go with Facebook&#8217;s.  Also, if you notice, my library can handle times in the future as well as times in the past.  Here&#8217;s how to use it&#8230;</p>
<p><strong>Usage</strong>:</p>
<p>Once you&#8217;ve added the library to your project, it&#8217;s really quite easy to use.  Just call any of the two available APIs and pass in a date or two and you&#8217;ll get back the relative time string.  Done!</p>

<div class="wp_syntax"><div class="code"><pre class="actionscript" style="font-family:monospace;"><span style="color: #000000; font-weight: bold;">var</span> relativeTime:<span style="color: #0066CC;">String</span> = RelativeDate.<span style="color: #006600;">getRelativeDate</span><span style="color: #66cc66;">&#40;</span>firstDate, secondDate<span style="color: #66cc66;">&#41;</span>;
<span style="color: #000000; font-weight: bold;">var</span> relativeTime:<span style="color: #0066CC;">String</span> = RelativeDate.<span style="color: #006600;">getRelativeDateFromNow</span><span style="color: #66cc66;">&#40;</span>someDate<span style="color: #66cc66;">&#41;</span>;</pre></div></div>

<p><strong>Code</strong>:<br />
Finally, here is the code in all it&#8217;s glory!</p>

<div class="wp_syntax"><div class="code"><pre class="actionscript" style="font-family:monospace;">package com.<span style="color: #006600;">adobe</span>.<span style="color: #0066CC;">date</span>
<span style="color: #66cc66;">&#123;</span>
	<span style="color: #0066CC;">import</span> com.<span style="color: #006600;">adobe</span>.<span style="color: #006600;">utils</span>.<span style="color: #006600;">DateUtil</span>;
&nbsp;
	<span style="color: #808080; font-style: italic;">/**
	 * Utility class to help create human-readable Strings representing
	 * the difference in time from two different dates (e.g. &quot;just now&quot;
	 * or &quot;2 hours ago&quot; or &quot;13 minutes from now&quot;).
	 *
	 * @langversion ActionScript 3.0
	 * @playerversion Flash 10.0
	 */</span>
	<span style="color: #0066CC;">public</span> <span style="color: #000000; font-weight: bold;">class</span> RelativeDate
	<span style="color: #66cc66;">&#123;</span>
		<span style="color: #0066CC;">private</span> <span style="color: #0066CC;">static</span> const SECONDS_PER_MINUTE:uint = <span style="color: #cc66cc;">60</span>;
		<span style="color: #0066CC;">private</span> <span style="color: #0066CC;">static</span> const SECONDS_PER_TWO_MINUTES:uint = <span style="color: #cc66cc;">120</span>;
		<span style="color: #0066CC;">private</span> <span style="color: #0066CC;">static</span> const SECONDS_PER_HOUR:uint = <span style="color: #cc66cc;">3600</span>;
		<span style="color: #0066CC;">private</span> <span style="color: #0066CC;">static</span> const SECONDS_PER_TWO_HOURS:uint = <span style="color: #cc66cc;">7200</span>;
		<span style="color: #0066CC;">private</span> <span style="color: #0066CC;">static</span> const SECONDS_PER_DAY:uint = <span style="color: #cc66cc;">86400</span>;
		<span style="color: #0066CC;">private</span> <span style="color: #0066CC;">static</span> const SECONDS_PER_TWO_DAYS:uint = <span style="color: #cc66cc;">172800</span>;
		<span style="color: #0066CC;">private</span> <span style="color: #0066CC;">static</span> const SECONDS_PER_THREE_DAYS:uint = <span style="color: #cc66cc;">259200</span>;
&nbsp;
		<span style="color: #808080; font-style: italic;">/**
		 * Creates a human-readable String representing the difference
		 * in time from the date provided and now.  This method handles
		 * dates in both the past and the future (e.g. &quot;2 hours ago&quot;
		 * and &quot;2 hours from now&quot;.  For any date beyond 3 days difference
		 * from now, then a standard format is returned.
		 *
		 * @param date The date for which to compare against.
		 *
		 * @return Human-readable String representing the time elapsed.
		 */</span>
		<span style="color: #0066CC;">public</span> <span style="color: #0066CC;">static</span> <span style="color: #000000; font-weight: bold;">function</span> getRelativeDateFromNow<span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">date</span>:<span style="color: #0066CC;">Date</span>, capitalizeFirstLetter:<span style="color: #0066CC;">Boolean</span> = <span style="color: #000000; font-weight: bold;">false</span><span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">String</span>
		<span style="color: #66cc66;">&#123;</span>
			<span style="color: #b1b100;">return</span> getRelativeDate<span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">date</span>, <span style="color: #000000; font-weight: bold;">new</span> <span style="color: #0066CC;">Date</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>, capitalizeFirstLetter<span style="color: #66cc66;">&#41;</span>;
		<span style="color: #66cc66;">&#125;</span>
&nbsp;
		<span style="color: #808080; font-style: italic;">/**
		 * Creates a human-readable String representing the difference
		 * in time from the first date provided with respect to the
		 * second date provided.  If no second date is provided, then
		 * the relative date will be calcluated with respect to &quot;now&quot;.
		 * This method handles dates in both the past and the
		 * future (e.g. &quot;2 hours ago&quot; and &quot;2 hours from now&quot;.  For
		 * any date beyond 3 days difference from now, then a
		 * standard format is returned.
		 *
		 * @param firstDate The date for which to compare against.
		 * @param secondDate The date to use as &quot;present&quot; when comparing against firstDate.
		 *
		 * @return Human-readable String representing the time elapsed.
		 */</span>
		<span style="color: #0066CC;">public</span> <span style="color: #0066CC;">static</span> <span style="color: #000000; font-weight: bold;">function</span> getRelativeDate<span style="color: #66cc66;">&#40;</span>firstDate:<span style="color: #0066CC;">Date</span>, secondDate:<span style="color: #0066CC;">Date</span> = <span style="color: #000000; font-weight: bold;">null</span>, capitalizeFirstLetter:<span style="color: #0066CC;">Boolean</span> = <span style="color: #000000; font-weight: bold;">false</span><span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">String</span>
		<span style="color: #66cc66;">&#123;</span>
			<span style="color: #000000; font-weight: bold;">var</span> relativeDate:<span style="color: #0066CC;">String</span>;
			<span style="color: #000000; font-weight: bold;">var</span> isFuture:<span style="color: #0066CC;">Boolean</span> = <span style="color: #000000; font-weight: bold;">false</span>;
&nbsp;
			<span style="color: #b1b100;">if</span> <span style="color: #66cc66;">&#40;</span>secondDate == <span style="color: #000000; font-weight: bold;">null</span><span style="color: #66cc66;">&#41;</span>
			<span style="color: #66cc66;">&#123;</span>
				secondDate = <span style="color: #000000; font-weight: bold;">new</span> <span style="color: #0066CC;">Date</span><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;">// the difference between the passed-in date and now, in seconds</span>
			<span style="color: #000000; font-weight: bold;">var</span> secondsElapsed:<span style="color: #0066CC;">Number</span> = <span style="color: #66cc66;">&#40;</span>secondDate.<span style="color: #0066CC;">getTime</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span> - firstDate.<span style="color: #0066CC;">getTime</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span><span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">/</span> <span style="color: #cc66cc;">1000</span>;
&nbsp;
			<span style="color: #b1b100;">if</span> <span style="color: #66cc66;">&#40;</span>secondsElapsed <span style="color: #66cc66;">&lt;</span> <span style="color: #cc66cc;">0</span><span style="color: #66cc66;">&#41;</span>
			<span style="color: #66cc66;">&#123;</span>
				isFuture = <span style="color: #000000; font-weight: bold;">true</span>;
				secondsElapsed = <span style="color: #0066CC;">Math</span>.<span style="color: #0066CC;">abs</span><span style="color: #66cc66;">&#40;</span>secondsElapsed<span style="color: #66cc66;">&#41;</span>;
			<span style="color: #66cc66;">&#125;</span>
&nbsp;
			<span style="color: #b1b100;">switch</span><span style="color: #66cc66;">&#40;</span><span style="color: #000000; font-weight: bold;">true</span><span style="color: #66cc66;">&#41;</span>
			<span style="color: #66cc66;">&#123;</span>
				<span style="color: #b1b100;">case</span> secondsElapsed <span style="color: #66cc66;">&lt;</span> SECONDS_PER_MINUTE:
					relativeDate = <span style="color: #ff0000;">&quot;just now&quot;</span>;
					<span style="color: #b1b100;">break</span>;
				<span style="color: #b1b100;">case</span> secondsElapsed <span style="color: #66cc66;">&lt;</span> SECONDS_PER_TWO_MINUTES:
					relativeDate = <span style="color: #ff0000;">&quot;1 minute &quot;</span> + <span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#40;</span>isFuture<span style="color: #66cc66;">&#41;</span> ? <span style="color: #ff0000;">&quot;from now&quot;</span> : <span style="color: #ff0000;">&quot;ago&quot;</span><span style="color: #66cc66;">&#41;</span>;
					<span style="color: #b1b100;">break</span>;
				<span style="color: #b1b100;">case</span> secondsElapsed <span style="color: #66cc66;">&lt;</span> SECONDS_PER_HOUR:
					relativeDate = <span style="color: #0066CC;">int</span><span style="color: #66cc66;">&#40;</span>secondsElapsed <span style="color: #66cc66;">/</span> SECONDS_PER_MINUTE<span style="color: #66cc66;">&#41;</span> + <span style="color: #ff0000;">&quot; minutes &quot;</span> + <span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#40;</span>isFuture<span style="color: #66cc66;">&#41;</span> ? <span style="color: #ff0000;">&quot;from now&quot;</span> : <span style="color: #ff0000;">&quot;ago&quot;</span><span style="color: #66cc66;">&#41;</span>;
					<span style="color: #b1b100;">break</span>;
				<span style="color: #b1b100;">case</span> secondsElapsed <span style="color: #66cc66;">&lt;</span> SECONDS_PER_TWO_HOURS:
					relativeDate = <span style="color: #ff0000;">&quot;about an hour &quot;</span> + <span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#40;</span>isFuture<span style="color: #66cc66;">&#41;</span> ? <span style="color: #ff0000;">&quot;from now&quot;</span> : <span style="color: #ff0000;">&quot;ago&quot;</span><span style="color: #66cc66;">&#41;</span>;
					<span style="color: #b1b100;">break</span>;
				<span style="color: #b1b100;">case</span> secondsElapsed <span style="color: #66cc66;">&lt;</span> SECONDS_PER_DAY:
					relativeDate = <span style="color: #0066CC;">int</span><span style="color: #66cc66;">&#40;</span>secondsElapsed <span style="color: #66cc66;">/</span> SECONDS_PER_HOUR<span style="color: #66cc66;">&#41;</span> + <span style="color: #ff0000;">&quot; hours &quot;</span> + <span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#40;</span>isFuture<span style="color: #66cc66;">&#41;</span> ? <span style="color: #ff0000;">&quot;from now&quot;</span> : <span style="color: #ff0000;">&quot;ago&quot;</span><span style="color: #66cc66;">&#41;</span>;
					<span style="color: #b1b100;">break</span>;
				<span style="color: #b1b100;">case</span> secondsElapsed <span style="color: #66cc66;">&lt;</span> SECONDS_PER_TWO_DAYS:
					relativeDate = <span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#40;</span>isFuture<span style="color: #66cc66;">&#41;</span> ? <span style="color: #ff0000;">&quot;tomorrow&quot;</span> : <span style="color: #ff0000;">&quot;yesterday&quot;</span><span style="color: #66cc66;">&#41;</span> + <span style="color: #ff0000;">&quot; at &quot;</span> + DateUtil.<span style="color: #006600;">getShortHour</span><span style="color: #66cc66;">&#40;</span>firstDate<span style="color: #66cc66;">&#41;</span> + <span style="color: #ff0000;">&quot;:&quot;</span> + getMinutesString<span style="color: #66cc66;">&#40;</span>firstDate<span style="color: #66cc66;">&#41;</span> + DateUtil.<span style="color: #006600;">getAMPM</span><span style="color: #66cc66;">&#40;</span>firstDate<span style="color: #66cc66;">&#41;</span>.<span style="color: #0066CC;">toLowerCase</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
					<span style="color: #b1b100;">break</span>;
				<span style="color: #b1b100;">case</span> secondsElapsed <span style="color: #66cc66;">&lt;</span> SECONDS_PER_THREE_DAYS:
					relativeDate = DateUtil.<span style="color: #006600;">getFullDayName</span><span style="color: #66cc66;">&#40;</span>firstDate<span style="color: #66cc66;">&#41;</span> + <span style="color: #ff0000;">&quot; at &quot;</span> + DateUtil.<span style="color: #006600;">getShortHour</span><span style="color: #66cc66;">&#40;</span>firstDate<span style="color: #66cc66;">&#41;</span> + <span style="color: #ff0000;">&quot;:&quot;</span> + getMinutesString<span style="color: #66cc66;">&#40;</span>firstDate<span style="color: #66cc66;">&#41;</span> + DateUtil.<span style="color: #006600;">getAMPM</span><span style="color: #66cc66;">&#40;</span>firstDate<span style="color: #66cc66;">&#41;</span>.<span style="color: #0066CC;">toLowerCase</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
					<span style="color: #b1b100;">break</span>;
				<span style="color: #000000; font-weight: bold;">default</span>:
					relativeDate = DateUtil.<span style="color: #006600;">getFullMonthName</span><span style="color: #66cc66;">&#40;</span>firstDate<span style="color: #66cc66;">&#41;</span> + <span style="color: #ff0000;">&quot; &quot;</span> + firstDate.<span style="color: #0066CC;">getDate</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span> + <span style="color: #ff0000;">&quot; at &quot;</span> + DateUtil.<span style="color: #006600;">getShortHour</span><span style="color: #66cc66;">&#40;</span>firstDate<span style="color: #66cc66;">&#41;</span> + <span style="color: #ff0000;">&quot;:&quot;</span> + getMinutesString<span style="color: #66cc66;">&#40;</span>firstDate<span style="color: #66cc66;">&#41;</span> + DateUtil.<span style="color: #006600;">getAMPM</span><span style="color: #66cc66;">&#40;</span>firstDate<span style="color: #66cc66;">&#41;</span>.<span style="color: #0066CC;">toLowerCase</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>
					<span style="color: #b1b100;">break</span>;
			<span style="color: #66cc66;">&#125;</span>
&nbsp;
			<span style="color: #b1b100;">return</span> <span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#40;</span>capitalizeFirstLetter<span style="color: #66cc66;">&#41;</span> ? relativeDate.<span style="color: #0066CC;">substring</span><span style="color: #66cc66;">&#40;</span><span style="color: #cc66cc;">0</span>, <span style="color: #cc66cc;">1</span><span style="color: #66cc66;">&#41;</span>.<span style="color: #0066CC;">toUpperCase</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span> + relativeDate.<span style="color: #0066CC;">substring</span><span style="color: #66cc66;">&#40;</span><span style="color: #cc66cc;">1</span>, relativeDate.<span style="color: #0066CC;">length</span><span style="color: #66cc66;">&#41;</span> : relativeDate<span style="color: #66cc66;">&#41;</span>;
		<span style="color: #66cc66;">&#125;</span>
&nbsp;
		<span style="color: #808080; font-style: italic;">/**
		 * @private
		 */</span>
		<span style="color: #0066CC;">private</span> <span style="color: #0066CC;">static</span> <span style="color: #000000; font-weight: bold;">function</span> getMinutesString<span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">date</span>:<span style="color: #0066CC;">Date</span><span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">String</span>
		<span style="color: #66cc66;">&#123;</span>
			<span style="color: #b1b100;">return</span> <span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">date</span>.<span style="color: #006600;">minutes</span> <span style="color: #66cc66;">&lt;</span> <span style="color: #cc66cc;">10</span><span style="color: #66cc66;">&#41;</span> ? <span style="color: #ff0000;">&quot;0&quot;</span> : <span style="color: #ff0000;">&quot;&quot;</span><span style="color: #66cc66;">&#41;</span> + <span style="color: #0066CC;">date</span>.<span style="color: #006600;">minutes</span>;
		<span style="color: #66cc66;">&#125;</span>
	<span style="color: #66cc66;">&#125;</span>
<span style="color: #66cc66;">&#125;</span></pre></div></div>

<p>Hopefully, this can help someone out there looking to do the same!  Also, see the code in my <a href="https://github.com/charlesbihis/actionscript-relative-date">GitHub repo</a>!</p>
<p>Until next time, happy coding!</p>
<p>Charles</p>
<p><strong><sup>*</sup>Note</strong>: Shout-out to <a href="http://www.joelhooks.com/">Joel Hooks</a> for creating and sharing his awesome <a href="http://joelhooks.com/2008/10/11/flex-date-and-time-datetime-picker-control/">date-picker</a> component!</p>
			</div>

<ul class="tags">
<li><a href="http://blogs.adobe.com/charles/tag/actionscript-2">actionscript (5)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/library">library (2)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/opensource">opensource (2)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/programming-2">programming (9)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/relative-time">relative time (1)</a></li> 
</ul>


						
			<div class="meta">
				<span>11:03 AM</span>
<span><a href="http://blogs.adobe.com/charles/2011/05/relative-time-library-for-actionscript.html#comments">Comments</a> (0)</span>				<span><a href="http://blogs.adobe.com/charles/2011/05/relative-time-library-for-actionscript.html">Permalink</a></span>
			</div>
			<div class="clear"></div>

						
	</div>
	
	
	<div class="entry" id="entry-587">
					
		<span class="date">March 24, 2011</span>
			<h2><a href="http://blogs.adobe.com/charles/2011/03/actionscript-puzzler-the-joy-of-millisecs.html">ActionScript Puzzler &#8211; The Joy of Millisecs</a></h2>
			<div class="entry-body">
				
<!-- Facebook Like Button v1.9.6 BEGIN [http://blog.bottomlessinc.com] -->
<iframe src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fblogs.adobe.com%2Fcharles%2F2011%2F03%2Factionscript-puzzler-the-joy-of-millisecs.html&amp;layout=standard&amp;show_faces=false&amp;width=450&amp;action=like&amp;colorscheme=light" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:450px; height: 30px; align: left; margin: 2px 0px 2px 0px"></iframe>
<!-- Facebook Like Button END -->
<div class="tweetmeme_button" style="float: right; margin-left: 10px;"><a class="tm_button" rel="&amp;source=charlesbihis&amp;style=normal&amp;service=bit.ly&amp;service_api=R_9d9bd149a2e37cd8e69d45dcddf5c08c&amp;b=2" href="http://blogs.adobe.com/charles/2011/03/actionscript-puzzler-the-joy-of-millisecs.html"></a></div>
<style type="text/css">
.summarySection {
	margin-left: 20px;
	margin-right: 10px;
}
.summaryTableTitle {
	font-weight: bold;
	font-size: 18px;
	padding-top: 20px;
	padding-bottom: 5px;
}
* .summaryTable {
	margin-top: 10px;
	border: #999999 1px solid;
	width: 100%;
	margin-bottom: 20px;
}
html>body .summaryTable {
	margin-top: 10px;
	border: #999999 1px solid;
	width: 100%;
	margin-bottom: 20px;
	margin-right: 10px;
}
.summaryTable th {
	color: #FFFFFF;
	background-color: #627C9D;
	white-space: nowrap;
}
.summaryTable td {
	border-top: #999999 1px solid;
	vertical-align: top;
}
.summaryTablePaddingCol {
	width: 5px;
}
.summaryTableInheritanceCol {
	width: 14px;
}
.summaryTableSignatureCol {
	padding-right: 10px;
}
.summaryTableOperatorCol {
	padding-left: 10px;
	padding-right: 10px;
	font-weight: bold;
}
.summaryTableStatementCol {
	padding-left: 10px;
	padding-right: 10px;
	font-weight: bold;
	white-space: nowrap;
}
.summarySignature {
	text-indent: -20px;
	padding-left: 20px;
}
.summaryTableOwnerCol {
	padding-right: 10px;
	width: 10px;
}
.summaryTableCol, .summaryTableSecondCol {
}
.signatureLink {
	font-weight: bold;
}
.summaryTableDescription {
	color: #333333;
}
.summaryTableLastCol {
	padding-right: 10px;
}
.inheritedSummaryImage {
	width: 14px;
	height: 14px;
}
</style>
<p><strong>Note: This is the same puzzler that was <a href="http://www.adobe.com/newsletters/edge/march2011/articles/article7/index.html">featured</a> in the March issue of the <a href="http://www.adobe.com/newsletters/edge/">Adobe Edge newsletter</a>!</strong></p>
<p>It&#8217;s about that time again&#8230;time for another <a href="http://blogs.adobe.com/charles/category/puzzler">Puzzler</a>!  I&#8217;ve written a few before, in a couple of languages too, but this will be my first in ActionScript!  I know I have a lot of Flash readers, so hopefully this will be extra &#8216;puzzling&#8217; for you (see what I did there?).  For those that don&#8217;t know what a Puzzler is, it is essentially a short problem used to demonstrate special cases or &#8220;features&#8221; of a particular language.  Here is the format:</p>
<ol>
<li><strong>Code</strong> &#8211; I introduce the code</li>
<li><strong>Question</strong> &#8211; I pose a multiple-choice question and you guess what the outcome is&#8230;think hard!</li>
<li><strong>Walkthrough</strong> &#8211; I walk through a reasonable explanation</li>
<li><strong>Answer</strong> &#8211; I tell you the <em>real</em> outcome (it might surprise you), and explain why</li>
<li><strong>Moral</strong> &#8211; How can we avoid making mistakes like this in our own code</li>
</ol>
<p>Now that we all know what a Puzzler is, here is a simple ActionScript Puzzler:</p>
<p><strong>Code</strong>:</p>

<div class="wp_syntax"><div class="code"><pre class="actionscript" style="font-family:monospace;"><span style="color: #808080; font-style: italic;">// declare key dates</span>
<span style="color: #000000; font-weight: bold;">var</span> now:<span style="color: #0066CC;">Date</span> = <span style="color: #000000; font-weight: bold;">new</span> <span style="color: #0066CC;">Date</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
<span style="color: #000000; font-weight: bold;">var</span> birthday:<span style="color: #0066CC;">Date</span> = <span style="color: #000000; font-weight: bold;">new</span> <span style="color: #0066CC;">Date</span><span style="color: #66cc66;">&#40;</span><span style="color: #cc66cc;">1940</span>, 06, <span style="color: #cc66cc;">27</span><span style="color: #66cc66;">&#41;</span>; <span style="color: #808080; font-style: italic;">// Bugs Bunny’s birthday!</span>
&nbsp;
<span style="color: #808080; font-style: italic;">// save them as milliseconds since epoch</span>
<span style="color: #000000; font-weight: bold;">var</span> nowInMs:<span style="color: #0066CC;">int</span> = now.<span style="color: #0066CC;">getTime</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
<span style="color: #000000; font-weight: bold;">var</span> birthdayInMs:<span style="color: #0066CC;">int</span> = birthday.<span style="color: #0066CC;">getTime</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
&nbsp;
<span style="color: #808080; font-style: italic;">// get the difference to calculate Bugs’ age in milliseconds</span>
<span style="color: #000000; font-weight: bold;">var</span> millisecondsElapsed:<span style="color: #0066CC;">int</span> = nowInMs - birthdayInMs;
&nbsp;
<span style="color: #808080; font-style: italic;">// sanity check</span>
<span style="color: #b1b100;">if</span> <span style="color: #66cc66;">&#40;</span>millisecondsElapsed == now.<span style="color: #0066CC;">getTime</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span> - birthday.<span style="color: #0066CC;">getTime</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span><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;What’s up, Doc?&quot;</span><span style="color: #66cc66;">&#41;</span>;
<span style="color: #66cc66;">&#125;</span></pre></div></div>

<p>What does this print?</p>
<ol style="list-style: lower-alpha;">
<li>Nothing</li>
<li>&#8220;What&#8217;s up, Doc?&#8221;</li>
<li>Throws an exception</li>
<li>None of the above</li>
</ol>
<p><strong>Walkthrough</strong>:</p>
<p>Alright, it looks like we are just trying to compute Bugs Bunny’s age in milliseconds, from the time he was “born” until now.  First, we create the key dates.  We have <em>now</em> initialized to the current date (as in the date this program is executed), and <em>birthday</em> initialized to Bug Bunny&#8217;s birthday.  We then go and save those times as milliseconds since epoch so that we can easily do some date math with these two dates.  Next, we calculate the difference of Bugs’ birthday (in ms) from now (also in ms) which should give us the total milliseconds elapsed since he was born.  Finally, we do a sanity check.  In the sanity check, we essentially duplicate the math we’ve done previously: calculate the difference from Bugs’ birthday until now, in milliseconds.  This should obviously be true, and so we trace “What’s up, Doc?” to the debug console.<br />
<br />&nbsp;<br />
<center><strong>*SPOILER ALERT &#8211; ANSWER BELOW*</strong></center><br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp; </p>
<p><strong>Answer</strong>:</p>
<p>The answer is a – nothing!  How does this happen?  Well, we must be skipping over the trace statement.  That would only occur if the sanity check fails.  But the sanity check does exactly what is done earlier on in the code&#8230;almost!  The key error in this code is that <strong>there is an implicit narrowing type-cast</strong>!  Where is it?  Let’s take a look at the description of the Date class in the ActionScript 3 LiveDocs.  In the documentation for the Date.getTime() method, we get the following function prototype:</p>
<table class="summaryTable " id="summaryTableMethod" cellpadding="3" cellspacing="0">
<tbody>
<tr>
<th>&nbsp;</th>
<th colspan="2">Method</th>
<th class="summaryTableOwnerCol">Defined By</th>
</tr>
<tr class="" bgcolor="#FFFFFF">
<td class="summaryTablePaddingCol">&nbsp;</td>
<td class="summaryTableInheritanceCol">&nbsp;</td>
<td class="summaryTableSignatureCol">
<div class="summarySignature">
					<a href="http://livedocs.adobe.com/flash/9.0/ActionScriptLangRefV3/Date.html#getTime()" class="signatureLink">getTime</a>():<a href="http://livedocs.adobe.com/flash/9.0/ActionScriptLangRefV3/Number.html">Number</a></div>
<div class="summaryTableDescription">
					Returns the number of milliseconds since midnight January 1, 1970, universal time, for a Date object.
				</div>
</td>
<td class="summaryTableOwnerCol">Date</td>
</tr>
</tbody>
</table>
<p>Date.getTime() returns a Number!  And we are storing that number in an int.  In ActionScript, a Number uses the IEEE-754 double-precision floating-point specification, and therefore can use 53 bits to represent integer values.  Comparing this to only 32 bits used by int and uint, we can see that Numbers can be used to represent values well beyond the range of the int and uint data types.  Because of this implicit type-cast, <strong>our millisecond time gets narrowed and loses precision!</strong>  Now, knowing this, it is easy to see why our sanity check fails.  Our int variable millisecondsElapsed does not, in fact, store the total milliseconds elapsed since Bug Bunny was born, but rather, it stores the total milliseconds elapsed since he was born, truncated to 32 bits.  Therefore, the sanity check fails, the if-statement falls through, and the trace statement never gets executed.</p>
<p><strong>Moral</strong>:</p>
<p>Although in some other languages, implicit narrowing type-casts cause warnings or even compilation errors, in ActionScript, they do not.  So, whenever you are storing or working with numbers, be aware of the size of the numbers as well as the data-types floating around.  Implicit casts do occur (and often, in any language), but implicit narrowing casts will go unnoticed by the compiler, and likely by you as well…until now :)</p>
<p>That&#8217;s it for this Puzzler!  Hope you enjoyed!  Happy coding!<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
Charles</p>
<p><a href="http://blogs.adobe.com/charles/files/2011/03/actionscript-puzzler-the-joy-of-millisecs.zip"><img class="size-full wp-image-93" title="winzip_logo" src="http://blogs.adobe.com/charles/files/2010/11/winzip_logo-e1289008526983.gif" alt="" width="50" height="50" align="center" /></a> <strong><a href="http://blogs.adobe.com/charles/files/2011/03/actionscript-puzzler-the-joy-of-millisecs.zip">actionscript-puzzler-the-joy-of-millisecs.zip</a></strong> (source code)</p>
			</div>

<ul class="tags">
<li><a href="http://blogs.adobe.com/charles/tag/actionscript-2">actionscript (5)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/challenge">challenge (5)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/problem">problem (4)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/programming-2">programming (9)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/puzzler-2">puzzler (4)</a></li> 
</ul>


						
			<div class="meta">
				<span>1:47 PM</span>
<span><a href="http://blogs.adobe.com/charles/2011/03/actionscript-puzzler-the-joy-of-millisecs.html#comments">Comments</a> (0)</span>				<span><a href="http://blogs.adobe.com/charles/2011/03/actionscript-puzzler-the-joy-of-millisecs.html">Permalink</a></span>
			</div>
			<div class="clear"></div>

						
	</div>
	
	
	<div class="entry" id="entry-573">
					
		<span class="date">February 23, 2011</span>
			<h2><a href="http://blogs.adobe.com/charles/2011/02/want-to-localize-your-flexair-apps-its-easy-ill-show-you-how-again.html">Want to Localize Your Flex/AIR Apps?  It&#8217;s Easy!  I&#8217;ll Show You How&#8230;Again!</a></h2>
			<div class="entry-body">
				
<!-- Facebook Like Button v1.9.6 BEGIN [http://blog.bottomlessinc.com] -->
<iframe src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fblogs.adobe.com%2Fcharles%2F2011%2F02%2Fwant-to-localize-your-flexair-apps-its-easy-ill-show-you-how-again.html&amp;layout=standard&amp;show_faces=false&amp;width=450&amp;action=like&amp;colorscheme=light" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:450px; height: 30px; align: left; margin: 2px 0px 2px 0px"></iframe>
<!-- Facebook Like Button END -->
<div class="tweetmeme_button" style="float: right; margin-left: 10px;"><a class="tm_button" rel="&amp;source=charlesbihis&amp;style=normal&amp;service=bit.ly&amp;service_api=R_9d9bd149a2e37cd8e69d45dcddf5c08c&amp;b=2" href="http://blogs.adobe.com/charles/2011/02/want-to-localize-your-flexair-apps-its-easy-ill-show-you-how-again.html"></a></div>
<p><center><a href="http://www.adobe.com/devnet.html"><img class="aligncenter size-full wp-image-213" title="Adobe Developer Connection" src="http://blogs.adobe.com/charles/files/2010/11/adc_logo_wide.png" alt="" width="214" height="48" /></a></center></p>
<p>For anyone who is interested in localizing their Flex or AIR applications, I&#8217;ve written a very simple series that I&#8217;ve contributed to the <a title="Adobe Developer Connection" href="http://www.adobe.com/devnet.html">Adobe Developer Connection</a>.  As I&#8217;ve mentioned before, localization may seem like an enormous task, for any application, but the Flex framework provides great utilities to make this process surprisingly easy!  The articles are part of a two-part series which focuses solely on the task of localizing Flex and AIR applications using the Flex framework.  I&#8217;ve <a title="Want to Localize Your Flex/AIR Apps?  It's Easy!  I'll Show You How!" href="http://blogs.adobe.com/charles/2010/11/want-to-localize-your-flexair-apps-its-easy-ill-show-you-how.html">previously talked</a> about Part 1, but now Part 2 is published and the series is complete!</p>
<p style="text-align: center;"><a href="http://www.adobe.com/devnet/flex/articles/flex_localization_pt1.html"><strong>Localization  in Flex – Part 1: Compiling resources into an application</strong></a><br />
<a href="http://www.adobe.com/devnet/flex/articles/flex-localization-pt2.html"><strong>Localization  in Flex – Part 2: Loading resources at runtime</strong></a></p>
<p>Here is the end-product of the tutorial, which you can emulate for yourself in your own applications!</p>
<p><object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="550" height="400" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0"><param name="src" value="http://blogs.adobe.com/charles/files/2010/11/localization-part-i-end.swf" /><embed type="application/x-shockwave-flash" width="550" height="400" src="http://blogs.adobe.com/charles/files/2010/11/localization-part-i-end.swf"></embed></object></p>
<p>The series covers a variety of ways to attack the task of localization.  Different approaches have different advantages as well as disadvantages, but with the complete series, you will hopefully have a better understanding of what approach will suit your needs and your customer&#8217;s needs.</p>
<p>Until next time, happy localizing!</p>
			</div>

<ul class="tags">
<li><a href="http://blogs.adobe.com/charles/tag/actionscript-2">actionscript (5)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/adobe-developer-connection">adobe developer connection (2)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/internationalization">internationalization (3)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/localization">localization (3)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/programming-2">programming (9)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/tutorial-2">tutorial (2)</a></li> 
</ul>


						
			<div class="meta">
				<span>5:10 PM</span>
<span><a href="http://blogs.adobe.com/charles/2011/02/want-to-localize-your-flexair-apps-its-easy-ill-show-you-how-again.html#comments">Comments</a> (4)</span>				<span><a href="http://blogs.adobe.com/charles/2011/02/want-to-localize-your-flexair-apps-its-easy-ill-show-you-how-again.html">Permalink</a></span>
			</div>
			<div class="clear"></div>

						
	</div>
	
	
	<div class="entry" id="entry-546">
					
		<span class="date">February 17, 2011</span>
			<h2><a href="http://blogs.adobe.com/charles/2011/02/c-puzzler-give-me-a-float.html">C Puzzler &#8211; Give Me A Float</a></h2>
			<div class="entry-body">
				
<!-- Facebook Like Button v1.9.6 BEGIN [http://blog.bottomlessinc.com] -->
<iframe src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fblogs.adobe.com%2Fcharles%2F2011%2F02%2Fc-puzzler-give-me-a-float.html&amp;layout=standard&amp;show_faces=false&amp;width=450&amp;action=like&amp;colorscheme=light" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:450px; height: 30px; align: left; margin: 2px 0px 2px 0px"></iframe>
<!-- Facebook Like Button END -->
<div class="tweetmeme_button" style="float: right; margin-left: 10px;"><a class="tm_button" rel="&amp;source=charlesbihis&amp;style=normal&amp;service=bit.ly&amp;service_api=R_9d9bd149a2e37cd8e69d45dcddf5c08c&amp;b=2" href="http://blogs.adobe.com/charles/2011/02/c-puzzler-give-me-a-float.html"></a></div>
<p>Time for another <a href="http://blogs.adobe.com/charles/category/puzzler">Puzzler</a>!  This time, let&#8217;s do a <a href="http://blogs.adobe.com/charles/category/c-puzzler">C Puzzler</a> :)  For those that don&#8217;t know what a Puzzler is, it is essentially a short problem used to demonstrate special cases or &#8220;features&#8221; of a particular language.  Here is the format:</p>
<ol>
<li><strong>Code</strong> &#8211; I introduce the code</li>
<li><strong>Question</strong> &#8211; I pose a multiple-choice question and you guess what the outcome is&#8230;think hard!</li>
<li><strong>Walkthrough</strong> &#8211; I walk through a reasonable explanation</li>
<li><strong>Answer</strong> &#8211; I tell you the <em>real</em> outcome (it might surprise you), and explain why</li>
<li><strong>Moral</strong> &#8211; How can we avoid making mistakes like this in our own code</li>
</ol>
<p>Now that we all know what a Puzzler is, here is a simple C Puzzler:</p>
<p><strong>Code</strong>:</p>

<div class="wp_syntax"><div class="code"><pre class="c" style="font-family:monospace;"><span style="color: #666666; font-style: italic;">// c-puzzler-give-me-a-float.c</span>
<span style="color: #339933;">#include &lt;stdio.h&gt;</span>
&nbsp;
<span style="color: #993333;">int</span> main<span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span>
<span style="color: #009900;">&#123;</span>
	<span style="color: #993333;">int</span> x <span style="color: #339933;">=</span> <span style="color:#800080;">0.5</span> <span style="color: #339933;">+</span> giveMeAFloat<span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
&nbsp;
	<span style="color: #b1b100;">return</span> x<span style="color: #339933;">;</span>
<span style="color: #009900;">&#125;</span></pre></div></div>


<div class="wp_syntax"><div class="code"><pre class="c" style="font-family:monospace;"><span style="color: #666666; font-style: italic;">// c-puzzler-give-me-a-float-please.c</span>
<span style="color: #993333;">float</span> giveMeAFloat<span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span>
<span style="color: #009900;">&#123;</span>
	<span style="color: #b1b100;">return</span> <span style="color:#800080;">0.5</span><span style="color: #339933;">;</span>
<span style="color: #009900;">&#125;</span></pre></div></div>

<p><strong>Question</strong>:</p>
<p>What does this print?</p>
<ol style="list-style: lower-alpha;">
<li>0</li>
<li>1</li>
<li>1056964608</li>
<li>it varies</li>
</ol>
<p><strong>Walkthrough</strong>:</p>
<p>There is a local variable, x, and it is declared as an int.  It is being initialized to the sum of 0.5 and the value returned by the function giveMeAFloat, which is implemented in another source file.  The function giveMeAFloat returns the float value 0.5, and so the sum of these two values is the float value 1.0.  The variable x is an int, and so it will cast the value from 1.0 to 1.  So, my answer is b, main returns the int value 1.<br />
<br />&nbsp;<br />
<center><strong>*SPOILER ALERT &#8211; ANSWER BELOW*</strong></center><br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp; </p>
<p><strong>Answer</strong>:</p>
<p>The answer is actually d &#8211; it varies!  But, in practice, you will likely get c &#8211; 1056964608.  How does this happen?  Well, the astute observer will notice that in the source file containing our main function, there is no function prototype declaring the function giveMeAFloat. Because of this, and the fact that giveMeAFloat is implemented in another source file, then <strong>giveMeAFloat is *assumed* to return an int and not a float</strong>!  If the method were declared and defined within the same source file, the compiler would detect this error and not complete the compilation. However, due to separate compilation, this cast goes unnoticed.  And so, because of this ambiguity, depending on the compiler <i>and</i> the platform, how this value is treated and stored will vary from machine to machine!  To better understand this, let&#8217;s look at the practical case where the answer is 1056964608.</p>
<ul>
<li><strong>This assumes that the program is being executed on a typical machine setup, with an x86 architecture running a current version of gcc (v4.x+)</strong><br />
	When the program is executed, within main, an int variable, x, is declared and initialized with a simple assignment expression that invokes giveMeAFloat.  When giveMeAFloat returns, it stores the value 0.5 into the return register, eax.  Since we are on a little-endian machine, this value is 0x3F000000.  However, since the compiler is expecting to read an integer value, it interprets 0x3F000000 as an int and not a float, effectively loading the value 1056964608 (this is the decimal interpretation of the floating point hex representation of 0x3F000000&#8230;yikes!).  Back in main, the value 0.5 gets added to this, resulting in the float value 1056964608.5.  This subsequently gets assigned to the variable x.  Since x is an int, this value gets cast and therefore truncated to 1056964608.  And so <strong>main returns 1056964608</strong>.<br />&nbsp;
	</li>
</ul>
<p>As you can see, there are many factors that can affect the return value.  In particular, what value the compiler stores into the return register (if anything), how that value is stored internally (endian-ness of the host machine), and how that value is subsequently read from the register (interpreted as int, or float, or other) all play a part.  Due to all of these factors, the return value from main is effectively unpredictable, and should be treated as such (regardless of what the practical case would yield)!</p>
<p><strong>Moral</strong>:</p>
<p>Given an arbitrary name that has not yet been previously declared, if the name is followed by a left parenthesis, it is defined to be a function and it is assumed to return an int.  To prevent this, explicitly declare the function, either as a function prototype at the top of the source file, like so&#8230;</p>

<div class="wp_syntax"><div class="code"><pre class="c" style="font-family:monospace;"><span style="color: #339933;">#include &lt;stdio.h&gt;</span>
&nbsp;
<span style="color: #993333;">float</span> giveMeAFloat<span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
&nbsp;
<span style="color: #993333;">int</span> main<span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span>
<span style="color: #009900;">&#123;</span>
	<span style="color: #993333;">int</span> x <span style="color: #339933;">=</span> <span style="color:#800080;">0.5</span> <span style="color: #339933;">+</span> giveMeAFloat<span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
&nbsp;
	<span style="color: #b1b100;">return</span> x<span style="color: #339933;">;</span>
<span style="color: #009900;">&#125;</span></pre></div></div>

<p>&#8230;or within the calling routine, like so&#8230;</p>

<div class="wp_syntax"><div class="code"><pre class="c" style="font-family:monospace;"><span style="color: #339933;">#include &lt;stdio.h&gt;</span>
&nbsp;
<span style="color: #993333;">int</span> main<span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span>
<span style="color: #009900;">&#123;</span>
	<span style="color: #993333;">float</span> giveMeAFloat<span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
	<span style="color: #993333;">int</span> x <span style="color: #339933;">=</span> <span style="color:#800080;">0.5</span> <span style="color: #339933;">+</span> giveMeAFloat<span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
&nbsp;
	<span style="color: #b1b100;">return</span> x<span style="color: #339933;">;</span>
<span style="color: #009900;">&#125;</span></pre></div></div>

<p>Now, there is no confusion, to yourself or the compiler, about the return-type of the function giveMeAFloat().</p>
<p>That&#8217;s been another C Puzzler!  Hope you enjoyed!  Happy coding!<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
Charles</p>
<p><a href="http://blogs.adobe.com/charles/files/2011/02/c-puzzler-give-me-a-float.zip"><img class="size-full wp-image-93" title="winzip_logo" src="http://blogs.adobe.com/charles/files/2010/11/winzip_logo-e1289008526983.gif" alt="" width="50" height="50" align="center" /></a> <strong><a href="http://blogs.adobe.com/charles/files/2011/02/c-puzzler-give-me-a-float.zip">c-puzzler-give-me-a-float.zip</a></strong> (source code)</p>
<p><strong>Update</strong>: This post was corrected based on some feedback in the comments by Mihai.  Thanks for the feedback, Mihai!</p>
			</div>

<ul class="tags">
<li><a href="http://blogs.adobe.com/charles/tag/c-2">c (2)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/challenge">challenge (5)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/problem">problem (4)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/programming-2">programming (9)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/puzzler-2">puzzler (4)</a></li> 
</ul>


						
			<div class="meta">
				<span>3:49 PM</span>
<span><a href="http://blogs.adobe.com/charles/2011/02/c-puzzler-give-me-a-float.html#comments">Comments</a> (4)</span>				<span><a href="http://blogs.adobe.com/charles/2011/02/c-puzzler-give-me-a-float.html">Permalink</a></span>
			</div>
			<div class="clear"></div>

						
	</div>
	
	
	<div class="entry" id="entry-490">
					
		<span class="date">January 26, 2011</span>
			<h2><a href="http://blogs.adobe.com/charles/2011/01/my-adventure-writing-my-first-quine-in-java.html">My Adventure Writing My First Quine in Java</a></h2>
			<div class="entry-body">
				
<!-- Facebook Like Button v1.9.6 BEGIN [http://blog.bottomlessinc.com] -->
<iframe src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fblogs.adobe.com%2Fcharles%2F2011%2F01%2Fmy-adventure-writing-my-first-quine-in-java.html&amp;layout=standard&amp;show_faces=false&amp;width=450&amp;action=like&amp;colorscheme=light" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:450px; height: 30px; align: left; margin: 2px 0px 2px 0px"></iframe>
<!-- Facebook Like Button END -->
<div class="tweetmeme_button" style="float: right; margin-left: 10px;"><a class="tm_button" rel="&amp;source=charlesbihis&amp;style=normal&amp;service=bit.ly&amp;service_api=R_9d9bd149a2e37cd8e69d45dcddf5c08c&amp;b=2" href="http://blogs.adobe.com/charles/2011/01/my-adventure-writing-my-first-quine-in-java.html"></a></div>
<p>Today, I tried to write my very first <a href="http://en.wikipedia.org/wiki/Quine_(computing)">quine</a>.  What is a quine, you might ask?  Well, for those that don&#8217;t know, a quine is simply a program that takes no input but whose only output is the program code itself.  Easy, right?  That&#8217;s what I thought.  This post is going to document my adventure writing my first quine in Java.</p>
<p>&nbsp;</p>
<h2>Trial and error</h2>
<p>So, I need to write a program that outputs a program&#8230;itself to be exact.  I didn&#8217;t think much of it, so I dove right in.  Let&#8217;s take a look at my first pass&#8230;</p>

<div class="wp_syntax"><div class="code"><pre class="java" style="font-family:monospace;"><span style="color: #000000; font-weight: bold;">public</span> <span style="color: #000000; font-weight: bold;">class</span> Quine <span style="color: #009900;">&#123;</span>
	<span style="color: #000000; font-weight: bold;">public</span> <span style="color: #000000; font-weight: bold;">static</span> <span style="color: #000066; font-weight: bold;">void</span> main<span style="color: #009900;">&#40;</span><span style="color: #003399;">String</span><span style="color: #009900;">&#91;</span><span style="color: #009900;">&#93;</span> args<span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
		<span style="color: #003399;">System</span>.<span style="color: #006633;">out</span>.<span style="color: #006633;">println</span><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">&quot;public class Quine {<span style="color: #000099; font-weight: bold;">\n</span><span style="color: #000099; font-weight: bold;">\t</span>public static void main(String[] args) {<span style="color: #000099; font-weight: bold;">\n</span><span style="color: #000099; font-weight: bold;">\t</span><span style="color: #000099; font-weight: bold;">\t</span>System.out.println(<span style="color: #000099; font-weight: bold;">\&quot;</span>...fuck&quot;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
	<span style="color: #009900;">&#125;</span>
<span style="color: #009900;">&#125;</span>
&nbsp;
<span style="color: #666666; font-style: italic;">/* OUTPUT:
public class Quine {
	public static void main(String[] args) {
		System.out.println(&quot;...fuck
&nbsp;
*/</span></pre></div></div>

<p>Fuck.  This won&#8217;t work.  As you can see, the problem quickly reveals itself.  Essentially, there comes a point where you must print the code that you are using to print!  (Even that sentence is a little confusing)  This can easily degrade into an infinite loop.  So, how do you overcome this?</p>
<p style="text-align: center;"><strong><em>You must write some code that you use to both store the characters<br />
to be printed, but can ALSO be used to print itself!</em></strong></p>
<p>I believe this is the main problem to solve when writing quines.  Once you can get over this hump, the rest is simple!  If you can figure this out, you&#8217;ve done 90% of the work.  Really!  So I started to tackle this problem, head on.</p>
<p>&nbsp;</p>
<h2>A string that prints itself</h2>
<p>First, I did away with the System.out.println() method.  Instead, I opted for the printf() method.  With functionality very similar to the ANSII C printf() method, it has some powerful string manipulation features that will make this quine much easier to write (and read).  Second, I tried to think of a way to write some code that printed itself.  More specifically, I decided that I needed to figure out a way to solve the following code segment&#8230;</p>

<div class="wp_syntax"><div class="code"><pre class="java" style="font-family:monospace;"><span style="color: #003399;">String</span> s <span style="color: #339933;">=</span> <span style="color: #0000ff;">&quot;?&quot;</span><span style="color: #339933;">;</span>
<span style="color: #003399;">System</span>.<span style="color: #006633;">out</span>.<span style="color: #006633;">printf</span><span style="color: #009900;">&#40;</span><span style="color: #339933;">?</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span></pre></div></div>

<p>What could I replace the question marks with such that it would output the string declaration itself, exactly, and nothing else?  I thought about this for a while before I came up with a solution.  Since I think that this step is the most important and requires the most thinking, rather than ruin it for you, I&#8217;ll let you think about it for yourself.</p>
<p>&nbsp;<br />
<center><strong>*SPOILER ALERT &#8211; ANSWER BELOW*</strong></center><br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<div id="attachment_525" class="wp-caption aligncenter" style="width: 335px"><a href="http://blogs.adobe.com/charles/files/2011/01/willard_van_orman_quine.jpg"><img src="http://blogs.adobe.com/charles/files/2011/01/willard_van_orman_quine.jpg" alt="Willard Van Orman Quine - A Harvard Professor of philosophy for which the self-reproducing code concept was named after" title="Willard Van Orman Quine" width="325" height="495" class="size-full wp-image-525" /></a><p class="wp-caption-text">Willard Van Orman Quine - A Harvard professor of philosophy for which the self-reproducing code concept was named after</p></div><br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp; </p>
<p>After some head-scratching, I came up with&#8230;</p>

<div class="wp_syntax"><div class="code"><pre class="java" style="font-family:monospace;"><span style="color: #000000; font-weight: bold;">public</span> <span style="color: #000000; font-weight: bold;">class</span> Quine <span style="color: #009900;">&#123;</span>
	<span style="color: #000000; font-weight: bold;">public</span> <span style="color: #000000; font-weight: bold;">static</span> <span style="color: #000066; font-weight: bold;">void</span> main<span style="color: #009900;">&#40;</span><span style="color: #003399;">String</span><span style="color: #009900;">&#91;</span><span style="color: #009900;">&#93;</span> args<span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
		<span style="color: #003399;">String</span> s <span style="color: #339933;">=</span> <span style="color: #0000ff;">&quot;String s = %c%s%c;&quot;</span><span style="color: #339933;">;</span>
		<span style="color: #003399;">System</span>.<span style="color: #006633;">out</span>.<span style="color: #006633;">printf</span><span style="color: #009900;">&#40;</span>s, <span style="color: #0000ff;">'&quot;'</span>, s, <span style="color: #0000ff;">'&quot;'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
	<span style="color: #009900;">&#125;</span>
<span style="color: #009900;">&#125;</span>
&nbsp;
<span style="color: #666666; font-style: italic;">/* OUTPUT:
String s = &quot;String s = %c%s%c;&quot;;
*/</span></pre></div></div>

<p>There are many other solutions for this, but this is what I came up with.  Now that I&#8217;ve got this figured out, all that&#8217;s left is filling in the stuff before and after.</p>
<p>&nbsp; </p>
<h2>All that&#8217;s left is everything</h2>
<p>The self-reproducing code that I wrote above is essentially the middle of the program, and I&#8217;ve figured out a way to print it.  Now, on to printing the stuff that goes before.  This is quite a bit simpler than the first step, but not quite trivial.  Again, here is another failed attempt&#8230;</p>

<div class="wp_syntax"><div class="code"><pre class="java" style="font-family:monospace;"><span style="color: #000000; font-weight: bold;">public</span> <span style="color: #000000; font-weight: bold;">class</span> Quine <span style="color: #009900;">&#123;</span>
	<span style="color: #000000; font-weight: bold;">public</span> <span style="color: #000000; font-weight: bold;">static</span> <span style="color: #000066; font-weight: bold;">void</span> main<span style="color: #009900;">&#40;</span><span style="color: #003399;">String</span><span style="color: #009900;">&#91;</span><span style="color: #009900;">&#93;</span> args<span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
		<span style="color: #003399;">String</span> s <span style="color: #339933;">=</span> <span style="color: #0000ff;">&quot;public class Quine {<span style="color: #000099; font-weight: bold;">\n</span><span style="color: #000099; font-weight: bold;">\t</span>public static void main(String[] args) {<span style="color: #000099; font-weight: bold;">\n</span><span style="color: #000099; font-weight: bold;">\t</span><span style="color: #000099; font-weight: bold;">\t</span>String s = %c%s%c;&quot;</span><span style="color: #339933;">;</span>
		<span style="color: #003399;">System</span>.<span style="color: #006633;">out</span>.<span style="color: #006633;">printf</span><span style="color: #009900;">&#40;</span>s, <span style="color: #0000ff;">'&quot;'</span>, s, <span style="color: #0000ff;">'&quot;'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
	<span style="color: #009900;">&#125;</span>
<span style="color: #009900;">&#125;</span>
&nbsp;
<span style="color: #666666; font-style: italic;">/* OUTPUT:
public class Quine {
	public static void main(String[] args) {
		String s = &quot;public class Quine {
	public static void main(String[] args) {
		String s = %c%s%c;&quot;;
*/</span></pre></div></div>

<p>You&#8217;ll notice that hardcoding the line-feeds and horizontal tabs into the string doesn&#8217;t give us the right result.  They get evaluated by the printf() twice.  The solution to this is to make use of the variable arguments in printf() and reference those characters instead.</p>

<div class="wp_syntax"><div class="code"><pre class="java" style="font-family:monospace;"><span style="color: #000000; font-weight: bold;">public</span> <span style="color: #000000; font-weight: bold;">class</span> Quine <span style="color: #009900;">&#123;</span>
	<span style="color: #000000; font-weight: bold;">public</span> <span style="color: #000000; font-weight: bold;">static</span> <span style="color: #000066; font-weight: bold;">void</span> main<span style="color: #009900;">&#40;</span><span style="color: #003399;">String</span><span style="color: #009900;">&#91;</span><span style="color: #009900;">&#93;</span> args<span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
		<span style="color: #003399;">String</span> s <span style="color: #339933;">=</span> <span style="color: #0000ff;">&quot;public class Quine {%c%cpublic static void main(String[] args) {%c%c%cString s = %c%s%c;&quot;</span><span style="color: #339933;">;</span>
		<span style="color: #003399;">System</span>.<span style="color: #006633;">out</span>.<span style="color: #006633;">printf</span><span style="color: #009900;">&#40;</span>s, <span style="color: #0000ff;">'<span style="color: #000099; font-weight: bold;">\n</span>'</span>, <span style="color: #0000ff;">'<span style="color: #000099; font-weight: bold;">\t</span>'</span>, <span style="color: #0000ff;">'<span style="color: #000099; font-weight: bold;">\n</span>'</span>, <span style="color: #0000ff;">'<span style="color: #000099; font-weight: bold;">\t</span>'</span>, <span style="color: #0000ff;">'<span style="color: #000099; font-weight: bold;">\t</span>'</span>, <span style="color: #0000ff;">'&quot;'</span>, s, <span style="color: #0000ff;">'&quot;'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
	<span style="color: #009900;">&#125;</span>
<span style="color: #009900;">&#125;</span>
&nbsp;
<span style="color: #666666; font-style: italic;">/* OUTPUT:
public class Quine {
	public static void main(String[] args) {
		String s = &quot;public class Quine {%c%cpublic static void main(String[] args) {%c%c%cString s = %c%s%c;&quot;;
*/</span></pre></div></div>

<p>Nice!  Things are coming along, but the code is getting uglier.</p>
<p>&nbsp; </p>
<h2>Spring cleaning!</h2>
<p>As you can see, we&#8217;re starting to get a lot of redundancy in the printf() call.  My next step was to clean this up.  Quine&#8217;s are all about reuse!  The less code there is, the less code I have to worry about re-printing.  So, I changed all of the arguments to printf() to be index-based instead, allowing me to reuse characters.</p>

<div class="wp_syntax"><div class="code"><pre class="java" style="font-family:monospace;"><span style="color: #000000; font-weight: bold;">public</span> <span style="color: #000000; font-weight: bold;">class</span> Quine <span style="color: #009900;">&#123;</span>
	<span style="color: #000000; font-weight: bold;">public</span> <span style="color: #000000; font-weight: bold;">static</span> <span style="color: #000066; font-weight: bold;">void</span> main<span style="color: #009900;">&#40;</span><span style="color: #003399;">String</span><span style="color: #009900;">&#91;</span><span style="color: #009900;">&#93;</span> args<span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
		<span style="color: #003399;">String</span> s <span style="color: #339933;">=</span> <span style="color: #0000ff;">&quot;public class Quine {%3$c%4$cpublic static void main (String[] args) {%3$c%4$c%4$cString s = %2$c%1$s%2$c;&quot;</span><span style="color: #339933;">;</span>
		<span style="color: #003399;">System</span>.<span style="color: #006633;">out</span>.<span style="color: #006633;">printf</span><span style="color: #009900;">&#40;</span>s, s, <span style="color: #0000ff;">'&quot;'</span>, <span style="color: #0000ff;">'<span style="color: #000099; font-weight: bold;">\n</span>'</span>, <span style="color: #0000ff;">'<span style="color: #000099; font-weight: bold;">\t</span>'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
	<span style="color: #009900;">&#125;</span>
<span style="color: #009900;">&#125;</span>
&nbsp;
<span style="color: #666666; font-style: italic;">/* OUTPUT:
public class Quine {
	public static void main (String[] args) {
		String s = &quot;public class Quine {%3$c%4$cpublic static void main (String[] args) {%3$c%4$c%4$cString s = %2$c%1$s%2$c;&quot;;
*/</span></pre></div></div>

<p>This is looking a lot cleaner now.  Finally, let&#8217;s round this quine off by filling in the rest of the code.</p>
<p>&nbsp; </p>
<h2>Print the rest&#46;&#46;&#46;easy!  I think.</h2>
<p>Again, this is quite a bit simpler than the previous steps, but not trivial.  Another failed attempt&#8230;</p>

<div class="wp_syntax"><div class="code"><pre class="java" style="font-family:monospace;"><span style="color: #000000; font-weight: bold;">public</span> <span style="color: #000000; font-weight: bold;">class</span> Quine <span style="color: #009900;">&#123;</span>
	<span style="color: #000000; font-weight: bold;">public</span> <span style="color: #000000; font-weight: bold;">static</span> <span style="color: #000066; font-weight: bold;">void</span> main<span style="color: #009900;">&#40;</span><span style="color: #003399;">String</span><span style="color: #009900;">&#91;</span><span style="color: #009900;">&#93;</span> args<span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
		<span style="color: #003399;">String</span> s <span style="color: #339933;">=</span> <span style="color: #0000ff;">&quot;public class Quine {%3$c%4$cpublic static void main (String[] args) {%3$c%4$c%4$cString s = %2$c%1$s%2$c;%3$c%4$c%4$cSystem.out.printf(s, s, ...fuck&quot;</span><span style="color: #339933;">;</span>
		<span style="color: #003399;">System</span>.<span style="color: #006633;">out</span>.<span style="color: #006633;">printf</span><span style="color: #009900;">&#40;</span>s, s, <span style="color: #0000ff;">'&quot;'</span>, <span style="color: #0000ff;">'<span style="color: #000099; font-weight: bold;">\n</span>'</span>, <span style="color: #0000ff;">'<span style="color: #000099; font-weight: bold;">\t</span>'</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
	<span style="color: #009900;">&#125;</span>
<span style="color: #009900;">&#125;</span>
&nbsp;
<span style="color: #666666; font-style: italic;">/* OUTPUT:
public class Quine {
	public static void main (String[] args) {
		String s = &quot;public class Quine {%3$c%4$cpublic static void main (String[] args) {%3$c%4$c%4$cString s = %2$c%1$s%2$c;%3$c%4$c%4$cSystem.out.printf(s, s, ...fuck&quot;;
		System.out.printf(s, s, ...fuck
*/</span></pre></div></div>

<p>We have hit the familiar problem of printing code that is used to print itself!  This is slightly different, however.  The difference is that we are trying to output characters that must be escaped in one output, but not in the other.  There is a simple solution for this!  Use the ASCII character codes instead!  Replacing &#8216;&#8221;&#8216;, &#8216;\n&#8217;, and &#8216;\t&#8217; with their ASCII decimal equivalent codes, we are easily able to insert them into the string literal without them being interpreted by the printf() method, and without the need for escaping them.  In the end, we get&#8230;.</p>

<div class="wp_syntax"><div class="code"><pre class="java" style="font-family:monospace;"><span style="color: #000000; font-weight: bold;">public</span> <span style="color: #000000; font-weight: bold;">class</span> Quine <span style="color: #009900;">&#123;</span>
	<span style="color: #000000; font-weight: bold;">public</span> <span style="color: #000000; font-weight: bold;">static</span> <span style="color: #000066; font-weight: bold;">void</span> main<span style="color: #009900;">&#40;</span><span style="color: #003399;">String</span><span style="color: #009900;">&#91;</span><span style="color: #009900;">&#93;</span> args<span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
		<span style="color: #003399;">String</span> s <span style="color: #339933;">=</span> <span style="color: #0000ff;">&quot;public class Quine {%3$c%4$cpublic static void main (String[] args) {%3$c%4$c%4$cString s = %2$c%1$s%2$c;%3$c%4$c%4$cSystem.out.printf(s, s, 34, 10, 9);%3$c%4$c}%3$c}&quot;</span><span style="color: #339933;">;</span>
		<span style="color: #003399;">System</span>.<span style="color: #006633;">out</span>.<span style="color: #006633;">printf</span><span style="color: #009900;">&#40;</span>s, s, <span style="color: #cc66cc;">34</span>, <span style="color: #cc66cc;">10</span>, <span style="color: #cc66cc;">9</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
	<span style="color: #009900;">&#125;</span>
<span style="color: #009900;">&#125;</span>
&nbsp;
<span style="color: #666666; font-style: italic;">/* OUTPUT:
public class Quine {
	public static void main (String[] args) {
		String s = &quot;public class Quine {%3$c%4$cpublic static void main (String[] args) {%3$c%4$c%4$cString s = %2$c%1$s%2$c;%3$c%4$c%4$cSystem.out.printf(s, s, 34, 10, 9);%3$c%4$c}%3$c}&quot;;
		System.out.printf(s, s, 34, 10, 9);
	}
}
*/</span></pre></div></div>

<p>Eureka!  My very first quine!  Try writing one for yourself!  Feel free to share them with me in the comments, or through e-mail at charlesb[at]adobe[dot]com!  I&#8217;d love to post them :)</p>
<p>Enjoy!<br />
<br />&nbsp;<br />
Charles</p>
			</div>

<ul class="tags">
<li><a href="http://blogs.adobe.com/charles/tag/challenge">challenge (5)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/java-2">java (1)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/programming-2">programming (9)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/quine">quine (1)</a></li> 
</ul>


						
			<div class="meta">
				<span>1:17 PM</span>
<span><a href="http://blogs.adobe.com/charles/2011/01/my-adventure-writing-my-first-quine-in-java.html#comments">Comments</a> (5)</span>				<span><a href="http://blogs.adobe.com/charles/2011/01/my-adventure-writing-my-first-quine-in-java.html">Permalink</a></span>
			</div>
			<div class="clear"></div>

						
	</div>
	
	
	<div class="entry" id="entry-405">
					
		<span class="date">January 13, 2011</span>
			<h2><a href="http://blogs.adobe.com/charles/2011/01/introducing-facebook-desktop-a-lightweight-unobtrusive-notification-engine-for-facebook-built-on-adobe-air.html">Introducing &#8220;Facebook Desktop&#8221; &#8211; A Lightweight, Unobtrusive Notification Engine for Facebook Built on Adobe AIR</a></h2>
			<div class="entry-body">
				
<!-- Facebook Like Button v1.9.6 BEGIN [http://blog.bottomlessinc.com] -->
<iframe src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fblogs.adobe.com%2Fcharles%2F2011%2F01%2Fintroducing-facebook-desktop-a-lightweight-unobtrusive-notification-engine-for-facebook-built-on-adobe-air.html&amp;layout=standard&amp;show_faces=false&amp;width=450&amp;action=like&amp;colorscheme=light" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:450px; height: 30px; align: left; margin: 2px 0px 2px 0px"></iframe>
<!-- Facebook Like Button END -->
<div class="tweetmeme_button" style="float: right; margin-left: 10px;"><a class="tm_button" rel="&amp;source=charlesbihis&amp;style=normal&amp;service=bit.ly&amp;service_api=R_9d9bd149a2e37cd8e69d45dcddf5c08c&amp;b=2" href="http://blogs.adobe.com/charles/2011/01/introducing-facebook-desktop-a-lightweight-unobtrusive-notification-engine-for-facebook-built-on-adobe-air.html"></a></div>
<p><strong>Disclaimer: Facebook Desktop is a personal project.  It is <i>not</i> sponsored by or affiliated with either Adobe® or Facebook®.</strong></p>
<p style="text-align: left;">Once upon a time, I was involved in a project here at Adobe called &#8220;<a href="http://work.whoischarles.com/content/project-san-dimas-a-fresh-face-to-the-ebay-shopping-experience">Project San Dimas</a>&#8220;.  That project eventually grew into a full-fledged product called &#8220;<a href="http://work.whoischarles.com/content/project-san-dimas-graduates-to-public-beta-now-called-ebay-desktop">eBay Desktop</a>&#8221; which enjoyed some impressive success.  I was lucky enough to be part of the protyping, designing, and launching of the very first version, and it was very exciting.  More recently, I&#8217;ve thought about doing something similar.  Introducing, &#8220;<a href="http://www.facebookdesktop.com/">Facebook Desktop</a>&#8220;!</p>
<p><center><img src="http://blogs.adobe.com/charles/files/2010/12/facebook-desktop-windows.png" alt="" title="facebook-desktop-windows" width="510" height="260" class="aligncenter size-full wp-image-453" /></center></p>
<p><strong>So, what is Facebook Desktop?</strong><br />
Facebook Desktop is a notification engine that gives you updates about your Facebook friends in real-time!  Whenever someone posts a story, comments on your photo, tags you in a status-update, whatever&#8230;Facebook Desktop will let you know.  It gives unobtrusive messenger-style toast messages whenever you have a notification.</p>
<p><center><img src="http://blogs.adobe.com/charles/files/2010/12/facebook-desktop-mac.png" alt="" title="facebook-desktop-mac" width="510" height="260" class="aligncenter size-full wp-image-452" /></center></p>
<p><strong>Why build Facebook Desktop?</strong><br />
I moved away from my home in Vancouver for work and so Facebook has been a great tool to help keep me in touch with everyone.  I found, though, that the browser metaphor for the Facebook &#8220;stream&#8221; just wasn&#8217;t working for me.  I didn&#8217;t like refreshing my home page constantly to see what people were up to.  I also didn&#8217;t like keeping a browser open whenever I wanted to read some of my friends posts.  So, I made a simple AIR app that hits the Facebook APIs, grabs the latest posts, and delivers them to me in an unobtrusive way.  I ended up finding it so useful, I started adding more and more features, like the ability to pause/resume, replay missed notifications, update my status, etc.  Eventually, I was encouraged by a friend to polish it up and release it for others to use, and so here we are!</p>
<p>Anyways, if you&#8217;re interested in trying it out, install it here:</p>
<p style="text-align: center;"><a href="http://www.facebookdesktop.com/">http://www.facebookdesktop.com/</a></p>
<p>You can also keep up with the project and reach out to me on any of our community pages:</p>
<ul>
<li>Facebook Page &#8211; <a href="http://www.facebook.com/apps/application.php?id=95615112563">http://www.facebook.com/apps/application.php?id=95615112563</a></li>
<li>Twitter Page &#8211; <a href="http://www.twitter.com/facebookdesktop/">http://www.twitter.com/facebookdesktop/</a></li>
</ul>
<p>And definitely, let me know what you think!  Your feedback helps me make Facebook Desktop better and better.  Until next time, happy Facebook&#8217;ing ;)<br />
<br />&nbsp;<br />
Charles</p>
			</div>

<ul class="tags">
<li><a href="http://blogs.adobe.com/charles/tag/air-2">air (2)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/facebook-2">facebook (2)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/facebook-desktop-2">facebook desktop (2)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/project">project (1)</a></li> 
</ul>


						
			<div class="meta">
				<span>3:52 PM</span>
<span><a href="http://blogs.adobe.com/charles/2011/01/introducing-facebook-desktop-a-lightweight-unobtrusive-notification-engine-for-facebook-built-on-adobe-air.html#comments">Comments</a> (17)</span>				<span><a href="http://blogs.adobe.com/charles/2011/01/introducing-facebook-desktop-a-lightweight-unobtrusive-notification-engine-for-facebook-built-on-adobe-air.html">Permalink</a></span>
			</div>
			<div class="clear"></div>

						
	</div>
	
	
	<div class="entry" id="entry-342">
					
		<span class="date">December 10, 2010</span>
			<h2><a href="http://blogs.adobe.com/charles/2010/12/happy-holidays-from-adobe.html">Happy Holidays from Adobe!</a></h2>
			<div class="entry-body">
				
<!-- Facebook Like Button v1.9.6 BEGIN [http://blog.bottomlessinc.com] -->
<iframe src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fblogs.adobe.com%2Fcharles%2F2010%2F12%2Fhappy-holidays-from-adobe.html&amp;layout=standard&amp;show_faces=false&amp;width=450&amp;action=like&amp;colorscheme=light" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:450px; height: 30px; align: left; margin: 2px 0px 2px 0px"></iframe>
<!-- Facebook Like Button END -->
<div class="tweetmeme_button" style="float: right; margin-left: 10px;"><a class="tm_button" rel="&amp;source=charlesbihis&amp;style=normal&amp;service=bit.ly&amp;service_api=R_9d9bd149a2e37cd8e69d45dcddf5c08c&amp;b=2" href="http://blogs.adobe.com/charles/2010/12/happy-holidays-from-adobe.html"></a></div>
<p><center><a href="http://www.mercycorp.org/" target="_blank"><img src="http://blogs.adobe.com/charles/files/2010/12/adobe_plus_mercycorps2.png" alt="" title="adobe_plus_mercycorps2" width="351" height="150" class="aligncenter size-full wp-image-397" /></a></center></p>
<p>Every year, Adobe helps us celebrate the holiday season by giving us a fun and interactive way to share the spirit!</p>
<ul>
<li>2006 &#8211; <a href="http://www.adobe.com/aboutadobe/holidaycard/2006/">Holiday Card 2006</a></li>
<li>2007 &#8211; <a href="http://www.adobe.com/aboutadobe/holidaycard/2007/index.html">Holiday Card 2007</a></li>
<li>2008 &#8211; <a href="http://greeting2008.adobe.com/">Greeting Slide Puzzle AIR App</a></li>
<li>2009 &#8211; <a href="http://www.adobegreeting2009.com/">Good Thoughts</a></li>
</ul>
<p>This year is no different!  We often have a theme for each year, and I happen to love this years theme &#8211; <em>turning inspiration into action</em>.  We&#8217;re asking you to share what it is in your life that inspires you, and in return, <strong>we&#8217;ll donate $1 per response to <a href="http://www.mercycorps.org/" target="_blank">Mercy Corps</a></strong> with the goal of donating $25,000!<br />&nbsp;</p>
<h2 style="text-align: center;"><a href="http://www.adobe.com/special/holidaycard/?2010"><strong>Adobe Holiday Card 2010</strong></a></h2>
<p>&nbsp;<br />
So, share the inspiration and share the love!</p>
<p style="padding-left: 30px;">If you&#8217;re on <a href="http://www.twitter.com" target="_blank">Twitter</a>, please tweet:<br />
• What inspires you? Share with us and we will donate $1 to @MercyCorps. Happy Holidays from @Adobe! http://bit.ly/AdobeGreet</p>
<p style="padding-left: 30px;">If you&#8217;re on <a href="http://www.facebook.com" target="_blank">Facebook</a>, please share:<br />
• What inspires you this holiday season? Share your thoughts with us and we’ll help turn inspiration into action by donating $1 to Mercy Corps. Happy Holidays from Adobe! http://bit.ly/AdobeGreet</p>
<p>Happy Holidays!</p>
<p>*I love this time of year :D</p>
<p>&nbsp;</p>
<p>Charles</p>
			</div>

<ul class="tags">
<li><a href="http://blogs.adobe.com/charles/tag/adobe-2">adobe (1)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/charity">charity (1)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/donation">donation (1)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/holidays">holidays (1)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/mercy-corps">mercy corps (1)</a></li> 
</ul>


						
			<div class="meta">
				<span>5:44 PM</span>
<span><a href="http://blogs.adobe.com/charles/2010/12/happy-holidays-from-adobe.html#comments">Comments</a> (0)</span>				<span><a href="http://blogs.adobe.com/charles/2010/12/happy-holidays-from-adobe.html">Permalink</a></span>
			</div>
			<div class="clear"></div>

						
	</div>
	
	
	<div class="entry" id="entry-287">
					
		<span class="date">December 7, 2010</span>
			<h2><a href="http://blogs.adobe.com/charles/2010/12/javascript-puzzler-lets-print-some-zip-codes.html">JavaScript Puzzler &#8211; Let&#8217;s Print Some ZIP-Codes!</a></h2>
			<div class="entry-body">
				
<!-- Facebook Like Button v1.9.6 BEGIN [http://blog.bottomlessinc.com] -->
<iframe src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fblogs.adobe.com%2Fcharles%2F2010%2F12%2Fjavascript-puzzler-lets-print-some-zip-codes.html&amp;layout=standard&amp;show_faces=false&amp;width=450&amp;action=like&amp;colorscheme=light" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:450px; height: 30px; align: left; margin: 2px 0px 2px 0px"></iframe>
<!-- Facebook Like Button END -->
<div class="tweetmeme_button" style="float: right; margin-left: 10px;"><a class="tm_button" rel="&amp;source=charlesbihis&amp;style=normal&amp;service=bit.ly&amp;service_api=R_9d9bd149a2e37cd8e69d45dcddf5c08c&amp;b=2" href="http://blogs.adobe.com/charles/2010/12/javascript-puzzler-lets-print-some-zip-codes.html"></a></div>
<p>Let&#8217;s take a look at a JavaScript <a href="/charles/category/puzzler">Puzzler</a>.  If you don&#8217;t know what a Puzzler is, it is essentially a short problem used to demonstrate a quirk or edge-case with the language that you might encounter.  Here is the format:</p>
<ol>
<li><strong>Code</strong> &#8211; I introduce the code</li>
<li><strong>Question</strong> &#8211; I pose a multiple-choice question and you guess what the outcome is&#8230;think hard!</li>
<li><strong>Walkthrough</strong> &#8211; I walk through a reasonable explanation</li>
<li><strong>Answer</strong> &#8211; I tell you the <em>real</em> outcome (it might surprise you), and explain why</li>
<li><strong>Moral</strong> &#8211; How can we avoid making mistakes like this in our own code</li>
</ol>
<p>Now that we all know what a Puzzler is, here is a simple JavaScript Puzzler:</p>
<p><strong>Code:</strong></p>

<div class="wp_syntax"><div class="code"><pre class="javascript" style="font-family:monospace;"><span style="color: #339933;">&lt;</span>script type<span style="color: #339933;">=</span><span style="color: #3366CC;">&quot;text/javascript&quot;</span><span style="color: #339933;">&gt;</span>
&nbsp;
	<span style="color: #006600; font-style: italic;">// array of 6 valid zip-codes</span>
	<span style="color: #003366; font-weight: bold;">var</span> zipCodes <span style="color: #339933;">=</span> <span style="color: #003366; font-weight: bold;">new</span> Array<span style="color: #009900;">&#40;</span><span style="color: #3366CC;">&quot;93021&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;16284&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;02392&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;20341&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;08163&quot;</span><span style="color: #339933;">,</span> <span style="color: #3366CC;">&quot;32959&quot;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
&nbsp;
	<span style="color: #006600; font-style: italic;">// let's do something with each zip-code - for now, print them out</span>
	<span style="color: #000066; font-weight: bold;">for</span> <span style="color: #009900;">&#40;</span>i <span style="color: #339933;">=</span> <span style="color: #CC0000;">0</span><span style="color: #339933;">;</span> i <span style="color: #339933;">&lt;</span> zipCodes.<span style="color: #660066;">length</span><span style="color: #339933;">;</span> i<span style="color: #339933;">++</span><span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
&nbsp;
		<span style="color: #006600; font-style: italic;">// sanity check</span>
		<span style="color: #000066; font-weight: bold;">if</span> <span style="color: #009900;">&#40;</span><span style="color: #339933;">!</span>isNaN<span style="color: #009900;">&#40;</span>parseInt<span style="color: #009900;">&#40;</span>zipCodes<span style="color: #009900;">&#91;</span>i<span style="color: #009900;">&#93;</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">&amp;&amp;</span> parseInt<span style="color: #009900;">&#40;</span>zipCodes<span style="color: #009900;">&#91;</span>i<span style="color: #009900;">&#93;</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">&gt;</span> <span style="color: #CC0000;">0</span><span style="color: #009900;">&#41;</span> <span style="color: #009900;">&#123;</span>
			document.<span style="color: #000066; font-weight: bold;">write</span><span style="color: #009900;">&#40;</span>parseInt<span style="color: #009900;">&#40;</span>zipCodes<span style="color: #009900;">&#91;</span>i<span style="color: #009900;">&#93;</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">+</span> <span style="color: #3366CC;">&quot; &quot;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
		<span style="color: #009900;">&#125;</span>
&nbsp;
	<span style="color: #009900;">&#125;</span>
&nbsp;
<span style="color: #339933;">&lt;/</span>script<span style="color: #339933;">&gt;</span></pre></div></div>

<p><strong>Question:</strong></p>
<p>What does this print?</p>
<ol style="list-style: lower-alpha;">
<li>93021 16284 2392 20341 32959</li>
<li>93021 16284 2392 20341 8163 32959</li>
<li>93021 16284 20341 32959</li>
<li>none of the above</li>
</ol>
<p><strong>Walkthrough:</strong></p>
<p>So, we have an array of 6 ZIP-codes in string format.  We iterate through each one and print it, but first we do a sanity check.  Let&#8217;s walk through each number and see if it passes.</p>
<ul>
<li>93021 &#8211; This will return a number and it will be greater than 0, so &#8220;93021&#8243; will be written.</li>
<li>16284 &#8211; This will return a number and it will be greater than 0, so &#8220;16284&#8243; will be written.</li>
<li>02392- This number has a leading 0, but parseInt() will just trim it.  So, this will also return a number greater than 0, and &#8220;2392&#8243; will also be printed (Note: no leading 0).</li>
<li>20341 &#8211; This will return a number and it will be greater than 0, so &#8220;20341&#8243; will be written.</li>
<li>08163 &#8211; The same as the other number with a leading 0, parseInt() will trim this and return valid number, so &#8220;8163&#8243; will be printed (Note again: no leading 0).</li>
<li>32959 &#8211; This will return a number and it will be greater than 0, so &#8220;32959&#8243; will be written.</li>
</ul>
<p>Therefore, we should see all six numbers printed, with the numbers that have trailing 0&#8242;s being trimmed.  So, my answer is b, this code will print the string &#8220;93021 16284 2392 20341 8163 32959&#8243;.</p>
<p>&nbsp;<br />
<center><strong>*SPOILER ALERT &#8211; ANSWER BELOW*</strong></center><br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp;<br />
<br />&nbsp; </p>
<p><strong>Answer:</strong></p>
<p>If you chose a, you were close.  The answer is actually d &#8211; none of the above.  This is because the ECMAScript standard does not define the interpretation of certain number literals, in particular number literals with a leading 0.  Some JavaScript implementations will interpret these as integers with the leading 0 trimmed.  Others will treat them as <em>octal literals</em>.  It should be noted, though, that MOST JavaScript interpreters will perform the latter and interpret number literals with leading 0&#8242;s as octal literals.  This is different from other languages, like Java&#8217;s Integer.parseInt(), which will conversely trim the leading 0.</p>
<p>So what <em>actually</em> gets printed?  In most browsers, including IE 8, Firefox 3 and Chrome, the string &#8220;93021 16284 <strong>19</strong> 20341 32959&#8243; gets printed (Notice the 19!).  Let&#8217;s examine this step-by-step one more time&#8230;</p>
<ul>
<li>93021 &#8211; There is no leading 0, and so this number will get interpreted just as we expect, as the integer 93021, and so &#8220;93021&#8243; will be written.</li>
<li>16284 &#8211; Again, no leading 0, so no surprises here.  &#8220;16284&#8243; will be written.</li>
<li>02392- This number has a leading 0, and so it will be interpreted as an octal literal.  Notice, though, that the second least-significant-digit is a 9, which is not allowed in an octal number!  And so, by the specification of parseInt(), it will read all digits until an illegal character is read.  Therefore, parseInt() will parse the octal value 23, which equals ((2 x 8) + (3 * 1)) = (16 + 3) = <strong>19 in decimal</strong>.</li>
<li>20341 &#8211; This will return a number and it will be greater than 0, so &#8220;20341&#8243; will be written.</li>
<li>08163 &#8211; Again, this number has a leading 0.  But, this time, the <em>most</em>-significant-digit is an 8, which is also not allowed in an octal number.  So, parseInt() will interpret the octal value 0, and return 0.  This fails the second part of our sanity check (that our ZIP-code must be non-zero), and so this <strong>doesn&#8217;t get printed</strong>!</li>
<li>32959 &#8211; This will get printed as is.  No surprise here either.</li>
</ul>
<p><strong>Moral:</strong></p>
<p>Whenever possible, do <em>not</em> write an integer with a leading zero.  Doing so can cause unexpected behaviour across browsers with different JavaScript implementations.  If you can&#8217;t control the input values (as in our example above), then make use of parseInt()&#8217;s second optional parameter, radix &#8211; e.g. use parseInt(&#8220;08163&#8243;, 10) to parse &#8220;08163&#8243; to a base-10 integer.  Passing in the radix explicitly eliminates the variability between browser implementations.</p>
<p>That&#8217;s it for this JavaScript Puzzler!  Until next time, happy coding!</p>
<p>Charles</p>
<p><a href="http://blogs.adobe.com/charles/files/2010/12/javascript-puzzler-lets-print-some-zip-codes.zip"><img class="size-full wp-image-93" title="winzip_logo" src="http://blogs.adobe.com/charles/files/2010/11/winzip_logo-e1289008526983.gif" alt="" width="50" height="50" align="center" /></a> <strong><a href="http://blogs.adobe.com/charles/files/2010/12/javascript-puzzler-lets-print-some-zip-codes.zip">javascript-puzzler-lets-print-some-zip-codes.zip</a></strong> (source code)</p>
			</div>

<ul class="tags">
<li><a href="http://blogs.adobe.com/charles/tag/challenge">challenge (5)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/javascript-2">javascript (1)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/problem">problem (4)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/programming-2">programming (9)</a></li> 
<li><a href="http://blogs.adobe.com/charles/tag/puzzler-2">puzzler (4)</a></li> 
</ul>


						
			<div class="meta">
				<span>1:00 PM</span>
<span><a href="http://blogs.adobe.com/charles/2010/12/javascript-puzzler-lets-print-some-zip-codes.html#comments">Comments</a> (0)</span>				<span><a href="http://blogs.adobe.com/charles/2010/12/javascript-puzzler-lets-print-some-zip-codes.html">Permalink</a></span>
			</div>
			<div class="clear"></div>

						
	</div>
	
	
	<div class="navigation">
<a href="http://blogs.adobe.com/charles/page/2" >Next Posts</a>		<div class="clear"></div>
	</div>
					
	</div>

</div>
<div class="right">
<ul>
<li class="widget widget_text">			<div class="textwidget"><b>Charles Bihis</b> is a Computer Scientist for Adobe Systems. The views expressed in this blog are his own and do not necessarily reflect those of his employers.
<br /><br /></div>
		</li>		<li class="widget widget_recent_entries">		<h3>Recent Posts</h3>		<ul>
				<li><a href="http://blogs.adobe.com/charles/2011/12/diff-library-for-actionscript.html" title="Diff Library for ActionScript">Diff Library for ActionScript</a></li>
				<li><a href="http://blogs.adobe.com/charles/2011/05/facebook-desktop-were-international-baby.html" title="Facebook Desktop &#8211; We&#8217;re international, baby!">Facebook Desktop &#8211; We&#8217;re international, baby!</a></li>
				<li><a href="http://blogs.adobe.com/charles/2011/05/relative-time-library-for-actionscript.html" title="Relative Time Library for ActionScript">Relative Time Library for ActionScript</a></li>
				<li><a href="http://blogs.adobe.com/charles/2011/03/actionscript-puzzler-the-joy-of-millisecs.html" title="ActionScript Puzzler &#8211; The Joy of Millisecs">ActionScript Puzzler &#8211; The Joy of Millisecs</a></li>
				<li><a href="http://blogs.adobe.com/charles/2011/02/want-to-localize-your-flexair-apps-its-easy-ill-show-you-how-again.html" title="Want to Localize Your Flex/AIR Apps?  It&#8217;s Easy!  I&#8217;ll Show You How&#8230;Again!">Want to Localize Your Flex/AIR Apps?  It&#8217;s Easy!  I&#8217;ll Show You How&#8230;Again!</a></li>
				</ul>
		</li><li class="widget widget_recent_comments"><h3>Recent Comments</h3><ul id="recentcomments"><li class="recentcomments"><a href='http://www.cultcreative.com' rel='external nofollow' class='url'>Marc Pelland</a> on <a href="http://blogs.adobe.com/charles/2011/12/diff-library-for-actionscript.html#comment-168">Diff Library for ActionScript</a></li><li class="recentcomments"><a href='http://www.hireflashdevelopers.com/blog/2011/12/diff-library-for-actionscript/' rel='external nofollow' class='url'>Diff Library for ActionScript | Hire Flash Developers</a> on <a href="http://blogs.adobe.com/charles/2011/12/diff-library-for-actionscript.html#comment-166">Diff Library for ActionScript</a></li><li class="recentcomments">Charles Bihis on <a href="http://blogs.adobe.com/charles/2010/11/wanted-computer-scientist-summer-intern.html#comment-165">WANTED: Computer Scientist Summer Intern!</a></li><li class="recentcomments">nayan singhal on <a href="http://blogs.adobe.com/charles/2010/11/wanted-computer-scientist-summer-intern.html#comment-162">WANTED: Computer Scientist Summer Intern!</a></li><li class="recentcomments"><a href='http://no' rel='external nofollow' class='url'>prahalad sharma</a> on <a href="http://blogs.adobe.com/charles/2011/01/my-adventure-writing-my-first-quine-in-java.html#comment-160">My Adventure Writing My First Quine in Java</a></li></ul></li><li class="widget widget_twitter"><div><h3><span class='twitterwidget twitterwidget-title'>Charles on Twitter</span></h3><ul><li><span class='entry-content'><a href="http://twitter.com/zacharyjohnson" class="twitter-user" target="_blank">@zacharyjohnson</a> Awesome blackout page!</span> <span class='entry-meta'><span class='time-meta'><a href="http://twitter.com/charlesbihis/statuses/159827781830717440" target="_blank">about 1 day ago</a></span> <span class='from-meta'>from web</span> <span class="in-reply-to-meta"><a href="http://twitter.com/zacharyjohnson/statuses/" class="reply-to" target="_blank">in reply to zacharyjohnson</a></span></span> <span class="intent-meta"><a href="http://twitter.com/intent/tweet?in_reply_to=159827781830717440" class="in-reply-to" data-lang="en" title="Reply" target="_blank">Reply</a><a href="http://twitter.com/intent/retweet?tweet_id=159827781830717440" class="retweet" data-lang="en" title="Retweet" target="_blank">Retweet</a><a href="http://twitter.com/intent/favorite?tweet_id=159827781830717440" class="favorite" data-lang="en" title="Favorite" target="_blank">Favorite</a></span></li><li><span class='entry-content'>RT <a href="http://twitter.com/mind" class="twitter-user" target="_blank">@mind</a>: Why SOPA is dangerous? ██████ ███ █████ ██████ Because ███████ <a href="http://search.twitter.com/search?q=%23Internet" class="twitter-hashtag" target="_blank">#Internet</a> ███ <a href="http://search.twitter.com/search?q=%23censorship" class="twitter-hashtag" target="_blank">#censorship</a> is. █████ █████ ████ ███ "End Piracy, ...</span> <span class='entry-meta'><span class='time-meta'><a href="http://twitter.com/charlesbihis/statuses/159732981404147712" target="_blank">about 1 day ago</a></span> <span class='from-meta'>from web</span></span> <span class="intent-meta"><a href="http://twitter.com/intent/tweet?in_reply_to=159732981404147712" data-lang="en" class="in-reply-to" title="Reply" target="_blank">Reply</a><a href="http://twitter.com/intent/retweet?tweet_id=159732981404147712" data-lang="en" class="retweet" title="Retweet" target="_blank">Retweet</a><a href="http://twitter.com/intent/favorite?tweet_id=159732981404147712" data-lang="en" class="favorite" title="Favorite" target="_blank">Favorite</a></span></li><li><span class='entry-content'><a href="http://twitter.com/RepJimMcDermott" class="twitter-user" target="_blank">@RepJimMcDermott</a> <a href="http://twitter.com/PattyMurray" class="twitter-user" target="_blank">@PattyMurray</a> Stop the madness!  Stop SOPA!  PLEASE!</span> <span class='entry-meta'><span class='time-meta'><a href="http://twitter.com/charlesbihis/statuses/159550365954605056" target="_blank">about 1 day ago</a></span> <span class='from-meta'>from web</span> <span class="in-reply-to-meta"><a href="http://twitter.com/RepJimMcDermott/statuses/" class="reply-to" target="_blank">in reply to RepJimMcDermott</a></span></span> <span class="intent-meta"><a href="http://twitter.com/intent/tweet?in_reply_to=159550365954605056" class="in-reply-to" data-lang="en" title="Reply" target="_blank">Reply</a><a href="http://twitter.com/intent/retweet?tweet_id=159550365954605056" class="retweet" data-lang="en" title="Retweet" target="_blank">Retweet</a><a href="http://twitter.com/intent/favorite?tweet_id=159550365954605056" class="favorite" data-lang="en" title="Favorite" target="_blank">Favorite</a></span></li><li><span class='entry-content'><a href="http://twitter.com/jenlai312" class="twitter-user" target="_blank">@jenlai312</a> Jenny!</span> <span class='entry-meta'><span class='time-meta'><a href="http://twitter.com/charlesbihis/statuses/157016592641835009" target="_blank">08:30:47 AM January 11, 2012</a></span> <span class='from-meta'>from web</span> <span class="in-reply-to-meta"><a href="http://twitter.com/jenlai312/statuses/" class="reply-to" target="_blank">in reply to jenlai312</a></span></span> <span class="intent-meta"><a href="http://twitter.com/intent/tweet?in_reply_to=157016592641835009" class="in-reply-to" data-lang="en" title="Reply" target="_blank">Reply</a><a href="http://twitter.com/intent/retweet?tweet_id=157016592641835009" class="retweet" data-lang="en" title="Retweet" target="_blank">Retweet</a><a href="http://twitter.com/intent/favorite?tweet_id=157016592641835009" class="favorite" data-lang="en" title="Favorite" target="_blank">Favorite</a></span></li><li><span class='entry-content'><a href="http://twitter.com/my_ninja" class="twitter-user" target="_blank">@my_ninja</a> Post-dated tweet.  I meant Sunday.  Steph still won't let me forget it.</span> <span class='entry-meta'><span class='time-meta'><a href="http://twitter.com/charlesbihis/statuses/156848446987440128" target="_blank">09:22:38 PM January 10, 2012</a></span> <span class='from-meta'>from web</span> <span class="in-reply-to-meta"><a href="http://twitter.com/my_ninja/statuses/156847183134588929" class="reply-to" target="_blank">in reply to my_ninja</a></span></span> <span class="intent-meta"><a href="http://twitter.com/intent/tweet?in_reply_to=156848446987440128" class="in-reply-to" data-lang="en" title="Reply" target="_blank">Reply</a><a href="http://twitter.com/intent/retweet?tweet_id=156848446987440128" class="retweet" data-lang="en" title="Retweet" target="_blank">Retweet</a><a href="http://twitter.com/intent/favorite?tweet_id=156848446987440128" class="favorite" data-lang="en" title="Favorite" target="_blank">Favorite</a></span></li></ul><div class="follow-button"><a href="http://twitter.com/charlesbihis" class="twitter-follow-button" title="Follow @charlesbihis" data-lang="en" target="_blank">@charlesbihis</a></div></div></li><li class="widget widget_archive"><h3>Archives</h3>		<ul>
			<li><a href='http://blogs.adobe.com/charles/2011/12' title='December 2011'>December 2011</a></li>
	<li><a href='http://blogs.adobe.com/charles/2011/05' title='May 2011'>May 2011</a></li>
	<li><a href='http://blogs.adobe.com/charles/2011/03' title='March 2011'>March 2011</a></li>
	<li><a href='http://blogs.adobe.com/charles/2011/02' title='February 2011'>February 2011</a></li>
	<li><a href='http://blogs.adobe.com/charles/2011/01' title='January 2011'>January 2011</a></li>
	<li><a href='http://blogs.adobe.com/charles/2010/12' title='December 2010'>December 2010</a></li>
	<li><a href='http://blogs.adobe.com/charles/2010/11' title='November 2010'>November 2010</a></li>
	<li><a href='http://blogs.adobe.com/charles/2010/05' title='May 2010'>May 2010</a></li>
	<li><a href='http://blogs.adobe.com/charles/2010/04' title='April 2010'>April 2010</a></li>
		</ul>
</li><li class="widget widget_categories"><h3>Categories</h3>		<ul>
	<li class="cat-item cat-item-23"><a href="http://blogs.adobe.com/charles/category/adobe" title="View all posts filed under Adobe">Adobe</a> (2)
<ul class='children'>
	<li class="cat-item cat-item-24"><a href="http://blogs.adobe.com/charles/category/adobe/air" title="View all posts filed under AIR">AIR</a> (2)
</li>
</ul>
</li>
	<li class="cat-item cat-item-5"><a href="http://blogs.adobe.com/charles/category/contest" title="View all posts filed under Contest">Contest</a> (1)
</li>
	<li class="cat-item cat-item-20"><a href="http://blogs.adobe.com/charles/category/facebook" title="View all posts filed under Facebook">Facebook</a> (1)
</li>
	<li class="cat-item cat-item-3"><a href="http://blogs.adobe.com/charles/category/general" title="View all posts filed under General">General</a> (4)
</li>
	<li class="cat-item cat-item-15"><a href="http://blogs.adobe.com/charles/category/jobs" title="View all posts filed under Jobs">Jobs</a> (1)
</li>
	<li class="cat-item cat-item-13"><a href="http://blogs.adobe.com/charles/category/programming" title="View all posts filed under Programming">Programming</a> (9)
<ul class='children'>
	<li class="cat-item cat-item-16"><a href="http://blogs.adobe.com/charles/category/programming/actionscript" title="View all posts filed under Actionscript">Actionscript</a> (5)
</li>
	<li class="cat-item cat-item-14"><a href="http://blogs.adobe.com/charles/category/programming/c" title="View all posts filed under C">C</a> (2)
</li>
	<li class="cat-item cat-item-27"><a href="http://blogs.adobe.com/charles/category/programming/java" title="View all posts filed under Java">Java</a> (1)
</li>
	<li class="cat-item cat-item-18"><a href="http://blogs.adobe.com/charles/category/programming/javascript" title="View all posts filed under JavaScript">JavaScript</a> (1)
</li>
</ul>
</li>
	<li class="cat-item cat-item-21"><a href="http://blogs.adobe.com/charles/category/projects" title="View all posts filed under Projects">Projects</a> (3)
<ul class='children'>
	<li class="cat-item cat-item-22"><a href="http://blogs.adobe.com/charles/category/projects/facebook-desktop" title="View all posts filed under Facebook Desktop">Facebook Desktop</a> (3)
</li>
</ul>
</li>
	<li class="cat-item cat-item-11"><a href="http://blogs.adobe.com/charles/category/puzzler" title="View all posts filed under Puzzler">Puzzler</a> (4)
<ul class='children'>
	<li class="cat-item cat-item-28"><a href="http://blogs.adobe.com/charles/category/puzzler/actionscript-puzzler" title="View all posts filed under ActionScript-Puzzler">ActionScript-Puzzler</a> (1)
</li>
	<li class="cat-item cat-item-12"><a href="http://blogs.adobe.com/charles/category/puzzler/c-puzzler" title="View all posts filed under C-Puzzler">C-Puzzler</a> (2)
</li>
	<li class="cat-item cat-item-19"><a href="http://blogs.adobe.com/charles/category/puzzler/javascript-puzzler" title="View all posts filed under JavaScript-Puzzler">JavaScript-Puzzler</a> (1)
</li>
</ul>
</li>
	<li class="cat-item cat-item-17"><a href="http://blogs.adobe.com/charles/category/tutorial" title="View all posts filed under Tutorial">Tutorial</a> (2)
</li>
		</ul>
</li></ul>
</div>			<div class="clear"></div>
	</div>
			<div id="footer">
<div class="footer-inner">
	<ul>
		<li><a href="http://www.adobe.com/aboutadobe/careeropp">Careers</a></li>
		<li><a href="http://www.adobe.com/misc/agreement.html">Permissions & Trademarks</a></li>
		<li><a href="http://www.adobe.com/products/eulas/">EULAs</a></li>
		<li><a href="http://www.adobe.com/aboutadobe/antipiracy/">Report Piracy</a></li>
		<li><a href="http://www.adobe.com/aboutadobe/contact.html">Contact Adobe</a></li>
		<li class="last"><a href="#">Security</a></li>
	</ul>
<div class="clear"></div>
Copyright &copy; 2010 Adobe Systems Incorporated. <a href="http://www.adobe.com/misc/copyright.html">All Rights Reserved.</a><br />
Use of this website signifies your agreement to the <a href="http://www.adobe.com/misc/privacy.html">Online Privacy Policy</a> and <a href="http://www.adobe.com/misc/copyright.html">Terms of Use</a> <i>(updated 07/14/2009)</i>
</div>
</div>
		</div>
	<div id="bottom_shadow"></div>

<script language="JavaScript" type="text/javascript"><!--
var s_code=' ';
var scJsHost = (("https:" == document.location.protocol) ? "https://www.adobe.com" : "http://wwwimages.adobe.com");
document.write(unescape("%3Cscript src='" + scJsHost + "/uber/js/omniture_s_code.js' type='text/javascript'%3E%3C/script%3E"));
document.write(unescape("%3Cscript src='" + scJsHost + "/ubi/analytics/analytics_blogs.js' type='text/javascript'%3E%3C/script%3E"));
//--></script><script src="http://blogs.adobe.com/charles/wp-content/plugins/tweetmeme/button.js" type="text/javascript"></script><script type='text/javascript' src='http://platform.twitter.com/widgets.js?ver=1.0.0'></script>
</body>
</html>