TimeSelectorUI.js 6.2 KB
/**
 * Project   : AMDA-NG
 * Name      : TimeSelectorUI.js
 * @class      amdaUI.TimeSelectorUI
 * @extends    Ext.form.FieldSet
 * @brief    common component to select Time in searchModule, plotModule
 * 					and downloadModule
 * @author 	 Myriam
 * @version  $Id: TimeSelectorUI.js 2135 2014-02-25 13:37:18Z elena $ 
 */

Ext.define('amdaUI.TimeSelectorUI', {
	extend: 'Ext.form.Panel',
	
	requires : [ 'amdaUI.IntervalUI' ],
	
	setTTTab: function(arrayTT) {
		var arrayRec = new Array();
		var index = 1;
		if (arrayTT){
			index = 0;            
			Ext.Array.each(arrayTT,function(item,index,all){
				// adding the time table to the TTGrid
				if (!item.$className){
					//json case
					var r = Ext.create('amdaModel.TTobject', { id: item.id, name: item.timeTableName });
					arrayRec.push(r);
				}
				else
					//TTobject case
					arrayRec.push(item);
			});
		}          
		this.activeTab = amdaModel.AmdaTimeObject.inputTimeSrc[index];
		
		// name of RadioGroup in every TimeSelector object should be UNIQUE: 
		// RadioManager is a singleton working with getByName !!!!!	
		var obj = new Object();  	 
		obj['timesrc_' + this.id] =  this.activeTab;        
		this.timeSrc.setActiveTab(this.activeTab); 
		
		if (index === 0) this.TTGrid.getStore().loadData(arrayRec);
	},
    
	addTT : function(newTTName,newTTid) {      
		// set the TimeTable radio checked
		var obj = new Object();  
		obj['timesrc_'+this.id] =  amdaModel.AmdaTimeObject.inputTimeSrc[0]; /*'TimeTable'*/
		this.timeSrc.setActiveTab(obj['timesrc_'+this.id]); 
		
		// search for an existing record in store with this unique name
		var existingIndex = this.TTGrid.store.findExact( 'name', newTTName);
		// if no corresponding TT found
		if (existingIndex == -1){
			// adding the time table to the TTGrid  
			var r = Ext.create('amdaModel.TTobject', { id: newTTid, name: newTTName });
			this.TTGrid.store.insert(this.TTGrid.store.getCount(),r);   
		}        
	},
   
	getActiveTimeSource: function() {
		return this.timeSrc.getActiveTab().getItemId(); 
	},
    
	initComponent: function() {
		this.activeField = null;
		var store = Ext.create('Ext.data.Store', 
		{
			model: 'amdaModel.TTobject'	
		});

		var me = this;
        
		this.TTGrid = Ext.create('Ext.grid.Panel', 
		{
			itemId: 1, 	    
			store : store,
			columns: 
			[ 
				Ext.create('Ext.grid.RowNumberer', { width: 20 } ),
				{ header: "Time Table or Catalog Name", dataIndex: 'name', flex:1, sortable : false, menuDisabled: true },
				{ 
					menuDisabled: true,  width: 30, renderer: function()
					{
						return'<div class="icon-remover" style="width: 15px; height: 15px;"></div>';
					}
				}
			],
			listeners : {
				render : function(o,op) {
					var el = this.getEl();
					var dropTarget = Ext.create('Ext.dd.DropTarget', el, {
						ddGroup: 'explorerTree',
						notifyOver  : function(ddSource, e, data)
						{
							if ((data.records[0].get('nodeType') == 'timeTable' || 
								data.records[0].get('nodeType') == 'sharedtimeTable' ||
								data.records[0].get('nodeType') == 'catalog' ||
								data.records[0].get('nodeType') == 'sharedcatalog') && (data.records[0].get('leaf')))
							{
								this.valid = true;
								return this.dropAllowed;
							}
							this.valid = false;
							return this.dropNotAllowed;
						},
						notifyDrop  : function(ddSource, e, data) 
						{
							if (!this.valid) return false;
							
							var explorerModule = myDesktopApp.getLoadedModule(myDesktopApp.dynamicModules.explorer.id);
							if (!explorerModule)
								return false;
							var targetModuleId = explorerModule.getPinedModule(); 
							var targetModule = myDesktopApp.getLoadedModule(targetModuleId);
							if (targetModule)
								targetModule.getUiContent().addTT(data.records[0].get('text'),data.records[0].get('id'), me.getId());
							return true;
						}
					});
				}
			}
		}); 

		this.TTGrid.on('cellclick', function(view, cell, cellIndex, record, row, recordIndex, e)
		{
			if (cellIndex == 2)
			this.TTGrid.getStore().remove(record);
		}, this);

		this.intervalSel = Ext.create('amdaUI.IntervalUI', 
		{
			itemId: 2,
			listeners : 
			{
				render : function(o,op) 
				{
					var me = this;
					var el = me.getEl(); 
					var dropTarget = Ext.create('Ext.dd.DropTarget', el, {
						ddGroup: 'explorerTree',
						notifyOver  : function(ddSource, e, data) 
						{  
							if ((data.records[0].get('globalStart') != null) && (data.records[0].get('globalStop') != null) 
								 && data.records[0].get('globalStart') != 'depending on mission' &&  data.records[0].get('isParameter'))
						//	if ((data.records[0].get('nodeType') == 'myDataParam' || data.records[0].get('nodeType') == 'localParam')
						//		&&  data.records[0].get('isParameter'))
							{
								this.valid = true;
								return this.dropAllowed;
							}
							this.valid = false;
							return this.dropNotAllowed;
						},
						notifyDrop  : function(ddSource, e, data)
						{
							if (!this.valid) return false;
								
							var explorerModule = myDesktopApp.getLoadedModule(myDesktopApp.dynamicModules.explorer.id);
							if (!explorerModule)
								return false;
							var targetModuleId = explorerModule.getPinedModule();                                
							var targetModule = myDesktopApp.getLoadedModule(targetModuleId);
							
							targetModule.getUiContent().setTimeFromData({ start : data.records[0].get('globalStart'),
																						 stop  : data.records[0].get('globalStop')});     
							me.updateDuration();
							return true;
						}
					});
				}
			}                
		});
        
		this.timeSrc = new Ext.tab.Panel(
		{
			layout: 'fit',
			plain: true,
			bodyStyle: 'background: none',
			items: [
			{
				title: 'Interval',
				layout: 'fit',
				bodyStyle: 'background: none',
				itemId: amdaModel.AmdaTimeObject.inputTimeSrc[1],//'Interval'
				items: [ this.intervalSel ]
			},
			{
				title: 'Time Table or Catalog',
				layout: 'fit',
				itemId: amdaModel.AmdaTimeObject.inputTimeSrc[0],//'TimeTable'
				items: [ this.TTGrid ]
			}]     
		});
        
		var config = 
		{
			title: (!this.title) ? 'Time Selection' : this.title,
			layout: 'fit',
			bodyStyle: { background : '#dfe8f6' },
			items: [ this.timeSrc ]
		};
	 
		Ext.apply(this, config);
		this.callParent(arguments);
	}
});