<?xml version="1.0" encoding="utf-8"?>
<s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
                xmlns:s="library://ns.adobe.com/flex/spark" 
                xmlns:mx="library://ns.adobe.com/flex/mx" 
                autoDrawBackground="true"
                doubleClickEnabled="true"
                doubleClick="onDoubleClick(event)"
                creationComplete="onCreationComplete(event)">
  
  <mx:ModuleLoader url="Assets.swf"/>
  
  <fx:Metadata>
    /**
    * Dispatched when a resource was selected
    */
    [Event("resourceSelected", type="de.dtele.ui.components.events.ResourceListEvent")]
  </fx:Metadata>
  
  <fx:Script>
    <![CDATA[
      import de.dtele.data.Assets;
      import de.dtele.data.IResource;
      import de.dtele.data.MimeType;
      import de.dtele.data.MimeTypes;
      import de.dtele.settings.SettingsManager;
      import de.dtele.settings.events.SettingEvent;
      import de.dtele.ui.components.events.ResourceListEvent;
      
      import mx.collections.ArrayCollection;
      import mx.events.FlexEvent;
      import mx.utils.URLUtil;
      
      [Bindable]protected var visibleProperties:ArrayCollection;
      
      protected var defaultThumbnails:Object = {
        "application/msword": Assets.DocumentThumbnail,
        "application/rar": Assets.PackageThumbnail,
        "application/x-executable": Assets.ExecutableThumbnail,
        "application/x-msdos-program": Assets.ExecutableThumbnail,
        "application/x-msi": Assets.ExecutableThumbnail,
        "application/xhtml+xml": Assets.HTMLThumbnail,
        "application/pdf": Assets.DocumentThumbnail,
        "application/zip": Assets.PackageThumbnail,
        "audio": Assets.AudioThumbnail,
        "image": Assets.ImageThumbnail,
        "text": Assets.TextThumbnail,
        "text/html": Assets.HTMLThumbnail,
        "text/rtf": Assets.DocumentThumbnail,
        "video": Assets.VideoThumbnail
      };
      
      protected function thumbnailDataProvider(resource:IResource):Object {
        
        var thumbnail:Object = resource.properties.thumbnail;
        
        if (!thumbnail) {
          
          if (resource.properties.type) {
            
            if (resource.properties.type in this.defaultThumbnails) {
              
              thumbnail = this.defaultThumbnails[resource.properties.type];
            } else {
              
              var mimeType:MimeType = MimeTypes.split(resource.properties.type);
              
              if (mimeType.mediaType in this.defaultThumbnails) {
                
                thumbnail = this.defaultThumbnails[mimeType.mediaType];
              }
            }
          } else {
            
            thumbnail = Assets.GenericThumbnail;
          }
        } else {
          
          thumbnail = URLUtil.getFullURL(resource.source.url, thumbnail as String);
        }
        
        return thumbnail;
      }
      
      /**
       * Notifies about the request to change the current resource
       */
      protected function onDoubleClick(e:MouseEvent):void {
        
        this.dispatchEvent(new ResourceListEvent(
          ResourceListEvent.SELECTED,
          this.data as IResource,
          true
        ));
      }
      
      protected function onCreationComplete(e:FlexEvent):void {
        
        SettingsManager.instance.addEventListener(SettingEvent.DEFAULT_SET, this.onDefaultSet);
        SettingsManager.instance.addEventListener(SettingEvent.OPTION_SET, this.onOptionSet);
      }
      
      protected function onDefaultSet(e:SettingEvent):void {
        
        if (e.option == "visibleProperties") {
        
          this.visibleProperties.source = e.value as Array; 
        
          SettingsManager.instance.removeEventListener(SettingEvent.DEFAULT_SET, this.onDefaultSet);
        }
      }
      
      protected function onOptionSet(e:SettingEvent):void {
        
        if (e.option == "visibleProperties") {
          
          this.visibleProperties.source = (e.value as Array);
        }
      }
      
    ]]>
  </fx:Script>
  
  <s:VGroup
    textAlign="center"
    paddingRight="6"
    paddingBottom="6"
    paddingLeft="6"
    paddingTop="6"
    right="6"
    left="6"
    bottom="6"
    top="6">
    <s:Image
      x="0"
      y="0"
      width="100"
      height="100"
      source="{thumbnailDataProvider(data as IResource)}"
      skinClass="de.dtele.ui.components.skins.ThumbnailImageSkin"/>
    <s:VGroup
      id="propertiesGroup"
      x="0"
      y="108"
      width="100"
      textAlign="center">
      <s:Label
        text="{data.properties.title}"
        width="100%"
        fontSize="10"
        fontWeight="bold"/>
      <s:Label
        text="{data.properties.type}"
        width="100%"
        fontSize="10"/>
    </s:VGroup>
  </s:VGroup>
  
</s:ItemRenderer>