var _Green = '#289a1c';
var _Red = '#ce1443';
var _Yellow = '#f7901e';




function DrawBar(id, mData, tData, format, rows, dimensions, biggerIsBetter, yellowRange)
{
    Flotr.draw
		(
			$('flotr_Bar'),
			[
				{ // => first series
				    data: mData,
				    points: { show: false },
				    xaxis: 1, yaxis: 1,
				    bars: { show: true, fillOpacity: 0.90, fill: true, lineWidth: 2, barWidth: 0.8, horizontal: true, centered: false },
				    mouse: { track: true, lineColor: '#4b9052', lineWidth: 4, radius: 12 }
				}
			],
			{
			    mouse: { radius: 5, lineWidth: 4, lineColor: '#4b9052' },
			    colors: ['#636247', '#ce1443'],
			    grid:
				{
				    color: '#545454',
				    backgroundColor: null,
				    tickColor: '#f2f1e9',
				    labelMargin: 10,
				    outlineWidth: 0.15
				},
			    xaxis: { showLabels: true, tickDecimals: 0,  autoscaleMargin: 0.50 },
			    legend: { show: false },
			    yaxis:
				{
				    showLabels: true,
				    min: 0,
				    noTicks: rows,
				    tickFormatter: function(obj)
				    {
				        var idx = parseInt(obj);
				        if (idx >= dimensions.length || idx < 0)
				            return '';

				        return dimensions[idx];
				    }
				}
			}
		);

    $('flotr_Bar' + id).observe('flotr:hit',
function(evt)
{
    var dateLabel = $('fD_' + id);
    var value = $('fV_' + id);
    var target = $('fT_' + id);
    var change = $('fC_' + id);

    var n = evt.memo[0];
    var targetValue = null;
    var actualValue = evt.memo[0].x;

    if (tData != null && tData.length > n.idx)
    {
        targetValue = tData[n.idx][0];

        if (actualValue == 0)
        {
            change.innerHTML = ' - %';
        }
        else
        {
            var relChange = (actualValue - targetValue) / actualValue;
            change.innerHTML = new Number(relChange).numberFormat('0.00%');
            target.innerHTML = new Number(targetValue).numberFormat(format);
        }
        change.style.color = calculateColor(biggerIsBetter, mData[n.idx], tData[n.idx], yellowRange);
        target.style.color = calculateColor(biggerIsBetter, mData[n.idx], tData[n.idx], yellowRange);
    }

    value.innerHTML = new Number(evt.memo[0].x).numberFormat(format);

    dateLabel.innerHTML = dimensions[n.idx] + ':';
}
		);
}





function formatDate(obj)
{
    var months = new Array('Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec');
    var date = new Date(obj / 1);
    var month = months[date.getMonth()];
    if (month != null)
        month = month.toUpperCase();
    return (date.getDate()) + '-' + month + '-' + date.getFullYear();
}

function calculateColor(biggerIsBetter, mValue, tValue, yRange)
{
    if (biggerIsBetter)
    {

        if (mValue > tValue + (tValue * yRange))
            return _Green;

        if (mValue < (tValue - (tValue * yRange)))
            return _Red;

        return _Yellow;
    }
    else
    {
        if (mValue > tValue + (tValue * yRange))
            return _Red;

        if (mValue < tValue - (tValue * yRange))
            return _Green;

        return _Yellow;

    }
}