Requirements

Prerequisite knowledge
Prior experience with Flex or ActionScript development will be helpful in understanding how SourceMate features improve productivity.
 
Additional required other products
SourceMate 3.0
 
User level
All
Required products
Flash Builder (Download trial)
SourceMate is an add-on to Flash Builder that brings a wealth of advanced coding tools and puts extraordinary power in the hands of Flex and ActionScript developers. SourceMate has many features, but often just one feature can eliminate a day of tedious and boring coding by automating and streamlining one of the many mind-numbing tasks that we, as developers, never enjoy. This article introduces SourceMate and describes just a handful of the popular code generation, refactoring, globalization, and localization features SourceMate adds to Flash Builder 4.5. For a listing of all the notable features SourceMate provides, visit the SourceMate product page on the ElementRiver website..
 

 
Code generation and refactoring

The three features described in this section—generating an event class, extracting an interface, and extracting a method—provide just a taste of the full refactoring and code generation capabilities that SourceMate offers. There are many additional refactorings available, including Change Method Signature, Extract Variable, Inline Method or Variable, and Disable/Remove trace() statements among others.
 
 
Generating an event class
Do you ever need to dispatch your own custom event? Creating an event class seems easy at first but there are lots of details and pitfalls that are easy to forget. Did you declare your event type constant? Did you make sure your read only event properties aren't mutable? Did you create a toString() method? And most importantly, did you remember to override clone() ? These are all things you're expected to do when you create your own custom event classes, and these details can make such classes a nuisance to code.
 
The Event Class wizard in SourceMate (see Figure 1) will take care of these details for you. The wizard is similar to other Flash Builder class wizards but it offers two additional options. First, there's a table to declare your custom event type constants. Second, there's another table to declare your event properties. When you click Finish, SourceMate will generate the necessary event class, including all the important little details. A constructor will be created that enables you to pass in the event properties. Each property will receive a getter, but not a setter, ensuring that the property is not mutable. Additionally an appropriate toString() and clone() method will be generated for you. Now creating an event class really is a piece of cake.
 
Figure 1. The Event Class wizard.
Figure 1. The Event Class wizard.

Below is an event class generated by SourceMate:
 
package { import flash.events.Event; public class CustomerEvent extends Event { public static const CUSTOMER_ADDED:String = "customerAdded"; public static const CUSTOMER_REMOVED:String = "customerRemoved"; public static const CUSTOMER_MODIFIED:String = "customerModified"; private var _customer:Customer; private var _modifiedFields:Array; public function CustomerEvent(type:String, customer:Customer, modifiedFields:Array=null) { super(type,false,false); this._customer = customer; this._modifiedFields = modifiedFields; } public function get customer():Customer { return _customer; } public function get modifiedFields():Array { return _modifiedFields; } public override function clone():Event { return new CustomerEvent(type,customer,modifiedFields); } public override function toString():String { return formatToString("CustomerEvent","customer","modifiedFields"); } } }
 
Extracting an interface
Two important cornerstones of good architecture are encapsulation and polymorphism. Interfaces play a key role in enabling these two concepts. However, developers don't often have the chance to put good architecture in place until after much of the code is written. With interfaces, it's common to have written a concrete class only to realize later that the details should have been hidden behind an interface. In other cases a developer may notice other classes that fill a similar role, and need to create a common interface.
 
When you encounter these situations you need to do more than just create the interface class itself. You also need to change the concrete class so it implements this interface. More significantly, you need to go through the calling code and change any references to the concrete class over to the new interface class you created. This, in particular, can be a hassle.
 
When using SourceMate's Extract Interface feature (see Figure 2), all the interface set up tasks are done for you. SourceMate will generate the interface based on the selected methods of the concrete class. Then it will modify the concrete class to implement the interface. Finally, it will go through your entire project and replace any references to the concrete class with the interface name. Instead of tediously wading through your project code, finding references to your class, and making manual updates, you can use SourceMate to do it automatically.
 
Figure 2. The Extract Interface dialog box.
Figure 2. The Extract Interface dialog box.

Extracting a method
Extract Method refactoring (see Figure 3) is one of the most useful SourceMate features for everyday coding. Extract Method takes a chunk of code from the current method and moves it into its own method. You can use this feature when you identify a piece of common code that should have its own utility method. Of course, you can do this manually, but you'll need to figure out what arguments the method is going to need, determine the method's return type, and then replace the code in the original method with a call to the new method. SourceMate performs these steps for you. Just select the lines of code you want extract into the new method and SourceMate will parse the code, determine the necessary arguments for the new method, figure out the required return type, create the utility method, and finally replace all instances of the selected code with a call to the new method. It's easy and quick.
 
Figure 3. The Extract Method dialog box.
Figure 3. The Extract Method dialog box.

To see how this capability works, consider the function loadCustomers() as it was written and before Extract Method was invoked:
 
public function loadCustomers(customers:Array):void { for (var i:int = 0; i < customers.length; i++) { var customer:Customer = customers[i]; var isValid:Boolean = true; if (customer.name == null) isValid = false; if (customer.email == null) isValid = false; if (customer.location == null) isValid = false; if (!isValid) continue; //load customer } }
The code below would be selected by the developer as the target for the refactoring:
 
var isValid:Boolean = true; if (customer.name == null) isValid = false; if (customer.email == null) isValid = false; if (customer.location == null) isValid = false;
After Extract Method, the selected code is moved to a separate function named isCustomerValid() :
 
public function loadCustomers(customers:Array):void { for (var i:int = 0; i < customers.length; i++) { var customer:Customer = customers[i]; var isValid:Boolean = isCustomerValid(customer); if (!isValid) continue; //load customer } } private function isCustomerValid(customer:Customer):Boolean { var isValid:Boolean = true; if (customer.name == null) isValid = false; if (customer.email == null) isValid = false; if (customer.location == null) isValid = false; return isValid; }

 
Globalization and localization

SourceMate 3.0 Enterprise Edition includes a set of localization features that make it particularly valuable for any enterprise creating large multilanguage Flex applications. Fully localizing a Flex application can a daunting task. There are a series of steps you must perform to get your application ready to accept new translations and they're not all obvious or easy to remember. Perhaps the most difficult task is replacing all your hardcoded strings with lookups to strings in resource properties files. This can get even more painful when the strings are part of concatenating expressions (for example: "Showing " + count + " items" ). This task usually accounts for the largest amount of development time when localizing applications. Fortunately SourceMate can automate this for you.
 
You can use SourceMate's Externalize Strings feature (see Figure 4) to pull hardcoded strings out from a class and put them into a Flex resource properties file. The hardcoded strings in code are then replaced with calls to the Flex ResourceManager class to retrieve them from the correct properties file. On large projects (which are typically the projects that get translated), performing this process manually can take days or even weeks of mind-numbing manual changes. This is not the type of code anyone looks forward to writing. Using SourceMate you can cut this time to a bare minimum and get back to writing solid and interesting code. 
 
Figure 4. The Externalize Strings dialog box.
Figure 4. The Externalize Strings dialog box.

Of course, externalizing your hardcoded strings isn't the only localization task you need to complete. You still need to create different properties files for each different locale. Furthermore, if you're dealing with existing properties files, perhaps because you're working on an update of an already localized application, you need to manage the existing data and ensure it's all still correct and valid. When working with many different properties files over time, it's very easy to run into missing translations, missing keys, unreferenced or orphaned strings, and other problems. SourceMate's Resource Bundle Editor provides features to help with these problems so you don't have to hunt through a myriad of properties files to find and fix them.
 
With SourceMate installed, the Resource Bundle Editor comes up automatically when you open a .properties files. The most basic functionality of the Resource Bundle Editor is to gather all the related properties files from all your locales and treat them as one logical entity. After all, for each key you really have just one logical string in the application with different translations kept in different locales. In the Resource Bundle Editor, you can see the keys for your strings, and in the values grid you can see the different translations for each string in the different locale files (see Figure 5). This grouping makes it much easier to deal with multiple properties files, but it's the advanced functions where the editor really shines.
 
Figure 5. The Flex Resource Bundle Editor.
Figure 5. The Flex Resource Bundle Editor.

There are four advanced functions in the Resource Bundle Editor:
 
  • Find Unused Keys
  • Show Missing Keys and Keys with Empty Values
  • Find Duplicate Keys
  • Create New Locale File
Find Unused Keys compares the keys in your properties files against the ResourceManager calls in your code. It will then mark any keys that exist in your properties files but aren't retrieved in your project code.
 
Show Missing Keys and Keys with Empty Values provides similar functionality. This feature will mark keys that exist in some of your properties files but not in others, or similar keys that exist but don't have any values. This helps you locate missing translations.
 
Find Duplicate Keys generates a report of all duplicate keys in each locale file.
 
Create New Locale File, as the name suggests, creates a new properties file (and a locale folder if necessary). The new locale file will be populated with the existing keys and optionally have automatically translated values using Google Translate. Machine translators like Google Translate don't produce translations that you would want in your final application but they do create usable pseudo-translations. Pseudo-translations are temporary translations that are used to test the ability of the application to accept and properly show translated data. Pseudo-translations can help expose localization problems early in the process. The most common of these problems is text truncation, as translated strings can be many times longer than their original text. The real benefit of pseudo-translations is that you can start your localization testing without having to wait for the final results from the translators.
 
In addition to the features mentioned above, SourceMate will also help configure your Flex projects as necessary. While externalizing strings, SourceMate will scan your project's properties and offer to make any configuration changes necessary to support localization. For example, by convention localized projects should include a separate source path for locale-specific resources. This source path is typically named locale/{locale}, with the {locale} key being substituted for the current locale. If your project doesn't have this additional source path, SourceMate will offer to add it for you. Similarly, while creating a new locale file, if the Flex SDK does not contain framework resources for that new locale, SourceMate can create these for you via the copylocale utility. Without SourceMate, you have to run this command line utility manually and it's not always obvious when you need to. With SourceMate, you'll get a reminder with an option to run it right inside Flash Builder.
 
Localizing a Flex application without SourceMate is tedious and often error prone. With SourceMate, the same task is straightforward and substantially faster.
 

 
Where to go from here

Eliminating even one monotonous coding task with SourceMate can save days of boring work and troubleshooting. When you start using the rest of the great features SourceMate brings to Flash Builder, you'll feel like you're coding on steroids.
 
SourceMate is available for a free, 30-day trial. You can download the free trial from here.