flickrria.mxml

Simple RIA-> Example

<?xml version="1.0" encoding="utf-8"?>
<!--
////////////////////////////////////////////////////////////////////////////////
// ADOBE SYSTEMS INCORPORATED
// Copyright 2007 Adobe Systems Incorporated
// All Rights Reserved.
//
// NOTICE:  Adobe permits you to use, modify, and distribute this file in accordance with the 
// terms of the Adobe license agreement accompanying it.  If you have received this file from a 
// source other than Adobe, then your use, modification, or distribution of it requires the prior 
// written permission of Adobe.
////////////////////////////////////////////////////////////////////////////////
-->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
	backgroundGradientColors="[0xFFFFFF, 0xAAAAAA]"
	horizontalAlign="left"
	verticalGap="15" horizontalGap="15"
	creationComplete="init()" >

    <mx:Script>
        <![CDATA[
        	import mx.collections.ArrayCollection;
            import mx.rpc.events.ResultEvent;
            import mx.rpc.events.FaultEvent;
            import mx.controls.Alert;
			import mx.managers.PopUpManager;
	     	import mx.managers.CursorManager;
	     	import flash.net.FileReference;
   	 		   	 		
			private var target:FileReference;
			private var imageUrl:String;
	     	   	   	      	
            [Bindable]
            private var photoFeed:ArrayCollection;   // holds Flickr xml data

	     	private function customizedContextMenu():ContextMenu {
	     		// add "Save image..." to right-click context menu
    			var customContextMenu:ContextMenu = new ContextMenu();
    			var saveImage:ContextMenuItem = new ContextMenuItem("Save image...")
    			saveImage.addEventListener(ContextMenuEvent.MENU_ITEM_SELECT, doSaveImageCommand);
    			customContextMenu.customItems.push(saveImage);
    			return customContextMenu
			}

			private function doSaveImageCommand(event:ContextMenuEvent):void {
				// save image
				if (imageUrl != null) {
					var fullSizeImage:URLRequest = new URLRequest(imageUrl);
					target = new FileReference();
					target.download(fullSizeImage);
				}
			}
            
            private function requestPhotos():void {
            	photoService.cancel();  // cancel any pending service calls
                var params:Object = new Object();
                params.format = 'rss_200_enc';
                params.tags = searchTerms.text;
                // get Flickr images/data:
                // http://api.flickr.com/services/feeds/photos_public.gne?tags=<search terms>&format=rss_200_enc
                photoService.send(params);
            }

            private function photoHandler(event:ResultEvent):void {
            	// get xml data for search term(s)
                photoFeed = event.result.rss.channel.item as ArrayCollection;
            }
            
            private function init():void {
            	searchTerms.setFocus();
            }
            
            private function photoFaultHandler(event:FaultEvent):void {
            	// error occurred
                 Alert.show("Cannot load or reach photos from Flickr.","Error");
            }
            
            private function launchViewer(event:Event):void { 
				// show full-sized image in popup when thumbnail clicked
                var customPopup:ViewWindow = ViewWindow(PopUpManager.createPopUp(this, ViewWindow, true));
                imageUrl = event.currentTarget.selectedItem.content.url;
				customPopup.contextMenu = customizedContextMenu();	 // add 'Save image' context menu option			
                customPopup.title=event.currentTarget.selectedItem.credit;              
                customPopup.showCloseButton=true;
                customPopup.maxImageHeight = this.height - 150;  // set max height from browser window
                customPopup.maxImageWidth = this.width - 300;  // set max width from browser window
                customPopup.originalImageHeight = event.currentTarget.selectedItem.content.height;
                customPopup.originalImageWidth = event.currentTarget.selectedItem.content.width;
      			customPopup.fullImage.source=imageUrl;  // set full-sized image source (url)
      			CursorManager.setBusyCursor();  // show busy cursor
            }
            
         ]]>
    </mx:Script>

	<!-- Flickr web service -->
    <mx:HTTPService id="photoService" showBusyCursor="true"
        url="http://api.flickr.com/services/feeds/photos_public.gne"
        result="photoHandler(event)" fault="photoFaultHandler(event)" />
	
	<mx:HBox>
		<mx:Label text="Flickr tags or search terms:" />
		<mx:TextInput id="searchTerms"
			enter="requestPhotos()" />
		<mx:Button label="Search" 
			click="requestPhotos()" />
	</mx:HBox>

	<mx:TileList width="100%" height="100%"
		dataProvider="{photoFeed}"
		itemRenderer="FlickrThumbnail" itemClick="launchViewer(event)">
	</mx:TileList>

</mx:Application>