/**
 * Project   : AMDA-NG
 * Name      : PlotTabPanel.js
 * @class   amdaPlotComp.PlotTabPanel
 * @extends Ext.tab.Panel
 * @brief   Component use to show Plot tabs definition
 * @author  Benjamin Renard
 * @version $Id: PlotTabPanel.js benjamin $
 */

Ext.define('amdaPlotComp.PlotTabPanel', {
	extend: 'Ext.tab.Panel',
	
	requires: [
	           'amdaPlotComp.PlotTabContent'
	],
	
	//Link to the Plot Element Panel
    plotElementPanel: null,
    
    //Link to the Plot UI
    plotUI : null,
	
	//Request object
	object: null,
	
	constructor: function(config) {
		this.init(config);	    
		this.callParent(arguments);
	},
	
	setRequestObject: function(object)
	{
		var me = this;
		this.removeAll();
		this.object = object;

		var haveSelectedTab = false;
		this.object.tabs().each(function (rec, index) {
			if (rec.get('id') == me.object.get('active-tab-id')) {
				haveSelectedTab = true;
			}
		});

		this.object.tabs().each(function (rec, index) {
			var isSelectedTab = haveSelectedTab ? (rec.get('id') == me.object.get('active-tab-id')) : (index == 0);
			this.addPlotTab(rec, isSelectedTab); 	
		}, this);
	},
	
	addPlotTab: function(tabObject, selectTab)
	{
		var tabNumber = this.getTabBar().items.getCount();
		var tabContent = new amdaPlotComp.PlotTabContent({plotElementPanel: this.plotElementPanel, plotTabPanel : this, tabId : tabObject.get('id')});
		tabContent.setTabObject(tabObject);
		var me = this;
    	var tabComp = this.add({
    		title: (tabObject.get('tab-name') != '') ? tabObject.get('tab-name') : 'Plot '+tabNumber,
    		closable: true,
    		layout: 'fit',
    		bodyStyle: 'background: none',
    		defaults: {
				border: false
			},
    		items: [
    		        tabContent
    		],
    		listeners : {
    			scope : this,
    			beforeclose: function( tab, eOpts ) {
    				if (this.items.getCount() == 1)
    				{
    					myDesktopApp.warningMsg('You need to keep at least one plot definition');
    					return false;
    				}
    				return true;
    			},
    			close: function( tab, eOpts ) {
    				if (tab.items.getAt(0).object)
    					this.object.removeTabById(tab.items.getAt(0).object.get('id'));
    			},
    			destroy: function(tab, eOpts) {
				
    				this.updatePlotTabs();
    			},
			afterrender: function(tab, e0pts) {
				if (!tab.tab.el) {
					return;
				}
				tab.tab.el.on('contextmenu', function(e, t, eOpts) {
					var menu = new Ext.menu.Menu({
						items: [
							{
								text: 'Rename',
								handler: function() {
									Ext.Msg.prompt('Rename', 'Please enter new plot tab name:', function(btn, text){
										if (btn == 'ok'){
											tabObject.set('tab-name',text);
											me.updatePlotTabs();
										}
									}, me);
								}
							}
						]
					});
					var position = e.getXY();
					e.stopEvent();
					menu.showAt(position);
				},this);
			}
    		}
    	});
    	
    	if (selectTab)
    		this.setActiveTab(tabComp);
    	
    	return tabContent;
	},
	
	updatePlotTabs: function()
	{
		var me = this;
		var haveSelectedTab = false;
		this.object.tabs().each(function (rec, index) {
			if (rec.get('id') == me.object.get('active-tab-id')) {
				haveSelectedTab = true;
			}
		});

		var i = 0;
		for (i = 0; i < this.items.getCount(); ++i)
		{
			var tabItem = this.items.getAt(i);
			var tabContent = tabItem.items.getAt(0);
			var tabObj = this.object.tabs().getById(tabContent.tabId);
			if (!tabObj) {
				continue;
			}
			if (!haveSelectedTab) {
				//Set first tab as the selected one
				this.setActiveTab(tabItem);
				this.object.set('active-tab-id', tabObj.get('id'));
				haveSelectedTab = true;
			}
			var tabNumber =  i+1;
			tabItem.setTitle((tabObj.get('tab-name') != '') ? tabObj.get('tab-name') : 'Plot '+tabNumber);
			tabContent.setTabObject(tabObj);
		}
	},
	
	updateLinkedToMultiPlotMode : function(isLinkedToMultiPlotMode) {
		this.plotUI.updateLinkedToMultiPlotMode(isLinkedToMultiPlotMode);
	},
	
	updateTimeObject : function() {
		for (i = 0; i < this.items.getCount(); ++i)
		{
			this.items.getAt(i).items.getAt(0).updateTimeObject();
		}
	},
	
	getTreeFromPlotTab: function(plotTab)
	{
		return plotTab.child().treePlot;
	},
	
	getSelectedTabId: function()
	{
		if (this.getActiveTab())
			return this.getActiveTab().child().tabId;
		return 0;
	},
	
	init : function(config) {
		var me = this;
		
		this.plotElementPanel = config.plotElementPanel;
		this.plotUI = config.plotUI;
		
		var myConf = {
				plain: true,
				bodyStyle: { background : '#dfe8f6' },
				border : false,
				defaults: {
					border: false
				},	
				tabBar:{
					items:[
					       {
					    text:'+',
					    closable: false,
					    handler:function(btn,e){
					    	var tabContent = me.addPlotTab(me.object.createNewTab(), true);
					    }
					}]
				},
				
				listeners: {
					tabchange: function(tabPanel, newCard, oldCard, eOpts ) {
						var newCardTree = this.getTreeFromPlotTab(newCard);
						var selectedNode = newCardTree.getSelectedNode();
						if (selectedNode == null)
							me.plotElementPanel.resetElement();
						else
							me.plotElementPanel.setElement(selectedNode.type,selectedNode.object, newCardTree);
						newCardTree.updateLinkedToMultiPlotMode();
					},
					scope: me
				}
		};
		
		Ext.apply (this , Ext.apply (arguments, myConf));
	}
});