var steps = 4;
var wkendBorder = '1px dashed #CCCCCC';
var MonthNames = [TXT_JANUARY,TXT_FEBRUARY,TXT_MARCH,TXT_APRIL,TXT_MAY,TXT_JUNE,TXT_JULY,TXT_AUGUST,TXT_SEPTEMBER,TXT_OCTOBER,TXT_NOVEMBER,TXT_DECEMBER];
var MonthAbbr = [TXT_JAN,TXT_FEB,TXT_MAR,TXT_APR,TXT_MAY_SHORT,TXT_JUN,TXT_JUL,TXT_AUG,TXT_SEP,TXT_OCT,TXT_NOV,TXT_DEC];
var DayAbbr = [TXT_SUN_SHORT,TXT_MON_SHORT,TXT_TUE_SHORT,TXT_WED_SHORT,TXT_THU_SHORT,TXT_FRI_SHORT,TXT_SAT_SHORT];
var SelectedBarDate = null;
var prevMonthON = 'i/cal/left1.gif';
var prevMonthOFF = 'i/cal/leftOff.gif';
var yAxisCss = null;
var chartAreaCss = null;
var showWeekends = true;

var getElement = function(id){ return (document.all ? document.all[id] : document.getElementById(id)); }

var BarChart = $.Class.create({
	accessor: null,
	chartData: null,
	maxVal: 0,
	labelID: null,
	targetID: null,
	month: null,
	year: null,
	selectedDate: null,
	init: function (accessor, targetId, labelId) {
		this.accessor = accessor;
		this.chartData = [];
		this.maxVal = 0;
		this.labelID = labelId;
		this.targetID = targetId;
		this.month = null;
		this.year = null;
	},
	setMonthYear: function (m, y) {
		if (this.month != m || this.year != y) {
			this.month = m;
			this.year = y;
			this.selectedDate = null;
			this.chartData = [];
			var dt = new Date(this.year, this.month - 1, 1);
			while (dt.getMonth() == (this.month - 1)) {
				this.chartData.push(null);
				dt.setDate(dt.getDate() + 1);
			}
		}
	},
	clearData: function (m, y) {
		if (this.chartData) {
			for (var i = this.chartData.length; i--;) {
				this.chartData[i] = null;
			}
		}
	},
	addItem: function (item) {
		var itemDate = item.outbound.dateValue;
		if (itemDate && itemDate.getMonth() == this.month - 1 && itemDate.getFullYear() == this.year) {
			var index = itemDate.getDate() - 1;
			if (this.chartData && (this.chartData[index] == null ||
				item.value < this.chartData[index].value)) {
				this.chartData[index] = item;
			}
		}
	},
	drawChart: function () {
		var container = getElement(this.targetID);
		if (!container)
			return;

		this.writeMonthLabel(this.month, this.year);
		this.setMaxVal();

		var html = '';
		html += '<div ' + (yAxisCss ? 'class="' + yAxisCss + '"' : 'style="float:left;width:5%;"') + '>' + this.getYAxisHtml() + '</div>';
		html += '<div ' + (chartAreaCss ? 'class="' + chartAreaCss + '"' : 'style="float:left;width:94%;"') + '>' + this.getChartHtml(this.month, this.year) + '</div>';
		container.innerHTML = html;
	},
	writeMonthLabel: function (m, y) {
		var monthLabel = getElement(this.labelID);
		if (!monthLabel) { return; }

		var now = new Date();
		var nextImg = IMG_ROOT + 'i/cal/right1.gif';
		var prevImg = '';
		var prevCss = '';
		var prevClick = 'void(0)';
		if (m == (now.getMonth() + 1) && y == now.getFullYear()) {
			prevImg = IMG_ROOT + prevMonthOFF;
			prevCss = '';
			prevClick = 'void(0)';
		}
		else {
			prevImg = IMG_ROOT + prevMonthON;
			prevCss = 'monthButton';
			prevClick = this.accessor + '.prevMonth()'
		}

		var prevMonth = '<img src="' + prevImg + '" onclick="' + prevClick + '" class="' + prevCss + '" align="absmiddle" />';
		var nextMonth = '<img src="' + nextImg + '" onclick="' + this.accessor + '.nextMonth()" class="monthButton" align="absmiddle" />';
		monthLabel.innerHTML = prevMonth + '&nbsp; ' + MonthNames[(m - 1)] + ' ' + y + ' &nbsp;' + nextMonth;
	},
	setMaxVal: function () {
		this.maxVal = 0;
		for (var i = 0; i < this.chartData.length; i++) {
			if (this.chartData[i] && this.chartData[i].value > this.maxVal)
				this.maxVal = this.chartData[i].value;
		}

		var power = parseInt((Math.log(this.maxVal)) / (Math.log(10))) - 1;
		var factor = (power == 0 ? 5 : Math.pow(10, power));
		this.maxVal = Math.ceil(this.maxVal / (steps * factor)) * (steps * factor);
	},
	getYAxisHtml: function () {
		var yAxisHtml = '';
		if (isNaN(this.maxVal)) { return '&nbsp;'; }

		var interval = this.maxVal / steps;
		for (var i = steps; i > 0; i--) {
			var val = parseInt(interval * i);
			yAxisHtml += '<div class="horizBar">' + val + '&nbsp;</div>';
		}
		return yAxisHtml;
	},
	getChartHtml: function (m, y) {
		var barHtml = '<table class="chartTable" cellpadding="0" cellspacing=0><tr>';
		var labelHtml = '<table class="labelTable" cellpadding=0 cellspacing=0><tr>';
		var maxHeight = steps * 40;
		for (var i = 0; i < this.chartData.length; i++) {
			var height = 0;
			var date = new Date(y, (m - 1), (i + 1));
			var item = this.chartData[i];
			var barCSS = 'bar';
			var barDiv = '&nbsp;';
			var extraProps = '';

			dayOfWeek = date.getDay();
			if (showWeekends && (dayOfWeek == 6 || dayOfWeek == 0)) {
				barCSS = 'weekendBar';
				var border = (dayOfWeek == 0 ? 'border-right:' + wkendBorder : 'border-left:' + wkendBorder);
				extraProps += ' style="' + border + '"';
			}

			if (this.selectedDate && date.getDate() == this.selectedDate) {
				barCSS = 'dayBar';
			}

			if (item != null) {
				height = Math.ceil(maxHeight * (item.value / this.maxVal));
				if (height > 0) {
					barDiv = '<div class="barOuter"><div class="' + barCSS + '"';
					barDiv += ' style="height:' + height + 'px;"';
					barDiv += ' onmouseover="showTooltip(this, ' + this.accessor + '.getTooltipHtml(' + i + '), event)"';
					barDiv += ' onclick="' + this.accessor + '.setDate(' + date.getDate() + ');hideTooltip(event);"></div></div>';
				}
			}

			var labelCss = 'labelCell';
			if (barDiv == '&nbsp;' || barDiv.length == 0) { labelCss += ' labelCellOff'; }

			labelHtml += '<td class="' + labelCss + '">' + date.getDate() + '</td>';
			barHtml += '<td class="barCell"' + extraProps + '>' + barDiv + '</td>';
		}

		labelHtml += '</tr></table>';
		barHtml += '</tr></table>';

		return (barHtml + labelHtml);
	},
	setSelectedDay: function (date) {
		if (this.selectedDate != date) { this.selectedDate = date; }
	}
});


var MonthChart = $.Class.create({
	accessor:null,
	chartData:null,
	maxVal:0,
	targetID:null,
	init: function(accessor, targetId){
		this.accessor = accessor;
		this.chartData = {};
		this.maxVal = 0;
		this.targetID = targetId;
	},
	addData: function(data){
		var len = data.length;
		for(var i = 0; i < len; i++){
			var item = data[i];
			var itemDate = Date.parseDate(item.outbound.date);
			if(itemDate){
				var monthVal = itemDate.getMonth() + '-' + itemDate.getFullYear();
				if(this.chartData && (this.chartData[monthVal] == null ||
					item.value < this.chartData[monthVal].value)){
					this.chartData[monthVal] = item;
				}
			}
		}
	},
	drawChart: function(){
		var container = getElement(this.targetID);
		if(!container){ return; }
		this.setMaxVal();
		var html = '';
		html += '<div ' + (yAxisCss ? 'class="' + yAxisCss + '"' : 'style="float:left;width:5%;"') + '>' + this.getYAxisHtml() + '</div>';
		html += '<div ' + (chartAreaCss ? 'class="' + chartAreaCss + '"' : 'style="float:left;width:94%;"') + '>' + this.getChartHtml() + '</div>';
		container.innerHTML = html;
	},
	setMaxVal: function(){
		this.maxVal = 0;
		var date = new Date();
		for(var index in this.chartData){
			var item = this.chartData[index];
			if(item && item.value > this.maxVal){ this.maxVal = item.value; }
		}
		var power = parseInt((Math.log(this.maxVal))/(Math.log(10))) - 1;
		var factor = (power == 0 ? 5 : Math.pow(10, power));
		this.maxVal =  Math.ceil(this.maxVal/(steps*factor))*(steps*factor);
	},
	getYAxisHtml: function(){
		var yAxisHtml = '';
		if(isNaN(this.maxVal)){ return '&nbsp;'; }
		var interval = this.maxVal/steps;
		for(var i = steps; i > 0; i--){
			var val = parseInt(interval*i);
			yAxisHtml += '<div class="horizBar">' + val + '&nbsp;</div>';
		}
		return yAxisHtml;
	},
	getChartHtml: function(){
		var barHtml = '<table class="chartTable" cellpadding="0" cellspacing=0><tr>';
		var labelHtml = '<table class="labelTable" cellpadding=0 cellspacing=0><tr>';
		var maxHeight = steps*40;
		var date = (window['SEARCH_TIME'] ? new Date(window['SEARCH_TIME'].getTime()) : new Date());
		date.setDate(1);
		for(var i = 0; i < 12; i++){
			var monthVal = date.getMonth() + '-' + date.getFullYear();
			var height = 0;
			var item = this.chartData[monthVal];
			var barCSS = 'barMonth';
			var barDiv = '&nbsp;';

			if(item != null){
				height = Math.ceil(maxHeight*(item.value/this.maxVal));
				if(height > 0){
					var monthPath = MonthNames[date.getMonth()] + '-' + date.getFullYear();
					var url = MONTH_GRAPH_TARGET + '.htm';
					url = url.replace('%1', monthPath);
					barDiv = '<div class="barOuter"><div class="' + barCSS + '"';
					barDiv += ' style="height:' + height + 'px;"';
					barDiv += ' onmouseover="showTooltip(this, getGraphTooltip(\'' + monthVal + '\'), event)"';
					barDiv += ' onclick="goToUrl(\'' + url + '\')"></div></div>';
				}
			}
			
			var labelCss = 'labelCell';
			if(barDiv == '&nbsp;' || barDiv.length == 0){ labelCss += ' labelCellOff'; }
			
			var labelText = '<div class="month">' + MonthAbbr[date.getMonth()] + '</div><div class="year">' + date.getFullYear() + '</div>';
			labelHtml += '<td class="' + labelCss + '">' + labelText + '</td>';
			barHtml += '<td class="barCell">' + barDiv + '</td>';
			date.setMonth(date.getMonth() + 1);
		}
		
		labelHtml += '</tr></table>';
		barHtml += '</tr></table>';

		return (barHtml + labelHtml);
	}
});


var goToUrl = function(url){ document.location.href = url; };
