/////////////////////////////////////////////////////////////////////////////////////////////
// Java-Script Library for UMG 600
// Graph-Routinen

function barover(evt){
    evt = (evt) ? evt : ((window.event) ? window.event : "");
    var elem = (evt.target) ? evt.target : evt.srcElement;
	if(elem.alt  &&elem.alt.length>=1)
	    overlib(elem.alt);
}

function barout(evt){
    evt = (evt) ? evt : ((window.event) ? window.event : "");
    var elem = (evt.target) ? evt.target : evt.srcElement;
    nd();
}

NOP = 0xFF00FF00;
function GraphImage(img){
    return {
        "type": "image",
        "src": img
    };
}

////////////////////////////////////
function AxisOption(){
    this.name = "";
    this.unit = "";
    this.min = 0;
    this.max = 0;
    this.TeilerKl = 0;
    this.TeilerGr = 0;
    this.Xpx = 0;
    this.Ypx = 0;
    this.Objs = new Array();
}

AxisOption.prototype.delta = function(){
    return Math.abs(this.max - this.min);
}
//////////////////////////////////////////////////////
var xAxisStart = 10;
var xAxisWidth = 88; // Data width
var xAxisPaddingLeft = 3;
var xAxisPaddingRight = 1;
var xBar = 0.50;

var BAR_BORDER_WIDTH = 1;

var yAxisStart = 8;
var yAxisHeight = 75;
var yAxisPaddingTop = 5;//ex 3
var yAxisPaddingBottom = 10;

if (yAxisPaddingTop > yAxisStart) {
    Error.Debug("yAxisPaddingTop>yAxisStart ! Corrected: yAxisPaddingTop=yAxisStart");
    yAxisPaddingTop = yAxisStart;
}
if (yAxisStart + yAxisHeight + yAxisPaddingTop + yAxisPaddingBottom > 100) {
    Error.Warning("CGraph: yAxis-Sizeparamters exceeds 100%! Using Std-Values.");
    yAxisStart = 8;
    yAxisHeight = 75;
    yAxisPaddingTop = 3;
    yAxisPaddingBottom = 3;
}


function CGraph(id){
    this.id = id;
    this.divNode = document.createElement("div");
    this.divNode.style.position = "absolute";
    this.divNode.style.top = "0px";
    this.divNode.style.left = "0px";
    this.divNode.style.width = "0px";
    this.divNode.style.height = "0px";
    this.divNode.style.margin = "0px";
    this.divNode.style.padding = "0px";
    this.textNode = this.divNode.cloneNode(true);
    this.bPrintXNumber = true;
    this.LegendenDiv = null;
    
    this.unit = "px";
    //Achsen:
    // y:
    this.YAxis = new AxisOption();
    this.XAxis = new AxisOption();
    this.bars = new Array();
    this.FontSize = "12pt";
    this.LineSize = "1";
    // 
}

CGraph.prototype.SetFontSize = function(size){
    var old = this.FontSize;
    this.FontSize = size;
    return old;
}
CGraph.prototype.SetLineSize = function(size){
    var old = this.LineSize;
    this.LineSize = size;
    return old;
}
CGraph.prototype.ClearBars = function(){
    for (x in this.bars) {
		if(x in Array.prototype)continue;
        for (var i = 0; i < this.bars[x].length; i++) {			
            this.el.removeChild(this.bars[x][i]);
        }
    }
    this.bars = [];
    while (this.LegendenDiv.hasChildNodes()) 
        this.LegendenDiv.removeChild(this.LegendenDiv.firstChild);
}
//CGraph.prototype.CreateBlob = function(name,count, color,border,BarShift){
CGraph.prototype.CreateDynBars = function(count, name, color, border, BarShift,suppressLegenden){
    if (!BarShift) 
        BarShift = 0;
    var oldunit = this.SetUnit("%");
    var oldfont = this.SetFontSize("8pt");
    this.bars[name] = new Array(count);
    var xBarWidth = (xAxisWidth / count);
    for (var i = 0; i < count; i++) {
        var el = this.bars[name][i] = this.Rectangle(xAxisStart + xBarWidth * i + BarShift + ((xBar * xBarWidth) / 2), 0, xBar * xBarWidth, 0);
        el.style.visibility = "hidden";
        el.style.background = color;
        el.style.borderColor = border;
        el.style.borderStyle = "solid";
        el.style.borderWidth = BAR_BORDER_WIDTH + "px";		
		el.style.zIndex =99;		
        
        addEvent(el, "mouseover", barover);
        addEvent(el, "mouseout", barout);
        
        
    }
	if (!suppressLegenden) {
		var legenChild = document.createElement("DIV");
		var legenBox = document.createElement("DIV");
		legenBox.style.width = "8px";
		legenBox.style.height = "8px";
		legenBox.style.background = color;
		legenBox.style.borderColor = border;
		legenBox.style.borderStyle = "solid";
		legenBox.style.borderWidth = BAR_BORDER_WIDTH + "px";
		legenBox.style.marginTop = "3px";
		legenBox.style.marginRight = "5px";
		legenBox.style.cssFloat = "left";
		legenBox.style.styleFloat = "left";
		legenBox.style.fontSize = "2pt";
		legenBox.style.lineHeight = "2px";
		
		legenChild.style.cssFloat = "left";
		legenChild.style.styleFloat = "left";
		legenChild.style.marginRight = "30px";
		
		legenChild.appendChild(legenBox);
		
		legenChild.appendChild(document.createTextNode(name));
		
		this.LegendenDiv.appendChild(legenChild);
	}
    this.SetUnit(oldunit);
    this.SetFontSize(oldfont);
}
/*
 *
 * @return Object Height,Top, Visibitlity
 */
CGraph.prototype._CalcBar = function(value){
    if (value == 0) {
        return {
            "Height": 0,
            "Top": 0,
            "Visibility": "hidden"
        };
    }
    //Nulldurchgang in % von DeltaY
    var NULLPosY = ((0 - this.YAxis.min) / this.YAxis.delta());
    var PosDelta = this.YAxis.delta() * (1 - NULLPosY);
    var NegDelta = this.YAxis.delta() * NULLPosY;
    // Fitting:
    if (value > this.YAxis.max) 
        value = this.YAxis.max*1.04;
    if (value < this.YAxis.min) 
        value = this.YAxis.min;
    
    if (value > 0) {
        var proOfYPos = (value - 0) / PosDelta; //this.YAxis.min
        if (NULLPosY < this.YAxis.min) 
            NULLPosY = 0;
        var h = parseInt(this.perY((1 - NULLPosY) * yAxisHeight) * proOfYPos);
        
        return {
            "Height": h,
            "Top": (this.perY(yAxisStart) + this.perY(yAxisHeight - (NULLPosY) * yAxisHeight) - h),
            "Visibility": ((h > 1) ? "visible" : "hidden")
        };
    }
    if (value < 0) {
        var proOfYPos = Math.abs(value) / NegDelta;
        var h = parseInt(this.perY(NULLPosY * yAxisHeight) * proOfYPos);
        return {
            "Height": h,
            "Top": (this.perY(yAxisStart) + this.perY(yAxisHeight - NULLPosY * yAxisHeight)),
            "Visibility": ((h > 1) ? "visible" : "hidden")
        };
    }
    if (value > 0) {
        var OffsetNull = this.YAxis.min;
        if (OffsetNull >= 0) {// Null auf linie oder unsichbar darunter
            // % von (?berstehenden) Bar auf Y-Achse
            var proOfY = (value - OffsetNull) / this.YAxis.delta();
            var h = this.perY(yAxisStart) - this.perY(yAxisPaddingTop) + parseInt(this.perY(yAxisHeight) * proOfY);
            return {
                "Height": h,
                "Top": (this.YAxis.Ypx - h),
                "Visibility": ((h > 1) ? "visible" : "hidden")
            };
            
        }
        else {
            //Verschiebung der NULL-Achse
            var NULLPosY = ((0 - this.YAxis.min) / this.YAxis.delta()) * yAxisHeight;
            var proOfY = (value - OffsetNull) / this.YAxis.delta();
            var h = this.perY(yAxisStart) - this.perY(yAxisPaddingTop) + parseInt(this.perY(yAxisHeight) * proOfY);
            return {
                "Height": h,
                "Top": (this.YAxis.Ypx - h),
                "Visibility": ((h > 1) ? "visible" : "hidden")
            };
            
        }
        
        
        
    }
    
    
    
    return {
        "Height": 0,
        "Top": 0,
        "Visibility": "hidden"
    };
}
CGraph.prototype.UpdateBar = function(i, name, value, addalt,suppressAlt){


    var _Bar = this._CalcBar(value);
    this.bars[name][i].style.visibility = _Bar.Visibility;
    if (_Bar.Height == 0) 
        _Bar.Height = 1; // IE Fix
    this.bars[name][i].style.height = (_Bar.Height - 1) + "px";
    this.bars[name][i].style.top = (_Bar.Top) + "px";

    this.bars[name][i].style.clip = "rect(0pt, " + (parseFloat(this.bars[name][i].style.width) + BAR_BORDER_WIDTH * 2) + "px, " + (_Bar.Height + BAR_BORDER_WIDTH * 2) + "px, 0pt)";
	if(suppressAlt)
		this.bars[name][i].alt = addalt
	else
	    this.bars[name][i].alt = name + " " + (i + 1) + ": <nobr>" + tlnum(value) + " " + this.YAxis.unit +"</nobr> "+ addalt;
    
}
CGraph.prototype.UpdateXAxis = function(){
    this.RemoveXAxis();
    this.DrawXAxis();
}
CGraph.prototype.RemoveXAxis = function(){
    for (var i = 0; i < this.XAxis.Objs.length; i++) {
        this.el.removeChild(this.XAxis.Objs[i]);
    }
    this.XAxis.Objs = new Array();
    
}

CGraph.prototype.UpdateYAxis = function(){
    this.RemoveYAxis();
    this.DrawYAxis();
}
CGraph.prototype.RemoveYAxis = function(){
    for (var i = 0; i < this.YAxis.Objs.length; i++) {
        this.el.removeChild(this.YAxis.Objs[i]);
    }
    this.YAxis.Objs = new Array();
    
}
CGraph.prototype.DrawYAxis = function(){
    var oldunit = this.SetUnit("%");
    var oldfont = this.SetFontSize("14pt");
    
    // Y-Achse Beschriftung
    if (typeof(this.YAxis.name) == "object" && this.YAxis.name.type == "image") {
        this.YAxis.Objs.push(this.Image(0, 1, this.YAxis.name.src));
    }
    else {
        this.YAxis.Objs.push(this.TextOutV(1, 15, 80, this.YAxis.name));
    }
    if (this.YAxis.unit != "") {
        this.SetFontSize("10pt");
        this.YAxis.Objs.push(this.TextOut(1, yAxisStart - yAxisPaddingTop - 3, 2, "[" + this.YAxis.unit + "]"));
    }
    
    // Max-Beschriftung
    this.YAxis.Objs.push(this.TextOut(xAxisStart - 10, yAxisStart, 10, tlnum(this.YAxis.max)));
    // Min-Beschriftung
    this.YAxis.Objs.push(this.TextOut(xAxisStart - 10, yAxisStart + yAxisHeight, 10, tlnum(this.YAxis.min)));
    // NULL-Beschriftung
    if (this.YAxis.min < 0 && this.YAxis.max > 0) {
        var NULLPosY = ((0 - this.YAxis.min) / this.YAxis.delta()) * yAxisHeight;
        
        this.YAxis.Objs.push(this.TextOut(xAxisStart - 2, yAxisStart + yAxisHeight - NULLPosY, 1, "0"));
        this.YAxis.Objs.push(this.LineH(xAxisStart - 2, yAxisStart + yAxisHeight - NULLPosY, xAxisWidth + 2));
    }
    this.SetFontSize("14pt");
    // Y-Achse
    this.YAxis.Objs.push(this.LineV(xAxisStart, yAxisStart - yAxisPaddingTop, yAxisHeight + yAxisPaddingTop + yAxisPaddingBottom));
    //this.LineV(xAxisStart+1, yAxisStart-yAxisPaddingTop  ,yAxisPaddingTop  )
    //this.LineV(xAxisStart+1, yAxisStart+yAxisHeight  ,yAxisPaddingBottom  )
    
    
    for (var i = 1; i <= this.YAxis.TeilerKl; i++) {
        this.YAxis.Objs.push(this.LineH(xAxisStart - 1, yAxisStart + (yAxisHeight / this.YAxis.TeilerKl) * i, 1));
    }
    for (var i = 0; i < this.YAxis.TeilerGr; i++) {
        this.YAxis.Objs.push(this.LineH(xAxisStart - 3, yAxisStart + (yAxisHeight / this.YAxis.TeilerGr) * i, 3));
        this.SetBackground("gray");
        this.YAxis.Objs.push(this.LineH(xAxisStart, yAxisStart + (yAxisHeight / this.YAxis.TeilerGr) * i, xAxisWidth));
    }
    this.SetUnit(oldunit);
    this.SetFontSize(oldfont);
}
CGraph.prototype.DrawXAxis = function(){
    var oldunit = this.SetUnit("%");
    var oldfont = this.SetFontSize("14pt");
    //x-Axis
    this.XAxis.Objs.push(this.LineH(xAxisStart - xAxisPaddingLeft, yAxisStart + yAxisHeight, xAxisWidth + xAxisPaddingLeft + xAxisPaddingRight))
    this.YAxis.Ypx = this.perY(yAxisStart + yAxisHeight);
    // Beschriftung
    this.XAxis.Objs.push(this.TextOut(xAxisStart + 20,90, 100 - xAxisStart, this.XAxis.name))
    for (var i = 0; i < this.XAxis.TeilerKl; i++) {
        this.XAxis.Objs.push(this.LineV(xAxisStart + (xAxisWidth / this.XAxis.TeilerKl) * i, yAxisStart + yAxisHeight, 1))
    }
    this.SetFontSize("8pt");
    for (var i = 0; i < this.XAxis.TeilerGr; i++) {
        this.XAxis.Objs.push(this.LineV(xAxisStart + (xAxisWidth / (this.XAxis.TeilerGr)) * (i + 1), yAxisStart + yAxisHeight - 1, 3))
		if(this.bPrintXNumber)
        this.XAxis.Objs.push(this.TextOut(xAxisStart + (xAxisWidth / this.XAxis.TeilerGr) * i, yAxisStart + yAxisHeight + 1, 2, (i + 1)))
    }
	this.SetUnit(oldunit);
    this.SetFontSize(oldfont);
}
CGraph.prototype.setYAxisUnit = function(newuint){
    this.YAxis.unit = newuint;
}
CGraph.prototype.Init = function(){
    this.el = document.getElementById(this.id);
    this.width = parseInt(this.el.style.width);
    this.height = parseInt(this.el.style.height);
    
    
    ////////////////////
    // Y-Axis
    // Unit:
    this.DrawYAxis();
    this.DrawXAxis();
    
    // Legenden Box
    this.LegendenDiv = document.createElement("DIV");
    this.LegendenDiv.id = "legende";
    this.LegendenDiv.style.position = "absolute";
    this.LegendenDiv.style.left = this.perX(xAxisStart + 1) + "px";
    this.LegendenDiv.style.top = this.perY(100 - 8) + "px";
    this.LegendenDiv.style.width = this.perX(100 - yAxisStart - xAxisPaddingRight ) + "px";
    this.LegendenDiv.style.zIndex = 220;
    
    
    this.el.appendChild(this.LegendenDiv);
}

CGraph.prototype.SetYAxis = function(name, unit, min, max){
    if ((name) != NOP) 
        this.YAxis.name = name;
    if ((unit) != NOP) 
        this.YAxis.unit = unit;
    if ((min) != NOP) 
        this.YAxis.min = min;
    if ((max) != NOP) 
        this.YAxis.max = max;
}
CGraph.prototype.SetYAxisMarkerFac = function(kl, gr){
    this.YAxis.TeilerKl = kl;
    this.YAxis.TeilerGr = gr;
}
CGraph.prototype.SetXAxis = function(name, unit, min, max){
    if ((name) != NOP) 
        this.XAxis.name = name;
    if ((unit) != NOP) 
        this.XAxis.unit = unit;
    if ((min) != NOP) 
        this.XAxis.min = min;
    if ((max) != NOP) 
        this.XAxis.max = max;
}
CGraph.prototype.SetXAxisMarkerFac = function(kl, gr){
    this.XAxis.TeilerKl = kl;
    this.XAxis.TeilerGr = gr;
}
CGraph.prototype.SetUnit = function(unit){
    var ret = this.unit;
    this.unit = unit;
    return ret;
}

CGraph.prototype.SetBackground = function(color){
    this.divNode.style.background = color;
}
/**
 * @param Percentage of Width
 * @return number of pixel
 */
CGraph.prototype.perX = function(perw){
	
    return (perw / 100) * this.width;
}
/**
 * @param Percentage of Height
 * @return number of pixel
 */
CGraph.prototype.perY = function(perw){
    
    return (perw / 100) * this.height;
}

CGraph.prototype.TextOutV = function(x1, y1, height, text){
    if (this.unit == "%") {
        x1 = this.perX(x1);
        y1 = this.perY(y1);
        height = this.perY(height);
    }
    /*OLDvar s="";
     for(var i=0;i<text.length;i++) s+=text.charAt(i)+"<br>";
     var textNode= this.textNode.cloneNode(true);
     textNode.style.left = x1+"px";
     textNode.style.top = y1+"px";
     textNode.style.width = 10+"px";
     textNode.style.fontSize = this.FontSize;
     textNode.style.lineHeight= "80%";
     textNode.style.textAlign="center";
     textNode.innerHTML = s;
     this.el.appendChild(textNode);
     */
    var node = document.createElement("DIV");
    for (var i = 0; i < text.length; i++) {
        var textNode = this.textNode.cloneNode(true);
        textNode.style.left = x1 + "px";
        textNode.style.top = y1 + (i * (parseInt(this.FontSize) * (1 / 72) * 121)) + "px";
        textNode.style.width = 10 + "px";
        textNode.style.height = height + "px";
        textNode.style.fontSize = this.FontSize;
        textNode.style.lineHeight = "80%";
        textNode.style.textAlign = "left";
        textNode.innerHTML = text.charAt(i);
        node.appendChild(textNode);
    }
    this.el.appendChild(node);
    return node;
}

CGraph.prototype.TextOut = function(x1, y1, width, text){
    if (this.unit == "%") {
        x1 = this.perX(x1);
        y1 = this.perY(y1);
        width = this.perX(width);
    }
    var textNode = this.textNode.cloneNode(true);
    textNode.style.left = x1 + "px";
    textNode.style.top = y1 + "px";
    textNode.style.width = width + "px";
    textNode.style.fontSize = this.FontSize;
    textNode.style.textAlign = "center";
    textNode.innerHTML = text;
    this.el.appendChild(textNode);
    return textNode;
}
////////////////////////////////////////////////////////////////////
// Draws a Rectangle to the Canvas:
// Parameter:
// x1,y1 - First Point, upper left
// x2,y2 - Second Point, lower right
// If SetUnit is set to "%" the pixel values will be calculated.
// Return: Created node
CGraph.prototype.Rectangle = function(x1, y1, width, height){
    if (this.unit == "%") {
        x1 = this.perX(x1);
        y1 = this.perY(y1);
        width = this.perX(width);
        height = this.perY(height);
    }
    
    var node = this.divNode.cloneNode(true);
    node.style.left = x1 + "px";
    node.style.top = y1 + "px";
    node.style.width = width + "px";
    node.style.height = height + "px";
    node.style.clip = "rect(0pt, " + (width) + "px, " + (height) + "px, 0pt)";
    this.el.appendChild(node);
    return node;
}
////////////////////////////////////////////////////////////////////
// Draws a horizontal Line to the Canvas:
// Parameter:
// x1,y1 - Start Point
// w - Length
// If SetUnit is set to "%" the pixel values will be calculated.
// Return: Created node
CGraph.prototype.LineH = function(x1, y1, w){
    if (this.unit == "%") {
        x1 = this.perX(x1);
        y1 = this.perY(y1);
        w = this.perX(w);
    }
    
    var node = this.divNode.cloneNode(true);
	factor = 1
	unit = "px"
    node.style.left = x1*factor + unit;
    node.style.top = y1*factor + unit;
    node.style.width = w*factor + unit;
    node.style.height = this.LineSize*factor + unit;
    node.style.clip = "rect(0pt, " + w*factor + unit+", " + this.LineSize*factor + unit+", 0pt)";
    node.innerHTML = " ";
    this.el.appendChild(node);
    return node;
}

/**
 * Draws a vertical Line to the Canvas:
 * Parameter:
 * x1,y1 - Start Point
 * w - Height
 * If SetUnit is set to "%" the pixel values will be calculated.
 * Return: Created node
 * @param {int} x1
 * @param {int} y1
 * @param {int} h
 * @return {DOM_Node}
 */
CGraph.prototype.LineV = function(x1, y1, h){
    if (this.unit == "%") {
        x1 = this.perX(x1);
        y1 = this.perY(y1);
        h = this.perY(h);
    }
    var node = this.divNode.cloneNode(true);
    node = this.el.appendChild(node);
    node.style.left = x1 + "px";
    node.style.top = y1 + "px";
    node.style.width = this.LineSize + "px";
    node.style.height = h + "px";
    return node;
}
CGraph.prototype.Image = function(x1, y1, src){

    if (this.unit == "%") {
        x1 = this.perX(x1);
        y1 = this.perY(y1);
    }
    var node = document.createElement("img");
    node.src = src;
    node = this.el.appendChild(node);
    node.style.position = "absolute";
    node.style.left = x1 + "px";
    node.style.top = y1 + "px";
    
    return node;
}