/**
 * AS4ResourceEditorThumbnail
 * AJAX resource editor thumbnail
 */

var resourceLibrary_thumbnail;

document.observe('dom:loaded', function() {
	
	// - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

	if(AS4ResourceLibrary)
	{
		resourceLibrary_thumbnail = new AS4ResourceLibrary();

//		if(Prototype.Browser.IE && typeof(widgetsLayoutEditor) != 'undefined')
			//resourceLibrary_thumbnail.onResourceClicked = AS4ResourceEditorThumbnail.getInstance().onResourceSelected.bind(AS4ResourceEditorThumbnail.getInstance());

        // Inline search terms
			/*if($('ml_search_terms_thumbnail'))
				$('ml_search_terms_thumbnail').observe('keyup', function(e) {
					resourceLibrary_thumbnail.setResourcesPage(1, {refresh: false});
					resourceLibrary_thumbnail.searchTerms = $F(this);
					resourceLibrary_thumbnail.startSearch_thumbnail.bind(resourceLibrary_thumbnail, $F(this)).delay(2); // Delay the search by 2 seconds, allow typing to catch up
				});
*/
			// Smart folder filters
			/*if($('smart_folder_thumbnail'))
				$('smart_folder_thumbnail').observe('change', function(e) {

					resourceLibrary_thumbnail.setResourcesPage(1, {refresh: false});
					resourceLibrary_thumbnail.currentFolderId = $F(this);
					if($F(this) == 'all_folders')
					{
						resourceLibrary_thumbnail.fetchFolders();
					}
					else
					{
						resourceLibrary_thumbnail.fetchResources(null,$('files_list_thumbnail'));
					}
				});

			 Resource type filtering
			if($('filter_type_thumbnail'))
				$('filter_type_thumbnail').observe('change', function(e) {
					resourceLibrary_thumbnail.setResourcesPage(1, {refresh: false});
					resourceLibrary_thumbnail.setSearchType($F(this));
				});*/

		// Override the resource library's success callback to make each resource a selectable
		// thing
		resourceLibrary_thumbnail.onFetchResourcesSuccess = function(transport, target)
		{
			// Ignore exceptions
			if(transport.headerJSON && transport.headerJSON.exception)
				return;
		}

        AS4ResourceEditorThumbnail.getInstance().resource_library = resourceLibrary_thumbnail;
	}
});


// # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # #
// Class declaration

var AS4ResourceEditorThumbnail = Class.create({

	/**
	 * @type integer The identifier of the resource being edited
	 */
	channelId: null,
    resource_id: null,
	resourceSelectorVisible: false,

	resourceValueTarget: null,
	resourceValueHTML: null,
	resourceValueHolder: null,

    searchTerms: null,
	/**
	 * @type {AS4ResourceLibrary} The local resource library instance for selecting resources
	 */
	resource_library: null,

	// # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # #

	/**
	 * @constructor
	 */
	initialize: function()
	{
	},

    //  # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # #
	// Interface Methods
    onResourceSelected: function(thumbnail_id, position)
	{
        if(!thumbnail_id)
			throw('Thumbnail could not be set. No data loaded into editor component.');

        if (position=="" || resourceLibrary.image_type =="thumbnail")
            {
            var url = '/resource_editor/save_resource_icon';
            
            var params = {
                thumbnail_id: thumbnail_id,
                resource_id: this.resource_id
            };

            AS4Shell.getInstance().ajaxUpdate(url, params, null, {message: 'Setting thumbnail...'});
            $('resource_thumbnail_container').update('<p>'+'<img alt="Thumbnail" width="48" height="48" src="/resources/view/id/'+ thumbnail_id +'?inline=true"/>'+'</p>');
            
            
            	
            
            }
        else
            {
             // We use thumnbnail function for linked documents, the thumbnail_id here actually represents the linked document id.
                var url = '/resource_editor/save_link_document';

                if(!this.resource_id)
                	this.resource_id = resourceLibrary.current_resource_id;

                var params = {
                    linked_id: thumbnail_id,
                    resource_id: this.resource_id,
                    renderMode:'update'
                };

                
           		AS4Shell.getInstance().ajaxUpdate(url, params, null, $A([this.onSaveLinkedResourceComplete.bind(this)]), {message: 'Linking document..'});
                
            }
           
		AS4Shell.getInstance().safeCloseLightbox();
	},

    onSaveLinkedResourceComplete: function(transport) {
        $('linked_document_list').update(transport.responseText);
    },

    /**
	 * Display an inline resource selector to allow the user
	 * to select a resource to be associated to the widget
	 *
	 * @param {Array} [resource_types] Optional array of the resource types that the media selector will show. Default is an empty array (all resource types)
	 *
	 */
	showResourceSelector: function(resource_types,position)
	{
        var target = (target ? target : "");
        var image_type="thumbnail";
		var resource_types = (resource_types ? resource_types : $A());
        var position = (position ? position : "");
		resourceLibrary_thumbnail.searchTypes = resource_types;
		resourceLibrary_thumbnail.image_type = image_type;
		AS4Shell.getInstance().showLightbox({
			callback: this.onShowResourceSelector.bind(this, image_type,position),
			width: 950,
			height: 645
		});
	},

	/**
	 * Callback for the resource selector lightbox
	 */
	onShowResourceSelector: function(image_type,position)
	{
		var url = '/resource_editor/resource_selector_lightbox';

		var params = {
			renderMode: 'lightbox',
			image_type: image_type,
			folder_id: this.channelId
		};

		AS4Shell.getInstance().ajaxUpdate(url, params, 'add_panel_container', $A([this.onResourceSelectorShown.bind(this, image_type,position)]), {showIndicator: false});

		return	'<div id="add_panel_container">' +
					'<div class="centre" style="padding-top: 40%">' +
						'<img src="/app/common/assets/images/ajax-loader.gif" alt="Loading..>" width="24" height="24" /><br />Loading...' +
					'</div>' +
				'</div>';
	},

	/**
	 * Trigger a load of the resource selector once it is loaded into the lightbox!
	 */

	onResourceSelectorShown: function(image_type,position)
	{
		resourceLibrary_thumbnail.channelId = AS4ResourceBrowser.MY_RESOURCES_PATH;
                
		// Bind lightbox interface
		if($('ml_search_terms_thumbnail'))
			$('ml_search_terms_thumbnail').observe('keyup', function(e) {
				resourceLibrary_thumbnail.searchTerms = $F(this);
                                resourceLibrary_thumbnail.setResourcesPage_thumbnail(1,position);
               // resourceLibrary_thumbnail.fetchResources(null,$('files_list_thumbnail'));
			});
		// Smart folder filters
		if($('smart_folder_thumbnail'))
		{
			$('smart_folder_thumbnail').observe('change', function(e) {
				resourceLibrary_thumbnail.currentFolderId = $F(this);
                                resourceLibrary_thumbnail.setResourcesPage_thumbnail(1,position);
				//resourceLibrary_thumbnail.fetchResources(null,$('files_list_thumbnail'));
			});

			resourceLibrary_thumbnail.currentFolderId = $F('smart_folder_thumbnail');
		}
            
                    
                    resourceLibrary_thumbnail.searchTerms = '';
                    resourceLibrary_thumbnail.image_type = image_type;
                    resourceLibrary_thumbnail.setResourcesPage_thumbnail(1,position);

                    // Run a search
                    //resourceLibrary_thumbnail.fetchResources(null,$('files_list_thumbnail'));
                    
	}

});

// Static instance of the AS4ResourceEditor object
AS4ResourceEditorThumbnail.instance = null;

/**
 * Return a singleton instance of the AS4ChannelControlPanel object
 * @return AS4ChannelControlPanel
 */
AS4ResourceEditorThumbnail.getInstance = function()
{
	if(!AS4ResourceEditorThumbnail.instance)
		AS4ResourceEditorThumbnail.instance = new AS4ResourceEditorThumbnail();

	return AS4ResourceEditorThumbnail.instance;
}