function drawLine(pntFromX, pntFromY, pntToX, pntToY) {
    context.moveTo(pntFromX / (3 - canvasScale), pntFromY / (3 - canvasScale));
    context.lineTo(pntToX / (3 - canvasScale), pntToY / (3 - canvasScale));
}

//Draw Functions


function drawArrowUtil(isBot, pntFrom, pntTo) {

    cont = contextI;
    if (isBot) cont = context;

    cont.beginPath();


    var X1 = pntFrom.x / (3 - canvasScale);
    var Y1 = pntFrom.y / (3 - canvasScale);
    var X2 = pntTo.x / (3 - canvasScale);
    var Y2 = pntTo.y / (3 - canvasScale);

//    if ((Y2 - Y1) * (Y2 - Y1) + (X2 - X1) * (X2 - X1) < 100 * (3 - canvasScale) * (3 - canvasScale)) {
//        return;
//    }


    cont.moveTo(pntFrom.x / (3 - canvasScale), pntFrom.y / (3 - canvasScale));
    cont.lineTo(pntTo.x / (3 - canvasScale), pntTo.y / (3 - canvasScale));
    cont.stroke();
    cont.closePath();

    w = parseInt(cont.lineWidth);

    if (w == 3) w = 4;
    if (w == 1 ) w = 3;

    var arrowHeight = 3 * w;
    var arrowWidth = w + 2;
    var angle = Math.atan2(Y2 - Y1, X2 - X1);

    Px1 = X2 - arrowHeight * Math.cos(angle) - arrowWidth * Math.sin(angle);
    Py1 = Y2 - arrowHeight * Math.sin(angle) + arrowWidth * Math.cos(angle);

    Px2 = X2 - arrowHeight * Math.cos(angle) + arrowWidth * Math.sin(angle);
    Py2 = Y2 - arrowHeight * Math.sin(angle) - arrowWidth * Math.cos(angle);


    if ((Y2 - Y1) * (Y2 - Y1) + (X2 - X1) * (X2 - X1) > 625 * canvasScale)
    {

    var SaveColorB = cont.fillStyle;
    cont.fillStyle = cont.strokeStyle;

    cont.beginPath();
    cont.moveTo(pntTo.x / (3 - canvasScale), pntTo.y / (3 - canvasScale));
    cont.lineTo(Px1, Py1);
    cont.lineTo(Px2, Py2);
    cont.lineTo(pntTo.x / (3 - canvasScale), pntTo.y / (3 - canvasScale));
    cont.fill();
    cont.closePath();
    cont.fillStyle = SaveColorB;

    cont.beginPath();
    cont.moveTo(pntTo.x / (3 - canvasScale), pntTo.y / (3 - canvasScale));
    cont.lineTo(Px1 , Py1);
    cont.lineTo(Px2 , Py2 );
    cont.lineTo(pntTo.x / (3 - canvasScale), pntTo.y / (3 - canvasScale));
    cont.stroke();
    cont.closePath();
} else {
    drawLineUtil(isBot, pntFrom, pntTo);
}
    
};


function drawLineUtil(isBot, pntFrom, pntTo) {

    cont = contextI;
    if (isBot) cont = context;

    cont.beginPath();

    cont.moveTo(pntFrom.x / (3 - canvasScale), pntFrom.y / (3 - canvasScale));
    cont.lineTo(pntTo.x / (3 - canvasScale), pntTo.y / (3 - canvasScale)) ;
    cont.stroke();

    cont.closePath();
};

function drawLineUtil4(isBot, pntFromX, pntFromY, pntToX, pntToY) {

    cont = contextI;
    if (isBot) cont = context;
    

 //    context.lineCap = "round";

    // context.beginPath();
    cont.moveTo(pntFromX, pntFromY);
    cont.lineTo(pntToX, pntToY);
    //context.stroke();
    //context.closePath();
};


function drawRectUtil(isBot, isFilled, _pntFrom, _pntTo) {

    cont = contextI;
    if (isBot) cont = context;

    cont.beginPath();

    var pntFromX = Math.min(_pntFrom.x, _pntTo.x);
    var pntToX = Math.max(_pntFrom.x, _pntTo.x);
    var pntFromY = Math.min(_pntFrom.y, _pntTo.y);
    var pntToY = Math.max(_pntFrom.y, _pntTo.y);

    if (isFilled == 1) {
        cont.fillRect(pntFromX / (3 - canvasScale), pntFromY / (3 - canvasScale),
            pntToX / (3 - canvasScale) - pntFromX / (3 - canvasScale),
            pntToY / (3 - canvasScale) - pntFromY / (3 - canvasScale));
    }

    cont.strokeRect(pntFromX / (3 - canvasScale), pntFromY / (3 - canvasScale),
        pntToX / (3 - canvasScale) - pntFromX / (3 - canvasScale),
         pntToY / (3 - canvasScale) - pntFromY / (3 - canvasScale));

    cont.closePath();


};


function drawRoundRectUtil(isBot, isFilled, _pntFrom, _pntTo) {

    cont = contextI;
    if (isBot) cont = context;

    var pntFrom = { x: Math.min(_pntTo.x / (3 - canvasScale), _pntFrom.x / (3 - canvasScale)), y: Math.min(_pntTo.y / (3 - canvasScale), _pntFrom.y / (3 - canvasScale)) };
    var pntTo = { x: Math.max(_pntTo.x / (3 - canvasScale), _pntFrom.x / (3 - canvasScale)), y: Math.max(_pntTo.y / (3 - canvasScale), _pntFrom.y / (3 - canvasScale)) };

    if (isFilled==1) fillRoundRectUtil(isBot, pntFrom, pntTo);


    if (Math.abs(pntTo.x - pntFrom.x) > 12 && Math.abs(pntTo.y - pntFrom.y) > 12) {

        cont.beginPath();
        var distance = 6;

        drawLineUtil4(isBot, pntFrom.x + 5, pntFrom.y, pntTo.x - 5, pntFrom.y);
        drawLineUtil4(isBot, pntFrom.x + 5, pntTo.y, pntTo.x - 5, pntTo.y);
        drawLineUtil4(isBot, pntFrom.x, pntFrom.y + 5, pntFrom.x, pntTo.y - 5);
        drawLineUtil4(isBot, pntTo.x, pntFrom.y + 5, pntTo.x, pntTo.y - 5);


        cont.moveTo(pntFrom.x, pntFrom.y + 6);
        cont.arc(pntFrom.x + 6, pntFrom.y + 6, distance, Math.PI, 3 * Math.PI / 2, false);

        cont.moveTo(pntTo.x - 6, pntFrom.y);
        cont.arc(pntTo.x - 6, pntFrom.y + 6, distance, 3 * Math.PI / 2, 2 * Math.PI, false);

        cont.moveTo(pntFrom.x + 6, pntTo.y);
        cont.arc(pntFrom.x + 6, pntTo.y - 6, distance, Math.PI / 2, Math.PI, false);

        cont.moveTo(pntTo.x, pntTo.y - 6);
        cont.arc(pntTo.x - 6, pntTo.y - 6, distance, 0, Math.PI / 2, false);

        cont.stroke();

        cont.closePath();
    } else {
       // cont.beginPath();
       // cont.strokeRect(pntFrom.x, pntFrom.y, pntTo.x - pntFrom.x - 2 * cont.lineWidth, pntTo.y - pntFrom.y - 2 * cont.lineWidth);
        // cont.closePath();
        drawCircleUtil(isBot, isFilled, _pntFrom, _pntTo);
    }

};

function fillRoundRectUtil(isBot, pntFrom, pntTo) {

    cont = contextI;
    if (isBot) cont = context;


    if (Math.abs(pntTo.x - pntFrom.x) > 12 && Math.abs(pntTo.y - pntFrom.y) > 12)
    {
        cont.beginPath();
        var distance = 6;
        var w = Math.abs(pntTo.x - pntFrom.x)
        var h = Math.abs(pntTo.y - pntFrom.y);

        cont.beginPath();

        cont.fillRect(pntFrom.x, pntFrom.y + distance, w+1, h - 2 * distance+1);
        cont.fillRect(pntFrom.x + distance, pntFrom.y, w - 2 * distance, h);

        cont.closePath();

        cont.beginPath();

        cont.moveTo(pntFrom.x, pntFrom.y + 6);
        cont.arc(pntFrom.x + 6, pntFrom.y + 6, distance, 0, 2 * Math.PI, false);

        cont.moveTo(pntTo.x - 6, pntFrom.y);
        cont.arc(pntTo.x - 6, pntFrom.y + 6, distance, 0, 2 * Math.PI, false);

        cont.moveTo(pntFrom.x + 6, pntTo.y);
        cont.arc(pntFrom.x + 6, pntTo.y - 6, distance, 0, 2 * Math.PI, false);

        cont.moveTo(pntTo.x, pntTo.y - 6);
        cont.arc(pntTo.x - 6, pntTo.y - 6, distance, 0, 2 * Math.PI, false);

        cont.fill();


        cont.closePath();
    } else {
        cont.fillRect(pntFrom.x + cont.lineWidth, pntFrom.y + cont.lineWidth, pntTo.x - pntFrom.x - 2 * cont.lineWidth, pntTo.y - pntFrom.y - 2 * cont.lineWidth);
    }

}

function drawCircleUtil(isBot, isFilled, _pntFrom, _pntTo) {

    cont = contextI;
    if (isBot) cont = context;
    

    pntFrom = { x: 0, y: 0 };
    pntTo = { x: 0, y: 0 };

    pntFrom.x = _pntFrom.x / (3 - canvasScale);
    pntFrom.y = _pntFrom.y / (3 - canvasScale);
    pntTo.x = _pntTo.x / (3 - canvasScale);
    pntTo.y = _pntTo.y / (3 - canvasScale);

    var centerX = Math.min(pntFrom.x, pntTo.x);
    var centerY = Math.min(pntFrom.y, pntTo.y);

    var w = Math.abs(pntFrom.x - pntTo.x);
    var h = Math.abs(pntFrom.y - pntTo.y);  

    if (isFilled) {
        drawEllipse(cont, centerX, centerY, w, h, true);
    }

    drawEllipse(cont, centerX, centerY, w, h, false);    

}

function drawEllipse(ctx, x, y, w, h, isFilled) {
    var kappa = .5522848;
    ox = (w / 2) * kappa, // control point offset horizontal
      oy = (h / 2) * kappa, // control point offset vertical
      xe = x + w,           // x-end
      ye = y + h,           // y-end
      xm = x + w / 2,       // x-middle
      ym = y + h / 2;       // y-middle

    ctx.beginPath();
    ctx.moveTo(x, ym);
    ctx.bezierCurveTo(x, ym - oy, xm - ox, y, xm, y);
    ctx.bezierCurveTo(xm + ox, y, xe, ym - oy, xe, ym);
    ctx.bezierCurveTo(xe, ym + oy, xm + ox, ye, xm, ye);
    ctx.bezierCurveTo(xm - ox, ye, x, ym + oy, x, ym);
    ctx.closePath();
    if (isFilled) {
        ctx.fill();
    }
    else {
        ctx.stroke();
    }
}


function drawCircleUtil_saved(isBot, isFilled, _pntFrom, _pntTo) {

    cont = contextI;
    if (isBot) cont = context;


    pntFrom = { x: 0, y: 0 };
    pntTo = { x: 0, y: 0 };

    pntFrom.x = _pntFrom.x / (3 - canvasScale);
    pntFrom.y = _pntFrom.y / (3 - canvasScale);
    pntTo.x = _pntTo.x / (3 - canvasScale);
    pntTo.y = _pntTo.y / (3 - canvasScale);

    var centerX = Math.max(pntFrom.x, pntTo.x) - Math.abs(pntFrom.x - pntTo.x) / 2;
    var centerY = Math.max(pntFrom.y, pntTo.y) - Math.abs(pntFrom.y - pntTo.y) / 2;

    if (isFilled == 1) {
        cont.beginPath();
        var distance = Math.sqrt(Math.pow(pntFrom.x - pntTo.x, 2) + Math.pow(pntFrom.y - pntTo.y, 2));
        cont.arc(centerX, centerY, distance / 2, 0, Math.PI * 2, true);
        cont.fill();
        cont.closePath();
    }

    cont.beginPath();
    var distance = Math.sqrt(Math.pow(pntFrom.x - pntTo.x, 2) + Math.pow(pntFrom.y - pntTo.y, 2));
    cont.arc(centerX, centerY, distance / 2, 0, Math.PI * 2, true);
    cont.stroke();
    cont.closePath();

}

var savedLineWidth = -1
var savedCenterX = -1;
var savedCenterY = -1;

function DrawCursorUtil(Center, action) {


    if (savedCenterX >= 0) {
        contextI.clearRect(savedCenterX / (3 - canvasScale) - canvasScale * savedLineWidth, savedCenterY / (3 - canvasScale) - canvasScale * savedLineWidth,
             2 * canvasScale * savedLineWidth, 2 * canvasScale * savedLineWidth);
    }

    savedCenterX = Center.x;
    savedCenterY = Center.y;

    savedLineWidth = contextI.lineWidth;
    contextI.lineWidth = 1;
    savedLineColor = contextI.strokeStyle;
    savedFillolor = contextI.fillStyle;

    if (action != 2) {
        contextI.fillStyle = contextI.strokeStyle;
        
    }
    else {
        savedLineColor = contextI.strokeStyle;
        contextI.strokeStyle = "#9400D3";    // canvasPainter.erzWidth
    }

    contextI.beginPath();


    if(action==2)
     {
//        contextI.strokeStyle = 'navy';
//        contextI.strokeRect(Center.x / (3 - canvasScale) - canvasPainter.erzWidth * canvasScale / 2, Center.y / (3 - canvasScale) - canvasPainter.erzWidth * canvasScale / 2, 
//            canvasPainter.erzWidth * canvasScale, canvasPainter.erzWidth * canvasScale);
             
    }
    else if (action == 5)
     {
        //contextI.fillStyle = 'white';
        //contextI.strokeStyle = 'black';
         contextI.fillRect(Center.x / (3 - canvasScale) - savedLineWidth / 2, Center.y / (3 - canvasScale) - savedLineWidth / 2, 
            parseInt(savedLineWidth), parseInt(savedLineWidth));
    }
     else if (action == 1 || action == 3 || action == 7 || action == 6 || action == 0 || action == 4) {
        var distance = savedLineWidth/2;
        contextI.arc(Center.x / (3 - canvasScale), Center.y / (3 - canvasScale), distance, 0, Math.PI * 2, true);
        contextI.fill();
    }

    contextI.closePath();       
    contextI.strokeStyle = savedLineColor;
    contextI.fillStyle = savedFillolor;  
    contextI.lineWidth = savedLineWidth;
}


function drawPolygonUtil(isBot, isFilled, _pntFrom, _pntTo) {

    pntFrom = { x: 0, y: 0 };
    pntTo = { x: 0, y: 0 };

    pntFrom.x = _pntFrom.x / (3 - canvasScale);
    pntFrom.y = _pntFrom.y / (3 - canvasScale);
    pntTo.x = _pntTo.x / (3 - canvasScale);
    pntTo.y = _pntTo.y / (3 - canvasScale);

    if (pntFrom.x == pntTo.x && pntFrom.y == pntTo.y) {
        return; 
    }

    cont = contextI;
    if (isBot) cont = context;

    cont.beginPath();
    drawLineUtil4(isBot, pntFrom.x, pntFrom.y, pntTo.x, pntTo.y);
    cont.stroke();
    cont.closePath();

};

function drawLongPolygonUtil(isFilled, drowPnts) {

    //================Fill

    if (isFilled==1) {
        context.beginPath();
        context.moveTo(drowPnts[0].x / (3 - canvasScale), drowPnts[0].y / (3 - canvasScale));
        for (var i = 0; i < drowPnts.length; i++) {
            var drawingPoint = drowPnts[i];
            context.lineTo(drawingPoint.x / (3 - canvasScale), drawingPoint.y / (3 - canvasScale));

        }
        context.fill();
        context.closePath();
    }

    //================================================================ draw

    context.beginPath();

    context.moveTo(drowPnts[0].x / (3 - canvasScale), drowPnts[0].y / (3 - canvasScale));

    for (var i = 0; i < drowPnts.length; i++) {
        var drawingPoint = drowPnts[i];
        context.lineTo(drawingPoint.x / (3 - canvasScale), drawingPoint.y / (3 - canvasScale));
    }

 //   context.lineTo(drowPnts[0].x, drowPnts[0].y);

    context.stroke();
    context.closePath();

};

function drawLongPencilUtil(isBot, isFilled, drowPnts) {

    cont = contextI;
    if (isBot) cont = context;
    //  cont.lineWidth = canvasScale * cont.lineWidth;

    //================================================================== click

    if (drowPnts.length == 2 && drowPnts[0].x == drowPnts[1].x && drowPnts[0].y == drowPnts[1].y) {
        cont.beginPath();
        if (canvasPainter.curDrawAction == 1) {
            savedFillolor = cont.fillStyle;
            cont.fillStyle = cont.strokeStyle;
        }
        var distance = cont.lineWidth / 2;
        if (distance < 1) {
            distance = 1;
        }
        var Center = drowPnts[0];
        if (distance > 1) {
            cont.arc(Center.x / (3 - canvasScale), Center.y / (3 - canvasScale), distance, 0, Math.PI * 2, true);
        }
        else {
            cont.fillRect(Center.x / (3 - canvasScale), Center.y / (3 - canvasScale), canvasScale, canvasScale);
        }

        cont.fill();
        cont.closePath();
        if (canvasPainter.curDrawAction == 1) {
            cont.fillStyle = savedFillolor;
        }
        return;
    }
    

    //================================================================== fill
    if (isFilled==1) {
        cont.beginPath();
        cont.moveTo(drowPnts[0].x / (3 - canvasScale), drowPnts[0].y / (3 - canvasScale));
        for (var i = 0; i < drowPnts.length; i++) {
            var drawingPoint = drowPnts[i];
            cont.lineTo(drawingPoint.x / (3 - canvasScale), drawingPoint.y / (3 - canvasScale));

        }
        cont.fill();
        cont.closePath();
    }

    //================================================================ draw

    cont.beginPath();

    cont.moveTo(drowPnts[0].x / (3 - canvasScale), drowPnts[0].y / (3 - canvasScale));


    for (var i = 0; i < drowPnts.length; i++) {
        var drawingPoint = drowPnts[i];
        cont.lineTo(drawingPoint.x / (3 - canvasScale), drawingPoint.y / (3 - canvasScale));
    }

    cont.stroke();
    cont.closePath();

 //   cont.lineWidth = cont.lineWidth /canvasScale;

};


function createArrow1(X1, X2, Y1, Y2, arrowHeight, arrowWidth) {

    var angle = Math.atan2(Y2 - Y1, X2 - X1);

    return { x: X2 - arrowHeight * Math.cos(angle) - arrowWidth * Math.sin(angle),
        y: Y2 - arrowHeight * Math.sin(angle) + arrowWidth * Math.cos(angle)};
    
}

function createArrow2(X1, X2, Y1, Y2, arrowHeight, arrowWidth)
{
    var angle= Math.atan2(Y2-Y1, X2-X1);   
           
    return {x: X2-arrowHeight*Math.cos(angle)+arrowWidth*Math.sin(angle), 
        y: Y2-arrowHeight*Math.sin(angle)-arrowWidth*Math.cos(angle)};
}

function pomi_clearCanvas() {
    context.beginPath();
    context.clearRect(0, 0, canvasScale * canvasWith, canvasScale * canvasHeight);
    context.closePath();
};


//Set_Cookie('mycookie', 'visited 9 times', 30, '/', '', '');
function Set_Cookie(name, value, expires, path, domain, secure) {
    if (!hasKey()) {
        return;
    }

    var today = new Date();
    today.setTime(today.getTime());
    if (expires) {
        expires = expires * 1000 * 60 * 60 * 24;
    }
    var expires_date = new Date(today.getTime() + (expires));

    document.cookie = name + "=" + escape(value) +
        ((expires) ? ";expires=" + expires_date.toGMTString() : "") +
        ((path) ? ";path=" + path : "") +
        ((domain) ? ";domain=" + domain : "") +
        ((secure) ? ";secure" : "");
}

function Get_Cookie(check_name) {
    var a_all_cookies = document.cookie.split(';');
    var a_temp_cookie = '';
    var cookie_name = '';
    var cookie_value = '';
    var b_cookie_found = false;

    for (i = 0; i < a_all_cookies.length; i++) {
        a_temp_cookie = a_all_cookies[i].split('=');

        cookie_name = a_temp_cookie[0].replace(/^\s+|\s+$/g, '');

        if (cookie_name == check_name) {
            b_cookie_found = true;
            if (a_temp_cookie.length > 1) {
                cookie_value = unescape(a_temp_cookie[1].replace(/^\s+|\s+$/g, ''));
            }
            return cookie_value;
            break;
        }
        a_temp_cookie = null;
        cookie_name = '';
    }
    if (!b_cookie_found) {
        return null;
    }
}


function ColorPicks() {

    $.fn.jPicker.defaults.images.clientPath = lng_subfolder + "images/";

    $('#lineColorPkr').jPicker(

          { window: { expandable: true,
              title: borderColorTitle,
              alphaSupport: false,
              position:
                {
                    x: 'screenCenter',
                    y: '200px'
                }
          },

              localization: colorLocalization
          },

        function (color, context) {


            if (!hasKey()) {
                return;
            }

            var all = color.val('all');
            if (all) {
                canvasPainter.setLineColor(all.r, all.g, all.b);
                savedLineColor = all.r + ',' + all.g + ',' + all.b;
                Set_Cookie('savedLineColor', savedLineColor, 300, '/', '', '');
            }
            else {
                $.jPicker.List[0].color.active.val('ahex', canvasPainter.getLineColor());
            }

        }

        );


    $('#fillColorPkr').jPicker(

    {
        window: { expandable: true,
            title: fillColorTitle,
            alphaSupport: false,
            position:
        {
            x: 'screenCenter',
            y: '200px'
        }
        },

        localization: colorLocalization
    },

    function (color, context) {

        if (!hasKey()) {
            return;
        }

        var all = color.val('all');
        if (all) {
            canvasPainter.setFillColor(all.r, all.g, all.b);
            savedFillColor = all.r + ',' + all.g + ',' + all.b;
            Set_Cookie('savedFillColor', savedFillColor, 300, '/', '', '');
        }
        else {
            $.jPicker.List[1].color.active.val('ahex', canvasPainter.getFillolor());
        }
    }


    );

}



function disableSelection(target) {
    if (typeof target.onselectstart != "undefined") //IE route
        target.onselectstart = function () { return false }
    //else if (typeof target.style.MozUserSelect != "undefined") //Firefox route
    //  target.style.MozUserSelect = "none"
    else //All other route (ie: Opera)
        target.onmousedown = function () { return false }
    //target.style.cursor = "default"
}


function EncodePomi(txt) {

    var ret_txt = txt.replace(/&/gi, ';empspi;');
    return ret_txt.replace(/_/gi, ';ulpi;');

   
}


function DecodePomi(txt) {

    var ret_txt = txt.replace(/;empspi;/gi, '&');
    return  ret_txt.replace(/;ulpi;/gi, '_');

}


function addTxtMsg(myName, myMsg) {

    if (textoutHeightDelts == 0) {
        document.getElementById("textout").style.display = "block";
        textoutHeightDelts = 90;
        document.getElementById("canvas").style.top = "90px";
        document.getElementById("canvasInterface").style.top = "90px";

        if (canvasScale == 2) {
            document.getElementById("Pomicopyright").style.top = (textoutHeightDelts + 1580) + "px";
            document.getElementById("tableLng").style.top = (textoutHeightDelts + 1531) + "px";
        }
        else {
            document.getElementById("Pomicopyright").style.top = (textoutHeightDelts + 880) + "px";
            document.getElementById("tableLng").style.top = (textoutHeightDelts + 831) + "px";

        }
    }

    document.getElementById("textout").innerHTML = "<p class='textoutMsg'><span class='userName'>" + myName + "</span>:&nbsp;&nbsp;&nbsp;" +
            myMsg + "</p>" + document.getElementById("textout").innerHTML;

}