/**
 * Strumento di visualizzazione ed editing dei dati configurabile, 
 * senza la necessità di scrivere codice (“codeless”) per Tolomeo. 
 *
 * @author Tobia Di Pisa at tobia.dipisa@geo-solutions.it
 */
Ext.define('TolomeoExt.ToloViewCodeLessPanel', {

	extend: 'Ext.Panel',

	/**
	 * @cfg {Object} paramsJS
	 * Configurazioni specifiche del file di preset.
	 */
	paramsJS: null,

	/**
	 * @cfg {String} TOLOMEOServer
	 * URL di base del contesto di Tolomeo.
	 */
	TOLOMEOServer: null,

	/**
	 * @cfg {String} TOLOMEOContext
	 * Contesto di Tolomeo.
	 */
	TOLOMEOContext: null,
	
	/**
	 * @cfg {String} viewFieldSetTitle
	 * Testo del field set in modalit� di visualizzazione.
	 */
	viewFieldSetTitle: null, //"Visualizzazione Dati",
	
	/**
	 * @cfg {String} editFieldSetTitle
	 * Testo del field set in modalit� di modifica.
	 */
	editFieldSetTitle: "Modifica Dati",
	
	/**
	 * @cfg {String} newFieldSetTitle
	 * Testo del field set in modalit� di nuovo elemento.
	 */
	newFieldSetTitle: "Nuovo Elemento",
	
	/**
	 * @cfg {String} applyModsTooltip
	 * Testo da mostrare per il tootlip del pulsante di salvataggio delle modifiche.
	 */
	applyModsTooltip: "Applica Modifiche",
	
	/**
	 * @cfg {String} resetTooltip
	 * Testo da mostrare per il tootlip del pulsante di reset delle modifiche.
	 */
	resetTooltip: "Reimposta Campi",
	
	/**
	 * @cfg {String} restoreBoxTitle
	 * Titolo da mostrare per la dialog di conferma per il reset delle modiche.
	 */
	restoreBoxTitle: "Ripristino", 
	
	/**
	 * @cfg {String} restoreBoxText
	 * Testo da mostrare per la dialog di conferma per il reset delle modiche.
	 */
	restoreBoxText: "Procedere con il ripristino dei dati allo stato iniziale?", 

	/**
	 * @cfg {String} saveBoxTitle
	 * Titolo da mostrare per la dialog di conferma per il salvataggio delle modiche.
	 */
	saveBoxTitle: "Salvataggio", 
	
	/**
	 * @cfg {String} saveBoxText
	 * Testo da mostrare per la dialog di conferma per il salvataggio delle modiche.
	 */
	saveBoxText: "Procedere con il salvataggio?", 
	
	/**
	 * @cfg {String} missingIDTPNTitle
	 * Titolo da mostrare in fase di salvataggio se il campo relativo all'IDTPN non risulta valorizzato.
	 */
	missingIDTPNTitle: "IDTPN Mancante",
	
	/**
	 * @cfg {String} missingIDTPNText
	 * Testo da mostrare per la dialog di avviso in fase di salvataggio se il campo relativo all'IDTPN non risulta valorizzato.
	 */
	missingIDTPNText: "Il campo relativo all'IDTPN deve essere inserito prima di procedere",
	
	/**
     * @cfg {Object} autoCompleteCfg [autoCompleteCfg="{}"]
	 * Stabilisce la configurazione da usare per la funzionalità di autocompletamento.
	 *
	 * @example
	 * autoCompleteCfg: {
	 *  	url: 'http://localhost:8080/tolomeobinj/UniqueValueServlet',
	 *		pageSize: 10
	 * }
     */
    autoCompleteCfg: {},
    
	/**
	 * @cfg {Number} pageSize
	 * Indica il massimo numero di elementi per pagina per la combo di autocompletamento usato per 
	 * gli editor di FKs.
	 */
    pageSize: 10,
    
	/**
	 * @cfg {String} dateFormat [dateFormat="c"]
	 * Indica il formato per i campi editor di tipo "data" (il valore predefinito e 'c' che corrispondea 'ISO 8601 date').
	 */
    dateFormat: "c",
    
	/**
	 * @cfg {Array} dateFormats
	 * Formati di data ExtJS disponibili per gli editor di campi data di questo componente.
	 */
    dateFormats: [
        {java: "yyyy-MM-dd'T'HH:mm:ss", ext: "Y-m-d H:i:s"},
        {java: "yyyy-MM-dd", ext: "Y-m-d"},
        {java: "dd-MM-yyyy", ext: "d-m-Y"},
        {java: "dd-MM-yyyy", ext: "d-m-Y"},
        {java: "MM-dd-yyyy", ext: "m-d-Y"}		
    ],
    
	/**
	 * @property {TolomeoExt.ToloViewCodelessManager} codelessManager
	 * Gestore delle operazioni del componente.
	 */
	
	/**
	 * @property {Ext.grid.Panel} propertyGrid
	 * Griglia ExtJs per la presentazione e la modifica dei dati richiesti.
	 */
	
	/**
	 * @property {Ext.grid.Panel} decodeGrid
	 * Griglia ExtJs per la presentazione e la modifica dei dati relativi alle tabelle di decodifica.
	 */
	
	/**
	 * @property {String} mode
	 * Stringa che indica la modalità di funzionamento corrente della form.
	 */

	/**
     * Inizializza un nuovo TolomeoExt.ToloNewCodeLessPanel.
     * @param {Object} [config] Un opzionale oggetto di configurazione per il componente ExtJs.
     */
	initComponent: function(config){
		TolomeoExt.Vars.ApplyIfDefaults(this);
		
		// ///////////////////// //
		// FEATURE DI SELEZIONE  //
		// ///////////////////// //
		
		var gridStore = Ext.create('Ext.data.Store', {
		    fields: ["name", "nl", "type", "editable", "validation", "value", "value2", "format", "width"],
		    proxy: {
		        type: 'memory',
		        reader: {
		            type: 'json',
		            root: 'rows'
		        }
		    }
		});
		
	    var me = this;
		this.propertyGrid = Ext.create('Ext.grid.Panel', {
			margin: "5 5 5 5",
			hideHeaders: true,
			store: gridStore,
			overflowY: 'auto',
		    columns: [
              {
            	  header: 'Nome',  
            	  dataIndex: 'name',
            	  tdCls: 'codelessnomecampo',
            	  flex: 1,
            	  renderer: function(value, metaData, record, rowIndex, colIndex, store, view)
            	  {
            		  var type = record.get("type");
            		  
	  	              switch (type) {
	                    case "VALORE":
	                    	return value;
	                        break;
	                    case "COSTANTE":
						    metaData.tdAttr = ' colspan="2"';
	                    	return value;
	                        break;
	                    case "URL":
						    metaData.tdAttr = ' colspan="2"';
	                    	return "<a href=\"" + record.get("value") + "\" target=\"_blank\">" + value + "</a>";
	                        break;
	                    case "IMG":
						    metaData.tdAttr = ' colspan="2"';
	                    	return "<img src=\"" + record.get("value") + "\" alt=\"" + value + "\" width=\"" + record.get("width") + "\"></img>";
	                        break;
	                    case "IMGURL":
						    metaData.tdAttr = ' colspan="2"';
	                    	return "<a href=\"" + record.get("value2") + "\" target=\"_blank\"><img src=\"" + record.get("value") + "\" alt=\"" + value + "\" width=\"" + record.get("width") + "\"></img></a>";
	                        break;
	                    case "DETAIL":
	                    	return value;
	                        break;
	                    default:
	                		return value;
	  	              }
            	  }
              },
              {
            	  header: 'NL',  
            	  dataIndex: 'nl',
                  hidden: true
              },
              {
            	  header: 'Tipo',  
            	  dataIndex: 'type',
                  hidden: true
              },
              {
            	  header: 'Editabile',  
            	  dataIndex: 'editable',
                  hidden: true
              },
              {
            	  header: 'Validation',  
            	  dataIndex: 'validation',
                  hidden: true
              }, 
              {
            	  header: 'Valore', 
            	  dataIndex: 'value',
            	  tdCls: 'codelessvalore',
            	  //flex: 50/100,
            	  flex: 2,
            	  renderer: function(value, metaData, record, rowIndex, store, view) {
            		  var type = record.get("type"); 
	  	              switch (type) {
	                    case "VALORE":
	                    	return value;
	                        break;
	                    case "COSTANTE":
	                    case "URL":
	                    case "IMG":
	                    case "IMGURL":
	                    	return null;
	                        break;
	                    case "DETAIL":
	                    	return value;
	                        break;
	                    default:
	                		return value;
	  	              }
            	  }
              }
            ]
		});
		
	    this.layout = 'fit';
		
		this.callParent();
		this.buildManager(gridStore);
//		this.codelessManager.on("loaddata", this.dataLoaded, this);
		
		this.add([this.propertyGrid]);
	},
	
//	dataLoaded: function()
//	{
//		
//		var linkButton = this.formPanel.query("button[ref=linkButton]")[0];
//		var metadata = this.codelessManager.getRequestMetadata();
//		
//		if (metadata.layerURL != null && metadata.layerURL != "") {
//			linkButton.setText(metadata.layerURLLabel);
//			linkButton.setHref(metadata.layerURL);
//			linkButton.show();
//		} else {
//			linkButton.hide();
//		}
//	},
	
	/**
     * Restituisce il formato data da usare per l'editor. 
     * 
     */
	getDateFormat: function(){
		var metadata = this.codelessManager.getRequestMetadata();
    	
		// ////////////////////////////////////////////////////////////
		// Usa ISO-8601 come formato data se non viene trovata nessuna 
		// corrispondenza attraverso l'invocazione di getExtDateFormat.
		// ////////////////////////////////////////////////////////////
		var format =  metadata ? (this.getExtDateFormat(metadata.dateFormat) || this.dateFormat) : this.dateFormat;
		return format;
	},
	
	/**
     * Converte il formato Data fornito dal server sulla base di quelli disponibili 
     * in configurazione. 
     * @param {String} format formato da usare per il campo editor della data.
     * 
     */
	getExtDateFormat: function(format){
		var date_format;
		
		if(format){
			for(var i=0; i<this.dateFormats.length; i++){
				var df = this.dateFormats[i];
				if(format == df.java){
					date_format = df.ext;
					break;
				}
			}
		}
		
		return date_format;
	},
	
	/**
     * Crea il componente Ext destinato a contenere il valore delle propriet�.
     * @param {TolomeoExt.data.ToloUniqueValuesStore} store Store della combo box di auto completamento.
     * @param {String} url Url del servizio remoto di auto completamento.
     * @param {String} layerName codTPN da usare com eparametro della richiesta.
     * @param {String} fieldName Nome della proprietà di cui ritornare i suggerimenti.
     * 
     */
    initUniqueValuesStore: function(store, layerName, fieldName) {
        var params = {
            inputs: {
            	featureTypeName: layerName,
                fieldName: fieldName
            },
            start: 0,
            limit: this.autoCompleteCfg.pageSize || this.pageSize
        };
        
        store.setParams(params);
    },
	
	/**
     * Crea il Gestore delle richieste se assente e registra gli eventi necessari.
     * @param {Ext.Data.Store} store Store che il Manager deve gestire.
     */
	buildManager: function(store){
		this.codelessManager = Ext.create('TolomeoExt.ToloViewCodelessManager', {
			TOLOMEOServer : this.TOLOMEOServer,
			TOLOMEOContext: this.TOLOMEOContext,
			store: store
		});
		
		this.codelessManager.on({
			changemode: function(mode, store){
				this.setFormMode(mode, store);
			},
			scope: this
		});
	},
	
	/**
     * Imposta sul Manager l'oggetto di controllo della mappa per intercettare le 
     * operazioni utente (eventi tolomeo) e procedere con la gestione della form.
     * @param {TolomeoExt.ToloMapAPIExt} mapApiExt Oggetto di controllo della mappa.
     */
	setMapApiExt: function(mapApiExt){
		this.codelessManager.setMapApiExt(mapApiExt);
	},
	
	/**
     * Imposta la modalit� con cui configurare la form.
     * @param {String} mode Modalit� di configurazione (view, edit, new).
     * @param {Ext.Data.Store} store Store con gui configurare la griglia dei dati
     */
	setFormMode: function(mode, store){
		this.mode = mode;
		
		this.propertyGrid.reconfigure(store);
		
		// ///////////////////////////////////////////////////////////
		// Se sono stati forniti dal server valori di default per i 
		// campi della form allora le rispettive celle delle griglia 
		// devono essere marcate come valorizzate (DIRTY).
		// ///////////////////////////////////////////////////////////
		if(mode == "new"){
			var gridStore = this.propertyGrid.getStore();
			var isDirty = false;
			gridStore.each(function(r) {
				var value = r.get("value");
				var nl = r.get("nl");
                if (value != "" && nl != "") {
                   r.setDirty();
                   isDirty = true;
                }
            });
		}
	}
});