FlexStore Revisited (with BabelFx)

<?xml version="1.0" encoding="utf-8"?>
<s:Application width="500" height="704" 
			   applicationComplete="catalogLoader.send()" 
			   viewSourceURL="srcview/index.html" 
			   xmlns:local="*" 
			   xmlns:fx="http://ns.adobe.com/mxml/2009" 
			   xmlns:s="library://ns.adobe.com/flex/spark" 
			   xmlns:mx="library://ns.adobe.com/flex/mx" 
			   xmlns:tiles="store.layouts.*" >
 
 
	<fx:Declarations>
		<s:HTTPService 					id="catalogLoader" url="assets/data/catalog.xml" result="onCatalogLoaded(event)"/>
		<l10nInjection:LocalizationMap 	id="injectors"	   phone="{_selectedPhone}"            xmlns:l10nInjection="l10n.map.*" />	</fx:Declarations>
 
	<l10n:LanguageBar id="barLang" right="19" left="19"   y="644" height="40" xmlns:l10n="l10n.views.*"/>
 
	<!-- Phone Catalog Display Area -->
	<s:Label id="lblCatalog" x="25" y="102" text="Catalog:" alpha=".3"/>
	<s:BorderContainer y="119" height="381" backgroundColor="#EDEDED" left="20" right="20">
		<s:DataGroup width="100%" height="100%" x="0" y="0"
					 dataProvider="{_items}" 
					 itemRenderer="store.renderers.Phone_Zoom" 
					 mouseMove="onHoverPhone(event);" 
					 contentBackgroundColor="#EDEDED" >
			<s:layout>
				<tiles:FilteredTileLayout id="filterLayout" filteredItems="{_filteredItems}" />
			</s:layout>
		</s:DataGroup>
	</s:BorderContainer>
 
	<s:Label id="lblDescription" x="25" y="514" text="Description:" alpha=".3" visible="{_selectedPhone != null}"/>
	<s:TextArea id="txtPhoneDescription" 
				alpha="{_selectedPhone ? 1 : .2}"
				text="{_selectedPhone ? _selectedPhone.description : ''}"
				top="532" left="20" right="20" 
				editable="false"  contentBackgroundColor="#EDEDED" color="#3D3D3D" 
				paddingBottom="10" paddingLeft="10" paddingRight="10" paddingTop="10"  height="100"/>
 
	<!-- Catalog Filter Options -->
	<mx:Canvas height="63" backgroundColor="#FAD1D1" borderAlpha="1.0" cornerRadius="5" borderColor="#080000" left="20" right="20" top="20" horizontalScrollPolicy="off" verticalScrollPolicy="off">
		<s:Label id="lblFilters" x="15" y="9" text="Filter Catalog:" color="#921010"/>
		<s:HGroup verticalAlign="middle" paddingLeft="8" x="6" y="30" height="28" >
			<s:Label id="lblMaxPrice" text="Max Price:" fontSize="11"/>
			<s:HSlider id="priceSlider" minimum="0" maximum="1000" snapInterval="100" value="@{_maxPrice}" change="onFiltersChanged()"/>
			<mx:Spacer width="20"/>
			<s:CheckBox id="chbxCamera"  label="Camera" selected="@{_camera}" change="onFiltersChanged()" fontSize="11"/>
			<s:CheckBox id="chbxVideo"   label="Video" selected="@{_video}" change="onFiltersChanged()" fontSize="11"/>
			<s:CheckBox id="chbxTriband" label="Triband" selected="@{_triband}" change="onFiltersChanged()" fontSize="11"/>
		</s:HGroup>
	</mx:Canvas>
 
</s:Application>

<?xml version="1.0" encoding="utf-8"?>
<LocaleMap 	xmlns="http://com.asfusion.mate/l10n"
			xmlns:mx="http://www.adobe.com/2006/mxml" >
 
	<mx:Metadata>
	<!--
		Using compiler arguments -locale=en_US,es_ES,fr_FR,zh_CN -allow-source-path-overlap=true -source-path+=locale/{locale}
	    with the metaTag below forces the compiler to EMBED the compiled resource bundles
	-->
	[ResourceBundle("store")]
	</mx:Metadata>
 
	<mx:Script>
		<![CDATA[
		import l10n.views.LanguageBar;
 
		[Bindable] 
		public var phone : Object = null;
 
		/**
		 *  EventHandler when locales change to new Catalog xml data to be loaded
		 *  This xml data has localized versions of the catalog.
		 */
		private function onLocaleChanged(event:Event):void {
			var sri : SmartResourceInjector  = (event.target as SmartResourceInjector);
			var app : FlexStore4             = sri.targetInstances[0] as FlexStore4;
 
			// Dynamically reload the XML data with localized text for each Phone catalog entry
			if (app != null) app.catalogLoader.send();		}			
		]]>
	</mx:Script>
 
	<SmartResourceInjector bundleName="store" target="{FlexStore4}" localeChange="onLocaleChanged(event);">
		<ResourceProxy property="catalogLoader.url" 			key="data.url" />
 
		<ResourceProxy property="lblDescription.text" 			key="details.title" parameters="{[phone.name]}"/>
		<ResourceProxy property="lblCatalog.text" 				key="catalog.title" />
 
		<ResourceProxy property="lblFilters.text" 				key="filters.title" />
		<ResourceProxy property="lblMaxPrice.text" 				key="filters.maxPrice" />
		<ResourceProxy property="chbxCamera.label" 				key="filters.option.camera" />
		<ResourceProxy property="chbxVideo.label" 				key="filters.option.video" />
		<ResourceProxy property="chbxTriband.label" 			key="filters.option.triband" />
	</SmartResourceInjector>
 
	<SmartResourceInjector bundleName="store" target="{LanguageBar}">
		<ResourceProxy property="lblBarHelp.text" 	key="languagebar.title" />
	</SmartResourceInjector>
 
</LocaleMap>