diff --git a/400-SOURCECODE/AIAHTML5.Web/app/controllers/DAController.js b/400-SOURCECODE/AIAHTML5.Web/app/controllers/DAController.js
index f81d04d..6530556 100644
--- a/400-SOURCECODE/AIAHTML5.Web/app/controllers/DAController.js
+++ b/400-SOURCECODE/AIAHTML5.Web/app/controllers/DAController.js
@@ -7314,6 +7314,8 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
$('#termList option[value="' + $rootScope.searchSelectedText + '"]').prop("selected", true);
$("#termList").find("option").css({ "background-color": "#ffffff", "color": "#000000" });
$('#termList option[value="' + $rootScope.searchSelectedText + '"]').css({ "background-color": "#3399FF", "color": "#ffffff" });
+
+
$rootScope.isLoading = true;
$('#spinner').css('visibility', 'visible');
diff --git a/400-SOURCECODE/AIAHTML5.Web/app/controllers/HomeController.js b/400-SOURCECODE/AIAHTML5.Web/app/controllers/HomeController.js
index 1e6994b..5035d2b 100644
--- a/400-SOURCECODE/AIAHTML5.Web/app/controllers/HomeController.js
+++ b/400-SOURCECODE/AIAHTML5.Web/app/controllers/HomeController.js
@@ -64,7 +64,6 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location",
$rootScope.isEraseToolSelected = false;
$rootScope.isMousedownOnPaintCanvas = false;
-
//opacity code
$rootScope.shapestyleOpacity = 1;
$rootScope.shapestyleFillColor = "#fff";
@@ -538,62 +537,67 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location",
//--Common code of Annotation Toolbar for CI and DA-------
$rootScope.DrawLineOnModuleItem = function (canvasId, LineNumber, shapestyleborderColor, shapestyleborderWidth, offsetX1, offsetY1, x, y) {
- $(canvasId).addLayer({
- name: 'Line_' + LineNumber,
- layer: true,
- type: 'line',
- draggable: true,
- strokeStyle: shapestyleborderColor,
- strokeWidth: shapestyleborderWidth,
- rounded: true,
- x1: offsetX1, y1: offsetY1,
- x2: x, y2: y,
-
- click: function (layer) {
- $rootScope.canvasLayerNameCollection = [];
- $rootScope.canvasLayerNameCollection.push(layer.name);
- $(canvasId).setLayer(layer.name, {
- handle: {
- type: 'arc',
- fillStyle: '#fff',
- strokeStyle: '#c33',
- strokeWidth: 2,
- radius: 3
- }
- }).drawLayers();
-
-
- },
- mouseout: function (layer) {
- $rootScope.canvasLayerNameCollection = [];
- $(canvasId).setLayer(layer.name, {
- handle: {
- type: 'arc',
- fillStyle: '#fff',
- strokeStyle: '#c33',
- strokeWidth: 0,
- radius: 0
- }
-
- }).drawLayers();
-
- },
- mouseover: function (layer) {
-
-
- $(canvasId).setLayer(layer.name, {
- handle: {
- type: 'arc',
- fillStyle: '#fff',
- strokeStyle: '#c33',
- strokeWidth: 2,
- radius: 3
- }
- }).drawLayers();
+ if ($rootScope.isLinePreviewCompleted == true) {
+ $rootScope.isLinePreviewCompleted = false;
+ $(canvasId).addLayer({
+ name: 'Line_' + LineNumber,
+ layer: true,
+ type: 'line',
+ draggable: true,
+ strokeStyle: shapestyleborderColor,
+ strokeWidth: shapestyleborderWidth,
+ rounded: true,
+ x1: offsetX1, y1: offsetY1,
+ x2: x, y2: y,
- }
+ click: function (layer) {
+ $rootScope.canvasLayerNameCollection = [];
+ $rootScope.canvasLayerNameCollection.push(layer.name);
+ $(canvasId).setLayer(layer.name, {
+ handle: {
+ type: 'arc',
+ fillStyle: '#fff',
+ strokeStyle: '#c33',
+ strokeWidth: 2,
+ radius: 3
+ }
+ }).drawLayers();
- }).drawLayers();
+
+ },
+ mouseout: function (layer) {
+ $rootScope.canvasLayerNameCollection = [];
+ $(canvasId).setLayer(layer.name, {
+ handle: {
+ type: 'arc',
+ fillStyle: '#fff',
+ strokeStyle: '#c33',
+ strokeWidth: 0,
+ radius: 0
+ }
+
+ }).drawLayers();
+
+ },
+ mouseover: function (layer) {
+
+
+ $(canvasId).setLayer(layer.name, {
+ handle: {
+ type: 'arc',
+ fillStyle: '#fff',
+ strokeStyle: '#c33',
+ strokeWidth: 2,
+ radius: 3
+ }
+ }).drawLayers();
+
+ }
+
+ }).drawLayers();
+
+ }
+
$('.btnCursor').trigger('click');
$(".btn-annotation").removeClass("activebtncolor");
@@ -601,72 +605,75 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location",
}
$rootScope.DrawRectangleOnModuleItem = function (canvasId, RectNumber, shapestyleFillColor, shapestyleborderColor, shapestyleOpacity, shapestyleborderWidth, offsetX1, offsetY1, x, y) {
-
- $(canvasId).addLayer({
- layer: true,
- name: 'Rect_' + RectNumber,
- fillStyle: shapestyleFillColor,
- type: 'rectangle',
- draggable: true,
- strokeStyle: shapestyleborderColor,
- opacity: shapestyleOpacity,
- strokeWidth: shapestyleborderWidth,
- x: offsetX1, y: offsetY1,
- width: x - offsetX1,
- height: y - offsetY1,
+ if ($rootScope.isRectanglePreviewCompleted == true) {
+ $rootScope.isRectanglePreviewCompleted = false;
+ $(canvasId).addLayer({
+ layer: true,
+ name: 'Rect_' + RectNumber,
+ fillStyle: shapestyleFillColor,
+ type: 'rectangle',
+ draggable: true,
+ strokeStyle: shapestyleborderColor,
+ opacity: shapestyleOpacity,
+ strokeWidth: shapestyleborderWidth,
+ fromCenter: false,
+ x: offsetX1, y: offsetY1,
+ width: (x - offsetX1),
+ height: (y - offsetY1),
resizeFromCenter: true,
dblclick: function () {
- },
-
- click: function (layer) {
- $rootScope.canvasLayerNameCollection = [];
- $rootScope.canvasLayerNameCollection.push(layer.name);
- $(canvasId).setLayer(layer.name, {
- handle: {
- type: 'rectangle',
- fillStyle: '#fff',
- strokeStyle: '#c33',
- strokeWidth: 2,
- width: 5, height: 5,
- cornerRadius: 3
- }
- }).drawLayers();
-
- },
- mouseout: function (layer) {
- $rootScope.canvasLayerNameCollection = [];
- $(canvasId).setLayer(layer.name, {
- handle: {
- type: 'rectangle',
- fillStyle: 'pink',
- strokeStyle: 'yellow',
- strokeWidth: 0,
- width: 0, height: 0,
- cornerRadius: 0
- }
-
- }).drawLayers();
-
- },
- mouseover: function (layer) {
-
-
- $(canvasId).setLayer(layer.name, {
- handle: {
- type: 'rectangle',
- fillStyle: '#fff',
- strokeStyle: '#c33',
- strokeWidth: 2,
- width: 5, height: 5,
- cornerRadius: 3
- }
- }).drawLayers();
+ },
+
+ click: function (layer) {
+ $rootScope.canvasLayerNameCollection = [];
+ $rootScope.canvasLayerNameCollection.push(layer.name);
+ $(canvasId).setLayer(layer.name, {
+ handle: {
+ type: 'rectangle',
+ fillStyle: '#fff',
+ strokeStyle: '#c33',
+ strokeWidth: 2,
+ width: 5, height: 5,
+ cornerRadius: 3
+ }
+ }).drawLayers();
+
+ },
+ mouseout: function (layer) {
+ $rootScope.canvasLayerNameCollection = [];
+ $(canvasId).setLayer(layer.name, {
+ handle: {
+ type: 'rectangle',
+ fillStyle: 'pink',
+ strokeStyle: 'yellow',
+ strokeWidth: 0,
+ width: 0, height: 0,
+ cornerRadius: 0
+ }
- }
- }).drawLayers();
+ }).drawLayers();
+
+ },
+ mouseover: function (layer) {
+
+
+ $(canvasId).setLayer(layer.name, {
+ handle: {
+ type: 'rectangle',
+ fillStyle: '#fff',
+ strokeStyle: '#c33',
+ strokeWidth: 2,
+ width: 5, height: 5,
+ cornerRadius: 3
+ }
+ }).drawLayers();
+
+ }
+ }).drawLayers();
+ }
$('.btnCursor').trigger('click');
$(".btn-annotation").removeClass("activebtncolor");
$('.btnCursor').addClass('activebtncolor');
@@ -674,146 +681,150 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location",
}
$rootScope.DrawCircleOnModuleItem = function (canvasId, CircleNumber, shapestyleOpacity, shapestyleborderColor, shapestyleborderWidth, shapestyleFillColor, offsetX1, offsetY1, x, y) {
+ // console.log("up"+ offsetX1 + " " + offsetY1 + " " + (x - offsetX1) + " " + (y - offsetY1));
+ if ($rootScope.isCirclePreviewCompleted == true) {
+ $rootScope.isCirclePreviewCompleted = false;
+ $(canvasId).addLayer({
+ layer: true,
+ name: 'Circle_' + CircleNumber,
+ type: 'ellipse',
+ opacity: shapestyleOpacity,
+ draggable: true,
+ strokeStyle: shapestyleborderColor,
+ strokeWidth: shapestyleborderWidth,
+ fillStyle: shapestyleFillColor,
+ fromCenter: false,
+ x: (offsetX1), y: (offsetY1),
+ 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, {
+ handle: {
+ type: 'arc',
+ fillStyle: '#fff',
+ strokeStyle: '#c33',
+ strokeWidth: 2,
+ radius: 3
+ }
+ }).drawLayers();
- $(canvasId).addLayer({
- layer: true,
- name: 'Circle_' + CircleNumber,
- type: 'ellipse',
- opacity: shapestyleOpacity,
- draggable: true,
- strokeStyle: shapestyleborderColor,
- strokeWidth: shapestyleborderWidth,
- fillStyle: shapestyleFillColor,
- x: offsetX1, y: offsetY1,
- width: (x - offsetX1) * 2, height: (y - offsetY1) * 2,
- // 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, {
- handle: {
- type: 'arc',
- fillStyle: '#fff',
- strokeStyle: '#c33',
- strokeWidth: 2,
- radius: 3
- }
- }).drawLayers();
-
- },
- mouseout: function (layer) {
- $rootScope.canvasLayerNameCollection = [];
-
- $(canvasId).setLayer(layer.name, {
- handle: {
- type: 'arc',
- fillStyle: '#fff',
- strokeStyle: '#c33',
- strokeWidth: 0,
- // width: 0, height: 0,
- radius: 0
- }
-
- }).drawLayers();
-
- },
- mouseover: function (layer) {
-
-
- $(canvasId).setLayer(layer.name, {
- handle: {
- type: 'arc',
- fillStyle: '#fff',
- strokeStyle: '#c33',
- strokeWidth: 2,
- // width: 5, height: 5,
- radius: 3
- }
- }).drawLayers();
+ },
+ mouseout: function (layer) {
+ $rootScope.canvasLayerNameCollection = [];
- }
- }).drawLayers();
+ $(canvasId).setLayer(layer.name, {
+ handle: {
+ type: 'arc',
+ fillStyle: '#fff',
+ strokeStyle: '#c33',
+ strokeWidth: 0,
+ // width: 0, height: 0,
+ radius: 0
+ }
+
+ }).drawLayers();
+
+ },
+ mouseover: function (layer) {
+
+
+ $(canvasId).setLayer(layer.name, {
+ handle: {
+ type: 'arc',
+ fillStyle: '#fff',
+ strokeStyle: '#c33',
+ strokeWidth: 2,
+ // width: 5, height: 5,
+ radius: 3
+ }
+ }).drawLayers();
+
+ }
+ }).drawLayers();
+ }
$('.btnCursor').trigger('click');
$(".btn-annotation").removeClass("activebtncolor");
$('.btnCursor').addClass('activebtncolor');
}
$rootScope.DrawArrowOnModuleItem = function (canvasId, ArrowNumber, shapestyleborderColor, shapestyleborderWidth, offsetX1, offsetY1, x, y) {
+ if ($rootScope.isArrowPreviewCompleted == true) {
+ $rootScope.isArrowPreviewCompleted = false;
+ $('#canvas').drawLine({
+ layer: true,
+ name: 'Arrow_' + ArrowNumber,
+ draggable: true,
+ strokeStyle: shapestyleborderColor,
+ strokeWidth: shapestyleborderWidth,
+ rounded: true,
+ startArrow: true,
+ arrowRadius: 7,
+ arrowAngle: 90,
+ x1: offsetX1, y1: offsetY1,
+ x2: x, y2: y,
- $('#canvas').drawLine({
- layer: true,
- name: 'Arrow_' + ArrowNumber,
- draggable: true,
- strokeStyle: shapestyleborderColor,
- strokeWidth: shapestyleborderWidth,
- rounded: true,
- startArrow: true,
- arrowRadius: 7,
- arrowAngle: 90,
- x1: offsetX1, y1: offsetY1,
- x2: x, y2: y,
-
- click: function (layer) {
- $rootScope.canvasLayerNameCollection = [];
- $rootScope.canvasLayerNameCollection.push(layer.name);
- $(canvasId).setLayer(layer.name, {
- handle: {
- type: 'arc',
- fillStyle: '#fff',
- strokeStyle: '#c33',
- strokeWidth: 2,
- // width: 5, height: 5,
- radius: 3
- }
- }).drawLayers();
- // $("#canvas").removeLayer(layer.name).drawLayers();
-
- },
- mouseout: function (layer) {
- $rootScope.canvasLayerNameCollection = [];
- $(canvasId).setLayer(layer.name, {
- handle: {
- type: 'arc',
- fillStyle: '#fff',
- strokeStyle: '#c33',
- strokeWidth: 0,
- // width: 0, height: 0,
- radius: 0
- }
-
- }).drawLayers();
-
- },
- mouseover: function (layer) {
-
-
- $(canvasId).setLayer(layer.name, {
- handle: {
- type: 'arc',
- fillStyle: '#fff',
- strokeStyle: '#c33',
- strokeWidth: 2,
- // width: 5, height: 5,
- radius: 3
- }
- }).drawLayers();
+ click: function (layer) {
+ $rootScope.canvasLayerNameCollection = [];
+ $rootScope.canvasLayerNameCollection.push(layer.name);
+ $(canvasId).setLayer(layer.name, {
+ handle: {
+ type: 'arc',
+ fillStyle: '#fff',
+ strokeStyle: '#c33',
+ strokeWidth: 2,
+ // width: 5, height: 5,
+ radius: 3
+ }
+ }).drawLayers();
+ // $("#canvas").removeLayer(layer.name).drawLayers();
- }
+ },
+ mouseout: function (layer) {
+ $rootScope.canvasLayerNameCollection = [];
+ $(canvasId).setLayer(layer.name, {
+ handle: {
+ type: 'arc',
+ fillStyle: '#fff',
+ strokeStyle: '#c33',
+ strokeWidth: 0,
+ // width: 0, height: 0,
+ radius: 0
+ }
- });
+ }).drawLayers();
+
+ },
+ mouseover: function (layer) {
+
+
+ $(canvasId).setLayer(layer.name, {
+ handle: {
+ type: 'arc',
+ fillStyle: '#fff',
+ strokeStyle: '#c33',
+ strokeWidth: 2,
+ // width: 5, height: 5,
+ radius: 3
+ }
+ }).drawLayers();
+
+ }
+
+ });
+ }
+
$('.btnCursor').trigger('click');
$(".btn-annotation").removeClass("activebtncolor");
$('.btnCursor').addClass('activebtncolor');
}
$rootScope.DrawPinOnModuleItem = function (canvasId, PinNumber, offsetX1, offsetY1, x, y, PinArcNumber) {
-
- var xAxisPinDiff = offsetX1 - x;
- var yAxisPinDiff = offsetY1 - y;
- if (xAxisPinDiff != 0 && yAxisPinDiff != 0)
- {
+
+ if ($rootScope.isPinPreviewCompleted == true) {
+ $rootScope.isPinPreviewCompleted = false;
var radial = $('#canvas').createGradient({
x1: 50, y1: 50,
x2: 50, y2: 50,
@@ -911,17 +922,16 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location",
}).drawLayers();
}
-
+
+
$('.btnCursor').trigger('click');
$(".btn-annotation").removeClass("activebtncolor");
$('.btnCursor').addClass('activebtncolor');
}
$rootScope.TextEditorFunctionality = function (canvasId, TextNumber, offsetX1, offsetY1, resetTextRect, shapestyleOpacity, shapestyleborderColor, shapestyleborderWidth, shapestyleFillColor, x, y) {
-
-
- debugger;
-
+ if ($rootScope.isTextAreaPreviewCompleted == true) {
+ $rootScope.isTextAreaPreviewCompleted = false;
$('#canvas').drawText({
layer: true,
draggable: true,
@@ -932,6 +942,7 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location",
fillStyle: '#36c',
strokeWidth: 0,
x: $rootScope.offsetX1, y: $rootScope.offsetY1,
+ fromCenter: false,
fontSize: '14pt',
align: "left",
fontFamily: 'Verdana, sans-serif',
@@ -943,117 +954,119 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location",
})
- // Draw rect as wide as the text
- .drawRect({
- layer: true,
- name: "TextRect_" + $rootScope.TextNumber,
- dragGroups: ['shapes'],
- opacity: $rootScope.shapestyleOpacity,
- 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,
- add: function (layer) {
-
- $rootScope.TextAreaRectID = layer.name;
- $rootScope.rectDimension.push({ width: layer.width, height: layer.height, x: layer.x, y: layer.y });
- $rootScope.CurrentWidth = layer.width;
- $rootScope.CurrentHeight = layer.height;
-
- },
- click: function (layer) {
-
- $rootScope.canvasLayerNameCollection = [];
- $rootScope.canvasLayerNameCollection.push(layer.name);
- $('#canvas').setLayer(layer.name, {
- handle: {
- type: 'rectangle',
- fillStyle: '#fff',
- strokeStyle: '#c33',
- strokeWidth: 2,
- width: 5, height: 5,
- cornerRadius: 3
- }
- }).drawLayers();
-
- },
- dblclick: function (layer) {
-
- $rootScope.IsTextAlreadySave = false;
- var RectNameArray = (layer.name).split("_");
-
- var TextAreaRectangleName = "TextArea_";
- var TextAreaRectNameConcat = TextAreaRectangleName.concat(RectNameArray[1]);
- $rootScope.TextAreaRectID = layer.name;
- $rootScope.TextID = TextAreaRectNameConcat;
-
- $rootScope.rectDimension.push({ width: layer.width, height: layer.height, x: layer.x, y: layer.y });
- $("#annotationTextModal").css("padding-right", "0px");
- document.getElementById('modelbackground').style.display = "block";
- $("#annotationTextModal").modal("toggle");
-
- $("#text_area").val('');
- $("#text_area").css({ "font-family": "Arial", "font-size": "14px", "font-weight": "normal", "font-style": "normal", "color": "#000", "text-align": "left", "text-decoration": "none" });
- $("#font-color .minicolors .minicolors-swatch .minicolors-swatch-color").css({ "background-color": "#000000" });
- // $("#font-color .minicolors .minicolors-swatch .minicolors-swatch-color").addClass("ActiveDefaultColorAnnotation");
-
- $("#selected-font-family option:eq(0)").prop('selected', true);
- $("#selected-font-size option:eq(0)").prop('selected', true);
-
- $("#text-italic").removeClass("ActiveFormattingButtonClass");
-
- $("#text-bold").removeClass("ActiveFormattingButtonClass");
+ // Draw rect as wide as the text
+ .drawRect({
+ layer: true,
+ name: "TextRect_" + $rootScope.TextNumber,
+ dragGroups: ['shapes'],
+ opacity: $rootScope.shapestyleOpacity,
+ strokeStyle: $rootScope.shapestyleborderColor,
+ fromCenter: false,
+ strokeWidth: $rootScope.shapestyleborderWidth,
+ fillStyle: $rootScope.shapestyleFillColor,
+ x: $rootScope.offsetX1, y: $rootScope.offsetY1,
+ width: ($rootScope.x - $rootScope.offsetX1),
+ height: ($rootScope.y - $rootScope.offsetY1),
+ add: function (layer) {
+
+ $rootScope.TextAreaRectID = layer.name;
+ $rootScope.rectDimension.push({ width: layer.width, height: layer.height, x: layer.x, y: layer.y });
+ // $rootScope.CurrentWidth = layer.width;
+ // $rootScope.CurrentHeight = layer.height;
+
+ },
+ click: function (layer) {
+
+ $rootScope.canvasLayerNameCollection = [];
+ $rootScope.canvasLayerNameCollection.push(layer.name);
+ $('#canvas').setLayer(layer.name, {
+ handle: {
+ type: 'rectangle',
+ fillStyle: '#fff',
+ strokeStyle: '#c33',
+ strokeWidth: 2,
+ width: 5, height: 5,
+ cornerRadius: 3
+ }
+ }).drawLayers();
+
+ },
+ dblclick: function (layer) {
+
+ $rootScope.IsTextAlreadySave = false;
+ var RectNameArray = (layer.name).split("_");
+
+ var TextAreaRectangleName = "TextArea_";
+ var TextAreaRectNameConcat = TextAreaRectangleName.concat(RectNameArray[1]);
+ $rootScope.TextAreaRectID = layer.name;
+ $rootScope.TextID = TextAreaRectNameConcat;
+
+ $rootScope.rectDimension.push({ width: layer.width, height: layer.height, x: layer.x, y: layer.y });
+ $("#annotationTextModal").css("padding-right", "0px");
+ document.getElementById('modelbackground').style.display = "block";
+ $("#annotationTextModal").modal("toggle");
+
+ $("#text_area").val('');
+ $("#text_area").css({ "font-family": "Arial", "font-size": "14px", "font-weight": "normal", "font-style": "normal", "color": "#000", "text-align": "left", "text-decoration": "none" });
+ $("#font-color .minicolors .minicolors-swatch .minicolors-swatch-color").css({ "background-color": "#000000" });
+ // $("#font-color .minicolors .minicolors-swatch .minicolors-swatch-color").addClass("ActiveDefaultColorAnnotation");
+
+ $("#selected-font-family option:eq(0)").prop('selected', true);
+ $("#selected-font-size option:eq(0)").prop('selected', true);
+
+ $("#text-italic").removeClass("ActiveFormattingButtonClass");
+
+ $("#text-bold").removeClass("ActiveFormattingButtonClass");
+
+ $("#text-underline").removeClass("ActiveFormattingButtonClass");
+
+ $("#text-left").removeClass("ActiveFormattingButtonClass");
+
+ $("#text-right").removeClass("ActiveFormattingButtonClass");
+
+ $("#text-center").removeClass("ActiveFormattingButtonClass");
+
+ },
+ mouseout: function (layer) {
+ $rootScope.canvasLayerNameCollection = [];
+ $('#canvas').setLayer(layer.name, {
+ handle: {
+ type: 'rectangle',
+ fillStyle: 'pink',
+ strokeStyle: 'yellow',
+ strokeWidth: 0,
+ width: 0, height: 0,
+ cornerRadius: 0
+ }
+
+ }).drawLayers();
+
+ },
+ mouseover: function (layer) {
+
+ $('#canvas').setLayer(layer.name, {
+ handle: {
+ type: 'rectangle',
+ fillStyle: '#fff',
+ strokeStyle: '#c33',
+ strokeWidth: 2,
+ width: 5, height: 5,
+ cornerRadius: 3
+ }
+ }).drawLayers();
- $("#text-underline").removeClass("ActiveFormattingButtonClass");
-
- $("#text-left").removeClass("ActiveFormattingButtonClass");
-
- $("#text-right").removeClass("ActiveFormattingButtonClass");
-
- $("#text-center").removeClass("ActiveFormattingButtonClass");
-
- },
- mouseout: function (layer) {
- $rootScope.canvasLayerNameCollection = [];
- $('#canvas').setLayer(layer.name, {
- handle: {
- type: 'rectangle',
- fillStyle: 'pink',
- strokeStyle: 'yellow',
- strokeWidth: 0,
- width: 0, height: 0,
- cornerRadius: 0
- }
-
- }).drawLayers();
-
- },
- mouseover: function (layer) {
+ }
+ });
- $('#canvas').setLayer(layer.name, {
- handle: {
- type: 'rectangle',
- fillStyle: '#fff',
- strokeStyle: '#c33',
- strokeWidth: 2,
- width: 5, height: 5,
- cornerRadius: 3
- }
- }).drawLayers();
- }
- });
+
// Annotation: Edit Text option is missing.
- // alert($rootScope.CurrentWidth);
- // alert($rootScope.CurrentHeight);
$("#annotationTextModal").css("padding-right", "0px");
- if (($rootScope.CurrentWidth > 0 && $rootScope.CurrentHeight > 0) || ($rootScope.CurrentWidth > 0 && $rootScope.CurrentHeight <= 0) || ($rootScope.CurrentWidth <= 0 && $rootScope.CurrentHeight > 0)) {
- $("#annotationTextModal").modal("toggle");
- document.getElementById('modelbackground').style.display = "block";
- }
- $('.btnCursor').trigger('click');
+ $("#annotationTextModal").modal("toggle");
+ document.getElementById('modelbackground').style.display = "block";
+
+ }
+ $('.btnCursor').trigger('click');
$("#font-color .minicolors .minicolors-swatch .minicolors-swatch-color").css({ "background-color": "#000000" });
$("#text_area").val('');
@@ -1081,8 +1094,6 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location",
$('.btnCursor').addClass('activebtncolor');
-
-
}
@@ -1104,15 +1115,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;
@@ -1129,92 +1141,157 @@ 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.isLinePreviewCompleted = true;
$rootScope.DrawLineOnModuleItem('#canvas', $rootScope.LineNumber, $rootScope.shapestyleborderColor, $rootScope.shapestyleborderWidth, $rootScope.offsetX1, $rootScope.offsetY1, $rootScope.x, $rootScope.y)
-
break;
-
case "Rectangle":
$rootScope.rectNumber = $rootScope.ObjectIndex++;
+ $rootScope.isRectanglePreviewCompleted = true;
$rootScope.DrawRectangleOnModuleItem('#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.isCirclePreviewCompleted = true;
$rootScope.DrawCircleOnModuleItem('#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.isArrowPreviewCompleted = true;
$rootScope.DrawArrowOnModuleItem('#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.DrawPinOnModuleItem('#canvas', $rootScope.PinNumber, $rootScope.offsetX1, $rootScope.offsetY1, $rootScope.x, $rootScope.y, $rootScope.PinArcNumber);
+ $rootScope.isPinPreviewCompleted = true;
+
+ $rootScope.DrawPinOnModuleItem('#canvas', $rootScope.PinNumber, $rootScope.offsetX1, $rootScope.offsetY1, $rootScope.x, $rootScope.y, $rootScope.PinArcNumber);
break;
case "TextArea":
-
$rootScope.IsTextAlreadySave = false;
$("#text_area").val('');
// Draw text
$rootScope.resetTextRect = $rootScope.ObjectIndex++;
$rootScope.TextNumber = $rootScope.ObjectIndex++;
+ $rootScope.isTextAreaPreviewCompleted = true;
$rootScope.TextEditorFunctionality('#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;
}
//}
}
- ///-----
+ $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();
+
+ $("#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();
+
+ $("#canvasDiv").append("");
+ break;
+ case "Rectangle":
+ $(".rectangle").remove();
+
+ $("#canvasDiv").append("");
+ break;
+ case "TextArea":
+ $(".textarea").remove();
+
+ $("#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) {
@@ -1229,15 +1306,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({
@@ -1249,6 +1319,7 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location",
fillStyle: $rootScope.fontColor,
fontStyle: $rootScope.fontWeight + " " + $rootScope.fontStyle,
fontSize: $rootScope.fontSizes,
+ fromCenter: false,
fontFamily: $rootScope.fontFamily,
align: $rootScope.textAlignmt,
strokeWidth: 0,
@@ -1272,6 +1343,7 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location",
opacity: $rootScope.shapestyleOpacity,
strokeStyle: $rootScope.shapestyleborderColor,
strokeWidth: $rootScope.shapestyleborderWidth,
+ fromCenter: false,
x: $rootScope.rectDimension[$rootScope.rectDimension.length - 1].x, y: $rootScope.rectDimension[$rootScope.rectDimension.length - 1].y,
width: $rootScope.rectDimension[$rootScope.rectDimension.length - 1].width,
height: $rootScope.rectDimension[$rootScope.rectDimension.length - 1].height,
@@ -1304,31 +1376,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) {
@@ -1540,6 +1593,7 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location",
fontFamily: _modifiedFontFamily,
align: _modifiedTextAlign,
strokeWidth: 0,
+ fromCenter: false,
text: _modifiedText,
x: $rootScope.rectDimension[$rootScope.rectDimension.length - 1].x, y: $rootScope.rectDimension[$rootScope.rectDimension.length - 1].y,
maxWidth: $rootScope.rectDimension[$rootScope.rectDimension.length - 1].width,
@@ -1554,6 +1608,7 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location",
groups: ['TextAreaAfterEdit_' + $rootScope.resetTextSave],
dragGroups: ['TextAreaAfterEdit_' + $rootScope.resetTextSave],
opacity: $rootScope.shapestyleOpacity,
+ fromCenter: false,
strokeStyle: $rootScope.shapestyleborderColor,
strokeWidth: $rootScope.shapestyleborderWidth,
x: $rootScope.rectDimension[$rootScope.rectDimension.length - 1].x, y: $rootScope.rectDimension[$rootScope.rectDimension.length - 1].y,
@@ -1729,9 +1784,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 = "";
@@ -1739,7 +1791,6 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location",
}
else {
- // alert($rootScope.canvasLayerNameCollection);
$("#canvas").removeLayer($rootScope.canvasLayerNameCollection).drawLayers();
}
@@ -1848,22 +1899,24 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location",
$('#listManager').css('display', 'block');
$("#listManager").css("visibility", "visible");
-
- // $('#termList option[selected="selected"]').prop("selected", false);
- // $("#termList").find("option[value=" + $rootScope.searchSelectedText + "]").prop("selected", true);
- // $("#termList").find("option").css({ "background-color": "#ffffff", "color": "#000000" });
- // $("#termList").find("option[value=" + $rootScope.searchSelectedText + "]").css({ "background-color": "#3399FF", "color": "#ffffff" });
+
+ // $('#termList option[selected="selected"]').prop("selected", false);
+ // $("#termList").find("option[value=" + $rootScope.searchSelectedText + "]").prop("selected", true);
+ // $("#termList").find("option").css({ "background-color": "#ffffff", "color": "#000000" });
+ // $("#termList").find("option[value=" + $rootScope.searchSelectedText + "]").css({ "background-color": "#3399FF", "color": "#ffffff" });
$('#listManager').draggable();
$rootScope.islistManagerEventAlredayDispachted = true;
$rootScope.$broadcast('listManagerEvent', true);
-
+
$('#termList option[selected="selected"]').prop("selected", false);
$('#termList option[value="' + $rootScope.searchSelectedText + '"]').prop("selected", true);
$("#termList").find("option").css({ "background-color": "#ffffff", "color": "#000000" });
$('#termList option[value="' + $rootScope.searchSelectedText + '"]').css({ "background-color": "#3399FF", "color": "#ffffff" });
+
+
}
$rootScope.CloseListManager = function () {