/**
 * Project   : AMDA-NG
 * Name      : MyDataUI.js
 * @class    : amdaUI.MyDataUI
 * @extends  Ext.container.Container 
 * @brief    MyData Module UI definition (View)
 * @author Elena 
 * @version  $Id: MyDataUI.js 2895 2015-05-05 14:38:28Z elena $	          
 */
 
 
Ext.define('amdaUI.MyDataUI', {

	extend: 'Ext.container.Container',
	alias: 'widget.panelMyData',
	
	requires: [
			'amdaUI.TableDefPlugUI'
	],

	object : null,	
	fileObject : null,
	
	module : null,
	
	fields : [],
	columns : [],
	
	constructor: function(config) {	
				this.module = myDesktopApp.getLoadedModule(myDesktopApp.dynamicModules.my_data.id);	   
				this.init(config);
				this.callParent(arguments);
				this.setObject(this.module.linkedNode.get('object'));
	},

	/*
	* linked node should be MyDataParamNode
	*/	 	
	resetLinkedNode: function() 
	{
		this.linkedNode = null;	    		      
		this.module.createLinkedNode();
		this.module.createObject();
		this.module.linkedNode.set('fileObject',this.fileObject); 
	},

	getObjectCallback: function(result,remoteEvent)
	{
		var t = remoteEvent.getTransaction();
		if (result && !result.error) {   	         	      	      	     
				//this.tmpNode.set('contextNode',mask!!! if exists	  
				this.fileObject = Ext.create('amdaModel.FileObject', result);
				var panelConfig = this.initPanel();
		} 
		else {	   
				// EXCEPTION : parameter not found !
				myDesktopApp.errorMsg(t.action + "." + t.method + " : No parameter '"
					+this.tmpNode.get('text')+"' found!");	     
		}  
	},

	/*
	*  Update info in the form on another parameter selection (cdf, cef formats);
	*/
	updateInfo : function(res, e) 
	{	    
		if (res.success){ 
				// info panel     
				this.items.getAt(1).update(res.info.name+': '+res.info.type+' '+res.info.size+' '+res.info.n_records);	    
				var form = this.items.getAt(0).getForm();
		
				//keep old name and mask if they exist 
				if (this.object.get('format') == 'vot')
				{
				res.info.ytitle = res.info.name;
				if ((res.info.id === this.object.get('realvar'))) { 
					if (this.object.get('realvar') != this.object.get('name')) {
						res.info.name = this.object.get('name');
					}
					if (res.info.mask != this.object.get('mask')) {
						res.info.mask = this.object.get('mask');
					}
				}
				}
				else
				{
				if ((res.info.name === this.object.get('realvar'))) { 
					if (this.object.get('realvar') != this.object.get('name')) {
						res.info.name = this.object.get('name');
					}
					if (res.info.mask != this.object.get('mask')) {
						res.info.mask = this.object.get('mask');
					}
				}
				res.info.ytitle = res.info.name;
				}

			form.setValues(res.info);       
		}
		else {
				myDesktopApp.errorMsg("System Error <br/> Error at AMDA Server");
		}
	},

	/*
	* Check if changes were made before closing window 
	* @return false
	*/	
	fclose : function() {
				return false;
	},

	/**
	* set object into form
	*/
	setObject : function (object) 
	{
		// edit in module from  FileUpload Module and ExplorerModule (edit param)
		if (this.module.linkedNode) { 
				if (this.module.linkedNode.get('fileObject')) {		

					this.fileObject = this.module.linkedNode.get('fileObject');

				} 
				// edit in module from Explorer Module (edit file)

				else if (this.module.linkedNode.get('object')) { 					
					this.fileObject = this.module.linkedNode.get('object');	

					this.resetLinkedNode();
				}
				else {	      
					myDesktopApp.errorMsg("System Error <br/> No FileObject and Object");
				}	      
		}	    
		else {  
				myDesktopApp.errorMsg("System Error <br/> No Linked Node"); 
		}
		
		var form = this.down('form');
		form.getForm().reset();
		// remove and DESTROY right panel if it exists
		if (form.items.length == 2) 
					form.remove(form.items.getAt(1),true);
		// create right panel depending on file	  
		var rightPanel = this.initPanel();
		form.add(rightPanel);
		this.object = this.module.linkedNode.get('object'); 

		// load object into form
		if (object.$className == 'amdaModel.FileObject' || !this.object.get('name')) {
					form.getForm().loadRecord(this.fileObject);
					if (this.fileObject.get('format') == 'txt')
							this.disablePredefined(false);
					else
							this.disablePredefined(true);
		}
		else
					form.getForm().loadRecord(this.object);

		// if it is not newly created empty myParamData node	  
		if (this.object.get('name')) {
				// file panel work around	   
				if (this.fileObject.get('format') == 'txt') {    		 
					form.getForm().findField('start').setValue(this.object.get('realvar'));	
					this.disablePredefined(false);	 
				}
				else if (this.object.get('format') == 'vot')
				{
					var radio = this.down('radiogroup');
					radio.setValue({'votvar' : this.object.get('realvar')});
				}
				else { // cdf, cef, nc
					// select parameter

					var radio = this.down('radiogroup');
					radio.suspendEvent('change');
					radio.setValue({'cdfvar' : this.object.get('realvar')}); 
					radio.resumeEvent('change');

					// disable form fields defined in file
					this.disablePredefined(true);
				}
		}

		//Set table definition
		if (object.get('tableDef'))
			this.getPlugin('tabledef').setTableDefinition(object.get('tableDef'));
	},

	/*
	*   // disable form fields defined in file ( cdf, nc, cef ) 
	*/	
	disablePredefined: function(disable)
	{
		var form = this.down('form');
		form.getForm().findField('start').setDisabled(disable);

		form.getForm().findField('size').setReadOnly(disable);
		this.down('combobox').setReadOnly(disable);

	},
	
	/*
	*  highlight selected columns in case of param (ASCII) edit
	*/
	updateSelection: function()
	{                    
		var start = parseInt(this.object.get('realvar'));
		var size =  parseInt(this.object.get('size'));
		
		if (start && size) {
				var columns = this.down('gridpanel').columns;
				for (var i = start; i < start+size; i++) {	   
					var selected = Ext.select(columns[i].getCellSelector(i));
					selected.addCls('meow');
					columns[i].selected = true;
				}
		}
	},

	/*
	* update this.object from form
	*/
	updateObject : function(nameField)
	{    
		// get the basic form
		var basicForm =  this.down('form').getForm();	  
		var updateStatus = true;
		var fieldsWithoutName = basicForm.getFields().items;
		
		Ext.Array.each(fieldsWithoutName, function(item, index,allItems){
				if(item !== nameField) { 		     
					if (!item.isValid()) {
						// set update isn't allowed
						updateStatus = false;    
					}
				}
		}, this);
		
		// if the update is allowed
		if (updateStatus) {
				// real object update
				// updateobject with the content of form
				var values = basicForm.getValues(); 
				basicForm.updateRecord(this.object);
				this.object.set('file',this.fileObject.get('fileName')); 
				this.object.set('format', this.fileObject.get('format'));
				if (this.object.get('format') == 'cdf' || this.object.get('format') == 'cef' || this.object.get('format') == 'nc') this.object.set('realvar',values.cdfvar);
				if (this.object.get('format') == 'vot') this.object.set('realvar',values.votvar);
				if (this.object.get('format') == 'txt') this.object.set('realvar',values.start);
				this.object.set('tableDef', this.getPlugin('tabledef').getTableDefinitionObject());
		}
		// return the update status
		return updateStatus;	    
	},

	/**
	* Check mask - length, existed....
	* @return true/false
	*/     
	validateMask : function(value)
	{
		// length
		if (value.length < 6) return 'mask length is too small (< 6)';

		// first *
		if (value.indexOf('*') === 0)  return '"*" could not be the first letter in mask';
		
		// several *
		if (value.indexOf('*') !== value.lastIndexOf('*')) return 'several "*" are not allowed in mask';
		
		// less common            
		var paramModule = myDesktopApp.getLoadedModule(myDesktopApp.dynamicModules.my_data.id); 
		var oldmask = paramModule.linkedNode.get('object').get('mask');
		// no old mask
		if (oldmask.length === 0) return true;
		if (value.length > oldmask.length) return 'new mask is less common than old one';
		
		return true;
	},

	/*
	*  save parameter
	*/        
	saveProcess : function(toRename)
	{          
		var values = this.down('form').getForm().getValues();              	 
		// Parameter Module
		var paramModule = myDesktopApp.getLoadedModule(myDesktopApp.dynamicModules.my_data.id);   
			
		// if the name has been modified this is a creation
		if (this.object.isModified('name'))
		{                
			var contextNode = paramModule.linkedNode.parentNode;        
			// if object already has an id : it's a 'rename' of an existing  	
			if (this.object.get('id'))
			{
				// get file object of the first node linked this file
				var fileObject = paramModule.linkedNode.get('fileObject');
				
				paramModule.createLinkedNode();                         
				// create a new object linked	                      
				var paramobj = Ext.create(paramModule.linkedNode.get('objectDataModel'), values);
							
				paramobj.set('format', this.fileObject.get('format'));                   
				if (paramobj.get('format') == 'cdf' || paramobj.get('format') == 'cef' ||
						paramobj.get('format') == 'nc')
														paramobj.set('realvar',values.cdfvar);
				if (paramobj.get('format') == 'vot') 
														paramobj.set('realvar',values.votvar);
				if (paramobj.get('format') == 'txt') 
														paramobj.set('realvar',values.start);

				paramobj.set('file', this.fileObject.get('fileName'));
				
				paramobj.set('tableDef', this.getPlugin('tabledef').getTableDefinitionObject());

				paramModule.linkedNode.set('object',paramobj);
				//synchronize objects
				this.object = paramobj; 
				
				paramModule.linkedNode.set('fileObject',fileObject);
				
				if (toRename) 
								paramModule.linkedNode.toRename = true;
			}
			paramModule.linkedNode.set('contextNode',contextNode);                 
			paramModule.linkedNode.create();
		
			paramModule.linkedNode.set('isParameter', true);
			
			if (values.size == 1) {
							paramModule.linkedNode.set('iconCls', 'icon-scalar');  
							paramModule.linkedNode.set('isSpectra', false);
			}

			else if (values.size == 3) {
							paramModule.linkedNode.set('iconCls', 'icon-vector');  
							paramModule.linkedNode.set('isSpectra', false);
			}

			else {
				if (values.plottype == 'Spectra') {
							paramModule.linkedNode.set('isSpectra', true);
							paramModule.linkedNode.set('iconCls', 'icon-spectra'); 
				}
				else {
							paramModule.linkedNode.set('iconCls', 'icon-unknowntype'); 
							paramModule.linkedNode.set('isSpectra', false);
						}
			}                                                   
		} else {  		  
			paramModule.linkedNode.set('contextNode',paramModule.contextNode); 
			paramModule.linkedNode.update();		  
		}                  
	}, 

	/* 
	*       overwrite method called by Save button
	*/
	overwriteProcess : function(btn){
			if (btn == 'cancel') return;
			var basicForm = this.down('form').getForm();
			basicForm.clearInvalid();
			this.saveProcess(true);        
	},

	updateForm : function() {
			var basicForm = this.down('form').getForm();
			var columns = this.down('gridpanel').columns;
			
			var start;
			var size = 0;
			Ext.Array.each(columns, function(column,index){
				if (!start && column.selected) start = index;
				if (column.selected) size += 1;
			});
			
			basicForm.setValues({start: start, size : size});
	},

	/*
	*         Configurations 
	* 
	*/     
	initPanel : function() 
	{
		var format = this.fileObject.get('format');	  
		if (format == 'cdf' || format == 'cef' || format == 'nc') return this.cdfPanel(format);
		if (format == 'txt')  return this.txtPanel();
		if (format == 'vot') return this.votPanel();
	},
	
	txtPanel: function() 
	{	  
		var fileName = this.fileObject.get('fileName');

		//FOR INFO
		// Null out built in convert functions for performance *because the raw data is known to be valid*
		// Specifying defaultValue as undefined will also save code. 
		// As long as there will always be values in the data, or the app tolerates undefined field values*
		
		// Dynamically created fields and columns	    
		var n_col = this.fileObject.get('vars'); 
		// reset	  
		this.fields = [];
		this.columns = [];

		for (var i = 0; i < n_col; i++)
		{    
			var name = i === 0 ? 'Time' : 'n'+i;
			//TODO width dependent on data?	  
			var width = i === 0 ? 120 : 75;
			
			this.fields[i] = { name: name };
			this.columns[i] = { text: name, sortable : false,  dataIndex: name, width : width, 
				menuDisabled: true, selected : false,
				listeners: 
				{
					scope : this,
					headerclick: function(ct, column)
					{
						if (column.text != 'Time') {
							var selected = Ext.select(column.getCellSelector(1));
							if (column.selected) {				      
								selected.removeCls('meow');
								column.selected = false;
							}
							else {
								selected.addCls('meow');
								column.selected = true;
							}
							this.updateForm();
						}
					}
				}
			};  
		}
			
		// Dynamically created model	  
		Ext.define('myData', {
				extend: 'Ext.data.Model',
				fields: this.fields,
				idProperty: 'Time' 
		});
		
		var store = Ext.create('Ext.data.ArrayStore', {
				model: 'myData',
				autoLoad: true,
				proxy: {
				type: 'direct',
				directFn: AmdaAction.getAsciiFile		   
				},
				listeners: {
					scope: this,
					beforeload: function(store){
						store.proxy.extraParams = {
						fileName: this.fileObject.get('fileName') 
						};
					},
					load: function(store, records, successful, eOpts) {
						this.updateSelection();
					}
				}
		});

		// Dynamically created columns dependent of myData model
		var panelConfig = {
				xtype : 'gridpanel',
				store : store,
				title : fileName,
				height: '100%',
				flex : 2,
				columnLines: true,
				columns: this.columns,
				listeners: 
				{
					scope : this,
					cellclick: function(view,td,cellIndex,record,tr,rowIndex,e)
					{
						var column = view.getGridColumns()[cellIndex];
						if (cellIndex > 0) {
								var selected = Ext.select(column.getCellSelector(cellIndex));
								if (column.selected) {
									selected.removeCls('meow');
									column.selected = false;			  
								}
								else {
									selected.addCls('meow');
									column.selected = true;
								}
								this.updateForm();
						}
					},
					select: function(selmodel, record, index, e) {
						selmodel.deselectAll();
					}	
				}
		};

		return panelConfig;
	},

	cdfPanel : function(format) 
	{
		var vars = this.fileObject.get('vars');
		var fileName = this.fileObject.get('fileName'); 
		var items = [];	   
		Ext.Array.each(vars, function(name, index) {
				if (name) {

					items[index] = { boxLabel: name, name: 'cdfvar', inputValue: name }	

				}
		}, this);

		var panelConfig = {
			xtype : 'fieldset', 
			bodyStyle: { background : '#dfe8f6'},
			flex : 2,
			autoScroll : true,
			height : '100%',
			title: fileName,
			items : [{
				xtype: 'radiogroup', 
				cls: 'x-check-group-alt',
				columns: 2,
				vertical: true,	                     

				items: items, 
				listeners : {
					scope: this,
					change: function (cb, nv, ov) {
						if (nv.cdfvar) { 
							AmdaAction.getMyParamInfo({format: format, file : fileName, varName : nv.cdfvar},
							this.updateInfo, this);
						}  
					}
				}

			}]
		};

		return panelConfig;
	},

	votPanel : function() 
	{                    
		var vars = this.fileObject.get('vars');
		var fileName = this.fileObject.get('fileName');
		
		var items = [];	  
		
		if (this.fileObject.get('foundTime'))
		{
				Ext.Array.each(vars, function(obj, index) {
					items[index] = { boxLabel: obj.name, name: 'votvar',  inputValue: obj.id,
						listeners: 
						{
							scope: this,
							change: function (cb, nv, ov) {					     
									if (nv) {						
									AmdaAction.getMyParamInfo({format: 'vot', file : fileName, varName : cb.inputValue},						
											this.updateInfo, this); 
								}					   							 						  
							}
						}
				};
			}, this);
		}
		else
				myDesktopApp.errorMsg("Cannot find a valid time field!");	       
						

		var panelConfig = {
			xtype : 'fieldset', 
			bodyStyle: { background : '#dfe8f6'},
			flex : 2, 
			autoScroll : true,
			height : '100%',
			title: fileName,
			items : [{
				xtype: 'radiogroup', 
				cls: 'x-check-group-alt',
				columns: 2,
				vertical: true,	                                                
				items: items
			}]
		};
		
		return panelConfig;
	},

	init : function(config) {	 

		var store = Ext.create('Ext.data.Store', {
			fields: ['value', 'name'],
			data : [
			{"value": "FLOAT", "name":"FLOAT"},
			{"value": "INTEGER", "name":"INTEGER"},
			{"value": "DOUBLE", "name":"DOUBLE"},
			{"value": "SHORT", "name":"SHORT"}
			]
		}); 

		var combo =   { 
				xtype: 'combo',
				fieldLabel: 'Parameter Data Type',
				store: store,
				queryMode: 'local',
				displayField: 'name',
				valueField: 'value',
				name: 'type',		
				editable: false,
				value: 'FLOAT'
		};

		var store1 = Ext.create('Ext.data.Store', {
					fields: ['value', 'name'],
					data : [
						{"value": "TimeSerie", "name":"Time Serie"},                   
						{"value": "Spectra", "name":"Spectra"}
					]
		}); 

		var comboPlotType =   { 
				xtype: 'combo',
				fieldLabel: 'Display Type',
				store: store1,
				queryMode: 'local',
				displayField: 'name',
				valueField: 'value',
				name: 'plottype',           
				editable: false,
				value: 'Time Series'
		};
	
	// Parameter Form	  
		var panelLeft =  {
			bodyStyle: { background : '#dfe8f6'},	      
			flex : 1,	 
			defaults: {
				xtype:'textfield',
				validateOnChange: false,
				validateOnBlur: false,
				padding : '0 10 0 5',
				inputWidth : 80
			},
			items: [
			{
				id: 'mydataName',
				fieldLabel: 'Parameter Name',
				labelAlign: 'top',
				name: 'name',
				allowBlank : false,
				stripCharsRe: /(^\s+|\s+$)/g,
				validFlag: false,
				validator : function() {
					return this.validFlag;
				},
				inputWidth : 180
			}, 
			{
				fieldLabel: 'File Name/Mask&nbsp;<img amda_clicktip="fileMask" style="vertical-align:bottom" src="js/resources/images/16x16/info_mini.png"', 
				labelAlign: 'top',             
				name: 'mask',
				inputWidth : 180,
				validator : this.validateMask
			}, 
			combo, 
			{
				xtype:'numberfield',
				fieldLabel: 'Parameter Start Position',              
				name: 'start',
				minValue : 1,
				//	  maxValue : maxSize,
				listeners : 
				{
					scope : this,
					change : function(field, newValue, oldValue){
						var grid = this.down('gridpanel');
						if (!grid) return;
						if (newValue && newValue != oldValue) 
						{
							var size = field.prev().value;
							var columns = grid.columns;
							Ext.Array.each(columns, function(column,index){
								var selected = Ext.select(column.getCellSelector(index));
								if (index < newValue)
								{
									if (column.selected) {
										selected.removeCls('meow');
										column.selected = false;				 
									}
								}
								else if (index == newValue) {
									if (!column.selected) {
										selected.addCls('meow');
										column.selected = true;				 
									}
								}
								else {
									if (column.selected) {
										selected.removeCls('meow');
										column.selected = false;				 
									} 
								}
							});
						}
					}
				}
			}, 
			{ 
				xtype:'numberfield',
				fieldLabel: 'Parameter Size',              
				name: 'size',
				minValue: 1,
				//	  maxValue : maxSize,
				listeners : 
				{
					scope : this,
					change : function(field, newValue, oldValue){
						var grid =  this.down('gridpanel');
						if (!grid) return;
						var start =  field.prev().value;
						var columns = grid.columns;
						Ext.Array.each(columns, function(column,index){
							var selected = Ext.select(column.getCellSelector(index));
							if (index <= start) {}
							else if (index - start < newValue) {
								if (!column.selected){
									selected.addCls('meow');
									column.selected = true;	
								}
							}
							else {
								if (column.selected){
									selected.removeCls('meow');
									column.selected = false;	
								}
							}
						});
					}
				}
			}, 
			{
				xtype:'numberfield',
				fieldLabel: 'Min Sampling',              
				name: 'minsampling'
			},
			{
				xtype:'numberfield',
				fieldLabel: 'Max Sampling',              
				name: 'maxsampling'
			},
			{
				fieldLabel: 'Filling Value',              
				name: 'fillvalue'
			},
			{
				fieldLabel: 'Units',              
				name: 'units'
			},  
			comboPlotType, 
			{
				fieldLabel: 'Y Title',              
				name: 'ytitle'
			},
			{
				fieldLabel: 'Legend',              
				name: 'legend'
			}],
			listeners: 
			{
				click: {
					element: 'el',
					fn: function(e,t) {	 		 
						var me = t,
						text = me.getAttribute('amda_clicktip');
						if (text) {
								e.preventDefault();
								AmdaAction.getInfo({name : text}, function(res,e) {					    					   
									if (res.success) myDesktopApp.infoMsg(res.result);
								}); 
						}
					}
				}			
			}
		};

		var myConf = {
			layout: 'border',		 
			items: [ 
				{   
					xtype : 'form',
					bodyStyle: { background : '#dfe8f6'},
					layout: 'hbox',   
					region: 'center',
					buttonAlign:'left',
					items : [
							panelLeft 
					],
					buttons: [
					{
						scope : this,  
						text: 'Show/Hide Table definition',   
						handler: function() 
						{
							this.getPlugin('tabledef').showHide();
						}
					},
					'->',
					{  
						scope : this,  
						text: 'Save',
						handler: function() 
						{   
							var form = this.down('form').getForm();     
							// check if variable was selected
							// cdf,...
							var radio = this.down('radiogroup');            
							if (radio && radio.getChecked().length == 0) {
								myDesktopApp.warningMsg('Select variable from the file, please');
								return;
							}
							// ascii
							if (!radio && this.columns.length > 0) {                                  
								if (!form.findField('start').getValue() || !form.findField('size').getValue()) {                                    
								myDesktopApp.warningMsg('Select column[s] from the file, please');
								return;
								}                                  
							}
							var nameField = form.findField('mydataName'); 
							if (this.updateObject(nameField))
							{
								var myDataModule = myDesktopApp.getLoadedModule(myDesktopApp.dynamicModules.my_data.id);	
								if (!myDataModule)
										return;
								var me = this;
								myDataModule.linkedNode.isValidName(nameField.getValue(), function (res) {
									if (!res) {
										nameField.validFlag = 'Error during object validation';
										myDesktopApp.errorMsg(nameField.validFlag);
										nameField.validate();
										return;
									}
									
									if (!res.valid)
									{
										if (res.error)
										{
											if (res.error.search('subtree') != -1) {
												Ext.MessageBox.show({title:'Warning', 
													msg: res.error+'<br/>Do you want to overwrite it?',
													width: 300,
													buttons: Ext.MessageBox.OKCANCEL, 
													fn : me.overwriteProcess,
													icon: Ext.MessageBox.WARNING,
													scope : me
												});
												nameField.validFlag = true;
											}
											else
												nameField.validFlag = res.error;
										}
										else
										{
											nameField.validFlag = 'Invalid object name';
											myDesktopApp.errorMsg(nameField.validFlag);
										}
										nameField.validate();
										return;
									}
								
									nameField.validFlag = true;
									nameField.validate();
									me.saveProcess();
								});
							}
						}
					},
					{
						scope : this,
						text: 'Reset',
						handler: function(){				      
							this.down('form').getForm().reset();
						}
					}]
				},
				{
					xtype: 'panel', 
					region: 'south',
					title: 'Information',
					collapsible: true,
					height: 100,
					autoHide: false,
					iconCls: 'icon-information',
					bodyStyle: 'padding:5px',
					loader: {
							autoLoad: true,
							url: helpDir+'myDataHOWTO'
					}  
				}],
			  
				plugins: [ {ptype: 'tabledef', pluginId: 'tabledef'} ]
		};

		Ext.apply (this, Ext.apply(arguments, myConf));
	},

	getParameterSize : function()
	{
		var form = this.down('form').getForm();
		return form.findField('size').getValue();
	}

});