<?xml version="1.0" encoding="utf-8"?>
  <!--
          FavoritesPanel
          
          The FavoritesPanel displays small thumbnails of photos which the user
          wants to remember. Photos are saved either by dragging them from
          the GalleryPanel or by picking the "Favorites" button on the PhotoViewer.
          
          FavoritesPanel implements the ISlideShow interface which requires the
          nextPhoto and prevPhoto methods be defined.
  -->
  <mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" xmlns="*" 
                  implements="com.adobe.flickr.interfaces.ISlideShow"
                  xmlns:ui="ui.favorites.*"
                  initialize="initComp()" 
                  dragEnter="handleDragEnter(event)"
                  dragDrop="handleDragDrop(event)" >
                  
          <mx:Metadata>
                  [Event(name="enlarge",type="com.adobe.flickr.events.EnlargeEvent")]
          </mx:Metadata>
          
          <mx:states>
                  <mx:State name="hasPhotos" >
                          <mx:SetProperty target="{noPhotos}" name="visible" value="false" />
                          <mx:SetProperty target="{imageTiles}" name="visible" value="true" />
                  </mx:State>
          </mx:states>
          
          <mx:Script>
          <![CDATA[
                  import mx.controls.Alert;
                  import com.adobe.flickr.events.TrashcanEvent;
                  import com.adobe.flickr.UserData;
                  import com.adobe.flickr.events.*;
                  import mx.collections.ArrayCollection;
                  import mx.managers.DragManager;
                  import mx.events.DragEvent;
                  
                  [Bindable] private var ac:ArrayCollection = new ArrayCollection();
                  [Bindable] public  var selectedPhoto:*;
                  
                  private var __userData:UserData;
                  
                  private function initComp() : void
                  {
                          __userData = new UserData();
                          var saved:Array = __userData.loadFavorites();
                          if( saved != null ) {
                                  for(var i:int=0; i < saved.length; i++) {
                                          ac.addItem(saved[i]);
                                  }
                          }
                          
                          if( ac.length > 0 ) currentState = "hasPhotos";
                  }
                  
                  public function get photos() : ArrayCollection
                  {
                          return ac;
                  }
                  
                  private var _selectedItem:actionscript_application_flickr_Thumbnail = null;
                  public function get selectedItem() : actionscript_application_flickr_Thumbnail
                  {
                          return _selectedItem;
                  }
                  
                  public function set selectedItem( item:actionscript_application_flickr_Thumbnail ) : void
                  {
                          if( _selectedItem != null ) _selectedItem.selected = false;
                          _selectedItem = item;
                          if( _selectedItem != null ) _selectedItem.selected = true;
                  }
                  
                  public function set selectedIndex( index:int ) : void
                  {
                          selectedItem = imageTiles.getChildAt(index) as actionscript_application_flickr_Thumbnail;
                          selectedPhoto = ac.getItemAt(index);
                  }
                  
                  private function handleDragEnter( event:mx.events.DragEvent ) : void
                  {
                          if( event.dragSource.hasFormat("thumbnail") ) {
                                  var dropTarget:Canvas = event.currentTarget as Canvas;
                                  mx.managers.DragManager.acceptDragDrop(dropTarget);
                          }
                  }
                  
                  private function handleDragDrop( event:mx.events.DragEvent ) : void
                  {
                          var photo:Object = event.dragSource.dataForFormat('thumbnail');
                          
                          ac.addItem(photo);
                          
                          __userData.saveFavorites(ac);
                          
                          if( ac.length > 0 ) currentState = "hasPhotos";
                  }
                  
                  public function deleteItems( event:TrashcanEvent ) : void
                  {
                          for(var i:int=0; i < ac.length; i++) {
                                  var item:* = ac.getItemAt(i);
                                  if( event.items[0].id == item.id ) {
                                          ac.removeItemAt(i);
                                          break;
                                  }
                          }
                          
                          __userData.saveFavorites(ac);
                          
                          if( ac.length == 0 ) currentState = '';
                  }
                  
                  public function nextPhoto() : void
                  {
                          if( selectedItem == null ) return;
                          
                          var index:int = selectedItem.index;
                          if( ++index >= ac.length ) index = 0;
                          
                          selectedItem = imageTiles.getChildAt(index) as actionscript_application_flickr_Thumbnail;
                          selectedPhoto = ac.getItemAt(index);
                          
                          dispatchEvent( new EnlargeEvent(this,selectedPhoto) );
                  }
                  
                  public function prevPhoto() : void
                  {
                          if( selectedItem == null ) return;
                          
                          var index:int = selectedItem.index;
                          if( --index < 0 ) index = ac.length - 1;
                          
                          selectedItem = imageTiles.getChildAt(index) as actionscript_application_flickr_Thumbnail;
                          selectedPhoto = ac.getItemAt(index);
                          
                          dispatchEvent( new EnlargeEvent(this,selectedPhoto) );
                  }
                  
                  public function addPhoto( event:FavoriteEvent ) : void
                  {
                          var photo:* = event.photo;
                          
                          ac.addItem(photo);
                          
                          __userData.saveFavorites(ac);
                          
                          if( ac.length > 0 ) currentState = "hasPhotos";
                  }
                  
                  private function showLargeView( event:flash.events.MouseEvent ) : void
                  {
                          selectedItem = event.currentTarget as actionscript_application_flickr_Thumbnail;
                          
                          selectedPhoto = event.currentTarget.data;
                          dispatchEvent( new EnlargeEvent(this,selectedPhoto) );
                  }
                  
          ]]>
          </mx:Script>
          
          <mx:Text id="noPhotos"
                  text="Drag photos here"
                  styleName="noPhotoLabel"
                  visible="true"
                  selectable="false"
                  alpha=".5"
                  left="4" top="20" right="4" bottom="4"
                  />
          
          <mx:Tile id="imageTiles" left="4" top="4" right="4" bottom="4" 
                          horizontalGap="10" verticalGap="10"
                          visible="false">
                  <mx:Repeater id="rep" dataProvider="{ac}">
                          <actionscript_application_flickr_Thumbnail data="{rep.currentItem}" 
                                  index="{rep.currentIndex}"
                                  photoSize="small"
                                  click="showLargeView(event)" />
                  </mx:Repeater>
          </mx:Tile>
          
  </mx:Canvas>