var startPointX = "", startPointY = "", endpointX, endpointY, isnewShape = false; function tool_polygon() { var tool = this; this.started = false; this.mousedown = function (ev) { tool.started = true; tool.x0 = ev.offsetX; tool.y0 = ev.offsetY; console.log('mousedown'); if (startPointX == "" && startPointY == "") { startPointX = tool.x0; startPointY = tool.y0; } console.log('startPointX ' + startPointX + ' startPointY ' + startPointY + ' ev.offsetX ' + ev.offsetX + ' ev.offsetY ' + ev.offsetY + ' isnewShape ' + isnewShape); //if ((Math.abs(startPointX - ev.offsetX) < 5) && (Math.abs(startPointY - ev.offsetY) < 5) && (startPointX != ev.offsetX && startPointY != ev.offsetY) && !isnewShape) { //keeping average gap of 5 pixels as the canvas is smaller and can't get exact start point if ((Math.abs(startPointX - ev.offsetX) < 5) && (Math.abs(startPointY - ev.offsetY) < 5) && isnewShape) { alert('point matched'); isnewShape = false ; context.clearRect(0, 0, canvas.width, canvas.height); context.beginPath(); context.moveTo(endpointX, endpointY); //context.moveTo(ev.offsetX, ev.offsetY); context.lineTo(startPointX, startPointY); startPointX = ""; startPointY = ""; endpointX = ""; endpointY = ""; context.strokeStyle = strokeColor; context.stroke(); context.closePath(); img_update(); tool.started = false; } else { if (startPointX == "" || startPointY == "" || endpointX == "" || endpointY == "") return; context.clearRect(0, 0, canvas.width, canvas.height); context.beginPath(); context.moveTo(endpointX, endpointY); isnewShape = false; context.lineTo(ev.offsetX, ev.offsetY); endpointX = ev.offsetX; endpointY = ev.offsetY; context.strokeStyle = strokeColor; context.stroke(); context.closePath(); img_update(); } }; this.mousemove = function (ev) { if (!tool.started) { return; } console.log('mousemove'); context.clearRect(0, 0, canvas.width, canvas.height); context.beginPath(); context.moveTo(startPointX, startPointY); context.lineTo(ev.offsetX, ev.offsetY); endpointX = ev.offsetX; endpointY = ev.offsetY; context.strokeStyle = strokeColor; context.stroke(); context.closePath(); }; this.mouseup = function (ev) { if (tool.started) { console.log('mouseup'); isnewShape = true; tool.started = false; img_update(); } }; }
var
This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)