var ChartCanvasManager = function(type,CHART_OPTIONS){
	var YmaxValue=CHART_OPTIONS.ymax;
	var timeFormat=CHART_OPTIONS.timeFormat;
	var yLable = CHART_OPTIONS.yLable ? CHART_OPTIONS.yLable : '';
	var xMin = CHART_OPTIONS.xMin ? CHART_OPTIONS.xMin : null;
	var xMax = CHART_OPTIONS.xMax ? CHART_OPTIONS.xMax : null;
	var fontColor=CHART_OPTIONS.fontcolor?CHART_OPTIONS.fontcolor:'#000000';
	var gridColor=CHART_OPTIONS.gridcolor?CHART_OPTIONS.gridcolor:'#CCCCCC';
	var module=CHART_OPTIONS.module?CHART_OPTIONS.module:'';
	var xAxisMode = CHART_OPTIONS.xAxisMode=='number' ? null: 'time';
	var clickable = CHART_OPTIONS.clickable ? CHART_OPTIONS.clickable : false;

	var YmaxValueObj;
	var bar_width='';
	
	var series={lines: { show: true }};
	switch(type){
	case 'line' :
		series={lines: { show: true }};
	break;
	case 'bar':
		if(xAxisMode=='time')
			series={bars: {show: true,barWidth:60*60*1000}};
		else
			series={bars: {show: true}};	
	break;
	case 'scatter':
		series={points: { show: true, radius: 1.5}};
	break;
	case 'pie':
		series= {pie: { show: true}};						
	}

	
	
	if(YmaxValue)
		YmaxValueObj={max:YmaxValue,min:0};
	else
		YmaxValueObj={min:0};
	
	this.options = { 
  		    series: series,
  		    yaxis:YmaxValueObj,
  		    
            grid: { 
		        hoverable: true,
		        clickable: clickable,
		        borderColor:gridColor, 
		        borderWidth: 1,
		        color: fontColor,
		        tickColor: gridColor
		        
		        
	            } ,
	        xaxis:{ 
            	mode: xAxisMode,
                timeformat: timeFormat,
                min:xMin,
                max:xMax
               },
           yaxis:{
  	     		 
  	     		labelWidth:25
	
  	     	},
	        legend: {
	        	show: false
	        	    
	        	  }
            
       };
	
	this.drawLineChart=function(cont,data){
		$.plot( $( cont ), data, this.options ); 
		var previousPoint = null;
		var toolTextString='';
		$(  $( cont ) ).bind( "plothover", function ( event, pos, item ){
	        if( item ){
	        	
	                     if( previousPoint != item.dataIndex ){
	                         previousPoint = item.dataIndex;
	                         $("#canvasTooltip").remove();
	                         var timeX;
	                         var hours;
	                         var minutes;
	                         var day ='';
	                         var x ;
	                         var y ;
	                        if(xAxisMode=='time'){
	                        	 timeX = new Date(item.datapoint[0]);
	 	                         hours = timeX.getUTCHours() > 9 ? timeX.getUTCHours() : '0' + timeX.getUTCHours();
	 							 minutes = timeX.getUTCMinutes() > 9 ? timeX.getUTCMinutes() : '0' + timeX.getUTCMinutes();
	 	                         if(module=='test')
		                        	   day=MONTHS[timeX.getUTCMonth()]+" "+timeX.getUTCDate();
	 	                        x = hours+":"+minutes;
	                        }else{
	                        	x = item.datapoint[0];
	                        }
	                      
	                         
	                        y = item.datapoint[1];
	                         	switch(type){
	                        	case 'line' :
	                        		if(item.series.label!="")
	                        			toolTextString = item.series.label+", "+day+ " "+x+" , "+y+" "+yLable;
	                        		else
	                        			toolTextString = day+ " "+x+" , "+y+" "+yLable;
	                        		
	                        		if(module=='report'&&item.series.label!=""){
		                        		 toolTextString = item.series.label+" "+x+", "+y.toFixed(1)+" "+yLable;
		                        	}
	                        	break;
	                        	case 'bar':
	                        		 toolTextString = x+", "+item.series.label.avg+": "+day+ " "+y.toFixed(1)+" "+yLable;
	                        	if(module=='test'){
	                        		if(item.seriesIndex==0){
	                        			toolTextString = item.series.label.Down+": "+day+ " "+x+", "+y.toFixed(1)+" "+yLable;
	                        		}else{
	                        			toolTextString = x+", "+item.series.label.avg+": "+day+ " "+y.toFixed(1)+" "+yLable;
	                        			
	                        		}
	                        	}
	                        	if(module=='report'){
	                        		 toolTextString = item.series.label+" "+x+", "+y.toFixed(1)+" "+yLable;
	                        	}
	                        		  
	                            break;
	                        	case 'scatter' :
	                        			toolTextString = item.series.label+", "+x+", "+y+" "+yLable;
	                        	break;
	                        	
	                        		
	                        }
	                         
	                         
	                        showTooltip( item.pageX, item.pageY,toolTextString, item.series.color );
	                     } 
	        }
	                 else {
	                     $("#canvasTooltip").remove();
	                     previousPoint = null;            
	                 }     
	       } );

	    $($( cont )).bind("plotclick", function (event, pos, item) {
	      console.log(item.series.data[item.dataIndex][2])
	    	PortletLoader.loadChartFromPortlet([item.series.objId, "drilldown", item.series.data[item.dataIndex][2]])
	      
	        
	    });
	};
   
this.drawPieChart=function(cont,data){
	
	
	drawCanvasPie( cont, data
				   /*[ { value: 600, color: '#FF6666', lable: 'Series 1' }, 
				     { value: 100, color: '#6666FF', lable: 'Series 2' }
					
				   ]*/
				);
};	
var showTooltip=function( x, y, toolTextString, color ){
              $('<div id="canvasTooltip"><b>' +  toolTextString + '</b></div>').css( {
                  position: 'absolute',
                  display: 'none',
                  top: y - 25,
                  left: x - 80,
                  border: '1px solid ' + color,
                  padding: '2px',
                  color:"#FFFFFF",
                  backgroundColor: color,
                  opacity: 0.80,
                  zIndex:10000
              }).appendTo("body").bind( "mouseover", function(){ $("#canvasTooltip").remove(); } ).show();
          }	
}