' +
+ content: '
' +
+ '
' +
'
' +
'' +
'
' +
@@ -467,8 +470,893 @@ function ($scope, $window, $rootScope, $compile, $http, log, $location, $timeout
$('#CIView').css("width", $(window).outerWidth());
}
+ //khushbu
+ $scope.$on('annotationToolEvent', function (event, data) {
+ $("#canvas").css("display", "block");
+ $("#canvasPaint").css("display", "block");
+
+ $scope.doClick();
+ // $rootScope.FreeStylePaint();
+ });
+
+
+ $scope.clicked = true;
+ $scope.offsetX1 = 0;
+ $scope.offsetY1 = 0;
+ $scope.x = 0;
+ $scope.y = 0;
+ $scope.doClick = function (event) {
+
+ $scope.clicked = true;
+ // OnPaintCanvasMouseDown(event);
+ canvas.addEventListener('mousedown', $scope.OnPaintCanvasMouseDown, false);
+ canvas.addEventListener('mouseup', $scope.OnPaintCanvasMouseUp, false);
+ // alert("doclick");
+ };
+
+ $scope.mousePressed = false;
+ $scope.lastX; $scope.lastY;
+ var ctx;
+
+ $scope.OnPaintCanvasMouseDown = function (event) {
+ // alert("testing333");
+ var canvasElement = document.getElementById("canvas");
+ var ctx = canvasElement.getContext("2d");
+
+ // var x = event.clientX;
+ // var y = event.clientY;
+ $scope.offsetX1 = 0;
+ $scope.offsetY1 = 0;
+ $scope.offsetX1 = event.offsetX;
+ $scope.offsetY1 = event.offsetY;
+
+ ctx.clearRect(0, 0, 2277, 3248);
+ $scope.clicked = true;
+ }
+ $rootScope.resetRectCI = 0;
+ $rootScope.resetLineCI = 0;
+ $rootScope.resetCircleCI = 0;
+ $rootScope.resetArrowCI = 0;
+ $rootScope.resetPinCI = 0;
+ $rootScope.resetPinArcCI = 0;
+ $rootScope.ObjectIndexCI = 0;
+ $rootScope.Object1IndexCI = 0;
+ $rootScope.Object2IndexCI = 0;
+ $rootScope.resetTextCI = 0;
+ $rootScope.resetTextSaveCI = 0;
+ $rootScope.ObjectIndexSaveCI = 0;
+ var arrayRect = {};
+
+
+ var storeLine = '';
+ $rootScope.canvasLayerNameCollection1CI = [];
+ $scope.OnPaintCanvasMouseUp = function (event) {
+
+ if (!$scope.clicked) {
+ return;
+ }
+ $scope.clicked = false;
+ $scope.x = 0;
+ $scope.y = 0;
+ $scope.x = parseInt(event.clientX - ($("#canvas").offset().left));
+ $scope.y = parseInt(event.clientY - ($("#canvas").offset().top));
+
+ var canvasElement = document.getElementById("canvas");
+ var ctx = canvasElement.getContext("2d");
+
+ var canvasElement1 = document.getElementById("canvasPaint");
+ var ctx1 = canvasElement1.getContext("2d");
+
+
+ switch ($rootScope.shapeType) {
+
+ case "cursor":
+ // ctx.clearRect(0, 0, 2277, 3248);
+ ctx.beginPath();
+ ctx1.beginPath();
+
+
+ break;
+
+ case "Line":
+
+ $rootScope.resetLineCI = $rootScope.ObjectIndexCI++;
+ $('#canvas').addLayer({
+ name: 'Line_' + $rootScope.resetLineCI,
+ layer: true,
+ type: 'line',
+ draggable: true,
+ strokeStyle: $rootScope.shapestyleborderColor,
+ strokeWidth: $rootScope.shapestyleborderWidth,
+ rounded: true,
+ x1: $scope.offsetX1, y1: $scope.offsetY1,
+ x2: $scope.x, y2: $scope.y,
+
+ click: function (layer) {
+ $rootScope.canvasLayerNameCollectionCI = [];
+ $rootScope.canvasLayerNameCollectionCI.push(layer.name);
+ $('#canvas').setLayer(layer.name, {
+ handle: {
+ type: 'arc',
+ fillStyle: '#fff',
+ strokeStyle: '#c33',
+ strokeWidth: 2,
+ radius: 3
+ }
+ }).drawLayers();
+
+
+ },
+ mouseout: function (layer) {
+ $rootScope.canvasLayerNameCollectionCI = [];
+ $('#canvas').setLayer(layer.name, {
+ handle: {
+ type: 'arc',
+ fillStyle: '#fff',
+ strokeStyle: '#c33',
+ strokeWidth: 0,
+ radius: 0
+ }
+
+ }).drawLayers();
+
+ },
+ mouseover: function (layer) {
+
+
+ $('#canvas').setLayer(layer.name, {
+ handle: {
+ type: 'arc',
+ fillStyle: '#fff',
+ strokeStyle: '#c33',
+ strokeWidth: 2,
+ radius: 3
+ }
+ }).drawLayers();
+
+ }
+
+ }).drawLayers();
+ $('.btnCursor').trigger('click');
+ $(".btn-annotation").removeClass("activebtncolor");
+ $('.btnCursor').addClass('activebtncolor');
+ break;
+
+ case "Rectangle":
+ $rootScope.resetRectCI = $rootScope.ObjectIndexCI++;
+
+ $('#canvas').addLayer({
+ layer: true,
+ name: 'Rect_' + $rootScope.resetRectCI,
+ fillStyle: $rootScope.shapestyleFillColor,
+ type: 'rectangle',
+ draggable: true,
+ strokeStyle: $rootScope.shapestyleborderColor,
+ opacity: $rootScope.shapestyleOpacity,
+ strokeWidth: $rootScope.shapestyleborderWidth,
+ x: $scope.offsetX1, y: $scope.offsetY1,
+ width: $scope.x - $scope.offsetX1,
+ height: $scope.y - $scope.offsetY1,
+
+ resizeFromCenter: false,
+
+
+ click: function (layer) {
+ $rootScope.canvasLayerNameCollectionCI = [];
+ $rootScope.canvasLayerNameCollectionCI.push(layer.name);
+ $('#canvas').setLayer(layer.name, {
+ handle: {
+ type: 'rectangle',
+ fillStyle: '#fff',
+ strokeStyle: '#c33',
+ strokeWidth: 2,
+ width: 5, height: 5,
+ cornerRadius: 3
+ }
+ }).drawLayers();
+
+ },
+ mouseout: function (layer) {
+ $rootScope.canvasLayerNameCollectionCI = [];
+ $('#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();
+
+ }
+ }).drawLayers();
+
+
+
+ $('.btnCursor').trigger('click');
+ $(".btn-annotation").removeClass("activebtncolor");
+ $('.btnCursor').addClass('activebtncolor');
+
+ break;
+
+ case "Circle":
+ // alert($rootScope.shapestyleborderWidth);
+ $rootScope.resetCircleCI = $rootScope.ObjectIndexCI++;
+ $('#canvas').addLayer({
+ layer: true,
+ name: 'Circle_' + $rootScope.resetCircleCI,
+ type: 'ellipse',
+ opacity: $rootScope.shapestyleOpacity,
+ draggable: true,
+ strokeStyle: $rootScope.shapestyleborderColor,
+ strokeWidth: $rootScope.shapestyleborderWidth,
+ fillStyle: $rootScope.shapestyleFillColor,
+ x: $scope.offsetX1, y: $scope.offsetY1,
+ width: ($scope.x - $scope.offsetX1) * 2, height: ($scope.y - $scope.offsetY1) * 2,
+ // Place a handle at each side and each corner
+ handlePlacement: 'both',
+
+
+
+ click: function (layer) {
+ // alert($rootScope.shapestyleFillColor);
+ $rootScope.canvasLayerNameCollectionCI = [];
+ $rootScope.canvasLayerNameCollectionCI.push(layer.name);
+ $('#canvas').setLayer(layer.name, {
+ handle: {
+ type: 'arc',
+ fillStyle: '#fff',
+ strokeStyle: '#c33',
+ strokeWidth: 2,
+ radius: 3
+ }
+ }).drawLayers();
+
+ },
+ mouseout: function (layer) {
+ $rootScope.canvasLayerNameCollectionCI = [];
+
+ $('#canvas').setLayer(layer.name, {
+ handle: {
+ type: 'arc',
+ fillStyle: '#fff',
+ strokeStyle: '#c33',
+ strokeWidth: 0,
+ // width: 0, height: 0,
+ radius: 0
+ }
+
+ }).drawLayers();
+
+ },
+ mouseover: function (layer) {
+
+
+ $('#canvas').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');
+ break;
+ case "Arrow":
+ $rootScope.resetArrowCI = $rootScope.ObjectIndexCI++;
+
+ $('#canvas').drawLine({
+ layer: true,
+ name: 'Arrow_' + $rootScope.resetArrowCI,
+ draggable: true,
+ strokeStyle: $rootScope.shapestyleborderColor,
+ strokeWidth: $rootScope.shapestyleborderWidth,
+ rounded: true,
+ startArrow: true,
+ arrowRadius: 7,
+ arrowAngle: 90,
+ x1: $scope.offsetX1, y1: $scope.offsetY1,
+ x2: $scope.x, y2: $scope.y,
+
+ click: function (layer) {
+ $rootScope.canvasLayerNameCollectionCI = [];
+ $rootScope.canvasLayerNameCollectionCI.push(layer.name);
+ $('#canvas').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.canvasLayerNameCollectionCI = [];
+ $('#canvas').setLayer(layer.name, {
+ handle: {
+ type: 'arc',
+ fillStyle: '#fff',
+ strokeStyle: '#c33',
+ strokeWidth: 0,
+ // width: 0, height: 0,
+ radius: 0
+ }
+
+ }).drawLayers();
+
+ },
+ mouseover: function (layer) {
+
+
+ $('#canvas').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');
+
+ // $scope.resetRect += 1;
+ break;
+ case "Pin":
+
+ $rootScope.resetPinCI = $rootScope.Object2IndexCI++;
+ $rootScope.resetPinArc = $rootScope.Object1IndexCI++;
+ var radial = $('canvas').createGradient({
+ x1: 50, y1: 50,
+ x2: 50, y2: 50,
+ r1: 10, r2: 30,
+ c1: 'rgba(100, 50, 0,0)',
+ c2: 'grey'
+ });
+ $('#canvas').drawLine({
+ draggable: true,
+ layer: true,
+ name: "Pin_" + $rootScope.resetPinCI,
+ groups: ["Pin_" + $rootScope.resetPinCI],
+ dragGroups: ["Pin_" + $rootScope.resetPinCI],
+ strokeStyle: 'black',
+ strokeWidth: 2,
+ x1: $scope.offsetX1, y1: $scope.offsetY1,
+ x2: $scope.x, y2: $scope.y,
+
+ click: function (layer) {
+
+ $rootScope.shapeTypePinCI = "Pin";
+ $rootScope.canvasLayerNameCollectionCI = [];
+ var pinLine_layer = layer.name;
+ var pinLine_layer_split = pinLine_layer.split("_");
+ var pinArcName = "ArcPin_";
+ var pinResult = pinArcName.concat(pinLine_layer_split[1]);
+
+ $rootScope.canvasLayerNameCollectionCI.push({ pinName: layer.name, ArcName: pinResult });
+
+ $('#canvas').setLayer(layer.name, {
+ handle: {
+ type: 'arc',
+ fillStyle: '#fff',
+ strokeStyle: '#c33',
+ strokeWidth: 2,
+ // width: 5, height: 5,
+ radius: 3
+ }
+ }).drawLayers();
+
+
+ },
+ mouseout: function (layer) {
+
+ $rootScope.canvasLayerNameCollectioCI = [];
+ $('#canvas').setLayer(layer.name, {
+ handle: {
+ type: 'arc',
+ fillStyle: '#fff',
+ strokeStyle: '#c33',
+ strokeWidth: 0,
+ // width: 0, height: 0,
+ radius: 0
+ }
+
+ }).drawLayers();
+
+ },
+ mouseover: function (layer) {
+
+
+ $('#canvas').setLayer(layer.name, {
+ handle: {
+ type: 'arc',
+ fillStyle: '#fff',
+ strokeStyle: '#c33',
+ strokeWidth: 2,
+ // width: 5, height: 5,
+ radius: 3
+ }
+ }).drawLayers();
+
+ }
+ }).drawArc({
+ draggable: true,
+ name: "ArcPin_" + $rootScope.resetPinArcCI,
+ // name: "Pin_" + $rootScope.resetPinCI,
+ layer: true,
+ groups: ["Pin_" + $rootScope.resetPinCI],
+ dragGroups: ["Pin_" + $rootScope.resetPinCI],
+ strokeStyle: 'grey',
+ strokeWidth: 2,
+ fillStyle: radial,
+ x: $scope.offsetX1, y: $scope.offsetY1,
+ radius: 5,
+ //handle: {
+ // type: 'arc',
+ // fillStyle: '#fff',
+ // strokeStyle: '#c33',
+ // strokeWidth: 2,
+ // radius: 3
+ //},
+ add: function (layer) {
+
+ $rootScope.resetPinArcCI = layer.name;
+ // $scope.arr = [];
+
+
+ },
+
+ }).drawLayers();
+ $('.btnCursor').trigger('click');
+ $(".btn-annotation").removeClass("activebtncolor");
+ $('.btnCursor').addClass('activebtncolor');
+ break;
+ case "TextArea":
+ $rootScope.IsTextAlreadySaveCI = false;
+ $("#text_area").val('');
+ // Draw text
+ $rootScope.resetTextRectCI = $rootScope.ObjectIndexCI++;
+ $rootScope.resetTextCI = $rootScope.ObjectIndexCI++;
+ $('#canvas').drawText({
+ layer: true,
+ draggable: true,
+ // opacity: $rootScope.shapestyleOpacity,
+ name: 'TextArea_' + $rootScope.resetTextCI,
+ groups: ['TextArea_' + $rootScope.resetTextCI],
+ dragGroups: ['TextArea_' + $rootScope.resetTextCI],
+ fillStyle: '#36c',
+ strokeWidth: 0,
+ x: $scope.offsetX1, y: $scope.offsetY1,
+ fontSize: '14pt',
+ align: "left",
+ fontFamily: 'Verdana, sans-serif',
+ text: ''
+
+ })
+ // Draw rect as wide as the text
+ .drawRect({
+ layer: true,
+ name: "TextRect_" + $rootScope.resetTextRectCI,
+ dragGroups: ['shapes'],
+ opacity: $rootScope.shapestyleOpacity,
+ strokeStyle: $rootScope.shapestyleborderColor,
+ strokeWidth: $rootScope.shapestyleborderWidth,
+ fillStyle: $rootScope.shapestyleFillColor,
+ x: $scope.offsetX1, y: $scope.offsetY1,
+ width: $scope.x - $scope.offsetX1,
+ height: $scope.y - $scope.offsetY1,
+ click: function (layer) {
+
+ $rootScope.canvasLayerNameCollectionCI = [];
+ $rootScope.canvasLayerNameCollectionCI.push(layer.name);
+ $('#canvas').setLayer(layer.name, {
+ handle: {
+ type: 'rectangle',
+ fillStyle: '#fff',
+ strokeStyle: '#c33',
+ strokeWidth: 2,
+ width: 5, height: 5,
+ cornerRadius: 3
+ }
+ }).drawLayers();
+
+ },
+ mouseout: function (layer) {
+ $rootScope.canvasLayerNameCollectionCI = [];
+ $('#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();
+
+ }
+ });
+
+
+ $("#annotationTextModal").modal("toggle");
+ $('.btnCursor').trigger('click');
+ $("#text_area").val('');
+ $("#text_area").css({ " font-family": 'Verdana, sans-serif', "font-size": "14px", "font-weight": "normal", "font-style": "normal", "color": "#000", "text-align": "left", "text-decoration": "none" });
+ $(".btn-annotation").removeClass("activebtncolor");
+ $('.btnCursor').addClass('activebtncolor');
+ break;
+
+ case "DrawPolygon":
+
+ break;
+
+ }
+ //}
+
+ }
+
+ //-- TextArea functionality of Annotation toolbar
+
+ $rootScope.fontSizesCI;
+ $rootScope.fontWeightCI;
+ $rootScope.fontStyleCI;
+ $rootScope.textAlignmtCI;
+ $rootScope.fontColorCI;
+ $rootScope.underlineTextCI;
+ $rootScope.textAreaCI;
+ $rootScope.fontFamilyCI;
+ $rootScope.TextPropertyArrayCI = [];
+ $rootScope.modifySavedTextCI = [];
+ $rootScope.TextRectangleArrCI = [];
+ $rootScope.rectDimensionCI = [];
+
+
+ // will refactor this code later
+
+
+ $rootScope.saveText = function () {
+ // this part will work first time when save button will be clicked
+ if ($rootScope.IsTextAlreadySaveCI == false) {
+ // getting textarea style properties
+ $rootScope.fontSizesCI = $("#text_area").css("font-size");
+ $rootScope.fontWeightCI = $("#text_area").css("font-weight");
+ $rootScope.fontStyleCI = $("#text_area").css("font-style");
+ $rootScope.textAlignmtCI = $("#text_area").css("text-align");
+ $rootScope.fontColorCI = $("#text_area").css("color");
+ $rootScope.fontFamilyCI = $("#text_area").css("font-family");
+ $rootScope.underlineTextCI = $("#text_area").css("text-decoration");
+ $rootScope.textAreaCI = $("#text_area").val();
+
+ // deleting previous text area
+
+ $("#canvas").removeLayer('TextArea_' + $rootScope.resetTextCI).drawLayers();
+ $("#canvas").removeLayer("TextRect_" + $rootScope.resetTextRectCI).drawLayers();
+
+ // Text After Saving in Rectangle
+ $('#canvas').drawText({
+ layer: true,
+ draggable: true,
+ name: 'TextArea_' + $rootScope.resetTextCI,
+ groups: ['TextArea_' + $rootScope.resetTextCI],
+ dragGroups: ['TextArea_' + $rootScope.resetTextCI],
+ fillStyle: $rootScope.fontColorCI,
+ fontStyle: $rootScope.fontStyleCI,
+ fontSize: $rootScope.fontSizesCI,
+ fontFamily: $rootScope.fontFamilyCI,
+ align: $rootScope.textAlignmtCI,
+ strokeWidth: 0,
+ text: $rootScope.textAreaCI,
+ x: $scope.offsetX1, y: $scope.offsetY1,
+ maxWidth: $scope.x - $scope.offsetX1,
+ maxHeight: $scope.y - $scope.offsetY1,
+ add: function (layer) {
+ $rootScope.TextPropertyArrayCI.push({ Text1: '', Align: '', FontColor: '', FontSize: '', FontStyle: '', FontFamily: '' });
+ $rootScope.TextPropertyArrayCI.push({ Text1: layer.text, Align: layer.align, FontColor: layer.fillStyle, FontSize: layer.fontSize, FontStyle: layer.fontStyle, FontFamily: layer.fontFamily });
+ }
+ })
+ // Draw rectangle
+ .drawRect({
+ name: 'TextArea1_' + $rootScope.resetTextCI,
+ layer: true,
+ draggable: true,
+ groups: ['TextArea_' + $rootScope.resetTextCI],
+ dragGroups: ['TextArea_' + $rootScope.resetTextCI],
+ opacity: $rootScope.shapestyleOpacity,
+ strokeStyle: $rootScope.shapestyleborderColor,
+ strokeWidth: $rootScope.shapestyleborderWidth,
+ x: $scope.offsetX1, y: $scope.offsetY1,
+ width: $scope.x - $scope.offsetX1,
+ height: $scope.y - $scope.offsetY1,
+ click: function (layer) {
+ $rootScope.shapeTypeTextCI = "textAreaRect";
+
+ var layerNameSplit = layer.name;
+ var splitedName = layerNameSplit.split("_");
+ var textValName = "TextArea_";
+ var concatinateResult = textValName.concat(splitedName[1]);
+ $rootScope.canvasLayerNameCollectionCI = [];
+ $rootScope.canvasLayerNameCollectionCI.push({ textareaRectangle: layer.name, textareaString: concatinateResult });
+ $('#canvas').setLayer(layer.name, {
+ handle: {
+ type: 'rectangle',
+ fillStyle: '#fff',
+ strokeStyle: '#c33',
+ strokeWidth: 2,
+ width: 5, height: 5,
+ cornerRadius: 3
+ }
+ }).drawLayers();
+ },
+ dblclick: function (layer) {
+ $rootScope.IsTextAlreadySaveCI = true;
+
+ var _rectLayerOnSave = layer.name;
+ var _rectLayerOnSaveSplit = _rectLayerOnSave.split("_");
+ var TextAreaRectName = "TextArea_";
+ var TextAreaRectNameConcatenated = TextAreaRectName.concat(_rectLayerOnSaveSplit[1]);
+ $rootScope.modifySavedTextCI.push({ TextName: layer.name, RectText: TextAreaRectNameConcatenated });
+ $rootScope.rectDimensionCI.push({ width: layer.width, height: layer.height, x: layer.x, y: layer.y });
+ var _rectLayerOnSaveSplitInt;
+ if (_rectLayerOnSaveSplit[1] >= 3)
+ _rectLayerOnSaveSplitInt = parseInt(_rectLayerOnSaveSplit[1] - 2);
+ else
+ _rectLayerOnSaveSplitInt = parseInt(_rectLayerOnSaveSplit[1]);
+ var b = $rootScope.TextPropertyArrayCI[_rectLayerOnSaveSplitInt].Text1;
+ $("#text_area").val(b);
+ $("#text_area").css("font-size", $rootScope.TextPropertyArrayCI[_rectLayerOnSaveSplitInt].FontSize);
+ $("#text_area").css("font-weight", $rootScope.TextPropertyArrayCI[_rectLayerOnSaveSplitInt].FontStyle);
+ $("#text_area").css("font-style", $rootScope.TextPropertyArrayCI[_rectLayerOnSaveSplitInt].FontStyle);
+ $("#text_area").css("text-align", $rootScope.TextPropertyArrayCI[_rectLayerOnSaveSplitInt].Align);
+ $("#text_area").css("color", $rootScope.TextPropertyArrayCI[_rectLayerOnSaveSplitInt].FontColor);
+ $("#text_area").css("font-family", $rootScope.TextPropertyArrayCI[_rectLayerOnSaveSplitInt].FontFamily);
+ $("#text_area").css("text-decoration", $rootScope.underlineTextCI);
+ _rectLayerOnSaveSplitInt = ''; b = '';
+ $("#annotationTextModal").modal("toggle");
+ },
+ mouseout: function (layer) {
+ $rootScope.canvasLayerNameCollectionCI = [];
+ $('#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_area").val('');
+ $("#text_area").css({ " font-family": "'Verdana, sans-serif'", "font-size": "14px", "font-weight": "normal", "font-style": "normal", "color": "#000", "text-align": "left", "text-decoration": "none" });
+
+ }
+
+ // this part will work second time when save button will be clicked
+ else {
+ // getting textarea style properties
+ var _modifiedText = $("#text_area").val();
+ var _modifiedFontSize = $("#text_area").css("font-size");
+ var _modifiedFontWeight = $("#text_area").css("font-weight");
+ var _modifiedFontStyle = $("#text_area").css("font-style");
+ var _modifiedTextAlign = $("#text_area").css("text-align");
+ var _modifiedFontColor = $("#text_area").css("color");
+ var _modifiedFontFamily = $("#text_area").css("font-family");
+ var _modifiedFontDecoration = $("#text_area").css("text-decoration");
+
+ // deleting previous textarea
+ $("#canvas").removeLayer($rootScope.modifySavedTextCI[0].RectText).drawLayers();
+ $("#canvas").removeLayer($rootScope.modifySavedTextCI[0].TextName).drawLayers();
+ $rootScope.resetTextRectSaveCI = $rootScope.ObjectIndexSaveCI++;
+ $rootScope.resetTextSaveCI = $rootScope.ObjectIndexSaveCI++;
+
+ // generating new text area
+ $('#canvas').drawText({
+ layer: true,
+ draggable: true,
+ name: 'TextAreaAfterEdit_' + $rootScope.resetTextSaveCI,
+ groups: ['TextAreaAfterEdit_' + $rootScope.resetTextSaveCI],
+ dragGroups: ['TextAreaAfterEdit_' + $rootScope.resetTextSaveCI],
+ fillStyle: _modifiedFontColor,
+ fontStyle: _modifiedFontStyle,
+ fontSize: _modifiedFontSize,
+ fontFamily: _modifiedFontFamily,
+ align: _modifiedTextAlign,
+ strokeWidth: 0,
+ text: _modifiedText,
+ x: $rootScope.rectDimensionCI[$rootScope.rectDimensionCI.length - 1].x, y: $rootScope.rectDimensionCI[$rootScope.rectDimensionCI.length - 1].y,
+ maxWidth: $rootScope.rectDimensionCI[$rootScope.rectDimensionCI.length - 1].width,
+ maxHeight: $rootScope.rectDimensionCI[$rootScope.rectDimensionCI.length - 1].height
+
+ })
+ // Draw rect as wide as the text
+ .drawRect({
+ name: 'TextAreaAfterEditRect_' + $rootScope.resetTextSaveCI,
+ layer: true,
+ draggable: true,
+ groups: ['TextAreaAfterEdit_' + $rootScope.resetTextSaveCI],
+ dragGroups: ['TextAreaAfterEdit_' + $rootScope.resetTextSaveCI],
+ opacity: $rootScope.shapestyleOpacity,
+ strokeStyle: $rootScope.shapestyleborderColor,
+ strokeWidth: $rootScope.shapestyleborderWidth,
+ x: $rootScope.rectDimensionCI[$rootScope.rectDimensionCI.length - 1].x, y: $rootScope.rectDimensionCI[$rootScope.rectDimensionCI.length - 1].y,
+ width: $rootScope.rectDimensionCI[$rootScope.rectDimensionCI.length - 1].width,
+ height: $rootScope.rectDimensionCI[$rootScope.rectDimensionCI.length - 1].height,
+ click: function (layer) {
+ $rootScope.shapeTypeTextCI = "textAreaRect";
+ var layerNameSplit = layer.name;
+ var splitedName = layerNameSplit.split("_");
+ var textValName = "TextAreaAfterEdit_";
+ var concatinateResult = textValName.concat(splitedName[1]);
+ $rootScope.canvasLayerNameCollectionCI = [];
+ $rootScope.canvasLayerNameCollectionCI.push({ textareaRectangle: layer.name, textareaString: concatinateResult });
+
+ $('#canvas').setLayer(layer.name, {
+ handle: {
+ type: 'rectangle',
+ fillStyle: '#fff',
+ strokeStyle: '#c33',
+ strokeWidth: 2,
+ width: 5, height: 5,
+ cornerRadius: 3
+ }
+ }).drawLayers();
+
+ },
+ dblclick: function (layer) {
+
+ $rootScope.IsTextAlreadySaveCI = true;
+ var _rectLayerOnSave = layer.name;
+ var _rectLayerOnSaveSplit = _rectLayerOnSave.split("_");
+ var RectNameAfterEdit = "TextAreaAfterEdit_";
+ var RectNameAfterEditResult = RectNameAfterEdit.concat(_rectLayerOnSaveSplit[1]);
+ $rootScope.modifySavedTextCI.push({ TextName: layer.name, RectText: RectNameAfterEditResult });
+ $rootScope.rectDimensionCI.push({ width: layer.width, height: layer.height, x: layer.x, y: layer.y });
+ $("#text_area").val(_modifiedText);
+ $("#text_area").css("font-size", _modifiedFontSize);
+ $("#text_area").css("font-weight", _modifiedFontWeight);
+ $("#text_area").css("font-style", _modifiedFontStyle);
+ $("#text_area").css("text-align", _modifiedTextAlign);
+ $("#text_area").css("color", _modifiedFontColor);
+ $("#text_area").css("font-family", _modifiedFontFamily);
+ $("#text_area").css("text-decoration", _modifiedFontDecoration);
+ $("#annotationTextModal").modal("toggle");
+ },
+ mouseout: function (layer) {
+ $rootScope.canvasLayerNameCollectionCI = [];
+ $('#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();
+
+ }
+ });
+ $rootScope.modifySavedText = [];
+
+ }
+ }
+
+ // deleting text area on close button
+ $rootScope.closeModal = function () {
+
+ $("#canvas").removeLayer('TextArea_' + $rootScope.resetTextCI).drawLayers();
+ $("#canvas").removeLayer("TextRect_" + $rootScope.resetTextRectCI).drawLayers();
+
+ }
+
+
+ $(document).keydown(function (event) {
+
+ if (event.which == 46) {
+ if ($rootScope.shapeTypePinCI == "Pin") {
+
+
+ $("#canvas").removeLayer($rootScope.canvasLayerNameCollectionCI[0].pinName).drawLayers();
+ $("#canvas").removeLayer($rootScope.canvasLayerNameCollectionCI[0].ArcName).drawLayers();
+ $rootScope.shapeTypePinCI = "";
+
+ }
+ else if ($rootScope.shapeTypeTextCI == "textAreaRect") {
+
+
+
+ $("#canvas").removeLayer($rootScope.canvasLayerNameCollectionCI[0].textareaRectangle).drawLayers();
+ $("#canvas").removeLayer($rootScope.canvasLayerNameCollectionCI[0].textareaString).drawLayers();
+ $rootScope.shapeTypeTextCI = "";
+
+ }
+ else {
+
+ // alert($rootScope.canvasLayerNameCollection);
+ $("#canvas").removeLayer($rootScope.canvasLayerNameCollectionCI).drawLayers();
+ }
+
+
+ }
+
+ });
}]
diff --git a/400-SOURCECODE/AIAHTML5.Web/app/controllers/DAController.js b/400-SOURCECODE/AIAHTML5.Web/app/controllers/DAController.js
index f3223a1..5594e29 100644
--- a/400-SOURCECODE/AIAHTML5.Web/app/controllers/DAController.js
+++ b/400-SOURCECODE/AIAHTML5.Web/app/controllers/DAController.js
@@ -5902,10 +5902,9 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
// $scope.currentY;
//----Annotation Toolbar: Jcanvas---
- $scope.$on('annotationToolEvent', function (event, data) {
+ $rootScope.$on('annotationToolEvent', function (event, data) {
$("#canvas").css("display", "block");
$("#canvasPaint").css("display", "block");
-
$scope.doClick();
$rootScope.FreeStylePaint();
});
@@ -6096,7 +6095,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
resizeFromCenter: false,
dblclick: function () {
- $rootScope.backOpacity();
+ // $rootScope.backOpacity();
},
diff --git a/400-SOURCECODE/AIAHTML5.Web/app/controllers/HomeController.js b/400-SOURCECODE/AIAHTML5.Web/app/controllers/HomeController.js
index dc50d19..ae79191 100644
--- a/400-SOURCECODE/AIAHTML5.Web/app/controllers/HomeController.js
+++ b/400-SOURCECODE/AIAHTML5.Web/app/controllers/HomeController.js
@@ -133,17 +133,23 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location",
$("#canvasPaint").css("display", "none");
$("#canvas").css("display", "none");
}
-
+ $rootScope.CIAnotationIdentifyModeOff = false;
$rootScope.OnIdentifyClick = function () {
// $rootScope.isIdetifyClicked = true;
// $rootScope.isDrawingToolSelected = false;
- $("#canvasPaint").css("display", "none");
- $("#canvas").css("display", "none");
+ // debugger;
+ if ($rootScope.CIAnotationIdentifyModeOff == true) {
+ $('.btnCursor').removeClass('activebtncolor');
- // $("#canvasPaint").css("z-index", "0");
- // $("#canvas").css("z-index", "0");
- $('.btnCursor').removeClass('activebtncolor');
+ } else {
+ $("#canvasPaint").css("display", "none");
+ $("#canvas").css("display", "none");
+
+ // $("#canvasPaint").css("z-index", "0");
+ // $("#canvas").css("z-index", "0");
+ $('.btnCursor').removeClass('activebtncolor');
+ }
}
@@ -321,7 +327,7 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location",
$rootScope.shapestyleborderWidth = 2;
$rootScope.shapestyleborderStyles = "solid";
$rootScope.shapestyle = function (id) {
-
+ // debugger;
document.getElementById('modelbackground').style.display = "none";
document.getElementById('modeleditstyle').style.display = "none";
diff --git a/400-SOURCECODE/AIAHTML5.Web/app/views/ci/clinical-illustrations-detail.html b/400-SOURCECODE/AIAHTML5.Web/app/views/ci/clinical-illustrations-detail.html
index 7c8044b..a454e6a 100644
--- a/400-SOURCECODE/AIAHTML5.Web/app/views/ci/clinical-illustrations-detail.html
+++ b/400-SOURCECODE/AIAHTML5.Web/app/views/ci/clinical-illustrations-detail.html
@@ -1,4 +1,6 @@
' + $scope.clickedCISummary + '
-
+
+
+