'use strict';
AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location", "$timeout", "DataService",
function ($rootScope, Modules, $log, $location, $timeout, DataService) {
//$scope.pageToOpen = {
// name: 'MainMenu'
//};
$rootScope.pageToOpen = 'app/widget/MainMenu.html';
$rootScope.currentBodyViewId;
$rootScope.currentActiveModuleTitle = 'Welcome to A.D.A.M. Interactive Anatomy';//Modules[0].Name;
$rootScope.currentActiveViewTitle;
$rootScope.cuurentActiveModuleId;
$rootScope.openModules = [];
$rootScope.openViews = [];
$rootScope.currentSlug;
$rootScope.jsPanelTitle;
$rootScope.ViewTitle;
$rootScope.isLoading = false;
$rootScope.isAnnotationWindowOpen = false;
$rootScope.isDrawingToolSelected = false;
$rootScope.isIdetifyClicked = true;
$rootScope.paint = false;
$rootScope.clickX = new Array();
$rootScope.clickY = new Array();
$rootScope.clickDrag = new Array();
$rootScope.isLineDrawSelecyed = false;
$rootScope.isAnnotationWindowClose = false;
$rootScope.setListManagerZindex = false;
$rootScope.lastX;
$rootScope.lastY;
$rootScope.CommonData;
$rootScope.shapeType;
$rootScope.globalSetting = {
ethnicity: 'W',
modesty: 'Y',
};
$rootScope.formsetting = {
ethnicity: null,
modesty: null
};
$rootScope.isModestyOn;
$rootScope.isModestyOff;
$rootScope.SetSettingActiveTab;
$rootScope.disableMenuannotation = "disableMenuannotation";
$rootScope.disableMenuoption = "disableMenuoption";
$rootScope.menuLabExer;
$rootScope.menuLabExer = 0;
$rootScope.fontSizes;
$rootScope.fontWeight;
$rootScope.fontStyle;
$rootScope.textAlignmt;
$rootScope.fontColor;
$rootScope.underlineText;
$rootScope.textArea;
$rootScope.fontFamily;
$rootScope.TextPropertyArray = [];
$rootScope.modifySavedText = [];
$rootScope.TextRectangleArr = [];
$rootScope.rectDimension = [];
$rootScope.isEraseToolSelected = false;
$rootScope.isMousedownOnPaintCanvas = false;
$rootScope.$on("$locationChangeSuccess", function () {
if (($location.url() == "/da-body-view") || ($location.url() == "/clinical-illustrations-detail") || ($location.url() == "/clinical-animations-detail")) {
$rootScope.disableMenuannotation = " ";
$rootScope.disableMenuoption = " ";
}
else {
$rootScope.disableMenuannotation = "disableMenuannotation";
$rootScope.disableMenuoption = "disableMenuoption";
$rootScope.CloseAnnotationTool();
$rootScope.CloseListManager();
angular.element('#modal-settings').modal('hide');
if ($location.url() == "/lab-exercises") {
$rootScope.menuLabExer = 0;
}
if ($rootScope.menuLabExer == 1) {
$rootScope.disableMenuoption = " ";
}
}
});
//jspanel functionality..
$rootScope.openParent = function (slug) {
// debugger;
var openViews = $rootScope.openViews;
if (openViews.length > 0) {
$rootScope.openViews.splice(openViews.length - 1);
}
if (openViews.length > 0) {
var lastOpenMoudle = $rootScope.openViews[openViews.length - 1];
}
$('#daImagePanel').remove();
$location.url('/' + slug);
$rootScope.$broadcast('jsPanelCloseEvent', true);
}
//called on jsanel minimize
$rootScope.setState = function (state, title) {
var alreadyOpenThisView = new jinqJs()
.from($rootScope.openViews)
.where("body-views == " + title)
.select();
var k = 0;
if (alreadyOpenThisView != null) {
for (var i = 0; i < $rootScope.openViews.length; i++) {
k++;
if ($rootScope.openViews[i].body - views == title) {
$rootScope.openViews.splice((k - 1), 1);
$rootScope.openViews.push(
{
"module": $rootScope.currentActiveModuleTitle, "bodyView": title, "state": state, "BodyViewId": $rootScope.currentBodyViewId,
"slug": $rootScope.currentSlug
}
);
}
}
}
if (state == 'max') {
$('#daBodyview').css('width', '100%')
}
}
// $rootScope.DrawLine = function () {
//$rootScope.isIdetifyClicked = false;
//$rootScope.isDrawingToolSelected = true;
//$rootScope.isLineDrawSelecyed = true;
// $rootScope.shapeType = "Line";
// alert($rootScope.shapeType);
// }
$rootScope.ClearIframe = function () {
if ($('#daImagePanel') != null)
$('#daImagePanel').remove();
$rootScope.hideScrollbar();
}
//ends
$rootScope.hideScrollbar = function () {
$(".sidebar").mCustomScrollbar({
autoHideScrollbar: true,
//theme:"rounded"
});
}
$rootScope.isFontFamilyLoaded = false;
//annotation tool custom events
$rootScope.ShowAnnotationWindow = function () {
//7904
if ($rootScope.MenuModuleName == "DA") {
if ($rootScope.disableAnnotationtoolOnListManager == true) {
$('#AnnotaionPopupDiv').find('input, textarea, button, select,img,div').attr('disabled', 'disabled');
$('#slider-range-min-2').slider('disable');
// $rootScope.disableAnnotationTB = false;
} else {
$('#AnnotaionPopupDiv').find('input, textarea, button, select,img,div').removeAttr('disabled', 'disabled');
$('#slider-range-min-2').slider('enable');
}
// document.getElementById('modelbackground').style.display = "block";
// document.getElementById('modeleditstyle').style.display = "block";
}
$("#OnIdentify").addClass("annotationtoolbartab");
$("#annotationToolBarOptions").addClass("active");
$("#annotationButton").addClass("active");
$rootScope.isAnnotationWindowOpen = true;
$(".annotationTollbar").css("display", "block");
$rootScope.$broadcast('annotationToolEvent', true);
$("#canvasPaint").css("display", "none");
$("#canvas").css("display", "none");
var FontFamilyJson = '~/../content/data/json/settings/fontstyle.json';
if ($rootScope.isFontFamilyLoaded == false) {
DataService.getJson(FontFamilyJson)
.then(
function (result) {
$rootScope.AnnotationFontFamily = result;
// alert($rootScope.AnnotationFontFamily.FontStyle.length);
for (var i = 0; i <= $rootScope.AnnotationFontFamily.FontFamily.length - 1; i++) {
$("#selected-font-family").append("");
}
$rootScope.isFontFamilyLoaded = true;
},
function (error) {
console.log(error.statusText)
}
)
}
}
$rootScope.CloseAnnotationTool = function () {
console.log('close');
$("#OnIdentify").removeClass("annotationtoolbartab");
$("#DrawMode").removeClass("annotationtoolbartab");
$('.btnCursor').removeClass('activebtncolor');
$("#annotationButton").removeClass("active");
$("#annotationToolBarOptions").removeClass("active");
$(".annotationTollbar").css("display", "none");
$rootScope.isAnnotationWindowClose = true;
$("#canvasPaint").css("display", "none");
$("#canvas").css("display", "none");
$('.btnCursor').removeClass('activebtncolor');
$(".btn-annotation").removeClass("activebtncolor");
}
$rootScope.CIAnotationIdentifyModeOff = false;
$rootScope.OnIdentifyClick = function () {
$("#OnIdentify").addClass("annotationtoolbartab");
$("#DrawMode").removeClass("annotationtoolbartab");
// $rootScope.isIdetifyClicked = true;
// $rootScope.isDrawingToolSelected = false;
// debugger;
if ($rootScope.CIAnotationIdentifyModeOff == true) {
$('.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');
}
}
$rootScope.DrawingMode = function () {
$("#OnIdentify").removeClass("annotationtoolbartab");
$("#DrawMode").addClass("annotationtoolbartab");
$('.btnCursor').addClass('activebtncolor');
$rootScope.switchCanvas();
$("#canvasPaint").css("display", "block");
$("#canvas").css("display", "block");
}
// Dissectible Anatomy > Settings should be disable if Annotation is Open.
$rootScope.ShowSettingWindow = function () {
if ($(".annotationTollbar").css("display") == "block") {
// alert("already open");
}
else {
$('#modal-settings').modal('toggle');
}
}
//----Annotation Toolbar: Jcanvas-----
$rootScope.DrLine = function (e) {
$rootScope.setListManagerZindex = true;
$("#canvasPaint").css("display", "block");
$("#canvas").css("display", "block");
$rootScope.switchCanvas();
$rootScope.shapeType = "Line";
$('.btnCursor').removeClass('activebtncolor');
$(".btn-annotation").removeClass("activebtncolor");
$(".btn-annotation-line").addClass("activebtncolor");
}
$rootScope.DrPin = function (e) {
$("#canvasPaint").css("display", "block");
$("#canvas").css("display", "block");
$rootScope.switchCanvas();
$rootScope.switchCanvas();
$rootScope.setListManagerZindex = true;
$rootScope.shapeType = "Pin";
$('.btnCursor').removeClass('activebtncolor');
$(".btn-annotation").removeClass("activebtncolor");
$(".btn-annotation-pin").addClass("activebtncolor");
}
$rootScope.Cursor = function () {
$rootScope.switchCanvas();
$rootScope.shapeType = "cursor";
$(".btn-annotation").removeClass("activebtncolor");
// $("#" + e.currentTarget.id).removeClass("activebtncolor");
$('.btnCursor').addClass('activebtncolor');
}
$rootScope.DrawRectangle = function (e) {
$rootScope.setListManagerZindex = true;
$("#canvasPaint").css("display", "block");
$("#canvas").css("display", "block");
$rootScope.switchCanvas();
$rootScope.shapeType = "Rectangle";
$('.btnCursor').removeClass('activebtncolor');
$(".btn-annotation").removeClass("activebtncolor");
$(".btn-annotation-rectangle").addClass("activebtncolor");
}
$rootScope.paintBrush = function () {
// debugger;
// $('.btnCursor').addClass('activebtncolor');
$rootScope.setListManagerZindex = true;
$("#canvasPaint").css("display", "block");
$("#canvas").css("display", "block");
$rootScope.switchCanvasToPaintCanvas();
$rootScope.shapeType = "FreeStylePaint";
var btnBrushSizeValue = $("#btnBrushSize").val();
$rootScope.shapeSize = parseInt(btnBrushSizeValue);
$("#annotationpaintbrushsize").attr("data-size", $rootScope.shapeSize);
$("#annotationpaintbrushsize").attr("data-color", $rootScope.shapestyleFillColor);
if ($rootScope.shapeSize == '') {
$('#canvasPaint').sketch({ defaultSize: 1 });
}
else {
$('#canvasPaint').sketch();
}
// $('#canvasPaint').sketch();
}
$rootScope.switchCanvasToPaintCanvas = function (e) {
var canvasPaint_zIndex = $('#canvasPaint').css("z-index");
var canvas_zIndex = $('#canvas').css("z-index");
if (canvas_zIndex > canvasPaint_zIndex) {
canvasPaint_zIndex = parseInt(canvas_zIndex) + 1;
}
else {
canvasPaint_zIndex = parseInt(canvasPaint_zIndex) + 1;
}
$('#canvasPaint').css("z-index", canvasPaint_zIndex);
}
$rootScope.DrawCircle = function (e) {
$rootScope.setListManagerZindex = true;
$("#canvasPaint").css("display", "block");
$("#canvas").css("display", "block");
$rootScope.switchCanvas();
$rootScope.shapeType = "Circle";
$('.btnCursor').removeClass('activebtncolor');
$(".btn-annotation").removeClass("activebtncolor");
$(".btn-annotation-circle").addClass("activebtncolor");
}
$rootScope.DrawArrow = function (e) {
$rootScope.setListManagerZindex = true;
$("#canvasPaint").css("display", "block");
$("#canvas").css("display", "block");
$rootScope.switchCanvas();
$rootScope.shapeType = "Arrow";
$('.btnCursor').removeClass('activebtncolor');
$(".btn-annotation").removeClass("activebtncolor");
$(".btn-annotation-arrow").addClass("activebtncolor");
}
$rootScope.DrawText = function () {
$rootScope.setListManagerZindex = true;
$("#canvasPaint").css("display", "block");
$("#canvas").css("display", "block");
$rootScope.switchCanvas();
$rootScope.shapeType = "TextArea";
$('.btnCursor').removeClass('activebtncolor');
$(".btn-annotation").removeClass("activebtncolor");
$(".btn-annotation-Text").addClass("activebtncolor");
// $("#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" });
}
$rootScope.DrawPolygon = function () {
$rootScope.setListManagerZindex = true;
$("#canvasPaint").css("display", "block");
$("#canvas").css("display", "block");
$rootScope.shapeType = "DrawPolygon";
}
$rootScope.OpacityModal = function () {
}
$rootScope.switchCanvas = function () {
var x = $('#canvasPaint').css("z-index");
var y = $('#canvas').css("z-index");
if (x > y) {
y = parseInt(x) + 1;
} else {
y = parseInt(y) + 1;
}
$('#canvas').css("z-index", y);
}
$rootScope.EraseDrawing = function () {
$rootScope.switchCanvas();
$rootScope.isEraseToolSelected = true;
//$rootScope.switchCanvasToPaintCanvas();
//// $('#canvasPaint').sketch({ defaultColor: "yellow", defaultSize: 1 });
//var sktch = $('#canvasPaint').sketch();
//$('#canvasPaint').sketch().actions = []; // this line empties the actions.
//var myCanvas = document.getElementById("canvasPaint");
//var ctx = myCanvas.getContext('2d');
//ctx.clearRect(0, 0, myCanvas.width, myCanvas.height);
//$rootScope.switchCanvas();
}
//opacity code
$rootScope.shapestyleOpacity = 1;
$rootScope.shapestyleFillColor = "#fff";
$rootScope.shapestyleFillBorderColor = "black";
$rootScope.shapestyleborderWidth = 2;
$rootScope.shapestyleborderStyles = "solid";
$rootScope.shapestyle = function (id) {
// debugger;
document.getElementById('modelbackground').style.display = "none";
document.getElementById('modeleditstyle').style.display = "none";
$rootScope.shapestyleOpacity = $("#" + id).css('opacity');
$("#shapeStyleDiv").parent().css("opacity", $rootScope.shapestyleOpacity);
$rootScope.shapestyleFillColor = $("#" + id).css('background-color');
$("#shapeStyleDiv").css("background-color", $rootScope.shapestyleFillColor);
$rootScope.shapestyleborderColor = $("#" + id).parent().css("border-top-color");
$("#shapeStyleDiv").parent().css("border-color", $rootScope.shapestyleborderColor);
$rootScope.shapestyleborderWidthSeparatingPixel = $("#" + id).parent().css("border-top-width");
$("#shapeStyleDiv").parent().css("border-width", $rootScope.shapestyleborderWidthSeparatingPixel);
var pixelSeparation = $rootScope.shapestyleborderWidthSeparatingPixel;
var intPart = pixelSeparation.split("p");
$rootScope.shapestyleborderWidth = intPart[0];
$rootScope.shapestyleborderStyles = "solid";
$('#editshapestyle').modal('hide');
// name: 'Circle_' + $rootScope.resetCircle,
// $("#canvas").removeLayer("TextRect_" + $rootScope.resetTextRect).drawLayers();
//Edit Shape Style popup should open at it's default position
$("#modeleditstyle").css({ "left": "40%", "right": "0", "top": "70px" });
}
$rootScope.enableAnnotationToolBar = function () {
if ($rootScope.disableAnnotationTB == true) {
document.getElementById('modelbackground').style.display = "none";
//$("#editshapestyle").modal('show');
document.getElementById('modeleditstyle').style.display = "none";
}
else {
document.getElementById('modelbackground').style.display = "block";
//$("#editshapestyle").modal('show');
document.getElementById('modeleditstyle').style.display = "block";
if ($('#modeleditstyle').css("display") == "block") { //Check if the modal is already showing
var previewOpacity = $('#imgOpacity').css("opacity");
$('#slider-range-min-4 div.ui-slider-range-min').css("width", (previewOpacity * 100) + "%");
$('#slider-range-min-4 span.ui-slider-handle').css("left", (previewOpacity * 100) + "%");
};
}
}
$rootScope.enableEditShapeTooltip = function () {
$("#edit-block").addClass("custom-tooltip-annotation");
$(".custom-tooltip-annotation").css('display', 'block');
}
$rootScope.disableEditShapeTooltip = function () {
$(".custom-tooltip-annotation").css('display', 'none');
$("#edit-block").removeClass("custom-tooltip-annotation");
}
$rootScope.disableAnnotationToolBar = function () {
document.getElementById('modelbackground').style.display = "none";
document.getElementById('modeleditstyle').style.display = "none";
//Edit Shape Style popup should open at it's default position
$("#modeleditstyle").css({ "left": "40%", "right": "0", "top": "70px" });
}
//----End-------------
//--Common code of Annotation Toolbar for CI and DA-------
$rootScope.LineFn = function (canvasId, LineNumber, shapestyleborderColor, shapestyleborderWidth, offsetX1, offsetY1, x, y) {
if ($rootScope.islineMoved == true) {
$rootScope.islineMoved = 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();
},
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");
$('.btnCursor').addClass('activebtncolor');
}
$rootScope.RectangleFn = function (canvasId, RectNumber, shapestyleFillColor, shapestyleborderColor, shapestyleOpacity, shapestyleborderWidth, offsetX1, offsetY1, x, y) {
if ($rootScope.isrectangleMoved == true) {
$rootScope.isrectangleMoved = 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: false,
dblclick: function () {
// $rootScope.backOpacity();
},
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();
}
}).drawLayers();
}
$('.btnCursor').trigger('click');
$(".btn-annotation").removeClass("activebtncolor");
$('.btnCursor').addClass('activebtncolor');
}
$rootScope.CircleFn = function (canvasId, CircleNumber, shapestyleOpacity, shapestyleborderColor, shapestyleborderWidth, shapestyleFillColor, offsetX1, offsetY1, x, y) {
// console.log("up"+ offsetX1 + " " + offsetY1 + " " + (x - offsetX1) + " " + (y - offsetY1));
if ($rootScope.iscircleMoved == true) {
$rootScope.iscircleMoved = 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();
},
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();
}
}).drawLayers();
}
$('.btnCursor').trigger('click');
$(".btn-annotation").removeClass("activebtncolor");
$('.btnCursor').addClass('activebtncolor');
}
$rootScope.ArrowFn = function (canvasId, ArrowNumber, shapestyleborderColor, shapestyleborderWidth, offsetX1, offsetY1, x, y) {
if ($rootScope.isarrowMoved == true) {
$rootScope.isarrowMoved = 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,
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.PinFn = function (canvasId, PinNumber, offsetX1, offsetY1, x, y, PinArcNumber) {
if ($rootScope.isPinMoved == true) {
$rootScope.isPinMoved = false;
var radial = $('#canvas').createGradient({
x1: 50, y1: 50,
x2: 50, y2: 50,
r1: 10, r2: 30,
c1: 'rgba(100, 50, 0,0)',
c2: 'grey'
});
$(canvasId).drawLine({
draggable: true,
layer: true,
name: "Pin_" + PinNumber,
groups: ["Pin_" + PinNumber],
dragGroups: ["Pin_" + PinNumber],
strokeStyle: 'black',
strokeWidth: 2,
x1: offsetX1, y1: offsetY1,
x2: x, y2: y,
click: function (layer) {
$rootScope.shapeTypePin = "Pin";
$rootScope.canvasLayerNameCollection = [];
var pinLine_layer = layer.name;
var pinLine_layer_split = pinLine_layer.split("_");
var pinArcName = "ArcPin_";
var pinResult = pinArcName.concat(pinLine_layer_split[1]);
$rootScope.canvasLayerNameCollection.push({ pinName: layer.name, ArcName: pinResult });
$(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 = [];
$(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();
}
}).drawArc({
draggable: true,
name: "ArcPin_" + PinArcNumber,
// name: "Pin_" + $rootScope.resetPin,
layer: true,
groups: ["Pin_" + PinNumber],
dragGroups: ["Pin_" + PinNumber],
strokeStyle: 'grey',
strokeWidth: 2,
fillStyle: radial,
x: offsetX1, y: offsetY1,
radius: 5,
//handle: {
// type: 'arc',
// fillStyle: '#fff',
// strokeStyle: '#c33',
// strokeWidth: 2,
// radius: 3
//},
add: function (layer) {
$rootScope.PinArcNumber = layer.name;
// $scope.arr = [];
},
}).drawLayers();
}
$('.btnCursor').trigger('click');
$(".btn-annotation").removeClass("activebtncolor");
$('.btnCursor').addClass('activebtncolor');
}
$rootScope.TextAreaFn = function (canvasId, TextNumber, offsetX1, offsetY1, resetTextRect, shapestyleOpacity, shapestyleborderColor, shapestyleborderWidth, shapestyleFillColor, x, y) {
if ($rootScope.istextAreaMoved == true) {
$rootScope.istextAreaMoved = false;
$('#canvas').drawText({
layer: true,
draggable: true,
// opacity: $rootScope.shapestyleOpacity,
name: 'TextArea_' + $rootScope.TextNumber,
groups: ['TextArea_' + $rootScope.TextNumber],
dragGroups: ['TextArea_' + $rootScope.TextNumber],
fillStyle: '#36c',
strokeWidth: 0,
x: $rootScope.offsetX1, y: $rootScope.offsetY1,
fromCenter: false,
fontSize: '14pt',
align: "left",
fontFamily: 'Verdana, sans-serif',
text: '',
add: function (layer) {
$rootScope.TextID = layer.name;
}
})
// 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();
}
});
// Annotation: Edit Text option is missing.
$("#annotationTextModal").css("padding-right", "0px");
$("#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('');
$("#text_area").css({ "font-family": "Arial", "font-size": "14px", "font-weight": "normal", "font-style": "normal", "color": "#000", "text-align": "left", "text-decoration": "none" });
$("#selected-font-family option:eq(0)").prop('selected', true);
$("#selected-font-size option:eq(0)").prop('selected', true);
// $("#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" });
$("#text-italic").removeClass("ActiveFormattingButtonClass");
$("#text-bold").removeClass("ActiveFormattingButtonClass");
$("#text-underline").removeClass("ActiveFormattingButtonClass");
$("#text-left").removeClass("ActiveFormattingButtonClass");
$("#text-right").removeClass("ActiveFormattingButtonClass");
$("#text-center").removeClass("ActiveFormattingButtonClass");
$(".btn-annotation").removeClass("activebtncolor");
$('.btnCursor').addClass('activebtncolor');
}
$rootScope.clicked = true;
$rootScope.offsetX1 = 0;
$rootScope.offsetY1 = 0;
$rootScope.x = 0;
$rootScope.y = 0;
$rootScope.mousePressed = false;
$rootScope.lastX; $rootScope.lastY;
var ctx;
$rootScope.OnPaintCanvasMouseDown = function (event) {
var canvasElement = document.getElementById("canvas");
var ctx = canvasElement.getContext("2d");
// var x = event.clientX;
// 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;
$rootScope.ArrowNumber = 0;
$rootScope.PinNumber = 0;
$rootScope.PinArcNumber = 0;
$rootScope.ObjectIndex = 0;
$rootScope.ArcObjectIndex = 0;
$rootScope.PinObjectIndex = 0;
$rootScope.TextNumber = 0;
$rootScope.resetTextSave = 0;
$rootScope.ObjectIndexSave = 0;
var arrayRect = {};
var storeLine = '';
$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;
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.beginPath();
PaintCanvasctx.beginPath();
break;
case "Line":
$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":
$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);
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
$rootScope.resetTextRect = $rootScope.ObjectIndex++;
$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;
}
//}
}
$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();
$rootScope.islineMoved = true;
// console.log($rootScope.MouseMoveXAxis - $rootScope.offsetX1);
$("#canvasDiv").append("");
$rootScope.Annotationangle();
break;
case "Arrow":
$(".arrow").remove();
$rootScope.isarrowMoved = true;
$("#canvasDiv").append("");
$rootScope.Annotationangle();
break;
case "Pin":
$(".pin").remove();
$rootScope.isPinMoved = true;
$("#canvasDiv").append("");
$rootScope.Annotationangle();
break;
case "Circle":
$(".circle").remove();
$rootScope.iscircleMoved = true;
// 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();
$rootScope.isrectangleMoved = true;
// 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();
$rootScope.istextAreaMoved = true;
// 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 () {
document.getElementById('modelbackground').style.display = "none";
// this part will work first time when save button will be clicked
if ($rootScope.IsTextAlreadySave == false) {
// getting textarea style properties
$rootScope.fontSizes = $("#text_area").css("font-size");
$rootScope.fontWeight = $("#text_area").css("font-weight");
$rootScope.fontStyle = $("#text_area").css("font-style");
$rootScope.textAlignmt = $("#text_area").css("text-align");
$rootScope.fontColor = $("#text_area").css("color");
$rootScope.fontFamily = $("#text_area").css("font-family");
$rootScope.underlineText = $("#text_area").css("text-decoration");
$rootScope.textArea = $("#text_area").val();
// deleting previous text area
$("#canvas").removeLayer($rootScope.TextID).drawLayers();
$("#canvas").removeLayer($rootScope.TextAreaRectID).drawLayers();
// Text After Saving in Rectangle
$rootScope.resetTextRect = $rootScope.ObjectIndex++;
$('#canvas').drawText({
layer: true,
draggable: true,
name: 'TextAreaNew_' + $rootScope.resetTextRect,
groups: ['TextAreaNew_' + $rootScope.resetTextRect],
dragGroups: ['TextAreaNew_' + $rootScope.resetTextRect],
fillStyle: $rootScope.fontColor,
fontStyle: $rootScope.fontWeight + " " + $rootScope.fontStyle,
fontSize: $rootScope.fontSizes,
fromCenter: false,
fontFamily: $rootScope.fontFamily,
align: $rootScope.textAlignmt,
strokeWidth: 0,
text: $rootScope.textArea,
x: $rootScope.rectDimension[$rootScope.rectDimension.length - 1].x, y: $rootScope.rectDimension[$rootScope.rectDimension.length - 1].y,
maxWidth: $rootScope.rectDimension[$rootScope.rectDimension.length - 1].width,
maxHeight: $rootScope.rectDimension[$rootScope.rectDimension.length - 1].height,
add: function (layer) {
//$rootScope.TextPropertyArray.push({ Text1: '', Align: '', FontColor: '', FontSize: '', FontStyle: '', FontFamily: '' });
$rootScope.TextPropertyArray.push({ layerName: layer.name, Rect_Text: layer.text, Align: layer.align, FontColor: layer.fillStyle, FontSize: layer.fontSize, FontStyle: layer.fontStyle, FontFamily: layer.fontFamily, TextDecoration: $rootScope.underlineText });
}
})
// Draw rectangle
.drawRect({
name: 'TextArea1_' + $rootScope.resetTextRect,
layer: true,
draggable: true,
groups: ['TextAreaNew_' + $rootScope.resetTextRect],
dragGroups: ['TextAreaNew_' + $rootScope.resetTextRect],
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,
click: function (layer) {
$rootScope.shapeTypeText = "textAreaRect";
var layerNameSplit = layer.name;
var splitedName = layerNameSplit.split("_");
var textValName = "TextAreaNew_";
var concatinateResult = textValName.concat(splitedName[1]);
$rootScope.canvasLayerNameCollection = [];
$rootScope.canvasLayerNameCollection.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.isTextAreaClosedButtonActive = false;
$rootScope.IsTextAlreadySave = true;
var _rectLayerOnSave = layer.name;
var _rectLayerOnSaveSplit = _rectLayerOnSave.split("_");
var TextAreaRectName = "TextAreaNew_";
var TextAreaRectNameConcatenated = TextAreaRectName.concat(_rectLayerOnSaveSplit[1]);
$rootScope.layerNameArr = layer.name;
$rootScope.rectTextArr = TextAreaRectNameConcatenated;
$rootScope.rectDimension.push({ width: layer.width, height: layer.height, x: layer.x, y: layer.y });
for (var i = 0; i <= $rootScope.TextPropertyArray.length - 1; i++) {
if ($rootScope.TextPropertyArray[i].layerName == TextAreaRectNameConcatenated) {
var textArrVal = $rootScope.TextPropertyArray[i].Rect_Text;
$("#text_area").val(textArrVal);
var fontStyleProp = $rootScope.TextPropertyArray[i].FontStyle;
var fontWeightProp = fontStyleProp.split(" ");
$("#text_area").css("font-size", $rootScope.TextPropertyArray[i].FontSize);
$("#text_area").css("font-weight", fontWeightProp[0]);
$("#text_area").css("font-style", fontWeightProp[1]);
$("#text_area").css("text-align", $rootScope.TextPropertyArray[i].Align);
$("#text_area").css("color", $rootScope.TextPropertyArray[i].FontColor);
$("#text_area").css("font-family", $rootScope.TextPropertyArray[i].FontFamily);
$("#text_area").css("text-decoration", $rootScope.TextPropertyArray[i].TextDecoration);
$("#font-color .minicolors .minicolors-swatch .minicolors-swatch-color").css({ "background-color": $rootScope.TextPropertyArray[i].FontColor });
var CurrentFontFamily = $rootScope.TextPropertyArray[i].FontFamily;
// alert(CurrentFontFamily);
// CurrentFontFamily = CurrentFontFamily.replace(/'/g, "");
var CurrentFontSize = parseInt($rootScope.TextPropertyArray[i].FontSize);
$("#selected-font-family option[value=" + CurrentFontFamily + "]").prop('selected', true);
$("#selected-font-size option[value=" + CurrentFontSize + "]").prop('selected', true);
CurrentFontFamily = '';
CurrentFontSize = '';
// $(".ActiveDefaultColorAnnotation").css({ "background-color": $rootScope.TextPropertyArray[_rectLayerOnSaveSplitInt].FontColor + "!important" });
// $("#font-color .minicolors .minicolors-swatch .minicolors-swatch-color").addClass("ActiveDefaultColorAnnotation");
//adding text text decoration active class in text edit pop-up
if ($rootScope.TextPropertyArray[i].TextDecoration == "underline") {
$("#text-underline").addClass("ActiveFormattingButtonClass");
}
else {
$("#text-underline").removeClass("ActiveFormattingButtonClass");
}
//adding text font weight active class in text edit pop-up
if (fontWeightProp[0] == 700) {
$("#text-bold").addClass("ActiveFormattingButtonClass");
}
else {
$("#text-bold").removeClass("ActiveFormattingButtonClass");
}
//adding text font style active class in text edit pop-up
if (fontWeightProp[1] == "italic") {
$("#text-italic").addClass("ActiveFormattingButtonClass");
}
else {
$("#text-italic").removeClass("ActiveFormattingButtonClass");
}
//adding text alignment active class in text edit pop-up
if ($rootScope.TextPropertyArray[i].Align == "left") {
$("#text-right").removeClass("ActiveFormattingButtonClass");
$("#text-center").removeClass("ActiveFormattingButtonClass")
$("#text-left").addClass("ActiveFormattingButtonClass");
}
else if ($rootScope.TextPropertyArray[i].Align == "right") {
$("#text-center").removeClass("ActiveFormattingButtonClass")
$("#text-left").removeClass("ActiveFormattingButtonClass");
$("#text-right").addClass("ActiveFormattingButtonClass");
}
else if ($rootScope.TextPropertyArray[i].Align == "center") {
$("#text-left").removeClass("ActiveFormattingButtonClass");
$("#text-right").removeClass("ActiveFormattingButtonClass");
$("#text-center").addClass("ActiveFormattingButtonClass");
}
}
else {
// alert("no");
}
}
// _rectLayerOnSaveSplitInt = '';
textArrVal = '';
$("#annotationTextModal").css("padding-right", "0px");
document.getElementById('modelbackground').style.display = "block";
$("#annotationTextModal").modal("toggle");
// $("#selected-font-family").val(CurrentFontFamily);
// $("#selected-font-size").val(CurrentFontSize);
},
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_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" });
$("#selected-font-family option:eq(0)").prop('selected', true);
$("#selected-font-size option:eq(0)").prop('selected', true);
// $("#selected-font-family option:eq(0)").prop('selected', true);
// $("#selected-font-size option:eq(0)").prop('selected', true);
// $("#selected-font-family option[value='Arial']").prop('selected', true);
// $("#selected-font-size option[value=14]").prop('selected', true);
$("#font-color .minicolors .minicolors-swatch .minicolors-swatch-color").css({ "background-color": "#000000" });
$("#text-italic").removeClass("ActiveFormattingButtonClass");
$("#text-bold").removeClass("ActiveFormattingButtonClass");
$("#text-underline").removeClass("ActiveFormattingButtonClass");
$("#text-left").removeClass("ActiveFormattingButtonClass");
$("#text-right").removeClass("ActiveFormattingButtonClass");
$("#text-center").removeClass("ActiveFormattingButtonClass");
}
// 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.layerNameArr).drawLayers();
$("#canvas").removeLayer($rootScope.rectTextArr).drawLayers();
$rootScope.resetTextRectSave = $rootScope.ObjectIndexSave++;
$rootScope.resetTextSave = $rootScope.ObjectIndexSave++;
// generating new text area
$('#canvas').drawText({
layer: true,
draggable: true,
name: 'TextAreaAfterEdit_' + $rootScope.resetTextSave,
groups: ['TextAreaAfterEdit_' + $rootScope.resetTextSave],
dragGroups: ['TextAreaAfterEdit_' + $rootScope.resetTextSave],
fillStyle: _modifiedFontColor,
fontStyle: _modifiedFontWeight + " " + _modifiedFontStyle,
fontSize: _modifiedFontSize,
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,
maxHeight: $rootScope.rectDimension[$rootScope.rectDimension.length - 1].height
})
// Draw rect as wide as the text
.drawRect({
name: 'TextAreaAfterEditRect_' + $rootScope.resetTextSave,
layer: true,
draggable: true,
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,
width: $rootScope.rectDimension[$rootScope.rectDimension.length - 1].width,
height: $rootScope.rectDimension[$rootScope.rectDimension.length - 1].height,
click: function (layer) {
$rootScope.shapeTypeText = "textAreaRect";
var layerNameSplit = layer.name;
var splitedName = layerNameSplit.split("_");
var textValName = "TextAreaAfterEdit_";
var concatinateResult = textValName.concat(splitedName[1]);
$rootScope.canvasLayerNameCollection = [];
$rootScope.canvasLayerNameCollection.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.isTextAreaClosedButtonActive = false;
$rootScope.IsTextAlreadySave = true;
var _rectLayerOnSave = layer.name;
var _rectLayerOnSaveSplit = _rectLayerOnSave.split("_");
var RectNameAfterEdit = "TextAreaAfterEdit_";
var RectNameAfterEditResult = RectNameAfterEdit.concat(_rectLayerOnSaveSplit[1]);
$rootScope.modifySavedTextIndexNumber = _rectLayerOnSaveSplit[1];
$rootScope.layerNameArr = layer.name;
$rootScope.rectTextArr = RectNameAfterEditResult;
$rootScope.rectDimension.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);
$("#font-color .minicolors .minicolors-swatch .minicolors-swatch-color").css({ "background-color": _modifiedFontColor });
// $(".ActiveDefaultColorAnnotation").css({ "background-color": _modifiedFontColor + "!important" });
// $("#font-color .minicolors .minicolors-swatch .minicolors-swatch-color").addClass("ActiveDefaultColorAnnotation");
//khushbu
var CurrentFontFamily = _modifiedFontFamily;
// alert(CurrentFontFamily);
// CurrentFontFamily = CurrentFontFamily.replace(/'/g, "");
var CurrentFontSize = parseInt(_modifiedFontSize);
$("#selected-font-family option[value=" + CurrentFontFamily + "]").prop('selected', true);
$("#selected-font-size option[value=" + CurrentFontSize + "]").prop('selected', true);
CurrentFontFamily = '';
CurrentFontSize = '';
//adding text text decoration active class in text edit pop-up
if (_modifiedFontDecoration == "underline") {
$("#text-underline").addClass("ActiveFormattingButtonClass");
}
else {
$("#text-underline").removeClass("ActiveFormattingButtonClass");
}
//adding text font weight active class in text edit pop-up
if (_modifiedFontWeight == 700) {
$("#text-bold").addClass("ActiveFormattingButtonClass");
}
else {
$("#text-bold").removeClass("ActiveFormattingButtonClass");
}
//adding text font style active class in text edit pop-up
if (_modifiedFontStyle == "italic") {
$("#text-italic").addClass("ActiveFormattingButtonClass");
}
else {
$("#text-italic").removeClass("ActiveFormattingButtonClass");
}
//adding text alignment active class in text edit pop-up
if (_modifiedTextAlign == "left") {
$("#text-right").removeClass("ActiveFormattingButtonClass");
$("#text-center").removeClass("ActiveFormattingButtonClass")
$("#text-left").addClass("ActiveFormattingButtonClass");
}
else if (_modifiedTextAlign == "right") {
$("#text-center").removeClass("ActiveFormattingButtonClass")
$("#text-left").removeClass("ActiveFormattingButtonClass");
$("#text-right").addClass("ActiveFormattingButtonClass");
}
else if (_modifiedTextAlign == "center") {
$("#text-left").removeClass("ActiveFormattingButtonClass");
$("#text-right").removeClass("ActiveFormattingButtonClass");
$("#text-center").addClass("ActiveFormattingButtonClass");
}
document.getElementById('modelbackground').style.display = "block";
$("#annotationTextModal").modal("toggle");
},
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();
}
});
}
}
//----
$rootScope.BindCanvasDrawingListners = function (event) {
$rootScope.clicked = true;
// OnPaintCanvasMouseDown(event);
var annotationCanvas = document.getElementById('canvas');
if (annotationCanvas != null || annotationCanvas != undefined) {
annotationCanvas.addEventListener('mousedown', $rootScope.OnPaintCanvasMouseDown, false);
annotationCanvas.addEventListener('mouseup', $rootScope.OnPaintCanvasMouseUp, false);
}
// alert("doclick");
};
$(document).keydown(function (event) {
// predefined function for detecting keyboard key
if (event.which == 46) {
if ($rootScope.shapeTypePin == "Pin") {
$("#canvas").removeLayer($rootScope.canvasLayerNameCollection[0].pinName).drawLayers();
$("#canvas").removeLayer($rootScope.canvasLayerNameCollection[0].ArcName).drawLayers();
$rootScope.shapeTypePin = "";
}
else if ($rootScope.shapeTypeText == "textAreaRect") {
$("#canvas").removeLayer($rootScope.canvasLayerNameCollection[0].textareaRectangle).drawLayers();
$("#canvas").removeLayer($rootScope.canvasLayerNameCollection[0].textareaString).drawLayers();
$rootScope.shapeTypeText = "";
}
else {
$("#canvas").removeLayer($rootScope.canvasLayerNameCollection).drawLayers();
}
}
});
$rootScope.closeModal = function () {
document.getElementById('modelbackground').style.display = "none";
//if ($rootScope.isTextAreaClosedButtonActive == true) {
// $("#canvas").removeLayer('TextArea_' + $rootScope.TextNumber).drawLayers();
// $("#canvas").removeLayer("TextRect_" + $rootScope.resetTextRect).drawLayers();
//}
}
//-- End ----------------------------
$rootScope.AddClick = function (x, y, dragging) {
$rootScope.clickX.push(x);
$rootScope.clickY.push(y);
$rootScope.clickDrag.push(dragging);
}
$rootScope.Redraw = function () {
var context = document.getElementById('paintCanvas').getContext('2d');
context.clearRect(0, 0, context.canvas.width, context.canvas.height); // Clears the canvas
context.strokeStyle = "#FFFFFF";
context.lineJoin = "round";
context.lineWidth = 5;
for (var i = 0; i < $rootScope.clickX.length; i++) {
context.beginPath();
if ($rootScope.clickDrag[i] && i) {
context.moveTo($rootScope.clickX[i - 1], $rootScope.clickY[i - 1]);
} else {
context.moveTo($rootScope.clickX[i] - 1, $rootScope.clickY[i]);
}
context.lineTo($rootScope.clickX[i], $rootScope.clickY[i]);
context.closePath();
context.stroke();
}
}
$rootScope.PaintCanvasMousedownListener = function (canvasContext, x, y) {
if ($rootScope.isLineDrawSelecyed == true) {
canvasContext.lineWidth = 0.1;
//$scope.paintCanvasContext.lineJoin = 'round';
//$scope.paintCanvasContext.lineCap = 'round';
canvasContext.strokeStyle = 'red';
canvasContext.beginPath();
//var canvasOffset = $("#myCanvas").offset();
//var offsetX = canvasOffset.left;
//var offsetY = canvasOffset.top;
canvasContext.moveTo(x, y);
}
}
$rootScope.PaintCanvasMouseupListener = function (canvasContext) {
if ($scope.isLineDrawSelecyed == true) {
}
}
$rootScope.PaintCanvasMousemoveListener = function (canvasContext, x, y) {
if ($rootScope.isLineDrawSelecyed == true) {
console.log('hm moving')
canvasContext.lineTo(x, y);
canvasContext.stroke();
}
}
$rootScope.Draw = function (x, y, isDown, context) {
if (isDown) {
context.beginPath();
context.strokeStyle = '#000000';
context.lineWidth = 1//$('#selWidth').val();
context.lineJoin = "round";
context.moveTo($rootScope.lastX, $rootScope.lastY);
context.lineTo(x, y);
context.closePath();
context.stroke();
}
$rootScope.lastX = x; $rootScope.lastY = y;
}
$rootScope.disableAnnotationTB = false;
$rootScope.disableAnnotationTBFn = function () {
$rootScope.disableAnnotationTB = true;
}
//list manager function
//list manager function
$rootScope.disableAnnotationtoolOnListManager = false;
$rootScope.ShowListManager = function () {
console.log('ShowListManager')
$rootScope.disableAnnotationtoolOnListManager = true;
$('#AnnotaionPopupDiv').find('input, textarea, button, select,img,div').attr('disabled', 'disabled');
$('#slider-range-min-2').slider('disable');
$rootScope.isLoading = true;
$('#spinner').css('visibility', 'visible');
$('#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" });
$('#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 () {
console.log('close')
$rootScope.disableAnnotationtoolOnListManager = false;
if ($rootScope.MenuModuleName == "DA") {
if ($rootScope.disableAnnotationtoolOnListManager == false) {
$('#AnnotaionPopupDiv').find('input, textarea, button, select,img,div').removeAttr('disabled', 'disabled');
$('#slider-range-min-2').slider('enable');
}
}
$('#listManager').css('display', 'none');
$("#listManager").css("visibility", "hidden");
$rootScope.isLoading = false;
$('#spinner').css('visibility', 'hidden');
//$('#spinner').css('display', 'none');
// $rootScope.isAnnotationWindowClose = true;
// if('#termList')
if ($('#termList option').length > 0) {
//$('#termList option') = null;
//$('#termList').innerHTML='';
$('#termList')
.find('option')
.remove()
.end()
if ($('#termList option').length > 0) {
}
}
}
function fillListManagerTerms() {
var len = $rootScope.openModules.length;
var openViewLen = $rootScope.openViews.length;
var currentOpenModuleId = $rootScope.openModules[len - 1].ModuleId;
var currentOpenViewId = $rootScope.openViews[openViewLen - 1].BodyViewId;
if (currentOpenModuleId == 1) {
}
}
//setrtings
$rootScope.SetSettingActiveTab = function (tabToSet) {
$rootScope.SettingsTab = tabToSet;
};
$rootScope.loadsettings = function () {
//1. For now we are by default opening DA settings tab
$rootScope.SettingsTab = 3;
//2.
var curentEthnicity = localStorage.getItem("globalEthnicity");
if (typeof (curentEthnicity) !== "undefined" && curentEthnicity !== null) {
$rootScope.globalSetting.ethnicity = curentEthnicity;
}
else {
localStorage.setItem("globalEthnicity", $rootScope.globalSetting.ethnicity);
}
var curentmodesty = localStorage.getItem("globalModesty");
if (typeof (curentmodesty) !== "undefined" && curentmodesty !== null) {
$rootScope.globalSetting.modesty = curentmodesty
}
else {
localStorage.setItem("globalModesty", $rootScope.globalSetting.modesty);
}
//3.
$rootScope.setModestySettings($rootScope.globalSetting.modesty);
//4.
$rootScope.setEthncitySettings($rootScope.globalSetting.ethnicity);
};
$rootScope.setModestySettings = function (currentmodsetting) {
if (currentmodsetting == 'Y') {
$rootScope.isModestyOn = true;
$rootScope.isModestyOff = false;
}
else {
$rootScope.isModestyOn = false;
$rootScope.isModestyOff = true;
}
}
$rootScope.setEthncitySettings = function (currentEthncitysetting) {
// this code is used for maintaing the currently selected Ethencity.
if (currentEthncitysetting == 'L') {
$("#btnEthnicA").addClass("skindefault");
if ($("#btnEthnicB").hasClass("skindefault")) { $("#btnEthnicB").removeClass("skindefault"); }
if ($("#btnEthnicL").hasClass("skindefault")) { $("#btnEthnicL").removeClass("skindefault"); }
if ($("#btnEthnicW").hasClass("skindefault")) { $("#btnEthnicW").removeClass("skindefault"); }
}
if (currentEthncitysetting == 'B') {
$("#btnEthnicB").addClass("skindefault");
if ($("#btnEthnicL").hasClass("skindefault")) { $("#btnEthnicL").removeClass("skindefault"); }
if ($("#btnEthnicW").hasClass("skindefault")) { $("#btnEthnicW").removeClass("skindefault"); }
if ($("#btnEthnicA").hasClass("skindefault")) { $("#btnEthnicA").removeClass("skindefault"); }
}
if (currentEthncitysetting == 'A') {
$("#btnEthnicL").addClass("skindefault");
if ($("#btnEthnicB").hasClass("skindefault")) { $("#btnEthnicB").removeClass("skindefault"); }
if ($("#btnEthnicW").hasClass("skindefault")) { $("#btnEthnicW").removeClass("skindefault"); }
if ($("#btnEthnicA").hasClass("skindefault")) { $("#btnEthnicA").removeClass("skindefault"); }
}
if (currentEthncitysetting == 'W') {
$("#btnEthnicW").addClass("skindefault");
if ($("#btnEthnicB").hasClass("skindefault")) { $("#btnEthnicB").removeClass("skindefault"); }
if ($("#btnEthnicL").hasClass("skindefault")) { $("#btnEthnicL").removeClass("skindefault"); }
if ($("#btnEthnicA").hasClass("skindefault")) { $("#btnEthnicA").removeClass("skindefault"); }
}
}
$rootScope.ChangeEthnicity = function (formsetting, skintone) {
formsetting.ethnicity = skintone;
$rootScope.setEthncitySettings(formsetting.ethnicity);
}
$rootScope.ChangeModesty = function (formsetting, modestyValue) {
formsetting.modesty = modestyValue;
$rootScope.setModestySettings(formsetting.modesty);
}
$rootScope.CloseSetting = function () {
$rootScope.setEthncitySettings($rootScope.globalSetting.ethnicity);
$rootScope.setModestySettings($rootScope.globalSetting.modesty);
$('#modal-settings').modal('hide');
}
$rootScope.UpdateAndCloseSetting = function (setting) {
$rootScope.UpdateSetting(setting);
$('#modal-settings').modal('hide');
};
$rootScope.UpdateSetting = function (setting) {
//1.
if (typeof (setting.ethnicity) !== "undefined" && setting.ethnicity !== null) {
$rootScope.ChangeEthnicity(setting, setting.ethnicity);
$rootScope.globalSetting.ethnicity = setting.ethnicity;
localStorage.setItem("globalEthnicity", $rootScope.globalSetting.ethnicity);
$rootScope.setEthncitySettings($rootScope.globalSetting.ethnicity);
}
if (typeof (setting.modesty) !== "undefined" && setting.modesty !== null) {
$rootScope.ChangeModesty(setting, setting.modesty);
$rootScope.globalSetting.modesty = setting.modesty;
localStorage.setItem("globalModesty", $rootScope.globalSetting.modesty);
$rootScope.setModestySettings($rootScope.globalSetting.modesty);
}
//2.
//localStorage.setItem("globalEthnicity", $rootScope.globalSetting.ethnicity);
//3.
//localStorage.setItem("globalModesty", $rootScope.globalSetting.modesty);
//4.
//$rootScope.reloadChildController();
var len = $rootScope.openModules.length;
if (len > 0) {
$rootScope.reloadChildController();
}
else {
$('#modal-settings').modal('hide');
}
};
$rootScope.reloadChildController = function () {
var len = $rootScope.openModules.length;
var currentOpenModuleId = $rootScope.openModules[len - 1].ModuleId;
//checking is DA module is opend.
if (currentOpenModuleId == 1) {
//Check that what current bodyview is open
if ($rootScope.openViews.length > 0) {
var openViewLen = $rootScope.openViews.length;
var currentOpenViewId = $rootScope.openViews[openViewLen - 1].BodyViewId;
//$rootScope.isSettingEventAlredayDispachted = true;
$rootScope.$broadcast('reloadDABodyViewEvent', { reloadDABodyViewId: currentOpenViewId }, true);
}
else {
$rootScope.$broadcast('reloadDAControllerEvent', true);
}
}
};
}]
);