/*
 *  Copyright 2015 Anyware Services
 *
 *  Licensed under the Apache License, Version 2.0 (the "License");
 *  you may not use this file except in compliance with the License.
 *  You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 *  Unless required by applicable law or agreed to in writing, software
 *  distributed under the License is distributed on an "AS IS" BASIS,
 *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 *  See the License for the specific language governing permissions and
 *  limitations under the License.
 */

/**
 * {@link} Ext.data.TreeStore for sites
 * @private
 */
Ext.define('Ametys.plugins.web.site.SiteTypesView', {
	extend: 'Ext.view.View',
	
    config: {
        /**
         * @cfg {Boolean} excludePrivateTypes Should privates be excluded
         */
        excludePrivateTypes: true
    },
    
	constructor: function(config)
	{
		Ext.applyIf (config, {
			ui: 'view',
			border: false,
			scrollable: true,
            
            selModel: {
                mode: 'SINGLE'
            },
	        
			overItemCls:'x-view-over',
	        itemSelector:'div.sitetype-item',
		    
		    tpl: new Ext.XTemplate(
					'<tpl for=".">',
				        '<div class="sitetype-item" id="sitetype-{name}">',
				        '<div class="text">',
				        '<tpl if="image">',
			            	'<span class="sitetype-item-img" style="height: 48px; width: 48px; background-image: url(\'{image}\'); display: inline-block;"></span>',
				        '</tpl>',
				        '<tpl if="iconGlyph">',
				        	'<span class="sitetype-item-glyph {iconGlyph}"></span>',
				        '</tpl>',
				        '<br/><span class="title">{label}</span>',
				        '</div></div>',
				    '</tpl>'
		    ),
		        
			store: Ext.create('Ext.data.Store', {
				model: 'Ametys.plugins.web.site.SiteTypesView.SiteType',
				
		        proxy: {
		        	type: 'ametys',
					plugin: 'web',
					url: 'administrator/site-types.json',
		        	reader: {
		        		type: 'json',
						rootProperty: 'types'
		        	}
		        },
		        
		        listeners: {
                    load: {fn: this._onLoad, scope: this},
                    beforeload: {fn: this._onStoreBeforeLoad, scope: this}
				},
				
		        sorters: [ { property: 'label', direction: "ASC" }]
			})
		});
		
		this.callParent(arguments);
	},
	
	/**
	 * @private
	 * Update records' tooltip after loading
	 * @param {Ext.data.Store} store The data store
	 * @param {Ext.data.Model[]} records An array of  loaded records
	 */
	_onLoad: function (store, records)
	{
		for (var i=0; i < records.length; i++)
		{
			var index = store.find('id', records[i].data.id)
			var record = store.getAt(index);
			var recordEl = this.getNode(index);
			
			Ext.QuickTips.unregister(recordEl);
	    	
	        Ext.QuickTips.register({
	        	target: recordEl,
	            
	        	glyphIcon: record.data.iconGlyph,
	        	image: record.data.image,
	        	imageWidth: 48,
	    		imageHeight: 48,
	            title: record.data.label + " (<em>" +  record.data.name + "</em>)",
	            text:  record.data.description,
	            inribbon: false
	        });
		}
	},
	
    /**
     * @private
     * Set the request parameters before loading the store.
     * @param {Ext.data.Store} store The store.
     * @param {Ext.data.operation.Operation} operation The Ext.data.operation.Operation object that will be passed to the Proxy to load the Store.
     */
    _onStoreBeforeLoad: function(store, operation)
    {
        var excludePrivateTypes = this.getConfig('excludePrivateTypes');
        var params = operation.getParams() || {};
        
        params.excludePrivateTypes = excludePrivateTypes;
        operation.setParams(params);
    }
});