diff --git a/400-SOURCECODE/AIAHTML5.Web/app/controllers/HomeController.js b/400-SOURCECODE/AIAHTML5.Web/app/controllers/HomeController.js
index 3b3b58d..a627b13 100644
--- a/400-SOURCECODE/AIAHTML5.Web/app/controllers/HomeController.js
+++ b/400-SOURCECODE/AIAHTML5.Web/app/controllers/HomeController.js
@@ -63,7 +63,6 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location",
$rootScope.rectDimension = [];
-
$rootScope.$on("$locationChangeSuccess", function () {
if (($location.url() == "/da-body-view") || ($location.url() == "/clinical-illustrations-detail") || ($location.url() == "/clinical-animations-detail")) {
@@ -611,9 +610,9 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location",
strokeStyle: shapestyleborderColor,
opacity: shapestyleOpacity,
strokeWidth: shapestyleborderWidth,
- x: offsetX1, y: offsetY1,
- width: x - offsetX1,
- height: y - offsetY1,
+ x: offsetX1 + 40, y: offsetY1 + 40,
+ width: (x - offsetX1),
+ height:(y - offsetY1),
resizeFromCenter: false,
@@ -678,7 +677,7 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location",
}
$rootScope.CircleFn = function (canvasId, CircleNumber, shapestyleOpacity, shapestyleborderColor, shapestyleborderWidth, shapestyleFillColor, offsetX1, offsetY1, x, y) {
-
+ // console.log("up"+ offsetX1 + " " + offsetY1 + " " + (x - offsetX1) + " " + (y - offsetY1));
$(canvasId).addLayer({
layer: true,
name: 'Circle_' + CircleNumber,
@@ -688,15 +687,11 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location",
strokeStyle: shapestyleborderColor,
strokeWidth: shapestyleborderWidth,
fillStyle: shapestyleFillColor,
- x: offsetX1, y: offsetY1,
- width: (x - offsetX1) * 2, height: (y - offsetY1) * 2,
+ x: (offsetX1 + 40), y: (offsetY1 + 40),
+ width: (x - offsetX1), height: (y - offsetY1),
// Place a handle at each side and each corner
handlePlacement: 'both',
-
-
-
click: function (layer) {
-
$rootScope.canvasLayerNameCollection = [];
$rootScope.canvasLayerNameCollection.push(layer.name);
$(canvasId).setLayer(layer.name, {
@@ -935,7 +930,7 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location",
$rootScope.TextAreaFn = function (canvasId, TextNumber, offsetX1, offsetY1, resetTextRect, shapestyleOpacity, shapestyleborderColor, shapestyleborderWidth, shapestyleFillColor, x, y) {
- debugger;
+ // debugger;
$('#canvas').drawText({
layer: true,
@@ -967,9 +962,9 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location",
strokeStyle: $rootScope.shapestyleborderColor,
strokeWidth: $rootScope.shapestyleborderWidth,
fillStyle: $rootScope.shapestyleFillColor,
- x: $rootScope.offsetX1, y: $rootScope.offsetY1,
- width: $rootScope.x - $rootScope.offsetX1,
- height: $rootScope.y - $rootScope.offsetY1,
+ x: $rootScope.offsetX1 + 40, y: $rootScope.offsetY1 + 40,
+ width: ($rootScope.x - $rootScope.offsetX1),
+ height:($rootScope.y - $rootScope.offsetY1),
add: function (layer) {
$rootScope.TextAreaRectID = layer.name;
@@ -1119,15 +1114,16 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location",
// var y = event.clientY;
$rootScope.offsetX1 = 0;
$rootScope.offsetY1 = 0;
+ var canvasDiv = document.getElementById('canvasDiv');
+ var verticalScrollPosition = canvasDiv.scrollTop;
+ var horizontlScrollPosition = canvasDiv.scrollLeft;
$rootScope.offsetX1 = event.offsetX;
$rootScope.offsetY1 = event.offsetY;
-
ctx.clearRect(0, 0, 2277, 3248);
$rootScope.clicked = true;
-
// alert("x:"+$rootScope.offsetX1 + " y:" + $rootScope.offsetY1);
+ canvasElement.addEventListener('mousemove', $rootScope.OnPaintCanvasMouseMove, false);
}
-
$rootScope.rectNumber = 0;
$rootScope.LineNumber = 0;
$rootScope.CircleNumber = 0;
@@ -1144,70 +1140,59 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location",
var arrayRect = {};
var storeLine = '';
- //$rootScope.canvasLayerNameCollection1 = [];
+
$rootScope.OnPaintCanvasMouseUp = function (event) {
-
+
if (!$rootScope.clicked) {
return;
}
+ var AnnotationCanvas = document.getElementById('canvas');
+ AnnotationCanvas.removeEventListener('mousemove', $rootScope.OnPaintCanvasMouseMove, false);
+ $(".line").remove();
+ $(".arrow").remove();
+ $(".pin").remove();
+ $(".circle").remove();
+ $(".rectangle").remove();
+ $(".textarea").remove();
$rootScope.clicked = false;
$rootScope.x = 0;
$rootScope.y = 0;
- $rootScope.x = parseInt(event.clientX - ($("#canvas").offset().left));
- $rootScope.y = parseInt(event.clientY - ($("#canvas").offset().top));
-
+ var canvasDiv = document.getElementById('canvasDiv');
+ var verticalScrollPosition = canvasDiv.scrollTop;
+ var horizontlScrollPosition = canvasDiv.scrollLeft;
+ $rootScope.x = event.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left;
+ $rootScope.y = event.pageY + verticalScrollPosition - $('#canvasDiv').offset().top;
var canvasElement = document.getElementById("canvas");
var ctx = canvasElement.getContext("2d");
-
var canvasPaintElement = document.getElementById("canvasPaint");
var PaintCanvasctx = canvasPaintElement.getContext("2d");
-
-
switch ($rootScope.shapeType) {
-
case "cursor":
- // ctx.clearRect(0, 0, 2277, 3248);
ctx.beginPath();
PaintCanvasctx.beginPath();
-
-
break;
-
case "Line":
- //$rootScope.canvasLayerNameCollection = [];
$rootScope.LineNumber = $rootScope.ObjectIndex++;
-
$rootScope.LineFn('#canvas', $rootScope.LineNumber, $rootScope.shapestyleborderColor, $rootScope.shapestyleborderWidth, $rootScope.offsetX1, $rootScope.offsetY1, $rootScope.x, $rootScope.y)
-
break;
-
case "Rectangle":
$rootScope.rectNumber = $rootScope.ObjectIndex++;
$rootScope.RectangleFn('#canvas', $rootScope.rectNumber, $rootScope.shapestyleFillColor, $rootScope.shapestyleborderColor, $rootScope.shapestyleOpacity, $rootScope.shapestyleborderWidth, $rootScope.offsetX1, $rootScope.offsetY1, $rootScope.x, $rootScope.y);
-
break;
-
case "Circle":
- // alert($rootScope.shapestyleborderWidth);
$rootScope.CircleNumber = $rootScope.ObjectIndex++;
-
$rootScope.CircleFn('#canvas', $rootScope.CircleNumber, $rootScope.shapestyleOpacity, $rootScope.shapestyleborderColor, $rootScope.shapestyleborderWidth, $rootScope.shapestyleFillColor, $rootScope.offsetX1, $rootScope.offsetY1, $rootScope.x, $rootScope.y);
break;
case "Arrow":
$rootScope.ArrowNumber = $rootScope.ObjectIndex++;
-
$rootScope.ArrowFn('#canvas', $rootScope.ArrowNumber, $rootScope.shapestyleborderColor, $rootScope.shapestyleborderWidth, $rootScope.offsetX1, $rootScope.offsetY1, $rootScope.x, $rootScope.y);
-
- // $scope.resetRect += 1;
break;
case "Pin":
$rootScope.PinNumber = $rootScope.PinObjectIndex++;
$rootScope.PinArcNumber = $rootScope.ArcObjectIndex++;
$rootScope.PinFn('#canvas', $rootScope.PinNumber, $rootScope.offsetX1, $rootScope.offsetY1, $rootScope.x, $rootScope.y, $rootScope.PinArcNumber);
-
break;
case "TextArea":
-
$rootScope.IsTextAlreadySave = false;
$("#text_area").val('');
// Draw text
@@ -1215,9 +1200,7 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location",
$rootScope.TextNumber = $rootScope.ObjectIndex++;
$rootScope.TextAreaFn('#canvas', $rootScope.TextNumber, $rootScope.offsetX1, $rootScope.offsetY1, $rootScope.resetTextRect, $rootScope.shapestyleOpacity, $rootScope.shapestyleborderColor, $rootScope.shapestyleborderWidth, $rootScope.shapestyleFillColor, $rootScope.x, $rootScope.y);
break;
-
case "DrawPolygon":
-
break;
}
@@ -1225,15 +1208,82 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location",
}
+ $rootScope.OnPaintCanvasMouseMove = function (event) {
+ var canvasDiv = document.getElementById('canvasDiv');
+ var verticalScrollPosition = canvasDiv.scrollTop;
+ var horizontlScrollPosition = canvasDiv.scrollLeft;
+ $rootScope.MouseMoveXAxis = event.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left;
+ $rootScope.MouseMoveYAxis = event.pageY + verticalScrollPosition - $('#canvasDiv').offset().top;
+ switch ($rootScope.shapeType) {
+ case "Line":
+ $(".line").remove();
+ // console.log($rootScope.MouseMoveXAxis - $rootScope.offsetX1);
+ $("#canvasDiv").append("");
+ $rootScope.Annotationangle();
+ break;
+ case "Arrow":
+ $(".arrow").remove();
+ $("#canvasDiv").append("");
+ $rootScope.Annotationangle();
+ break;
+ case "Pin":
+ $(".pin").remove();
+ $("#canvasDiv").append("");
+ $rootScope.Annotationangle();
+ break;
+ case "Circle":
+ $(".circle").remove();
+ // console.log($rootScope.offsetX1 + " " + $rootScope.offsetY1 + " " + Math.abs($rootScope.MouseMoveXAxis - $rootScope.offsetX1) + " " + Math.abs($rootScope.MouseMoveYAxis - $rootScope.offsetY1));
+ $("#canvasDiv").append("");
+ break;
+ case "Rectangle":
+ $(".rectangle").remove();
+ // console.log($rootScope.offsetX1 + " " + $rootScope.offsetY1 + " " + Math.abs($rootScope.MouseMoveXAxis - $rootScope.offsetX1) + " " + Math.abs($rootScope.MouseMoveYAxis - $rootScope.offsetY1));
+ $("#canvasDiv").append("");
+ break;
+ case "TextArea":
+ $(".textarea").remove();
+ // console.log($rootScope.offsetX1 + " " + $rootScope.offsetY1 + " " + Math.abs($rootScope.MouseMoveXAxis - $rootScope.offsetX1) + " " + Math.abs($rootScope.MouseMoveYAxis - $rootScope.offsetY1));
+ $("#canvasDiv").append("");
+ break;
+ }
+ }
+ $rootScope.Annotationangle = function (event) {
+ var dy = $rootScope.MouseMoveYAxis - $rootScope.offsetY1;
+ var dx = $rootScope.MouseMoveXAxis - $rootScope.offsetX1;
+ var theta = 0;
+ if (dx < 0) {
+ theta = Math.atan(dy / dx) * (180 / Math.PI);
+ theta = theta + 180;
+ }
+ else if (dy < 0) {
+ theta = Math.atan(dy / dx) * (180 / Math.PI);
+ theta = theta + 360;
+ }
+ else {
+ theta = Math.atan(dy / dx) * (180 / Math.PI);
+ }
+ var dottedLineWidth = Math.sqrt(($rootScope.offsetX1 - $rootScope.MouseMoveXAxis) * ($rootScope.offsetX1 - $rootScope.MouseMoveXAxis) + ($rootScope.offsetY1 - $rootScope.MouseMoveYAxis) * ($rootScope.offsetY1 - $rootScope.MouseMoveYAxis));
+ switch ($rootScope.shapeType) {
+ case "Line":
+ $('.line').css({ 'transform': 'rotate(' + theta + 'deg)', '-moz-transform': 'rotate(' + theta + 'deg)', '-webkit-transform': 'rotate(' + theta + 'deg)', 'transform-origin': '0% 0%', 'width': dottedLineWidth + 'px' });
+ break;
+ case "Arrow":
+ $('.arrow').css({ 'transform': 'rotate(' + theta + 'deg)', '-moz-transform': 'rotate(' + theta + 'deg)', '-webkit-transform': 'rotate(' + theta + 'deg)', 'transform-origin': '0% 0%', 'width': dottedLineWidth + 'px' });
+ break;
+ case "Pin":
+ $('.pin').css({ 'transform': 'rotate(' + theta + 'deg)', '-moz-transform': 'rotate(' + theta + 'deg)', '-webkit-transform': 'rotate(' + theta + 'deg)', 'transform-origin': '0% 0%', 'width': dottedLineWidth + 'px' });
+ break;
+ }
+ }
///-----
-
$rootScope.saveText = function () {
- debugger;
+
document.getElementById('modelbackground').style.display = "none";
// this part will work first time when save button will be clicked
if ($rootScope.IsTextAlreadySave == false) {
@@ -1248,15 +1298,8 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location",
$rootScope.textArea = $("#text_area").val();
// deleting previous text area
-
-
$("#canvas").removeLayer($rootScope.TextID).drawLayers();
$("#canvas").removeLayer($rootScope.TextAreaRectID).drawLayers();
-
-
- // $("#canvas").removeLayer('TextArea_' + $rootScope.TextNumber).drawLayers();
- // $("#canvas").removeLayer("TextRect_" + $rootScope.TextNumber).drawLayers();
-
// Text After Saving in Rectangle
$rootScope.resetTextRect = $rootScope.ObjectIndex++;
$('#canvas').drawText({
@@ -1323,31 +1366,12 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location",
var _rectLayerOnSaveSplit = _rectLayerOnSave.split("_");
var TextAreaRectName = "TextAreaNew_";
var TextAreaRectNameConcatenated = TextAreaRectName.concat(_rectLayerOnSaveSplit[1]);
- // alert(TextAreaRectNameConcatenated);
- //if (_rectLayerOnSaveSplit[1]%2 == 0)
- //{
- // _rectLayerOnSaveSplit[1] = _rectLayerOnSaveSplit[1] - 1;
-
- //}
- //else
- //{
-
- // _rectLayerOnSaveSplit[1] = _rectLayerOnSaveSplit[1];
- //}
$rootScope.layerNameArr = layer.name;
$rootScope.rectTextArr = TextAreaRectNameConcatenated;
$rootScope.rectDimension.push({ width: layer.width, height: layer.height, x: layer.x, y: layer.y });
- // var _rectLayerOnSaveSplitInt;
-
-
- // _rectLayerOnSaveSplitInt = parseInt(_rectLayerOnSaveSplit[1]);
-
- //alert(_rectLayerOnSaveSplitInt);
- // alert($rootScope.TextPropertyArray.length);
-
for (var i = 0; i <= $rootScope.TextPropertyArray.length - 1; i++) {
if ($rootScope.TextPropertyArray[i].layerName == TextAreaRectNameConcatenated) {
@@ -1767,9 +1791,6 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location",
}
else if ($rootScope.shapeTypeText == "textAreaRect") {
-
-
-
$("#canvas").removeLayer($rootScope.canvasLayerNameCollection[0].textareaRectangle).drawLayers();
$("#canvas").removeLayer($rootScope.canvasLayerNameCollection[0].textareaString).drawLayers();
$rootScope.shapeTypeText = "";
@@ -1777,7 +1798,6 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location",
}
else {
- // alert($rootScope.canvasLayerNameCollection);
$("#canvas").removeLayer($rootScope.canvasLayerNameCollection).drawLayers();
}