/**
 * Project   : AMDA-NG
 * Name      : PlotTabResultUI.js
 * @class    amdaUI.PlotTabResultUI
 * @extends  Ext. panel.Panel
 * @brief    Plot Tab Result UI definition (View)
 * @author    
 * @version  $Id: PlotTabResultUI.js benjamin $
 ********************************************************************************
 *    FT Id     :   Date   : Name - Description
 *******************************************************************************
 *              
 */

Ext.define('amdaUI.PlotTabResultUI', {
    extend: 'Ext.panel.Panel',
 
    alias: 'widget.plotTabResult',

    requires: [
        'amdaUI.InteractiveIntervalPlugin',
        'amdaPlotComp.PlotContextManager'
    ],
    
    panelImage : null,
    crtContext : null,
    
    constructor: function(config) {
        this.addEvents({'pagesize':true});
        
        this.init(config);	 
        this.callParent(arguments);	 
    },  
    
    getImageSize : function() {
    	if (!this.crtContext)
    		return {
    			width : 0,
    			height : 0
    		};
    		
    	return  {
    			width  : this.crtContext.page.width * this.sliderPage.getValue()/100.,
    			height : this.crtContext.page.height * this.sliderPage.getValue()/100.
	    } 
    },
    
    getImageUrl: function(resultFolder, plotFile) {
    	return 'data/'+sessionID +'/RES/'+resultFolder+ '/' + plotFile;
    },
    
    toPixelOnSourceImage : function(value) {
		return value*100/this.sliderPage.getValue();
	},
	
	toPixelOnResultImage : function(value) {
		return value*this.sliderPage.getValue()/100;
	},
	
    createPlotImage: function(resultFolder, plotFile) {
    	var me = this;
    	var size = this.getImageSize();
    	this.panelImage = Ext.create('amdaPlotComp.PlotResultImage', {
            src    : this.getImageUrl(resultFolder, plotFile),
            width  : size.width,
            height : size.height,
			onMouseMove : function(x, y) {
				if (!me.crtContext)
					return;
				
				var sourceXPos = me.toPixelOnSourceImage(x);
				var sourceYPos = me.toPixelOnSourceImage(y);
				var panel = amdaPlotComp.PlotContextManager.getPanel(me.crtContext, sourceXPos, sourceYPos);
				var text = '';
				if (me.panelImage)
				{
					if (!panel)
					{
						me.panelImage.resetCursor();
						text += 'No panel';
					}
					else
					{
						text += 'Panel Id : ';
						text += panel.id;
						if (amdaPlotComp.PlotContextManager.isInPlotArea(panel, sourceXPos, sourceYPos))
						{
							/*me.panelImage.updateCursor(
								me.toPixelOnResultImage(panel.plotArea.x),
								me.toPixelOnResultImage(panel.plotArea.y),
								me.toPixelOnResultImage(panel.plotArea.width),
								me.toPixelOnResultImage(panel.plotArea.height),
								x, y);*/
							me.panelImage.updateCursor(
									me.toPixelOnResultImage(0),
									me.toPixelOnResultImage(0),
									me.toPixelOnResultImage(me.crtContext.page.width),
									me.toPixelOnResultImage(me.crtContext.page.height),
									x, y);
							
							var xText = '';
							var yLeftText = '';
							var yRightText = '';
							Ext.each(panel.plotArea.axes, function (axis) {
								switch (axis.id)
								{
								case 'timeAxis':
									var crtTimestamp = amdaPlotComp.PlotContextManager.toAxisValue(axis, panel.plotArea.x, panel.plotArea.x+panel.plotArea.width, sourceXPos);
									var crtTime = new Date(crtTimestamp*1000);
									xText = crtTime.toJSON();
									break;
								case 'y-left' :
									yLeftText = parseFloat(amdaPlotComp.PlotContextManager.toAxisValue(axis, panel.plotArea.y+panel.plotArea.height, panel.plotArea.y, sourceYPos).toPrecision(2));
									break;
								case 'y-right' :
									yRightText = parseFloat(amdaPlotComp.PlotContextManager.toAxisValue(axis, panel.plotArea.y+panel.plotArea.height, panel.plotArea.y, sourceYPos).toPrecision(2));
									break;
								case 'xaxis_id' :
									xText = parseFloat(amdaPlotComp.PlotContextManager.toAxisValue(axis, panel.plotArea.x, panel.plotArea.x+panel.plotArea.width, sourceXPos).toPrecision(2));
									break;
								case 'epochAxis' :
									//
									xText = 'ToDo';
									break;
								}
								
							});
							
							if (xText != '')
								text += (', X : '+xText);
							if (yLeftText != '')
								text += (', Y Left : '+yLeftText);
							if (yRightText != '')
								text += (', Y Right : '+yRightText);
						}
						else
							me.panelImage.resetCursor();
					}
				}
				me.coordinatesField.setText(text);
			},
			onClick : function(x, y) {
				//console.log('position : '+me.toPixelOnSourceImage(x)+', '+me.toPixelOnSourceImage(y));
			},
        });

        return this.panelImage;
    },
    
    updatePlotImage: function(configResult) {
    	this.crtContext = configResult.context;
    	
    	this.panelImage.setSrc(this.getImageUrl(configResult.folder, configResult.plotFile));
    	
    	var size = this.getImageSize();
    	this.panelImage.setSize(size.width, size.height);
    	
    	this.panelImage.refreshMe();
    },
    
    init: function(configResult){
    	this.crtContext = configResult.context;
    	
        this.coordinatesField = new Ext.toolbar.TextItem({
            width: 300,
            text : ''
        });
    	
    	this.sliderPage = new Ext.slider.Single({
            width: 130,
            value: 75,
            increment: 5,
            minValue: 50,
            maxValue: 100,
            fieldLabel : 'Resize',
            labelWidth : 40,
            listeners: {
        		scope : this,
                changecomplete: function(s, v)
                {
        			//ToDo - this.resetMire();
        			var size = this.getImageSize();	 
        			this.panelImage.width  = size.width;
        			this.panelImage.height = size.height;
        			this.panelImage.doComponentLayout();
        			this.fireEvent('pagesize',this,v);
                }
            }
        });
    	
    	var mouseToolbar = {
    		xtype: 'toolbar',
    		height: 25,
            dock: 'bottom',
            items:[
                   this.coordinatesField,
                   this.sliderPage
            ]
    	};
            
    	
    	var plotResultTabPanelConfig = {
    			preventHeader : true,
                autoScroll: true,       
                items: [
                        this.createPlotImage(configResult.folder, configResult.plotFile)
                ],
                dockedItems: [mouseToolbar]
    	};
            
    	Ext.apply(this , plotResultTabPanelConfig);	
    }
});