making DataGridExample more sane wrt separation of mxml & as

03d1-datagrid/DataGridApp.as

@@ -0,0 +1,61 @@
+package
+{
+    import mx.core.Application;
+
+    import mx.collections.ArrayCollection;
+    import mx.containers.Panel;
+    import mx.controls.Alert;
+    import mx.controls.DataGrid;
+    import mx.controls.Image;
+    import mx.controls.Label;
+    import mx.controls.TextInput;
+    import mx.rpc.events.FaultEvent;
+    import mx.rpc.events.ResultEvent;
+    import mx.rpc.http.HTTPService;
+
+    import com.ag.RequestParams;
+
+    public class DataGridApp extends Application
+    {
+        [Bindable]
+        public var dataGrid:DataGrid;
+        public var photoFeed:ArrayCollection;
+        public var photoService:HTTPService;
+        public var searchTerms:TextInput;
+        public var vboxImage:Image;
+        public var vboxDesc:Label;
+        public var popup:Panel;
+
+        function DataGridApp()
+        {
+        }
+
+        public function requestPhotos():void {
+            var params:RequestParams = new RequestParams();
+            params.format = 'rss_200_enc';
+            params.tags = searchTerms.text;
+            photoService.send(params);
+        }
+
+        public function photoHandler(event:ResultEvent):void {
+            photoFeed= event.result.rss.channel.item as ArrayCollection;
+            dataGrid.dataProvider = photoFeed;
+            dataGrid.visible = true;
+        }
+
+        public function faultHandler(event:FaultEvent):void{
+            Alert.show(event.fault.faultCode + " , " + event.fault.faultString);
+        }
+
+        public function showPopup(event:Event):void{
+            vboxImage.source = photoFeed.getItemAt(event.currentTarget.selectedIndex).content.url
+            vboxDesc.text = photoFeed.getItemAt(event.currentTarget.selectedIndex).title.getItemAt(0)
+            popup.visible = true;
+        }
+
+        public function hidePopup():void{
+            popup.visible = false;
+            popup.includeInLayout = false;
+        }
+    }
+}

03d1-datagrid/DataGridExample.mxml

@@ -1,54 +1,12 @@
 <?xml version="1.0" encoding="utf-8"?>
-<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
+<loc:DataGridApp xmlns:mx="http://www.adobe.com/2006/mxml"
+    xmlns:loc="*"
     backgroundColor="#FFFFFF"
     backgroundAlpha="0"
     horizontalAlign="left"
     verticalGap="15"
     horizontalGap="15">
 
-    <mx:Script>
-        <![CDATA[
-            import mx.collections.ArrayCollection;
-            import mx.rpc.events.ResultEvent;
-            import mx.rpc.events.FaultEvent;
-            import mx.controls.Alert;
-
-            import com.ag.RequestParams;
-
-            [Bindable]
-            private var photoFeed:ArrayCollection;
-
-            private function requestPhotos():void {
-                var params:RequestParams = new RequestParams();
-                params.format = 'rss_200_enc';
-                params.tags = searchTerms.text;
-                photoService.send(params);
-            }
-
-            private function photoHandler(event:ResultEvent):void {
-                photoFeed= event.result.rss.channel.item as ArrayCollection;
-                datagrid_id.dataProvider = photoFeed;
-                datagrid_id.visible = true;
-            }
-
-            private function faultHandler(event:FaultEvent):void{
-                Alert.show(event.fault.faultCode + " , " + event.fault.faultString);
-            }
-
-            private function showPopup(event:Event):void{
-                theImage.source = photoFeed.getItemAt(event.currentTarget.selectedIndex).content.url
-                desc.text = photoFeed.getItemAt(event.currentTarget.selectedIndex).title.getItemAt(0)
-                popup.visible = true;
-            }
-
-            private function hidePopup():void{
-                popup.visible = false;
-                popup.includeInLayout = false;
-            }
-        ]]>
-    </mx:Script>
-
-
     <mx:HTTPService id="photoService"
         url="http://api.flickr.com/services/feeds/photos_public.gne"
         result="photoHandler(event)"
@@ -62,19 +20,23 @@
     </mx:HBox>
 
     <mx:HBox>
-        <mx:DataGrid id="datagrid_id"
+        <mx:DataGrid id="dataGrid"
             visible="false"
             itemClick="showPopup(event)">
             <mx:columns>
-                <mx:DataGridColumn  dataField="title" headerText="Title" width="100" >
+                <mx:DataGridColumn  dataField="title" headerText="Title"
+                    width="100" >
                 <mx:itemRenderer>
                     <mx:Component>
-                        <mx:Label text="{data.title.getItemAt(0)}" textAlign="center"/>
+                        <mx:Label text="{data.title.getItemAt(0)}"
+                            textAlign="center"/>
                         </mx:Component>
                     </mx:itemRenderer>
                 </mx:DataGridColumn>
-                <mx:DataGridColumn dataField="credit" headerText="Author" width="100" />
+                <mx:DataGridColumn dataField="credit" headerText="Author"
-                <mx:DataGridColumn dataField="thumbnail" headerText="Photo" width="100">
+                    width="100" />
+                <mx:DataGridColumn dataField="thumbnail" headerText="Photo"
+                    width="100">
                     <mx:itemRenderer>
                         <mx:Component>
                             <mx:Image height="75"
@@ -92,9 +54,9 @@
             paddingLeft="10" paddingTop="10" paddingRight="10"
             layout="horizontal">
             <mx:VBox width="325" height="400">
-                <mx:Label id="desc"/>
+                <mx:Label id="vboxDesc"/>
-                <mx:Image id="theImage"/>
+                <mx:Image id="vboxImage"/>
             </mx:VBox>
         </mx:Panel>
     </mx:HBox>
-</mx:Application>
+</loc:DataGridApp>