').appendTo('#bodyViewList');
$compile($el)($scope);
$(".sidebar").mCustomScrollbar({
autoHideScrollbar: true,
//theme:"rounded"
});
});
}
};
$scope.DisableUI = function () {
//enable daBodyViewDiv which was disabled on thumbnail click so need not bother where to enable
//as jspanel disable/enable is working for all features
document.getElementById('daBodyview').style.pointerEvents = "auto";
document.getElementById('daBodyview').style.opacity = "1";
var daImagePanelConetent = document.getElementsByClassName("jsPanel-content");
for (var i = 0; i < daImagePanelConetent.length; i++) {
daImagePanelConetent[i].style.pointerEvents = "none";
daImagePanelConetent[i].style.opacity = "0.5";
}
//to disbale layer change slider
$('.ui-slider').slider('disable');
}
$scope.EnableUI = function () {
var daImagePanelConetent = document.getElementsByClassName("jsPanel-content");
for (var i = 0; i < daImagePanelConetent.length; i++) {
daImagePanelConetent[i].style.pointerEvents = "auto";
daImagePanelConetent[i].style.opacity = "1";
}
//to enable layer change slider
$('.ui-slider').slider('enable');
}
$scope.openView = function ($event) {
$rootScope.disableAnnotationTB = false;
$rootScope.MenuModuleName = "DA";
$rootScope.isLoading = true;
$('#spinner').css('visibility', 'visible');
$rootScope.currentBodyViewId = $event.currentTarget.id;
$rootScope.ViewTitle = $event.currentTarget.textContent;
localStorage.setItem("currentViewTitleFromJson", $event.currentTarget.textContent);
localStorage.setItem("currentViewTitle", $event.currentTarget.textContent);
localStorage.setItem("currentBodyViewId", $event.currentTarget.id);
var u = $location.url();
$location.url('/da-body-view');
var view_list = angular.element($event.currentTarget);
var view_list_male_female = view_list.attr('title');
if (($event.currentTarget.textContent == "Female Anterior" || $event.currentTarget.textContent == "Male Anterior")) {
$rootScope.AnteriorView = "active";
$rootScope.LateralView = "";
$rootScope.MedialView = "";
$rootScope.PosteriorView = "";
$rootScope.LateralArmView = "";
$rootScope.MedialArmView = "";
}
if (($event.currentTarget.textContent == "Female Lateral" || $event.currentTarget.textContent == "Male Lateral")) {
$rootScope.AnteriorView = "";
$rootScope.LateralView = "active";
$rootScope.MedialView = "";
$rootScope.PosteriorView = "";
$rootScope.LateralArmView = "";
$rootScope.MedialArmView = "";
}
if (($event.currentTarget.textContent == "Female Medial" || $event.currentTarget.textContent == "Male Medial")) {
$rootScope.AnteriorView = "";
$rootScope.LateralView = "";
$rootScope.MedialView = "active";
$rootScope.PosteriorView = "";
$rootScope.LateralArmView = "";
$rootScope.MedialArmView = "";
}
if (($event.currentTarget.textContent == "Female Posterior" || $event.currentTarget.textContent == "Male Posterior")) {
$rootScope.AnteriorView = "";
$rootScope.LateralView = "";
$rootScope.MedialView = "";
$rootScope.PosteriorView = "active";
$rootScope.LateralArmView = "";
$rootScope.MedialArmView = "";
}
if (($event.currentTarget.textContent == "Female Lateral Arm" || $event.currentTarget.textContent == "Male Lateral Arm")) {
$rootScope.AnteriorView = "";
$rootScope.LateralView = "";
$rootScope.MedialView = "";
$rootScope.PosteriorView = "";
$rootScope.LateralArmView = "active";
$rootScope.MedialArmView = "";
}
if (($event.currentTarget.textContent == "Female Medial Arm" || $event.currentTarget.textContent == "Male Medial Arm")) {
$rootScope.AnteriorView = "";
$rootScope.LateralView = "";
$rootScope.MedialView = "";
$rootScope.PosteriorView = "";
$rootScope.LateralArmView = "";
$rootScope.MedialArmView = "active";
}
//$rootScope.Normal = "LeftButtonsDefaultState";
if (view_list_male_female == "Male") {
$rootScope.male = "active";
$rootScope.female = "";
}
else {
$rootScope.male = "";
$rootScope.female = "active";
}
}
//load json data for body view
$scope.loadDissectibleAnatomyData = function () {
if ($rootScope.refreshcheck == null) {
$location.path('/');
}
//get current path
var currentURL = $location.path();
var selectedModuleName = '';
angular.forEach($rootScope.userModules, function (value, key) {
if (value.slug === currentURL.replace('/', '')) {
selectedModuleName = value.name;
$rootScope.currentActiveModuleTitle = selectedModuleName;
}
})
$rootScope.ClearIframe();
//load common data
var commondataJsonPath = '~/../content/data/json/da/da_dat_common.json';
DataService.getAnotherJson(commondataJsonPath)
.then(
function (result) {
$rootScope.CommonData = result;
$http({ method: 'GET', url: '~/../content/data/json/da/da_dat_contentlist.json' }).success(function (data) {
$scope.BodyViewData = data;
$scope.getDAViewList();
})
.error(function (data, status, headers, config) {
console.log(data);
});
},
function (error) {
console.log(error.statusText)
}
)
//load body-views data
// $('#daLoaderLabel').css('visibility', 'hidden')
$rootScope.isLoading = false;
//push the details of open module in array $rootScope.openModules
$rootScope.openModules.push({ "ModuleId": 1 });
}
//da-body-views functions
$scope.openBodyView = function () {
//disable whole div because till now jspanel is not created. enable when jspanel gets disabled because
//than jspanel will take care of disabling/enabling ui
document.getElementById('daBodyview').style.pointerEvents = "none";
document.getElementById('daBodyview').style.opacity = "0.5";
//Check if browser 'REFRESHED' or 'RELOADED'
if ($rootScope.CommonData != null) {
//0. we will initially append container to load body
//check if localstorage has any settings
var curentEthnicity = $rootScope.getLocalStorageValue("globalEthnicity");
if (typeof (curentEthnicity) !== "undefined" && curentEthnicity !== null) {
$rootScope.globalSetting.ethnicity = curentEthnicity;
}
var curentmodesty = $rootScope.getLocalStorageValue("globalModesty");
if (typeof (curentmodesty) !== "undefined" && curentmodesty !== null) {
$rootScope.globalSetting.modesty = curentmodesty
}
//0.1
var currentBodyViewId = $rootScope.getLocalStorageValue("currentBodyViewId");
if (currentBodyViewId == null || currentBodyViewId == undefined) {
// document.location = '/';
document.location = '/';
$rootScope.isVisibleLogin = true;
}
else {
$rootScope.isVisibleLogin = false;
$rootScope.loadSearchData();
console.log('currentBodyViewId pickjed from localStorage: ' + currentBodyViewId);
var openViews;
if ($rootScope.openViews != null || $rootScope.openViews != undefined) {
if ($rootScope.openViews.length > 0) {
openViews = new jinqJs()
.from($rootScope.openViews)
.where("BodyViewId == " + currentBodyViewId)
.select();
}
}
// 0.2 getting corresponding body view title
//var counter = 1;
var tittle = $rootScope.getLocalStorageValue("currentViewTitleFromJson");
localStorage.setItem("currentViewTitle", tittle);
//WILL BE USED WHEN MULTI VIEWOPEN FUNCTIONALITY IS IMPELMNETD
//if (openViews != null && openViews != undefined) {
// angular.forEach(openViews, function (value, key) {
// if (value.bodyView == tittle) {
// tittle = $rootScope.getLocalStorageValue("currentViewTitleFromJson") + counter++;
// $rootScope.currentActiveViewTitle = tittle;
// localStorage.setItem("currentViewTitle", tittle);
// }
// });
//}
//else {
// localStorage.setItem("currentViewTitle", tittle);
//}
//0.3
$.jsPanel({
id: 'daImagePanel',
selector: '.daBodyView',
theme: 'success',
currentController: 'DAController',
parentSlug: 'da-view-list',
ajax: {
url: 'app/views/da/da-view.html'
},
title: $rootScope.getLocalStorageValue("currentViewTitle"),
position: {
top: 70,
left: 1,
},
size: { width: $(window).outerWidth() - 10, height: $(window).outerHeight() - 110 },
});
console.log('jsPanel loaded daImagePanel exist= ' + document.getElementById('daImagePanel'))
//0.1
$rootScope.currentSlug = 'da-body-view';
//0.2
$rootScope.openViews.push(
{
"module": $rootScope.currentActiveModuleTitle, "bodyView": tittle, "state": 'max', "BodyViewId": $rootScope.currentBodyViewId,
"slug": $rootScope.currentSlug
}
);
//0.3
var daBodyviewElement = angular.element(document.getElementById("daBodyview"));
$timeout(function ()
{
$compile(daBodyviewElement.contents())($scope);
console.log('html is compiled ' + document.getElementById('daView'))
if (document.getElementById('daView') != null) {
$scope.loadDAView(currentBodyViewId);
}
else
{
$compile(daBodyviewElement.contents())($scope);
console.log('html is compiled in else ' + document.getElementById('daView'))
$scope.loadDAView(currentBodyViewId);
}
if ($('#daImagePanel').offset().top == 0)
$('#daImagePanel').css("top", '70px');
if ($('#daImagePanel').offset().left == 0)
$('#daImagePanel').css("left", '1px');
}, 350);
}
}
else {
//for now we are redirecting user to index page on page refresh because on refresh we lost the rootscope data and some of application
//features stopped working which were depenedent of rootscope data like List manager, annotation toolbar, settings, usermodule list, etc.
$location.path('/');
}
}
$scope.loadDAView = function (currentBodyViewId)
{
//0.4 added some stylesheets
$('#daBodyview').css("height", (parseInt($(window).outerHeight()) - 62 - 20));
$('#daBodyview').css("width", $(window).outerWidth());
//1. load navigator man first
console.log('before LoadBodyViewNavigatorImage call')
$scope.LoadBodyViewNavigatorImage();
$scope.currentTitleFromJson = $rootScope.getLocalStorageValue("currentViewTitle");
$scope.layerNumber = 0;
//2.
console.log('currentBodyViewId just before sending: ' + currentBodyViewId);
$scope.loadBodyViewData(currentBodyViewId);
//2. load bodyRegion data
$rootScope.isLoading = true;
$rootScope.voId = $rootScope.getLocalStorageValue("currentBodyViewId");
}
angular.element(document).ready(function (e) {
var $ua = navigator.userAgent;
// var $event = ($ua.match(/(iPod|iPhone|iPad|android)/i));
if (($ua.match(/(iPod|iPhone|iPad|android)/i))) {
$("#layerChangeSlider").css("pointer-events", "auto");
}
//to get slider working on ipad
var $ua = navigator.userAgent;
if (($ua.match(/(iPod|iPhone|iPad|android)/i))) {
var jspanelContainerWidth = $(".jsPanel-content").css("width");
$(".jsPanel-content").css({ "width": "100%", "min-width": jspanelContainerWidth });
$("#daImagePanel").css("width", "100%");
$("#layerChangeSlider").css("pointer-events", "auto");
// on identity mode click
$("#btnZoom").removeAttr("onclick");
$("#btnZoom").on("touchstart", function () {
if ($(".btn-annotation").hasClass("activebtncolor")) //Bug #14928
$(".btn-annotation").removeClass("activebtncolor");
//Dissectible Anatomy > Extract and Annotations displays apart on the page after click on Zoom-in.
$(".com").remove();
$("#bord").remove();
console.log('OnZoom is called outside ');
var scope = angular.element(document.getElementById("daView")).scope();
scope.$apply(function () {
scope.enableZoom();
});
});
// on transparency mode click
$("#btnTranparency").removeAttr("onclick");
$("#btnTranparency").on("touchstart", function () {
console.log('OnEnableExtract is called outside ');
var scope = angular.element(document.getElementById("daView")).scope();
scope.$apply(function () {
scope.createTransparencyBox('true');
});
});
// on normal mode click
$("#btnNormalMode").removeAttr("onclick");
$("#btnNormalMode").on("touchstart", function () {
console.log('OnEnableNormalMode is called outside ');
$("#btnTranparency").removeClass("disabled");
var scope = angular.element(document.getElementById("daView")).scope();
scope.$apply(function () {
scope.enableNormalMode();
});
});
// on extract mode click
$("#btnExtract").removeAttr("onclick");
$("#btnExtract").on("touchstart", function () {
console.log('OnEnableExtract is called outside ');
var scope = angular.element(document.getElementById("daView")).scope();
scope.$apply(function () {
scope.enableExtract('true');
});
});
// on highlight mode click
$("#btnHighLight").removeAttr("onclick");
$("#btnHighLight").on("touchstart", function () {
console.log('OnEnableHighlight is called outside ');
var scope = angular.element(document.getElementById("daView")).scope();
scope.$apply(function () {
scope.enableHighlight();
});
});
// on show/hide mode click
$("#btnStrutureBox").removeAttr("onclick");
$("#btnStrutureBox").on("touchstart", function () {
console.log('OnBodySystem chnaged is called outside ');
var scope = angular.element(document.getElementById("daView")).scope();
scope.$apply(function () {
scope.enableShowHideStructureBox();
});
});
}
$(document).on("click", "#daImagePanel .jsPanel-hdr .jsPanel-hdr-r .jsPanel-btn-close .jsglyph-remove", function () {
$rootScope.selectedBodySystemName = 'All';
$rootScope.selectedBodySystemId = 0;
$rootScope.searchSelectedText = '';
});
$("#layerChangeSlider").slider({
orientation: "vertical",
range: "max",
min: 0,
value: 0,
slide: function (event, ui)
{
var layerNum;
var daViewScope = angular.element(document.getElementById("daView")).scope();
layerNum = parseInt(daViewScope.totalLayers) //- parseInt(scope.layerNumber);
var sliderVal = layerNum - ui.value;
$("#txtlayerNumber").val(sliderVal);
},
stop: function (event, ui) {
var la;
var rootScope = angular.element(document.getElementById("bo")).scope();
rootScope.$apply(function () {
rootScope.isLoading = true;
})
var scope = angular.element(document.getElementById("daView")).scope();
scope.$apply(function () {
if (scope.isTransparencyActivated) {
rootScope.isLoading = false;
}
la = parseInt(scope.totalLayers) //- parseInt(scope.layerNumber);
var slideVal = la - ui.value;
$("#txtlayerNumber").val(slideVal);
scope.layerNumber = slideVal;
scope.LayerChange();
$("#annotationpaintbrushsize").removeClass("activebtncolor");
$("#annotationpainteraser").removeClass("activebtncolor");
});
},
});
$("#daImagePanel").resize(function () {
$("#canvasDiv").scrollLeft($rootScope.CanvasDivLeftPosition);
$("#canvasDiv").scrollTop($rootScope.CanvasDivTopPosition);
});
$(document).on("mouseover", "#termList option", function (e) {
$('#termList option[selected="selected"]').attr("selected", false);
$(this).attr("selected", true);
});
$(document).keypress(function (e) {
if ($('#termList option[selected="selected"]').attr("id") == "undefined") {
return false;
}
else {
var originator = e.keyCode || e.which;
// alert($('#termList option[selected="selected"]').attr("id"));
if ($('#termList option[selected="selected"]').attr("id")) {
if (e.keyCode == 13) {
onListManagerTermSelection($('#termList option[selected="selected"]').attr("id"));
}
}
}
});
})
// $rootScope.languageArray = [];
$rootScope.loadSearchData = function () {
var primaryLexiconIndex;
var languageArray = [];
$rootScope.vocabTermDataArray = [];
var languageArray = $rootScope.lexiconLanguageArray;
console.log(languageArray.length);
console.log('loadSearchDataForBodyView');
var currentBodyViewId = $rootScope.getLocalStorageValue("currentBodyViewId");
for (var i = 0; i <= languageArray.length - 1; i++) {
var searchWorker = new Worker('search-wp.js');
//push workers in array to further used the refernece to delete the workers
$scope.runningSearchWorkers.push({ 'workerName': searchWorker })
//console.log('for bodyRegionId = ' + bodyRegionId + ', time: ' + new Date().toTimeString().replace(/.*(\d{2}:\d{2}:\d{2}).*/, "$1"))
searchWorker.postMessage({
'currentBodyViewId': currentBodyViewId,
'languageName': languageArray[i].language,
'languageID': languageArray[i].id
})
searchWorker.onmessage = function (e) {
//console.log('callback searchWorker , time: ' + new Date().toTimeString().replace(/.*(\d{2}:\d{2}:\d{2}).*/, "$1"));
$rootScope.TermNumberData = e.data.TermNumberData;
console.log("$rootScope.TermNumberData = " + $rootScope.TermNumberData.length);
$rootScope.VocabTermData = e.data.VocabTermData,//same
$scope.vocabTermTxt = e.data.vocabTermTxt,
$scope.vocabLanguage = e.data.language,
$rootScope.vocabTermDataArray.push({ "language": $scope.vocabLanguage, "VocabTermData": $rootScope.VocabTermData, "vocabTermTxt": $scope.vocabTermTxt });
for (var i = 0; i <= $rootScope.lexiconLanguageArray.length - 1; i++) {
$rootScope.vocabTermDataArray[i].vocabTermTxt = new jinqJs()
.from($rootScope.vocabTermDataArray[i].vocabTermTxt)
.distinct('_TermText', '_ActualTermNumber')
.orderBy([{ field: '_TermText', sort: 'asc' }])
.select('_ActualTermNumber', '_TermText', '_cdId');
// console.log("Language= " + $rootScope.lexiconLanguageArray[i].language + ", vocabTermTxt= " + $rootScope.vocabTermDataArray[i].vocabTermTxt[0]._TermText);
}
if ($rootScope.vocabTermDataArray.length == $rootScope.lexiconLanguageArray.length) {
$("#setting-spinner").css("display", "none");
for (var i = 0; i <= $rootScope.vocabTermDataArray.length - 1; i++) {
if ($rootScope.vocabTermDataArray[i].language == $rootScope.lexiconLanguageArray[0].language) {
primaryLexiconIndex = i;
}
}
//alert(primaryLexiconIndex);
if ($rootScope.isListManagerMenuSelected) {
$scope.loadListManger();
}
}
console.log('JlinqActivity , time: ' + new Date().toTimeString().replace(/.*(\d{2}:\d{2}:\d{2}).*/, "$1"));
if ($scope.runningSearchWorkers != null || $scope.runningSearchWorkers != undefined) {
var workerCount = $scope.runningSearchWorkers.length;
if (workerCount > 0) {
for (var i = workerCount - 1; i >= 0; i--) {
var runningWorker = $scope.runningSearchWorkers[i].workerName;
runningWorker.terminate();
$scope.runningSearchWorkers.splice(i, 1);
// workerCount--;
}
}
}
}
//console.log("s" + $rootScope.vocabTermDataArray);
//call watch on '$scope.VocabTermTxt and compile
and append to
on first time load
//$scope.$watch('$rootScope.vocabTermDataArray[primaryLexiconIndex].vocabTermTxt', function (newValue, oldValue, scope) {
//}, true);
}
}
$scope.loadBodyViewData = function (currentVoid) {
console.log('caller of worker sending currentVoid: ' + currentVoid);
var bodyViewWorker = new Worker('body-view-wp.js');
//push workers in array to further used the refernece to delete the workers
$scope.runningBodyViewWorkers.push({ 'workerName': bodyViewWorker })
bodyViewWorker.postMessage({
'currentViewId': currentVoid
});
bodyViewWorker.onmessage = function (e) {
//console.log('callback in extr');
$rootScope.BodyRegionData = e.data.bodyRegionData;
$rootScope.bgartData = e.data.bodyArtData;
$rootScope.BodyLayerData = e.data.bodyLayerData;
var dataLength = $rootScope.BodyLayerData.Layers.DataLayer.length;
//set max for LayerNumber input
$rootScope.totalLayers = dataLength - 1;
$('#txtLayerNumber').attr('max', $rootScope.totalLayers);
$('#layerChangeSlider').slider("option", "max", $rootScope.totalLayers);
$scope.isBodylayerdataLoaded = true;
$scope.LoadDefaultLayerImage();
}
bodyViewWorker.onerror = function (e) {
alert('Error: Line ' + e.lineno + ' in ' + e.filename + ': ' + e.message);
};
}
//Code for displaying NavigatorImage for BodyView
$scope.LoadBodyViewNavigatorImage = function () {
if ($rootScope.currentBodyViewId == undefined || $rootScope.currentBodyViewId == null) {
$rootScope.currentBodyViewId = $rootScope.getLocalStorageValue("currentBodyViewId");
}
console.log('insideLoadBodyViewNavigatorImage')
var NavigatorManJsonPath = '~/../content/data/json/da/da_dat_orient_image.json';
$http({ method: 'GET', url: NavigatorManJsonPath })
.success(function (data) {
$rootScope.NavigatorData = data;
$scope.skinTone = $rootScope.globalSetting.ethnicity;
var navigatorManData = new jinqJs()
.from($rootScope.NavigatorData.Navigtor.ViewOrientation)
.where("_ViewOrientationId == " + $rootScope.currentBodyViewId)
.select();
if ((navigatorManData != null || navigatorManData != undefined) && (navigatorManData.length > 0)) {
var imageInfoForNavigator = new jinqJs()
.from(navigatorManData[0].ImageInfo)
.where("_Ethnicity == " + $scope.skinTone)
.select();
}
else {
console.log('NAVIGATOR.DATA.NOT.FOUND FOR BODY VIEW: ' + $rootScope.currentBodyViewId);
}
if (imageInfoForNavigator != null || imageInfoForNavigator != undefined) {
$scope.navigatorImage = imageInfoForNavigator;
var navImageModesty;
if (($scope.navigatorImage != null || $scope.navigatorImage != undefined) && ($scope.navigatorImage.length > 0)) {
angular.forEach($scope.navigatorImage, function (value, key) {
if (value._HaveModesty === $rootScope.globalSetting.modesty) {
navImageModesty = value._ImageName;
}
})
}
if (typeof (navImageModesty) === "undefined" || navImageModesty === null) {
navImageModesty = $scope.navigatorImage[0]._ImageName;
}
// $scope.navimgsrc = "~/../content/images/DA/ethnicity/body-views/" + $scope.voId + '/' + $scope.skinTone + '/navigator_images/' + navImageModesty;
document.getElementById('navimg').src = "~/../content/images/DA/ethnicity/body-views/" + $scope.voId + '/' + $scope.skinTone + '/navigator_images/' + navImageModesty;
$('#navigatorDiv').css('visibility', 'visible');
$('#containment - wrapper').css('visibility', 'visible');
}
else {
console.log('NAVIGATOR.IMAGE.NOT.FOUND FOR BODY VIEW: ' + $rootScope.currentBodyViewId);
}
})
.error(function (data, status, headers, config) {
//1.
console.log('DATA.NOT.LOADED FOR:' + NavigatorManJsonPath + ', ERROR: ' + data);
//2.
// $scope.LoadBodyViewNavigatorImage()
});
}
$scope.LoadDefaultLayerImage = function () {
console.log('inside LoadDefaultLayerImage')
$rootScope.isNormalMode = true;
$scope.layerNumber = 0;
$scope.skinTone = $rootScope.globalSetting.ethnicity;
//viewOrientationId is to pic coordinates of view and void is to pic iamge name from resopective json
$rootScope.viewOrientationId = $rootScope.voId;
if ($rootScope.voId == 5) {
$rootScope.viewOrientationId = 1;
}
else if ($rootScope.voId == 6) {
$rootScope.viewOrientationId = 2;
}
else if ($rootScope.voId == 7) {
$rootScope.viewOrientationId = 3;
}
else if ($rootScope.voId == 8) {
$rootScope.viewOrientationId = 4;
}
else if ($rootScope.voId == 9) {
$rootScope.viewOrientationId = 5;
}
else if ($rootScope.voId == 10) {
$rootScope.viewOrientationId = 6;
}
else if ($rootScope.voId == 11) {
$rootScope.viewOrientationId = 5;
}
else if ($rootScope.voId == 12) {
$rootScope.viewOrientationId = 6;
}
$scope.CalculateImageCordinates($rootScope.viewOrientationId);
};
//calculate coordinates for body region images
$scope.CalculateImageCordinates = function (viewOrientationId) {
$scope.layerInfoForModesty = [];
$rootScope.isLoading = true;
$('#spinner').css('visibility', 'visible');
$scope.modestyImageInfo = [];
// annotation toolbar canvas
$scope.terminateCurrentlyRunningWPs();
var drawnBodyRegionCount = [];
if ($rootScope.MaskCanvasData != null || $rootScope.MaskCanvasData != undefined) {
var n = $rootScope.MaskCanvasData.length;
if (n > 0) {
for (var i = n - 1; i >= 0; i--) {
$rootScope.MaskCanvasData.splice(i, 1);
// workerCount--;
}
$rootScope.MaskCanvasData = null;
$rootScope.MaskCanvasData = [];
}
}
//set height of canvas div and left tool bar as per window size
$rootScope.BodyRegionCordinatesData = []; // create an empty array
$('#daBodyview').css('width', '100%');
var canvasDIvHeight = parseInt($('#daImagePanel').outerHeight()) - 104;
$('#canvasDiv').css('height', canvasDIvHeight);
$('#leftToolBar').css('height', $('#daImagePanel').outerHeight())
//calculate image coordinates and draw image
var bodyRegionCoordinates = $rootScope.BodyRegionData.BodyRegionViews;
// var viewOrientationId = String($rootScope.voId);
$scope.bodyRegionCoordinates = new jinqJs()
.from($rootScope.BodyRegionData.BodyRegionViews.BodyRegionCordinates)
.where('_ViewOrientationId == ' + viewOrientationId)
.select();
console.log('viewOrientationId= ' + viewOrientationId + ', $scope.bodyRegionCoordinates length= ' + $scope.bodyRegionCoordinates.length)
// if ($rootScope.voId == 9 || $rootScope.voId == 11) {
$scope.bagartDetails = new jinqJs()
.from($rootScope.bgartData.BackgroundArts.BackgroundArtDetail)
.where('_ViewOrientationId == ' + viewOrientationId)
.select();
//remove existing body view
var canDiv = document.getElementById('canvasDiv');
var canDivChildCount = canDiv.childElementCount;
if (canDivChildCount > 0) {
if ($rootScope.isTransparencyActivated) {
$scope.flushCanvas();
$('#transparencyScale').css('visibility', 'visible');
}
else {
canDiv.innerHTML = '';
//remove transparency scale
$('#transparencyScale').css('visibility', 'hidden');
}
}
if ($scope.ColoredImageSRC != null && $scope.ColoredImageSRC.length > 0) {
$scope.ColoredImageSRC = null;
$scope.ColoredImageSRC = [];
console.log('COLOREDIMAGESRC length = ' + $scope.ColoredImageSRC.length);
// $scope.flushCanvas();
}
else {
$scope.ColoredImageSRC = [];
}
if ($rootScope.updatedGrayDataList != null && $rootScope.updatedGrayDataList != undefined) {
$rootScope.updatedGrayDataList = [];
}
if ($rootScope.updatedGrayMRDataList != null && $rootScope.updatedGrayMRDataList != undefined) {
$rootScope.updatedGrayMRDataList = [];
}
if ($rootScope.grayImageDataList != null && $rootScope.grayImageDataList != undefined) {
$rootScope.grayImageDataList = [];
}
if ($rootScope.grayImageMRDataList != null && $rootScope.grayImageMRDataList != undefined) {
$rootScope.grayImageMRDataList = [];
}
//history code
if ($("#canvasDiv").find("canvas[id='canvasPaint']").length == 0) {
var ATBarHtml = $("#canvasDiv").append('');
$compile(ATBarHtml)($scope);
$scope.onDrawingCanvasClick();
// $rootScope.FreeStylePaint();
}
if ($rootScope.getLocalStorageValue("zoomInOutValue") != undefined)
$rootScope.zoomInOut = $rootScope.getLocalStorageValue("zoomInOutValue");
if ($scope.bodyRegionCoordinates != null || $scope.bodyRegionCoordinates != undefined) {
angular.forEach($scope.bodyRegionCoordinates, function (value, key) {
if (value._HaveMirrorImage == 'Y') {
//DrawMirroredImage
//0. Scaling as per default zoom
var rectangle = scaleRectangle(value._X, value._Y, value._Height, value._Width, value._MirrorValue);
//1.Get image source
var src = $scope.GetImageSource(value._BodyRegionId);
$scope.imageSource = src;
//2.Draw mirror image
$scope.DrawMirroredImage(Math.round(rectangle.scaledHeight), Math.round(rectangle.scaledWidth), Math.round(rectangle.scaledX), Math.round(rectangle.scaledY), src, value._BodyRegionId, 'N');
$rootScope.BodyRegionCordinatesData.push(
{
"bodyRegionId": value._BodyRegionId, "Height": Math.round(rectangle.scaledHeight), "Width": Math.round(rectangle.scaledWidth),
"X": Math.round(rectangle.scaledX), "Y": Math.round(rectangle.scaledY), "IsMirror": 'Yes'
}
);
//3.GetMaskImageSource
var maskImageSrc = $scope.GetMaskImageSource($scope.imageSource);
//4 Draw Mask Mirror Image
$scope.DrawMirroredImage(Math.round(rectangle.scaledHeight), Math.round(rectangle.scaledWidth), Math.round(rectangle.scaledX), Math.round(rectangle.scaledY), maskImageSrc, value._BodyRegionId, 'Y');
//Draw Normal Image
//0. Scaling as per default zoom
var rectangle = scaleRectangle(value._X, value._Y, value._Height, value._Width, 0);
//1.Draw body region which have mirror image
$scope.DrawImage(Math.round(rectangle.scaledHeight), Math.round(rectangle.scaledWidth), Math.round(rectangle.scaledX), Math.round(rectangle.scaledY), src, value._BodyRegionId, 'N');
$scope.BodyRegionCordinatesData.push(
{
"bodyRegionId": value._BodyRegionId, "Height": Math.round(rectangle.scaledHeight), "Width": Math.round(rectangle.scaledWidth),
"X": Math.round(rectangle.scaledX), "Y": Math.round(rectangle.scaledY), "IsMirror": 'No'
}
);
//2.Draw body region for mask image
$scope.DrawImage(Math.round(rectangle.scaledHeight), Math.round(rectangle.scaledWidth), Math.round(rectangle.scaledX), Math.round(rectangle.scaledY), maskImageSrc, value._BodyRegionId, 'Y');
}
else {
//0.Scaling as per default zoom
var rectangle = scaleRectangle(value._X, value._Y, value._Height, value._Width, value._MirrorValue);
//1.Get image source
if (value._IsPrimary == 'N') {
var src = $scope.GetBackgroundImgSource(value._BodyRegionId);
$scope.imageSource = src;
}
else {
var src = $scope.GetImageSource(value._BodyRegionId);
$scope.imageSource = src;
}
//2.Draw body region which don't have mirror image
$scope.DrawImage(Math.round(rectangle.scaledHeight), Math.round(rectangle.scaledWidth), Math.round(rectangle.scaledX), Math.round(rectangle.scaledY), src, value._BodyRegionId, 'N');
$scope.BodyRegionCordinatesData.push(
{
"bodyRegionId": value._BodyRegionId, "Height": Math.round(rectangle.scaledHeight), "Width": Math.round(rectangle.scaledWidth),
"X": Math.round(rectangle.scaledX), "Y": Math.round(rectangle.scaledY), "IsMirror": 'No'
}
);
//3.GetMaskImageSource
var maskSRC = $scope.GetMaskImageSource($scope.imageSource);
//4.Draw body region for mask image
$scope.DrawImage(Math.round(rectangle.scaledHeight), Math.round(rectangle.scaledWidth), Math.round(rectangle.scaledX), Math.round(rectangle.scaledY), maskSRC, value._BodyRegionId, 'Y');
//draw figLeaf for modesty
$scope.figLaefImageName;
$scope.figLaefX;
$scope.figLaefY;
var gender;
if ($rootScope.getLocalStorageValue("genderId") == 'Female') {
gender = 'F';
}
else {
gender = 'M';
}
if ((($rootScope.getLocalStorageValue("genderId") == 'Female') && (value._BodyRegionId == 2)) || (value._BodyRegionId == 3)) {
if ($scope.bagartDetails != null || $scope.bagartDetails != undefined) {
var dtlOfBr = new jinqJs()
.from($scope.bagartDetails)
.where('_BodyRegionId == ' + value._BodyRegionId)
.select();
if (dtlOfBr != null || dtlOfBr != undefined) {
var dtlOfGender = new jinqJs()
.from(dtlOfBr)
.where('_Gender == ' + gender)
.select();
if (dtlOfGender != null || dtlOfGender != undefined) {
var dtlOfSktn = new jinqJs()
.from(dtlOfGender)
.where('_Skintone == +')
.select();
//multiple conditions are not working in where clause of JinQ so need multiple filtered variables
if ((dtlOfSktn != null || dtlOfSktn != undefined) && (dtlOfSktn.length > 0)) {
if ((parseInt(dtlOfSktn[0]._lns) <= parseInt($scope.layerNumber)) && (parseInt(dtlOfSktn[0]._lne) > parseInt($scope.layerNumber)) && (dtlOfSktn[0]._isfr == 'Y')) {
$scope.figLaefImageName = dtlOfSktn[0]._ImageId;
$scope.lowerlayerNumberForModesty = dtlOfSktn[0]._lns;
$scope.HigherlayerNumberForModesty = dtlOfSktn[0]._lne;
$scope.layerInfoForModesty.push({ "bodyRegionId": value._BodyRegionId, "lowerlayerNumberForModesty": $scope.lowerlayerNumberForModesty, "HigherlayerNumberForModesty": $scope.HigherlayerNumberForModesty })
var rectangle = scaleRectangle(value._X, value._Y, value._Height, value._Width, value._MirrorValue);
var src = "content/images/DA/" + $rootScope.zoomInOut + "/body-views/" + $rootScope.voId + "/layers/0/" + value._BodyRegionId + "/" + $scope.figLaefImageName;
$scope.DrawImage(rectangle.scaledHeight, rectangle.scaledWidth, rectangle.scaledX, rectangle.scaledY, src, 'modestyImg' + value._BodyRegionId, 'N')
}
}
}
}
}
}
}
});
//$rootScope.isLoading = false;
//$('#spinner').css('visibility', 'hidden');
}
if (($rootScope.globalSetting.modesty == 'Y')) {
if ($('.modestyImg') != null) {
$('.modestyImg').css('visibility', 'visible');
}
}
//set scrollbars on canvas and hide loading label
// var isiOSSafari = (navigator.userAgent.match(/like Mac OS X/i)) ? true : false;
var isiOSSafari = (navigator.userAgent.match(/iPad/i)) ? true : false;
//set scrollbars on canvas and hide loading label
$('#daLoaderLabel').css('visibility', 'hidden')
$('#canvasDiv').css('overflow', 'scroll')
if (isiOSSafari) {
$('#canvasDiv').scrollLeft($('#canvasDiv').width() + 150)
}
else {
$('#canvasDiv').scrollLeft($('#canvasDiv').width() / 2)
}
// $('#canvasDiv').scrollLeft($scope.imageHorizontlScrollPosition)
$('#canvasDiv').scrollTop(50)
var abc = $rootScope.BodyRegionCordinatesData;
$('#layerChangeSlider').slider("option", "value", parseInt($rootScope.totalLayers) - parseInt($scope.layerNumber));
// $('#spinner').css('visibility', 'hidden');
$rootScope.isLoading = false;
//Dated:16-07-2016 Issue #4957 :While selecting the Zoom-in\Zoom-out button scroll should be go on top.
// #4976 :While changing gender male to female scroll bar is going on top.
var canvasDiv = document.getElementById('canvasDiv');
if (canvasDiv != null || canvasDiv != undefined) {
canvasDiv.scrollTop = 0;
//Navigator Code for dynamically calculating the height and width of Dragable Div on Navigator Image
var dragdivh = Math.floor(($('#canvasDiv').height() / $('#canvasDiv')[0].scrollHeight) * 119) //119px is the height of the image
if ($('#canvasDiv')[0].scrollWidth > $('#canvasDiv')[0].clientWidth) {
var dragdivw = 42
$scope.dragdivleft = 21;
$scope.dragdivtop = 0;
}
else {
var dragdivw = 83;
$scope.dragdivleft = 0;
$scope.dragdivtop = 0;
}
}
$(".dragdivposition").css("left", $scope.dragdivleft);
$(".dragdivposition").css("top", $scope.dragdivtop);
$('#draggable').css('width', dragdivw);
$('#draggable').css('height', dragdivh)
}
function scaleRectangle(x, y, height, width, mirrorValue) {
var nzoom = $rootScope.zoomInOut;
var existingZoon = 100;
var X = 0;
var scaledY = 0;
var scaledHeight = 0;
var scaledWidth = 0;
if (mirrorValue != 0) {
var mirroredX = parseInt(mirrorValue) + parseInt(x);
var newX = (mirroredX * nzoom);
mirroredX = (newX / existingZoon);
X = mirroredX;
}
else {
var newX = (x * nzoom);
X = (newX / existingZoon);
}
var newY = (y * nzoom);
var Y = (newY / existingZoon);
var newHeight = (height * nzoom);
var ht = (newHeight / existingZoon);
var newWidth = (width * nzoom);
var wt = (newWidth / existingZoon);
return {
scaledX: X,
scaledY: Y,
scaledHeight: ht,
scaledWidth: wt
}
}
$scope.GetMaskImageSource = function (src) {
if (src != null || src != undefined) {
if (src.match('.png')) {
var mciImage = src.replace('.png', '_mci.png')
}
else {
var mciImage = src.replace('.jpg', '_mci.png')
}
return mciImage;
}
else {
console.log('IMAGE.SOURCE.NOLT.FOUND');
}
}
$scope.GetImageSource = function (bodyRegionId) {
var dataLength = $rootScope.BodyLayerData.Layers.DataLayer.length;
// $('#layerChangeSlider').slider("option", "value",parseInt($rootScope.totalLayers)-parseInt($scope.layerNumber));
$scope.one = 1;
if ($rootScope.isListManagerSelected == true) {
$scope.layerNumber = $('#txtlayerNumber').val();
}
$scope.userInput = parseInt($scope.layerNumber);
$scope.skinTone = $rootScope.globalSetting.ethnicity;
var SelectedLayerData = [];
//as the data statrs with zero index and we have layer 331 on 0 index in json so we get the
//desired layer data by using below line of code.
SelectedLayerData = $rootScope.BodyLayerData.Layers.DataLayer[dataLength - $scope.userInput - 1];
if ((SelectedLayerData != null || SelectedLayerData != undefined))
if ($scope.layerNumber == 0) {
console.log('lNo: ' + $scope.layerNumber + ' and BodyRegion.length: ' + SelectedLayerData.BodyRegion.length);
if (SelectedLayerData.BodyRegion.length > 0) {
for (var z = 0; z < SelectedLayerData.BodyRegion.length; z++) {
var bodyRegion = SelectedLayerData.BodyRegion[z]._BodyRegionId;
var bodyRegionSkinTone = SelectedLayerData.BodyRegion[z].Image._SkintTone;
if ($rootScope.viewOrientationId == 3 && bodyRegionId == 1) {
console.log('$rootScope.voId: ' + $rootScope.voId);
if (bodyRegion == bodyRegionId && bodyRegionSkinTone == 'W') {
return "content/images/DA/" + $rootScope.zoomInOut + "/body-views/" + $rootScope.voId + "/layers/" + $scope.layerNumber + "/" + bodyRegionId + "/W/" + SelectedLayerData.BodyRegion[z].Image._ImageName;
}
}
else {
if (bodyRegion == bodyRegionId && bodyRegionSkinTone == $scope.skinTone) {
return "content/images/DA/" + $rootScope.zoomInOut + "/body-views/" + $rootScope.voId + "/layers/" + $scope.layerNumber + "/" + bodyRegionId + "/" + $scope.skinTone + "/" + SelectedLayerData.BodyRegion[z].Image._ImageName;
}
}
}
}
}
else {
//below 4 bodyviews have only single body region
if (($rootScope.voId == '9') || ($rootScope.voId == '11') || ($rootScope.voId == '10') || ($rootScope.voId == '12')) {
var bodyRegion = SelectedLayerData.BodyRegion._BodyRegionId;
return "content/images/DA/" + $rootScope.zoomInOut + "/body-views/" + $rootScope.voId + "/layers/" + $scope.layerNumber + "/" + bodyRegionId + "/" + SelectedLayerData.BodyRegion.Image._ImageName;
}
else // it is for other body view which have multiple body regions and layer no > 0
{
if (SelectedLayerData.BodyRegion.length > 0) {
for (var z = 0; z <= SelectedLayerData.BodyRegion.length; z++) {
var bodyRegion = SelectedLayerData.BodyRegion[z]._BodyRegionId;
if (bodyRegion == bodyRegionId) {
return "content/images/DA/" + $rootScope.zoomInOut + "/body-views/" + $rootScope.voId + "/layers/" + $scope.layerNumber + "/" + bodyRegionId + "/" + SelectedLayerData.BodyRegion[z].Image._ImageName;
}
}
}
}
}
}
$scope.GetBackgroundImgSource = function (bodyRegionId) {
var selectedGender;
if ($rootScope.getLocalStorageValue("genderId") == "Male") {
selectedGender = 'M';
}
else {
selectedGender = 'F';
}
//filter data based on bodyRegion
$scope.bagartBodyRegionDetails = new jinqJs()
.from($scope.bagartDetails)
.where('_BodyRegionId == ' + bodyRegionId)
.select();
if ($scope.bagartBodyRegionDetails != null || $scope.bagartBodyRegionDetails != undefined) {
//filter bodyRegion data basd on skintone
$scope.skinTone = $rootScope.globalSetting.ethnicity
$scope.bagartDetailsOnSktn = new jinqJs()
.from($scope.bagartBodyRegionDetails)
.where('_Skintone == ' + $scope.skinTone)
.select();
if ($scope.bagartDetailsOnSktn != null || $scope.bagartDetailsOnSktn != undefined) {
//only brid=2 is having different male,female image, other bodr region have common images for male, female
if (bodyRegionId == 2) {
for (var z = 0; z <= $scope.bagartDetailsOnSktn.length; z++) {
var gender = $scope.bagartDetailsOnSktn[z]._Gender;
if (gender == selectedGender) {
return "content/images/DA/" + $rootScope.zoomInOut + "/body-views/" + $rootScope.voId + "/layers/0/" + bodyRegionId + "/" + $scope.skinTone + "/" + $scope.bagartDetailsOnSktn[z]._ImageId;
}
}
}
else {
return "content/images/DA/" + $rootScope.zoomInOut + "/body-views/" + $rootScope.voId + "/layers/0/" + bodyRegionId + "/" + $scope.skinTone + "/" + $scope.bagartDetailsOnSktn[0]._ImageId;
}
}
}
}
$scope.DrawMirroredImage = function (h, w, x, y, src, bodyRegionId, isMaskImage) {
$scope.DisableUI();
$rootScope.isLoading = true;
$('#spinner').css('visibility', 'visible');
var FlipedImgCanvas = document.createElement('canvas');
FlipedImgCanvas.height = h;
FlipedImgCanvas.width = w;
FlipedImgCanvas.setAttribute("data-IsMirrored", "Y")
FlipedImgCanvas.style.position = "absolute";
FlipedImgCanvas.style.left = x + "px";
FlipedImgCanvas.style.top = y + "px";
if (isMaskImage == 'Y') {
FlipedImgCanvas.id = 'imageCanvas' + bodyRegionId + '_MR_mci';
FlipedImgCanvas.style.visibility = 'hidden';
}
else {
FlipedImgCanvas.id = 'imageCanvas' + bodyRegionId + '_MR';
if ($rootScope.isExtract == true) {
FlipedImgCanvas.style.visibility = 'visible'
}
else {
//if ($rootScope.isHighLight == true && $rootScope.isZoomed == false) {
// FlipedImgCanvas.style.visibility = 'hidden';
//}
}
}
FlipedImgCanvas.addEventListener('click', function (evt) {
var canvasDiv = document.getElementById('canvasDiv');
$scope.imageVerticalScrollPosition = canvasDiv.scrollTop;
//to get correct data on multihighlight highlight
if ($scope.isLayerChange == true) {
$scope.isLayerChange = false;
}
if (evt.ctrlKey) {
$rootScope.multiAnnotationIsON = true;
//document.getElementById("btnZoom").setAttribute('disabled', 'disabled');
}
else {
if (($rootScope.previousHighlightList != null || $rootScope.previousHighlightList != undefined) && ($rootScope.previousHighlightList.length > 0)) {
$rootScope.previousHighlightList = [];
}
$rootScope.multiAnnotationIsON = false;
// document.getElementById("btnZoom").disabled = false;
}
//get mouse coordinate of mirror image click
var mousePos = $scope.getMousePos(evt);
var context = FlipedImgCanvas.getContext("2d");
var canvasId = context.canvas.getAttribute('id');
var mirrorCanvasX = context.canvas.offsetLeft;
var mirrorCanvasWidth = context.canvas.clientWidth;
var maskCanvasId = (canvasId.replace('_MR', '')) + '_mci';
var maskCanvas = document.getElementById(maskCanvasId);
var maskCanvasContext = maskCanvas.getContext("2d");
var canvasDiv = document.getElementById('canvasDiv');
var verticalScrollPosition = canvasDiv.scrollTop;
var horizontlScrollPosition = canvasDiv.scrollLeft;
var distanceXOnMirrorImage = (parseInt(mirrorCanvasX) + parseInt(mirrorCanvasWidth)) - (parseInt(mousePos.x) + horizontlScrollPosition);// - 135);
var mirrorXOnNormalImage = parseInt(maskCanvasContext.canvas.offsetLeft) + parseInt(distanceXOnMirrorImage);
var actulalX = mirrorXOnNormalImage
var actualY = mousePos.y + verticalScrollPosition
var pixelData = maskCanvasContext.getImageData(Math.round(actulalX - parseInt(maskCanvasContext.canvas.offsetLeft)), Math.round(actualY - y), 1, 1);
pixelData.data[0] = pixelData.data[0] - 9;
pixelData.data[1] = pixelData.data[1] - 9;
pixelData.data[2] = pixelData.data[2] - 9
var Red;
var Green;
var Blue;
var zero = "0";
if ((pixelData.data[0]).toString().length != 2) {
Red = zero.concat((pixelData.data[0]).toString())
}
else {
Red = (pixelData.data[0]).toString()
}
if ((pixelData.data[1]).toString().length != 2) {
Green = zero.concat((pixelData.data[1]).toString())
}
else {
Green = (pixelData.data[1]).toString()
}
if ((pixelData.data[2]).toString().length != 2) {
Blue = zero.concat((pixelData.data[2]).toString())
}
else {
Blue = (pixelData.data[2]).toString()
}
var RGBColor = (Red + Green + Blue);
$rootScope.previousHighlightList.push(RGBColor);
if ($rootScope.isHighLight) {
if ($scope.machedIcolorInBodyRegion != null || $scope.machedIcolorInBodyRegion != undefined) {
if ($scope.machedIcolorInBodyRegion.length > 0) {
if ($rootScope.multiAnnotationIsON == false) {
for (var i = 0; i < $scope.machedIcolorInBodyRegion.length; i++) {
var bodyRegionId = $scope.machedIcolorInBodyRegion[i];
var grayCanvasID = 'imageCanvas' + bodyRegionId;
var grayCanvas = document.getElementById(grayCanvasID);
var grayCanvasContext = grayCanvas.getContext("2d");
if ($rootScope.grayImageDataList[bodyRegionId - 1] != null || $rootScope.grayImageDataList[bodyRegionId - 1] != undefined) {
var grayImageData = $rootScope.grayImageDataList[bodyRegionId - 1];
grayCanvasContext.putImageData(grayImageData, 0, 0);
}
// for mirrored canvas
if ($rootScope.voId == "1" || $rootScope.voId == "4" || $rootScope.voId == "5" || $rootScope.voId == "8") {
if (bodyRegionId == 4 || bodyRegionId == 5 || bodyRegionId == 6) {
var grayCanvasID = 'imageCanvas' + bodyRegionId + '_MR';
var grayCanvasMR = document.getElementById(grayCanvasID);
var grayCanvasContextMR = grayCanvasMR.getContext("2d");
if ($rootScope.grayImageMRDataList[bodyRegionId] != null || grayImageMRDataList[bodyRegionId] != undefined) {
var grayImageDataMR = $rootScope.grayImageMRDataList[bodyRegionId];
grayCanvasContextMR.putImageData(grayImageDataMR, 0, 0);
}
}
}
}
}
}
}
// $rootScope.previousHighlightList.push(RGBColor);
$scope.isClickedOnBodyForHighlight = true;
$scope.highLightBodyBasedOnIcolor(RGBColor);
}
//extarct clicked body part is extarct button is already enabled.
if ($rootScope.isExtract == true) {
if ($rootScope.multiAnnotationIsON == false) {
$rootScope.isListManagerSelected = false;
}
$scope.enableExtract(false);
}
var annotationText
if ($rootScope.TermNumberData != null && $rootScope.TermNumberData != undefined) {
annotationText = $scope.GetAnnotationText(parseInt(RGBColor));
}
else {
$rootScope.loadSearchData();
annotationText = $scope.GetAnnotationText(parseInt(RGBColor));
}
if ($('#speechBubbleTrns').length > 0)
$('#speechBubbleTrns').remove();
if ($rootScope.multiAnnotationIsON == true) {
// $scope.createDynamicSpeechBubble(evt, annotationText, evt.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left, evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top);
$scope.MultiLanguageAnnationArray = [];
for (var i = 0; i <= $rootScope.annotationText.length - 1; i++) {
$scope.MultiLanguageAnnationArray.push($rootScope.annotationText[i]);
}
$scope.createDynamicSpeechBubble(evt, evt.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left, evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top, true);
}
else {
if ($('#dot').length > 0) {
$('#dot').remove();
}
if ($('#sppeachBubble').length > 0) {
$('#sppeachBubble').remove();
// $scope.createDynamicSpeechBubble(evt, annotationText, evt.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left, evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top);
// alert(annotationText);
$scope.MultiLanguageAnnationArray = [];
for (var i = 0; i <= $rootScope.annotationText.length - 1; i++) {
$scope.MultiLanguageAnnationArray.push($rootScope.annotationText[i]);
}
$scope.createDynamicSpeechBubble(evt, evt.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left, evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top, true);
}
else {
// alert(annotationText);
// $scope.createDynamicSpeechBubble(evt, annotationText, evt.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left, evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top);
$scope.MultiLanguageAnnationArray = [];
for (var i = 0; i <= $rootScope.annotationText.length - 1; i++) {
$scope.MultiLanguageAnnationArray.push($rootScope.annotationText[i]);
}
$scope.createDynamicSpeechBubble(evt, evt.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left, evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top, true);
}
}
}, false);
FlipedImgCanvas.addEventListener('mousedown', function (evt) {
//alert('mousedown')
}, false);
FlipedImgCanvas.addEventListener('mouseup', function (evt) {
//alert('mouseup')
}, false);
var context = FlipedImgCanvas.getContext("2d");
var PI = Math.PI;
var PI2 = PI * 2;
var cw, ch, imgW, imgH, mouseX, mouseY;
var scaleFactor = 1.00;
//$scaler = $("#scaler");
//$scaler.val(scaleFactor);
//$scaler.hide();
var img = new Image();
img.onload = start;
// img.src = "~/../content/images/" + src;;
img.src = src;
function start() {
context.save();
context.translate(w, 0);
context.scale(-1, 1);
context.drawImage(img, 0, 0);
context.restore();
if (isMaskImage == 'N') {
var totalCanvas;
if (($rootScope.viewOrientationId == '1') || ($rootScope.viewOrientationId == '4')) {
totalCanvas = 9;
}
else if (($rootScope.viewOrientationId == '2') || ($rootScope.viewOrientationId == '3')) {
totalCanvas = 5;
}
else if (($rootScope.viewOrientationId == '5')) {
totalCanvas = 4;
}
else if (($rootScope.viewOrientationId == '6')) {
totalCanvas = 1;
}
if ($scope.ColoredImageSRC.length < totalCanvas) {
$scope.ColoredImageSRC.push(
{
"bodyRegionId": bodyRegionId, "SRC": src,
"Height": h,
"Width": w,
"x": x,
"y": y,
"haveMirror": 'true'
}
);
}
//else if ($scope.ColoredImageSRC.length == totalCanvas)
//{
// // dispatch event for enabling rest UI
// alert('all canvas drawn');
// $scope.EnableUI();
//}
//-NIKI-for solving extarct issue 8286
var imageCanvas = document.getElementById('imageCanvas' + bodyRegionId + '_MR');
if (imageCanvas != null || imageCanvas != undefined) {
var width = imageCanvas.width;
var ht = imageCanvas.height;
var coloredCanvasContext = imageCanvas.getContext("2d");
var coloredImageData = coloredCanvasContext.getImageData(0, 0, width, ht);
var coloredImageDataVar = coloredImageData;
$rootScope.coloredImageMRCanvasList[parseInt(bodyRegionId)] = coloredImageDataVar;
}
//
// console.log('$rootScope.isListManagerSelected= ' + $rootScope.isListManagerSelected + ' length= ' + $scope.ColoredImageSRC.length)
if (($scope.ColoredImageSRC != null || $scope.ColoredImageSRC != undefined)) {
if ((($rootScope.viewOrientationId == '1') || ($rootScope.viewOrientationId == '4')) && ($scope.ColoredImageSRC.length == 9)) {
$scope.isEligibleForHighlight = true;
}
else if ((($rootScope.viewOrientationId == '2') || ($rootScope.viewOrientationId == '3')) && ($scope.ColoredImageSRC.length == 5)) {
$scope.isEligibleForHighlight = true;
}
else if (($rootScope.viewOrientationId == '5') && ($scope.ColoredImageSRC.length == 4)) {
$scope.isEligibleForHighlight = true;
}
else if (($rootScope.viewOrientationId == '6') && ($scope.ColoredImageSRC.length == 1)) {
$scope.isEligibleForHighlight = true;
}
else {
$scope.isEligibleForHighlight = false;
}
if ($scope.isEligibleForHighlight == true) {
$scope.DisableUI();
if ($scope.isSearchDataLoaded) {
$rootScope.isLoading = false;
$('#spinner').css('visibility', 'hidden');
}
if ($scope.isExtract == true) {
$rootScope.isLoading = true;
$('#spinner').css('visibility', 'visible');
$scope.DisableUI();
$scope.highLightBody();
}
else if ($rootScope.isHighLight == true || ($rootScope.isListManagerSelected == true) || (($rootScope.isGenderChnage == true) && ($rootScope.isHighLight == true))
|| (($rootScope.isViewChange == true) && ($rootScope.isHighLight == true)) || $rootScope.isHighlightBodyByBodySystem == true) {
console.log('1. $rootScope.isHighLight= ' + $rootScope.isHighLight)
$rootScope.isLoading = true;
$('#spinner').css('visibility', 'visible');
$rootScope.isHighLight = true;
$scope.DisableUI();
$scope.highLightBody();
}
else {
$rootScope.isLoading = false;
$('#spinner').css('visibility', 'hidden');
//debugger;
$scope.EnableUI();
}
}
else {
$rootScope.isLoading = false;
$('#spinner').css('visibility', 'hidden');
//debugger;
$scope.EnableUI();
}
}
console.log('DrawMirroredImage- ColoredImageSRC. pushed and length: ' + $scope.ColoredImageSRC.length);
}
if (FlipedImgCanvas.id.match('_mci')) {
var maskImgData = context.getImageData(0, 0, w, h);
$rootScope.MaskCanvasData.push(
{
"bodyRegionId": bodyRegionId,
"canvasId": FlipedImgCanvas.id,
"maskData": maskImgData,
}
);
}
};
if (document.getElementById('canvasDiv') != null)
document.getElementById('canvasDiv').appendChild(FlipedImgCanvas);
}
$scope.DrawImage = function (h, w, x, y, src, bodyRegionId, isMaskImage) {
$scope.DisableUI();
$rootScope.isLoading = true;
$('#spinner').css('visibility', 'visible');
var imgCanvas = document.createElement('canvas');
imgCanvas.height = h;
imgCanvas.width = w;
imgCanvas.setAttribute("data-IsMirrored", "N")
imgCanvas.style.position = "absolute";
imgCanvas.style.left = x + "px";
imgCanvas.style.top = y + "px";
if (isMaskImage == 'Y') {
imgCanvas.style.visibility = 'hidden'
imgCanvas.id = 'imageCanvas' + bodyRegionId + '_mci';
}
else {
imgCanvas.id = 'imageCanvas' + bodyRegionId;
if (bodyRegionId == 3) {
//set z index of hip canavs to fix the issue caused by overlapping of arm canavs on hip canavs.
imgCanvas.style.zIndex = "100";
}
if (bodyRegionId.match('modestyImg')) {
//added class to further access this canavs to show and hide leaf as per modesty seting
imgCanvas.className = 'modestyImg'
imgCanvas.style.visibility = 'hidden'
//set z index to make leaf canvas on top of hip canavs
imgCanvas.style.zIndex = "200";
}
if (($rootScope.voId == 11 || $rootScope.voId == 9) && bodyRegionId == 6) {
imgCanvas.style.zIndex = "500";
}
if ($rootScope.isExtract == true) {
imgCanvas.style.visibility = 'visible'
}
else {
//if ($rootScope.isHighLight == true && $rootScope.isZoomed == false) {
// imgCanvas.style.visibility = 'hidden';
//}
}
}
imgCanvas.addEventListener('click', function (evt) {
var canvasDiv = document.getElementById('canvasDiv');
$scope.imageVerticalScrollPosition = canvasDiv.scrollTop;
if ($scope.isLayerChange == true) {
$scope.isLayerChange = false;
}
if (evt.ctrlKey) {
$rootScope.multiAnnotationIsON = true;
//$("#btnZoom").addClass('disabled');
// document.getElementById("btnZoom").setAttribute('disabled', 'disabled');
//$('#btnZoom').click(function (event) { event.preventDefault(); });
console.log('CTRL ON')
}
else {
if (($rootScope.previousHighlightList != null || $rootScope.previousHighlightList != undefined) && ($rootScope.previousHighlightList.length > 0)) {
$rootScope.previousHighlightList = [];
}
$rootScope.multiAnnotationIsON = false;
console.log('multiAnnotationIsON: ' + $rootScope.multiAnnotationIsON);
// document.getElementById("btnZoom").setAttribute('enabled', 'enabled');
// document.getElementById("btnZoom").disabled = false;
}
var annotationText;
var context = imgCanvas.getContext("2d");
var canvasId = context.canvas.getAttribute('id');
var maskCanvasId;
//for leaf canvas
if (canvasId.match('modestyImg')) {
maskCanvasId = canvasId;
}
else {
maskCanvasId = canvasId + '_mci';
}
var maskCanvas = document.getElementById(maskCanvasId);
var maskCanvasContext = maskCanvas.getContext("2d");
var mousePos = $scope.getMousePos(evt);
// alert(mousePos.x + ',' + mousePos.y);
var canvasDiv = document.getElementById('canvasDiv');
var verticalScrollPosition = canvasDiv.scrollTop;
var horizontlScrollPosition = canvasDiv.scrollLeft;
//We substracted 135, as the difference between flex and html coordinates for same organ is 135
var actulalX = mousePos.x + horizontlScrollPosition;
var actualY = mousePos.y + verticalScrollPosition;
var RGBColor = $scope.GetRGBColor(maskCanvasContext, actulalX, actualY, x, y);
//Modesty ON
if (maskCanvasId.match('modestyImg') && RGBColor != '000000') {
RGBColor = DA[0].figLeafTermId;
annotationText = $scope.GetAnnotationBasedOnActualTermNo(RGBColor);
}
//Modesty On but clicked somewhre else, we did modesty check because the modesty image covers whole body region so if user will click to
//see the annotation apart from leaf then the actual click will be on modesty canvas, but for annotation er
//
else if (maskCanvasId.match('modestyImg') && RGBColor == '000000') {
bodyRegionId = maskCanvasId.slice(-1);
maskCanvasId = 'imageCanvas' + bodyRegionId + '_mci';
var maskCanvas = document.getElementById(maskCanvasId);
var maskCanvasContext = maskCanvas.getContext("2d");
RGBColor = $scope.GetRGBColor(maskCanvasContext, actulalX, actualY, x, y);
// annotationText = $scope.GetAnnotationText(parseInt(RGBColor));
}
else {
RGBColor = $scope.GetRGBColor(maskCanvasContext, actulalX, actualY, x, y);
// annotationText = $scope.GetAnnotationText(parseInt(RGBColor));
}
if ($rootScope.TermNumberData != null && $rootScope.TermNumberData != undefined) {
annotationText = $scope.GetAnnotationText(parseInt(RGBColor));
}
else {
$rootScope.loadSearchData();
annotationText = $scope.GetAnnotationText(parseInt(RGBColor));
}
$rootScope.previousHighlightList.push(RGBColor);
if ($rootScope.isHighLight == true) {
if ($scope.machedIcolorInBodyRegion != null || $scope.machedIcolorInBodyRegion != undefined) {
if ($scope.machedIcolorInBodyRegion.length > 0) {
if ($rootScope.multiAnnotationIsON == false) {
for (var i = 0; i < $scope.machedIcolorInBodyRegion.length; i++) {
var bodyRegionId = $scope.machedIcolorInBodyRegion[i];
var grayCanvasID = 'imageCanvas' + bodyRegionId;
var grayCanvas = document.getElementById(grayCanvasID);
var grayCanvasContext = grayCanvas.getContext("2d");
if ($rootScope.grayImageDataList[bodyRegionId - 1] != null || $rootScope.grayImageDataList[bodyRegionId - 1] != undefined) {
var grayImageData = $rootScope.grayImageDataList[bodyRegionId - 1];
grayCanvasContext.putImageData(grayImageData, 0, 0);
}
// for unhighlight the mirrored body region
if ($rootScope.voId == "1" || $rootScope.voId == "4" || $rootScope.voId == "5" || $rootScope.voId == "8") {
if (bodyRegionId == 4 || bodyRegionId == 5 || bodyRegionId == 6) {
var grayCanvasID = 'imageCanvas' + bodyRegionId + '_MR';
var grayCanvasMR = document.getElementById(grayCanvasID);
var grayCanvasContextMR = grayCanvasMR.getContext("2d");
if ($rootScope.grayImageMRDataList[bodyRegionId] != null || $rootScope.grayImageMRDataList[bodyRegionId] != undefined) {
var grayImageDataMR = $rootScope.grayImageMRDataList[bodyRegionId];
grayCanvasContextMR.putImageData(grayImageDataMR, 0, 0);
}
}
}
}
}
}
}
// $rootScope.previousHighlightList.push(RGBColor);
if (maskCanvasId.match('modestyImg') && RGBColor != '000000') { }
else
{
$scope.isClickedOnBodyForHighlight = true;
$scope.highLightBodyBasedOnIcolor(RGBColor);
}
}
//extarct clisked body part is extarct button is already enabled.
if ($rootScope.isExtract == true) {
if ($rootScope.multiAnnotationIsON == false) {
$rootScope.isListManagerSelected = false;
}
$scope.enableExtract(false);
}
if ($('#speechBubbleTrns').length > 0)
$('#speechBubbleTrns').remove();
if ($rootScope.multiAnnotationIsON == true) {
// $scope.createDynamicSpeechBubble(evt, annotationText, evt.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left, evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top);
// alert(annotationText);
$scope.MultiLanguageAnnationArray = [];
for (var i = 0; i <= $rootScope.annotationText.length - 1; i++) {
$scope.MultiLanguageAnnationArray.push($rootScope.annotationText[i]);
}
$scope.createDynamicSpeechBubble(evt, evt.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left, evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top, true);
}
else {
$scope.MultiLanguageAnnationArray = [];
console.log('1. annotationText: ' + annotationText);
if ($('#dot').length > 0) {
$('#dot').remove();
if ($('#sppeachBubble').length > 0) {
$('#sppeachBubble').remove();
}
// $scope.createDynamicSpeechBubble(evt, annotationText, evt.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left, evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top);
for (var i = 0; i <= $rootScope.annotationText.length - 1; i++) {
$scope.MultiLanguageAnnationArray.push($rootScope.annotationText[i]);
}
console.log('2. annotationText: ' + annotationText + ' , length: ' + $scope.MultiLanguageAnnationArray.length);
$scope.createDynamicSpeechBubble(evt, evt.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left, evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top, true);
}
else {
$scope.MultiLanguageAnnationArray = [];
for (var i = 0; i <= $rootScope.annotationText.length - 1; i++) {
$scope.MultiLanguageAnnationArray.push($rootScope.annotationText[i]);
}
console.log('3. annotationText: ' + annotationText + ' , length: ' + $scope.MultiLanguageAnnationArray.length);
$scope.createDynamicSpeechBubble(evt, evt.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left, evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top, true);
}
}
}, false);
var PI = Math.PI;
var PI2 = PI * 2;
var cw, ch, imgW, imgH, mouseX, mouseY;
var scaleFactor = 1.00;
var context = imgCanvas.getContext('2d');
var img = new Image();
img.onload = start;
img.src = src;
function start() {
context.drawImage(img, 0, 0);
if (isMaskImage == 'N') {
if (bodyRegionId == 'modestyImg3' || bodyRegionId == 'modestyImg2') {
$scope.modestyImageInfo.push(
{
"bodyRegionId": bodyRegionId, "SRC": src,
"Height": h,
"Width": w,
"x": x,
"y": y,
"haveMirror": 'false'
}
);
}
else {
var totalCanvas;
if (($rootScope.viewOrientationId == '1') || ($rootScope.viewOrientationId == '4')) {
totalCanvas = 9;
}
else if (($rootScope.viewOrientationId == '2') || ($rootScope.viewOrientationId == '3')) {
totalCanvas = 5;
}
else if (($rootScope.viewOrientationId == '5')) {
totalCanvas = 4;
}
else if (($rootScope.viewOrientationId == '6')) {
totalCanvas = 1;
}
if ($scope.ColoredImageSRC.length < totalCanvas) {
$scope.ColoredImageSRC.push(
{
"bodyRegionId": bodyRegionId, "SRC": src,
"Height": h,
"Width": w,
"x": x,
"y": y,
"haveMirror": 'false'
}
);
}
//-NIKI-for solving extarct issue 8286
var imageCanvas = document.getElementById('imageCanvas' + bodyRegionId);
if (imageCanvas != null || imageCanvas != undefined) {
var width = imageCanvas.width;
var ht = imageCanvas.height;
var coloredCanvasContext = imageCanvas.getContext("2d");
var coloredImageData = coloredCanvasContext.getImageData(0, 0, width, ht);
var coloredImageDataVar = coloredImageData;
$rootScope.coloredImageCanvasList[parseInt(bodyRegionId - 1)] = coloredImageDataVar;
}
//
if (($scope.ColoredImageSRC != null || $scope.ColoredImageSRC != undefined)) {
if ((($rootScope.viewOrientationId == '1') || ($rootScope.viewOrientationId == '4')) && ($scope.ColoredImageSRC.length == 9)) {
$scope.isEligibleForHighlight = true;
}
else if ((($rootScope.viewOrientationId == '2') || ($rootScope.viewOrientationId == '3')) && ($scope.ColoredImageSRC.length == 5)) {
$scope.isEligibleForHighlight = true;
}
else if (($rootScope.viewOrientationId == '5') && ($scope.ColoredImageSRC.length == 4)) {
$scope.isEligibleForHighlight = true;
}
else if (($rootScope.viewOrientationId == '6') && ($scope.ColoredImageSRC.length == 1)) {
$scope.isEligibleForHighlight = true;
}
else {
$scope.isEligibleForHighlight = false;
}
if ($scope.isEligibleForHighlight == true) {
$scope.DisableUI();
if ($scope.isSearchDataLoaded) {
$rootScope.isLoading = false;
$('#spinner').css('visibility', 'hidden');
}
if ($scope.isExtract == true) {
$rootScope.isLoading = true;
$('#spinner').css('visibility', 'visible');
$scope.DisableUI();
$scope.highLightBody();
}
else if ($rootScope.isHighLight == true || ($rootScope.isListManagerSelected == true) || (($rootScope.isGenderChnage == true) && ($rootScope.isHighLight == true))
|| (($rootScope.isViewChange == true) && ($rootScope.isHighLight == true)) || $scope.isExtract == true || $rootScope.isHighlightBodyByBodySystem == true) {
console.log('2. $rootScope.isHighLight= ' + $rootScope.isHighLight)
$rootScope.isLoading = true;
$('#spinner').css('visibility', 'visible');
console.log('inside start of non flipped. $scope.ColoredImageSRC.length= ' + $scope.ColoredImageSRC.length)
$rootScope.isHighLight = true;
console.log('just before highLightBody call');
$scope.DisableUI();
$scope.highLightBody();
console.log('just after highLightBody call');
}
else {
$rootScope.isLoading = false;
$('#spinner').css('visibility', 'hidden');
//debugger;
$scope.EnableUI();
}
}
else {
$rootScope.isLoading = false;
$('#spinner').css('visibility', 'hidden');
//debugger;
$scope.EnableUI();
}
}
console.log('DrawImage- ColoredImageSRC. pushed and length: ' + $scope.ColoredImageSRC.length);
}
}
if (imgCanvas.id.match('_mci')) {
var maskImgData = context.getImageData(0, 0, w, h);
$rootScope.MaskCanvasData.push(
{
"bodyRegionId": bodyRegionId,
"canvasId": imgCanvas.id,
"maskData": maskImgData,
}
);
}
};
if (document.getElementById('canvasDiv') != null)
document.getElementById('canvasDiv').appendChild(imgCanvas);
}
$scope.highLightBodyBasedOnIcolor = function (RGBColor) {
//2. Find Actul Term No Based on Icolor.
var ActualTermNo = $scope.getActualTermNumber(RGBColor);
if (ActualTermNo != null) {
//3. Find Term No List Based on ActualTermNo
var TermList = $scope.getTermNumberList(ActualTermNo);
if (TermList != null) {
//4.
$scope.HighlightBodyByTermList(TermList);
}
}
}
$scope.HighlightBodyOnExtract = function () {
console.log(' insode HighlightBodyOnExtract. $rootScope.MaskCanvasData length= ' + $rootScope.MaskCanvasData.length + ', $rootScope.previousHighlightList.length= ' + $rootScope.previousHighlightList.length)
$("#btnExtract").removeClass("btn-black");
$("#btnExtract").addClass("btn-primary");
if ($("#btnNormalMode").hasClass("btn-primary")) {
$("#btnNormalMode").removeClass("btn-primary");
$("#btnNormalMode").addClass("btn-black");
}
if ($("#btnHighLight").hasClass("btn-primary")) {
$("#btnHighLight").removeClass("btn-primary");
$("#btnHighLight").addClass("btn-black");
}
//terminate previous running workers to create space for new workers
$scope.layerNumber = $('#txtlayerNumber').val();
$scope.terminateCurrentlyRunningWPs();
var multiTermList = [];
var CallBackBodyRegion = [];
var selectedAnnotation;
if (($rootScope.previousHighlightList != null || $rootScope.previousHighlightList != undefined) && ($rootScope.previousHighlightList.length > 0)
&& $rootScope.isListManagerSelected && $rootScope.multiAnnotationIsON == true) {
multiTermList = $scope.AllTerms;
angular.forEach($rootScope.previousHighlightList, function (value, key) {
var ActualTermNo = $scope.getActualTermNumber(value);
selectedAnnotation = ActualTermNo;
if (ActualTermNo != null) {
var TermList = $scope.getTermNumberList(ActualTermNo);
if (TermList != null) {
for (var i = 0; i < TermList.length; i++) {
multiTermList.push(TermList[i]);
}
}
}
// to do
});
}
if ($rootScope.isListManagerSelected) {
multiTermList = $scope.AllTerms;
selectedAnnotation = $rootScope.actualTermNumber;
}
else if (($rootScope.previousHighlightList != null || $rootScope.previousHighlightList != undefined) && ($rootScope.previousHighlightList.length > 0)) {
angular.forEach($rootScope.previousHighlightList, function (value, key) {
var ActualTermNo = $scope.getActualTermNumber(value);
selectedAnnotation = ActualTermNo;
if (ActualTermNo != null) {
var TermList = $scope.getTermNumberList(ActualTermNo);
if (TermList != null) {
for (var i = 0; i < TermList.length; i++) {
multiTermList.push(TermList[i]);
}
}
}
// to do
});
}
//get term list to get term coordinates
$scope.TermList = $scope.getTermNumberList(selectedAnnotation);
$scope.termCoordinate = $scope.getTermCoordinate(selectedAnnotation);
$timeout(function () {
var loopLength = 0;
if ((($rootScope.viewOrientationId == '1') || ($rootScope.viewOrientationId == '4')) && ($scope.ColoredImageSRC.length == 9)) {
loopLength = 9;
}
else if ((($rootScope.viewOrientationId == '2') || ($rootScope.viewOrientationId == '3')) && ($scope.ColoredImageSRC.length == 5)) {
loopLength = 5;
}
else if (($rootScope.viewOrientationId == '5') && ($scope.ColoredImageSRC.length == 4)) {
loopLength = 4;
}
else if (($rootScope.viewOrientationId == '6') && ($scope.ColoredImageSRC.length == 1)) {
loopLength = 1;
}
if (loopLength !== 0) {
for (var x = 0; x < loopLength; x++) {
if ($rootScope.MaskCanvasData[x] != null || $rootScope.MaskCanvasData[x] != undefined) {
var bodyRegionId = $rootScope.MaskCanvasData[x].bodyRegionId;
var canvasId = $rootScope.MaskCanvasData[x].canvasId;
var maskData = null;
maskData = $rootScope.MaskCanvasData[x].maskData;
var coloredImageDataVar = null;
var grayImageDataVar = null;
var white = null;
if (canvasId.match('_MR')) {
if ($rootScope.coloredImageMRCanvasList[bodyRegionId] != null || $rootScope.coloredImageMRCanvasList[bodyRegionId] != undefined) {
coloredImageDataVar = $rootScope.coloredImageMRCanvasList[bodyRegionId];
}
if ($rootScope.whiteImageMRDataList[bodyRegionId] != null || $rootScope.whiteImageMRDataList[bodyRegionId] != undefined) {
white = $rootScope.whiteImageMRDataList[bodyRegionId];
}
}
else {
if ($rootScope.coloredImageCanvasList[bodyRegionId - 1] != null || $rootScope.coloredImageCanvasList[bodyRegionId - 1] != undefined) {
coloredImageDataVar = $rootScope.coloredImageCanvasList[bodyRegionId - 1];
}
if ($rootScope.whiteImageDataList[bodyRegionId - 1] != null || $rootScope.whiteImageDataList[bodyRegionId - 1] != undefined) {
white = $rootScope.whiteImageDataList[bodyRegionId - 1];
}
}
var worker = new Worker('extract-wp.js');
//push workers in array to further used the refernece to delete the workers
$scope.runningWorkers.push({ 'workerName': worker })
console.log('for BRID = ' + bodyRegionId + ', coloredImageDataVar: ' + coloredImageDataVar + ', maskData= ' + maskData + ', white= ' + white)
if (coloredImageDataVar != null && maskData != null && white != null) {
worker.postMessage({
'termList': multiTermList,
'maskCanvasData': maskData,
'coloredImageData': coloredImageDataVar,
'grayImageData': white,
'bodyRegionId': bodyRegionId,
'canvasId': canvasId
});
}
//}
worker.onmessage = function (e) {
console.log('callback in extract for e.data.bodyRegionId: ' + e.data.bodyRegionId + ', time: ' + new Date().toTimeString().replace(/.*(\d{2}:\d{2}:\d{2}).*/, "$1"));
var updatedData = e.data.value;
var bodyRegionId = e.data.bodyRegionId;
var canvasId = (e.data.canvasId).replace('_mci', '');
//for (var i = 1; i <= updatedData.length; i++) {
var grayCanvasID = canvasId;
// var grayCanvasID = 'imageCanvas' + bodyRegionId;
var grayCanvas = document.getElementById(grayCanvasID);
var grayCanvasContext = grayCanvas.getContext("2d");
grayCanvasContext.putImageData(updatedData, 0, 0);
//to resolve lateral arm black issue in highlight mode
if ($rootScope.viewOrientationId == 5 && (bodyRegionId == 6 || bodyRegionId == 4)) {
var canavsWidth = parseInt(grayCanvas.width);
var canavsHeight = parseInt(grayCanvas.height);
console.log('canavsWidth= ' + canavsWidth + ', canavsHeight= ' + canavsHeight)
var imgData = grayCanvasContext.getImageData(0, 0, canavsWidth, canavsHeight);
var data = imgData.data;
var c = 0;
for (var i = 0; i < data.length; i += 4) {
if (data[i] == data[i + 1] && data[i + 1] == data[i + 2] && data[i + 2] === 0) {
data[i + 3] = 0;
}
}
grayCanvasContext.putImageData(imgData, 0, 0);
}
CallBackBodyRegion.push(bodyRegionId);
$scope.doAligneCanvasWithTerm = false;
if ((($rootScope.viewOrientationId == '1') || ($rootScope.viewOrientationId == '4')) && (CallBackBodyRegion.length == 9)) {
$scope.doAligneCanvasWithTerm = true;
}
else if ((($rootScope.viewOrientationId == '2') || ($rootScope.viewOrientationId == '3')) && (CallBackBodyRegion.length == 5)) {
$scope.doAligneCanvasWithTerm = true;
}
else if ((($rootScope.viewOrientationId == '5')) && (CallBackBodyRegion.length == 1)) {
$scope.doAligneCanvasWithTerm = true;
}
else if ((($rootScope.viewOrientationId == '6')) && (CallBackBodyRegion.length == 1)) {
$scope.doAligneCanvasWithTerm = true;
}
if ($rootScope.multiAnnotationIsON == true) {
if (canvasId.match('_MR'))
$rootScope.updatedWhiteImageMRDataList[bodyRegionId] = updatedData;
else
$rootScope.updatedWhiteImageDataList[bodyRegionId - 1] = updatedData;
}
else {
if (canvasId.match('_MR'))
$rootScope.whiteImageMRDataList[bodyRegionId] = e.data.value;
else {
if ($rootScope.whiteImageDataList[bodyRegionId - 1] != null || $rootScope.whiteImageDataList[bodyRegionId - 1] != undefined)
$rootScope.whiteImageDataList[bodyRegionId - 1] = e.data.value;
}
}
//if ((CallBackBodyRegion != null || CallBackBodyRegion[i] != undefined) && (CallBackBodyRegion.length > 0)) {
// if (CallBackBodyRegion.length == 6) {
// $rootScope.isLoading = false;
// $('#spinner').css('visibility', 'hidden');
// }
//}
if ($scope.doAligneCanvasWithTerm == true) {
$scope.aligneCanvasWithTerm();
//debugger;
$scope.EnableUI();
}
// $timeout(function () { $scope.DisableProgressBar() }, 1000);
};
worker.onerror = function (e) {
alert('Error: Line ' + e.lineno + ' in ' + e.filename + ': ' + e.message);
};
}
}
}
}, 500)
}
$scope.HighlightBodyByTermList = function (TermList) {
// $("#btnTranparency").attr('disabled', 'disabled');
$rootScope.currentLayerNumber = $scope.layerNumber;
$scope.layerNumber = $('#txtlayerNumber').val();
$rootScope.isLoading = true;
$('#spinner').css('visibility', 'visible');
if ($rootScope.isHighLight == true) {
false;
}
console.log('HighlightBodyByTermList is called');
$scope.highlightedBR = [];
$scope.terminateCurrentlyRunningWPs();
$timeout(function () {
var loopLength = 0;
if ((($rootScope.viewOrientationId == '1') || ($rootScope.viewOrientationId == '4')) && ($scope.ColoredImageSRC.length == 9)) {
loopLength = 9;
}
else if ((($rootScope.viewOrientationId == '2') || ($rootScope.viewOrientationId == '3')) && ($scope.ColoredImageSRC.length == 5)) {
loopLength = 5;
}
else if (($rootScope.viewOrientationId == '5') && ($scope.ColoredImageSRC.length == 4)) {
loopLength = 4;
}
else if (($rootScope.viewOrientationId == '6') && ($scope.ColoredImageSRC.length == 1)) {
loopLength = 1;
}
for (var x = 0; x < loopLength; x++) {
console.log('x value= ' + x);
if ($rootScope.MaskCanvasData[x] != null || $rootScope.MaskCanvasData[x] != undefined) {
var bodyRegionId = $rootScope.MaskCanvasData[x].bodyRegionId;
var canvasId = $rootScope.MaskCanvasData[x].canvasId;
var maskData = null;
maskData = $rootScope.MaskCanvasData[x].maskData;
var coloredImageDataVar = null;
var grayImageDataVar = null;
var white;
if (canvasId.match('_MR')) {
if ($rootScope.coloredImageMRCanvasList[bodyRegionId] != null || $rootScope.coloredImageMRCanvasList[bodyRegionId] != undefined) {
coloredImageDataVar = $rootScope.coloredImageMRCanvasList[bodyRegionId];
}
if ($rootScope.multiAnnotationIsON == true) {
//on layer change we need the fresh data not the updated one
if ($scope.isLayerChange == true) {
if ($rootScope.grayImageMRDataList[bodyRegionId] != null || $rootScope.grayImageMRDataList[bodyRegionId] != undefined) {
grayImageDataVar = $rootScope.grayImageMRDataList[bodyRegionId];
}
}
else {
if ($rootScope.updatedGrayDataList[bodyRegionId - 1] == null || $rootScope.updatedGrayDataList[bodyRegionId - 1] == undefined) {
if ($rootScope.grayImageMRDataList[bodyRegionId] != null || $rootScope.grayImageMRDataList[bodyRegionId] != undefined) {
grayImageDataVar = $rootScope.grayImageMRDataList[bodyRegionId];
}
}
else {
if ($rootScope.updatedGrayMRDataList[bodyRegionId] != null || $rootScope.updatedGrayMRDataList[bodyRegionId] != undefined) {
grayImageDataVar = $rootScope.updatedGrayMRDataList[bodyRegionId]
}
}
}
}
else {
if ($rootScope.grayImageMRDataList[bodyRegionId] != null || $rootScope.grayImageMRDataList[bodyRegionId] != undefined) {
grayImageDataVar = $rootScope.grayImageMRDataList[bodyRegionId];
}
}
}
else {
if ($rootScope.coloredImageCanvasList[bodyRegionId - 1] != null || $rootScope.coloredImageCanvasList[bodyRegionId - 1] != undefined) {
coloredImageDataVar = $rootScope.coloredImageCanvasList[bodyRegionId - 1];
}
if ($rootScope.multiAnnotationIsON == true) {
//on layer change we need the fresh data not the updated one
if ($scope.isLayerChange == true) {
if ($rootScope.grayImageDataList[bodyRegionId - 1] != null || $rootScope.grayImageDataList[bodyRegionId - 1] != undefined) {
grayImageDataVar = $rootScope.grayImageDataList[bodyRegionId - 1];
}
} else {
// this code is for the case where user first click on normal mode then extract then again highlight then we need to call highlight body in gray mode
//and then highlight the previously selected body regions at the time of normal mode.
if ($rootScope.updatedGrayDataList[bodyRegionId - 1] == null || $rootScope.updatedGrayDataList[bodyRegionId - 1] == undefined) {
if ($rootScope.grayImageDataList[bodyRegionId - 1] != null || $rootScope.grayImageDataList[bodyRegionId - 1] != undefined) {
grayImageDataVar = $rootScope.grayImageDataList[bodyRegionId - 1];
}
}
else {
if ($rootScope.updatedGrayDataList[bodyRegionId - 1] != null || $rootScope.updatedGrayDataList[bodyRegionId - 1] != undefined) {
// for normal case means without interdepency button case.
grayImageDataVar = $rootScope.updatedGrayDataList[bodyRegionId - 1];
}
}
}
}
else
if ($rootScope.grayImageDataList[bodyRegionId - 1] != null || $rootScope.grayImageDataList[bodyRegionId - 1] != undefined) {
grayImageDataVar = $rootScope.grayImageDataList[bodyRegionId - 1];
}
}
var worker = new Worker('term-number-wp.js');
//push workers in array to further used the refernece to delete the workers
$scope.runningWorkers.push({ 'workerName': worker })
console.log('before worker call BRID: ' + bodyRegionId)
//if (grayImageDataVar != null && coloredImageDataVar != null && maskData != null) {
if (grayImageDataVar != null && coloredImageDataVar != null && maskData != null && TermList != undefined && TermList.length > 0) {
worker.postMessage({
'termList': TermList,
'maskCanvasData': maskData,
'coloredImageData': coloredImageDataVar,
'grayImageData': grayImageDataVar,
'bodyRegionId': bodyRegionId,
'canvasId': canvasId
});
}
else {
$('#spinner').css('visibility', 'hidden')
$rootScope.isLoading = false;
}
worker.onmessage = function (e) {
console.log('callback for e.data.bodyRegionId: ' + e.data.bodyRegionId + ', time: ' + new Date().toTimeString().replace(/.*(\d{2}:\d{2}:\d{2}).*/, "$1"));
var updatedData = e.data.value;
var bodyRegionId = e.data.bodyRegionId;
var canvasId = (e.data.canvasId).replace('_mci', '');
var grayCanvasID = canvasId;
var grayCanvas = document.getElementById(grayCanvasID);
if (grayCanvas != null) {
var grayCanvasContext = grayCanvas.getContext("2d");
var canvasHeight = grayCanvas.height + 'px';
var canvasWidth = grayCanvas.width + 'px';
grayCanvasContext.clearRect(0, 0, canvasHeight, canvasWidth)
grayCanvasContext.putImageData(updatedData, 0, 0);
$scope.highlightedBR.push({ 'bodyRegionId': bodyRegionId });
}
if (canvasId.match('_MR')) {
$rootScope.updatedGrayMRDataList[bodyRegionId] = updatedData;
}
else
$rootScope.updatedGrayDataList[bodyRegionId - 1] = updatedData;
console.log('$scope.highlightedBR.length= ' + $scope.highlightedBR.length)
if ($scope.highlightedBR != null || $scope.highlightedBR != undefined) {
if ((($rootScope.viewOrientationId == '1') || ($rootScope.viewOrientationId == '4')) && ($scope.highlightedBR.length == 9)) {
$scope.doAligneCanvasWithTerm = true;
}
else if ((($rootScope.viewOrientationId == '2') || ($rootScope.viewOrientationId == '3')) && ($scope.highlightedBR.length == 5)) {
$scope.doAligneCanvasWithTerm = true;
}
else if ((($rootScope.viewOrientationId == '5')) && ($scope.highlightedBR.length == 1)) {
$scope.doAligneCanvasWithTerm = true;
}
else if ((($rootScope.viewOrientationId == '6')) && ($scope.highlightedBR.length == 1)) {
$scope.doAligneCanvasWithTerm = true;
}
if ($scope.doAligneCanvasWithTerm == true) {
if ($rootScope.isListManagerSelected == true) {
$scope.aligneCanvasWithTerm();
}
else if ($rootScope.previousHighlightList != undefined && $rootScope.previousHighlightList.length > 0 && ($scope.isGenderChnage == true || $scope.isViewChange == true)) {
var canvasDiv = document.getElementById('canvasDiv');
if ($rootScope.viewOrientationId == '1' || $rootScope.viewOrientationId == '4') {
$('#canvasDiv').scrollLeft($('#canvasDiv').width() / 2)
var canvasDiv = document.getElementById('canvasDiv');
$('#canvasDiv').scrollTop($scope.imageVerticalScrollPosition);
}
else {
$('#canvasDiv').scrollTop($scope.imageVerticalScrollPosition);
$('#canvasDiv').scrollLeft($scope.imageHorizontlScrollPosition);
$rootScope.isLoading = false;
}
$('#spinner').css('visibility', 'hidden');
}
//else if ($rootScope.isHighlightBodyByBodySystem == true || $rootScope.isListManagerSelected == true || $scope.isClickedOnBodyForHighlight
// )
else if ($rootScope.isHighlightBodyByBodySystem == true || $rootScope.isListManagerSelected == true) {
$rootScope.isLoading = false;
$('#spinner').css('visibility', 'hidden');
}
else {
if ($rootScope.isZoomed) {
var lastSelectedAnnotation;
angular.forEach($rootScope.previousHighlightList, function (value, key) {
var ActualTermNos = $scope.getActualTermNumber(value);
lastSelectedAnnotation = ActualTermNos;
});
$scope.TermList = $scope.getTermNumberList(lastSelectedAnnotation);
$scope.termCoordinate = $scope.getTermCoordinate(lastSelectedAnnotation);
console.log('last selected Annotation= ' + lastSelectedAnnotation);
console.log('termListCount= ' + $scope.TermList.length);
console.log('termCoordinate= ' + $scope.termCoordinate.x);
$scope.aligneCanvasWithTerm();
}
else {
var canvasDiv = document.getElementById('canvasDiv');
$('#canvasDiv').scrollTop($scope.imageVerticalScrollPosition);
$('#canvasDiv').scrollLeft($scope.imageHorizontlScrollPosition);
}
}
$rootScope.isLoading = false;
$('#spinner').css('visibility', 'hidden');
//debugger;
$scope.EnableUI();
}
}
};
worker.onerror = function (e) {
alert('Error: Line ' + e.lineno + ' in ' + e.filename + ': ' + e.message);
};
}
}
}, 100)
}
$scope.HighlightBodyByTermListForBodySystem = function (TermList) {
$scope.isScrolledToHighlightedBR = false;
//disable the background till the system gets highlighted.
$scope.DisableUI();
$('.ui-slider').slider('disable');
$("#btnTranparency").attr('disabled', 'disabled');
$rootScope.currentLayerNumber = $scope.layerNumber;
$scope.layerNumber = $('#txtlayerNumber').val();
$rootScope.isLoading = true;
$('#spinner').css('visibility', 'visible');
if ($rootScope.isHighLight == true) {
$rootScope.isHighLight = false;
$scope.CloseTransparencyBox();
}
console.log('HighlightBodyByTermListForBodySystem is called');
$scope.highlightedBR = [];
// if ($scope.layerNumber == 224) {
var matchedTermListPath = '~/../content/data/json/da/body-views/1/BodySystem_' + $rootScope.systemNumber + '.json';
var grayImageDataVar = null;
// DataService.getJson(matchedTermListPath)
TermService.getTermData($scope.layerNumber, $rootScope.voId, $rootScope.systemNumber, $rootScope.zoomInOut)
.then(
function (result) {
if (result.length == 0)
{
$rootScope.isLoading = false;
$('#spinner').css('visibility', 'hidden');
//remove existing data and draw fresh data
for (var i = 0; i < $rootScope.grayImageDataList.length; i++) {
var grayCanvasID = 'imageCanvas' + parseInt(i + 1);
var grayCanvas = document.getElementById(grayCanvasID);
if (grayCanvas != null) {
var grayCanvasContext = grayCanvas.getContext("2d");
var canvasHeight = grayCanvas.height;
var canvasWidth = grayCanvas.width;
grayCanvasContext.clearRect(0, 0, canvasHeight, canvasWidth)
grayCanvasContext.putImageData($rootScope.grayImageDataList[parseInt(i)], 0, 0);
}
}
$scope.message = AIAConstants.NO_BODY_SYSTEM_AVAILABLE;
$("#daMessageModal").modal('show');
$scope.message = AIAConstants.NO_BODY_SYSTEM_AVAILABLE;
$("#daMessageModal").modal('show');
//debugger;
$scope.EnableUI();
$('.ui-slider').slider('enable');
}
else {
console.log('1. HighlightBodyByTermListForBodySystem is called');
$rootScope.macthedTermList = result;
var termNo = 0;
var pixcelLocation = 0;
var prevBRID = 0;
if ($rootScope.macthedTermList.length > 0) {
console.log('2. HighlightBodyByTermListForBodySystem is called');
//remove existing data and draw fresh data
for (var i = 0; i < $rootScope.grayImageDataList.length; i++) {
var grayCanvasID = 'imageCanvas' + parseInt(i + 1);
var grayCanvas = document.getElementById(grayCanvasID);
if (grayCanvas != null) {
var grayCanvasContext = grayCanvas.getContext("2d");
var canvasHeight = grayCanvas.height;
var canvasWidth = grayCanvas.width;
grayCanvasContext.clearRect(0, 0, canvasHeight, canvasWidth)
if ($rootScope.isExtract) {
grayCanvasContext.putImageData($rootScope.whiteImageDataList[parseInt(i)], 0, 0);
}
else {
grayCanvasContext.putImageData($rootScope.grayImageDataList[parseInt(i)], 0, 0);
}
}
}
for (var i = 4; i <= $rootScope.grayImageMRDataList.length; i++) {
var grayCanvasMRID = 'imageCanvas' + i + '_MR';
var grayCanvasMR = document.getElementById(grayCanvasMRID);
if (grayCanvasMR != null) {
var grayCanvasContextMR = grayCanvasMR.getContext("2d");
var canvasHeight = grayCanvasMR.height;
var canvasWidth = grayCanvasMR.width;
grayCanvasContextMR.clearRect(0, 0, canvasHeight, canvasWidth)
if ($rootScope.isExtract) {
grayCanvasContext.putImageData($rootScope.whiteImageMRDataList[parseInt(i)], 0, 0);
}
else {
grayCanvasContextMR.putImageData($rootScope.grayImageMRDataList[parseInt(i)], 0, 0);
}
}
}
angular.forEach($rootScope.macthedTermList, function (value, key) {
var TermExistInBodyRegionId = value.bodyRegionId;
console.log('3. HighlightBodyByTermListForBodySystem is called TermExistInBodyRegionId=' + TermExistInBodyRegionId);
if (TermExistInBodyRegionId != undefined) {
if (prevBRID != TermExistInBodyRegionId) {
var grayCanvasID = 'imageCanvas' + TermExistInBodyRegionId;
var grayCanvas = document.getElementById(grayCanvasID);
if (grayCanvas != null) {
var grayCanvasContext = grayCanvas.getContext("2d");
var canvasHeight = grayCanvas.height;
var canvasWidth = grayCanvas.width;
var canvasX = grayCanvas.style.left;
var canvasY = grayCanvas.style.top;
grayCanvasContext.clearRect(0, 0, canvasHeight, canvasWidth)
if ($scope.isExtract) {
grayCanvasContext.putImageData($rootScope.whiteImageDataList[parseInt(TermExistInBodyRegionId) - 1], 0, 0);
}
else {
grayCanvasContext.putImageData($rootScope.grayImageDataList[parseInt(TermExistInBodyRegionId) - 1], 0, 0);
}
var gData = grayCanvasContext.getImageData(0, 0, canvasWidth, canvasHeight);
//for mirror images
var grayCanvasMRID = 'imageCanvas' + TermExistInBodyRegionId + '_MR';
var grayCanvasMR = document.getElementById(grayCanvasMRID);
var grayCanvasMRX;
var grayCanvasMRY;
//draw a canvas for same bodyregion wich will be flipped after coloring the body system
if ($rootScope.voId == "1" || $rootScope.voId == "4" || $rootScope.voId == "5" || $rootScope.voId == "8") {
if (TermExistInBodyRegionId == 4 || TermExistInBodyRegionId == 5 || TermExistInBodyRegionId == 6) {
var grayCanvasMRID = 'imageCanvas' + TermExistInBodyRegionId + '_MR';
var grayCanvasMR = document.getElementById(grayCanvasMRID);
grayCanvasMRX = grayCanvasMR.style.left;
grayCanvasMRY = grayCanvasMR.style.top;
var FlipedImgCanvas = document.createElement('canvas');
FlipedImgCanvas.height = canvasHeight;
FlipedImgCanvas.width = canvasWidth;
FlipedImgCanvas.setAttribute("data-IsMirrored", "Y")
FlipedImgCanvas.style.position = "absolute";
FlipedImgCanvas.style.left = canvasX + "px";
FlipedImgCanvas.style.top = canvasY + "px";
FlipedImgCanvas.style.visibility = 'hidden';
FlipedImgCanvas.id = 'imageCanvas' + TermExistInBodyRegionId + '_MR';
//remove previous canavs
$('#' + grayCanvasMRID).remove();
//add new canvas on same location and after flipping it will be added to mirrored position
document.getElementById('canvasDiv').appendChild(FlipedImgCanvas);
//put grayData
var filppedCanvasContx = FlipedImgCanvas.getContext("2d");
filppedCanvasContx.putImageData(gData, 0, 0);
}
}
grayImageDataVar = null;
var macthedData = new jinqJs()
.from($rootScope.macthedTermList)
.where('bodyRegionId == ' + TermExistInBodyRegionId)
.select();
var coloredImageDataVar = $rootScope.coloredImageCanvasList[parseInt(TermExistInBodyRegionId) - 1];
var grayImageDataValue = gData.data;
var coloredImageDataValue = coloredImageDataVar.data;
angular.forEach(macthedData, function (value2, key) {
$rootScope.termListWithLocation = value2.terms;
//pick the color from coloredImage data and put on gray imagedata
angular.forEach($rootScope.termListWithLocation.PixelLocations, function (value1, key1) {
var RED = coloredImageDataValue[value1];
var GREEN = coloredImageDataValue[value1 + 1];
var BLUE = coloredImageDataValue[value1 + 2];
grayImageDataValue[value1] = RED;
grayImageDataValue[value1 + 1] = GREEN;
grayImageDataValue[value1 + 2] = BLUE;
})
//for non mirrored bpdy regions
var grayCanvasID = 'imageCanvas' + TermExistInBodyRegionId;
var grayCanvas = document.getElementById(grayCanvasID);
if (grayCanvas != null) {
var grayCanvasContext = grayCanvas.getContext("2d");
grayCanvasContext.putImageData(gData, 0, 0);
}
//for mirror body regions
if (TermExistInBodyRegionId == 4 || TermExistInBodyRegionId == 5 || TermExistInBodyRegionId == 6) {
var grayCanvasMRID = 'imageCanvas' + TermExistInBodyRegionId + '_MR';
var grayCanvasMR = document.getElementById(grayCanvasMRID);
if (grayCanvasMR != null) {
var grayCanvasMRContext = grayCanvasMR.getContext("2d");
grayCanvasMRContext.save();
grayCanvasMRContext.translate(canvasWidth, 0);
grayCanvasMRContext.scale(-1, 1);
//flip does not work with putImageData, that is why we used drawImage
grayCanvasMRContext.drawImage(grayCanvas, 0, 0, canvasWidth, canvasHeight, 0, 0, canvasWidth, canvasHeight);
grayCanvasMRContext.restore();
//set this canavs on the actual posution of mirror image
grayCanvasMR.style.left = grayCanvasMRX;
grayCanvasMR.style.top = grayCanvasMRY;
grayCanvasMR.style.visibility = 'visible';
}
}
$('#spinner').css('visibility', 'hidden')
$rootScope.isLoading = false;
//document.getElementById("daView").style.pointerEvents = "auto";
//debugger;
//$('.ui-slider').slider('enable');
$scope.EnableUI();
prevBRID = TermExistInBodyRegionId;
$scope.scrollToHighlightedBodyRegion(TermExistInBodyRegionId);
})
}
}
}
else {
$('#spinner').css('visibility', 'hidden')
$rootScope.isLoading = false;
//debugger;
$scope.EnableUI();
$('.ui-slider').slider('enable');
}
})
}
}
},
function (error) {
console.log(' Error in getting term data = ' + error.statusText);
});
// }
}
$scope.scrollToHighlightedBodyRegion = function(TermExistInBodyRegionId){
if ($scope.isScrolledToHighlightedBR == false) {
$scope.bodyRegionCoordinates = new jinqJs()
.from($rootScope.BodyRegionData.BodyRegionViews.BodyRegionCordinates)
.where('_ViewOrientationId == ' + $rootScope.viewOrientationId)
.select();
$scope.TermExistInBodyRegionData = new jinqJs()
.from($scope.bodyRegionCoordinates)
.where('_BodyRegionId == ' + TermExistInBodyRegionId)
.select();
var rectangle = scaleRectangle($scope.TermExistInBodyRegionData[0]._X, $scope.TermExistInBodyRegionData[0]._Y, $scope.TermExistInBodyRegionData[0]._Height, $scope.TermExistInBodyRegionData[0]._Width, $scope.TermExistInBodyRegionData[0]._MirrorValue);
$('#canvasDiv').scrollTop(rectangle.scaledY);
$scope.isScrolledToHighlightedBR = true;
}
}
$scope.createTermListByPreviousTermsAndHighlight = function () {
var multiTermList = [];
angular.forEach($rootScope.previousHighlightList, function (value, key) {
var ActualTermNo = $scope.getActualTermNumber(value);
if (ActualTermNo != null && ActualTermNo != undefined) {
var TermList = $scope.getTermNumberList(ActualTermNo);
if (TermList != null) {
for (var i = 0; i < TermList.length; i++) {
multiTermList.push(TermList[i]);
}
}
}
});
console.log('createTermListByPreviousTermsAndHighlight is called');
if ((multiTermList != undefined && multiTermList != null) && multiTermList.length > 0) {
$timeout(function () { $scope.HighlightBodyByTermList(multiTermList); }, 50);
}
else {
$rootScope.isLoading = false;
$('#spinner').css('visibility', 'hidden');
}
}
$scope.GetRGBColor = function (maskCanvasContext, actulalX, actualY, x, y) {
var pixelData = maskCanvasContext.getImageData(Math.round(actulalX - x), Math.round(actualY - y), 1, 1);
pixelData.data[0] = pixelData.data[0] - 9;
pixelData.data[1] = pixelData.data[1] - 9;
pixelData.data[2] = pixelData.data[2] - 9;
var Red;
var Green;
var Blue;
var zero = "0";
if ((pixelData.data[0]).toString().length != 2) {
Red = zero.concat((pixelData.data[0]).toString())
}
else {
Red = (pixelData.data[0]).toString()
}
if ((pixelData.data[1]).toString().length != 2) {
Green = zero.concat((pixelData.data[1]).toString())
}
else {
Green = (pixelData.data[1]).toString()
}
if ((pixelData.data[2]).toString().length != 2) {
Blue = zero.concat((pixelData.data[2]).toString())
}
else {
Blue = (pixelData.data[2]).toString()
}
var RGBColor = (Red + Green + Blue);
return RGBColor;
}
//get annotation from term number
$scope.GetAnnotationText = function (termNumber) {
$rootScope.annotationText = [];
var annotationText;
var annotation = [];
//0
var figLeafTermNo = 5868; // to do declare constant for this
if (parseInt(termNumber) != parseInt(figLeafTermNo)) {
$scope.TermNumber = termNumber;
for (var j = 0; j <= $rootScope.lexiconLanguageArray.length - 1; j++) {
if ($rootScope.TermNumberData != null || $rootScope.TermNumberData != undefined)
{
$scope.matchedTermNoData = new jinqJs()
.from($rootScope.TermNumberData.TermData.Term)
.where('_TermNumber == ' + termNumber)
.select();
if ($scope.matchedTermNoData != null || $scope.matchedTermNoData != undefined) {
//1.
var actualTermNo = 0;
for (var z = 0; z < $scope.matchedTermNoData.length; z++) {
//send actual term no to get the term text.
actualTermNo = $scope.matchedTermNoData[0]._ActualTermNumber;
annotationText = $scope.GetAnnotationBasedOnActualTermNo(actualTermNo, $rootScope.lexiconLanguageArray[j].language);
annotation.push(annotationText);
$rootScope.annotationText.push(annotationText);
$rootScope.actualTermNumber = actualTermNo;
break;
};
//2.
}
else {
// send term no to vocab json data to get the text
}
}
else {
var currentBodyViewId = $rootScope.voId;
var termJsonPath = '~/../content/data/json/da/body-views/' + currentBodyViewId + '/da_dat_tm_sg_' + currentBodyViewId + '.json';
DataService.getAnotherJson(termJsonPath)
.then(
function (result) {
$rootScope.TermNumberData = result;
$scope.GetAnnotationText(termNumber);
})
}
}
}
return annotation;
}
$scope.GetAnnotationBasedOnActualTermNo = function (actualTermNo, language) {
var Annotation;
$scope.ActualTermNo = actualTermNo;
for (var j = 0; j <= $rootScope.vocabTermDataArray.length - 1; j++) {
if ($rootScope.vocabTermDataArray[j].language == language) {
if ($rootScope.vocabTermDataArray[j].VocabTermData != null || $rootScope.vocabTermDataArray[j].VocabTermData != undefined) {
$scope.matchedActualTermData = new jinqJs()
.from($rootScope.vocabTermDataArray[j].VocabTermData.VocabTerms.Term)
.where('_ActualTermNumber == ' + actualTermNo)
.select();
if ($scope.matchedActualTermData != null || $scope.matchedActualTermData != undefined) {
for (var z = 0; z <= $scope.matchedActualTermData.length; z++) {
//send actual term no to get the term text.
Annotation = $scope.matchedActualTermData[0]._TermText;
// alert("Annotation : " + Annotation);
break;
};
}
return Annotation;
}
else {
return null;
}
}
}
}
//layer change function
$scope.LayerChange = function () {
$scope.DisableUI();
//if listanager is visisble then close it
// $rootScope.isListManagerSelected = false;
$rootScope.CloseListManager();
$scope.isLayerChange = true;
$rootScope.isLoading = true;
$('#spinner').css('visibility', 'visible');
//1.
$scope.terminateCurrentlyRunningWPs();
var canvasDiv = document.getElementById('canvasDiv');
$scope.imageVerticalScrollPosition = canvasDiv.scrollTop;
$scope.imageHorizontlScrollPosition = canvasDiv.scrollLeft;
// $('#daLoaderLabel').css('visibility', 'visible');
if ($rootScope.isTransparencyActivated) {
//crete temp canavs to store the original data which will be used to chnange the transparency
if (document.getElementById('tempCanvas') != null) {
$('#tempCanvas').remove();
}
if ($('#speechBubbleTrns').length > 0) {
$('#speechBubbleTrns').remove();
}
var tempCanvas = document.createElement('canvas');
tempCanvas.id = 'tempCanvas';
$scope.tempCanvas = tempCanvas.id;
tempCanvas.height = $scope.transparencyCanvasHeight;
tempCanvas.width = $scope.transparencyCanvasWidth;
tempCanvas.style.position = "absolute";
tempCanvas.style.left = 200 + 'px';
tempCanvas.style.backgroundColor = "transparent";
tempCanvas.style.visibility = 'hidden';
if (document.getElementById('canvasDiv') != null)
document.getElementById('canvasDiv').appendChild(tempCanvas);
var tCanvas = document.getElementById('transparencyCanvas');
var tCanvasContext = tCanvas.getContext('2d');
var tCanvasHeight = parseInt((tCanvas.style.height).replace('px', ''));
var tCanvasWidth = parseInt((tCanvas.style.width).replace('px', ''));
// var tCanvas = document.getElementById('transparencyCanvas');
if (tCanvas != null) {
clearTransCanvas();
}
var TransparencyBoxStartX = parseInt((tCanvas.style.left).replace('px', ''));
var TransparencyEndX = parseInt((tCanvas.style.left).replace('px', '')) + parseInt((tCanvas.style.width.replace('px', '')));
var TransparencyBoxStartY = parseInt((tCanvas.style.top).replace('px', ''));
var TransparencyBoxEndY = parseInt((tCanvas.style.top).replace('px', '')) + parseInt((tCanvas.style.height).replace('px', ''));
var transparencyBoxBottom = parseInt(TransparencyBoxStartY) + parseInt(tCanvasHeight);
var transparencyBoxRight = parseInt(TransparencyBoxStartX) + parseInt(tCanvasWidth);
var BodyRegionDictionary = $rootScope.BodyRegionCordinatesData;
$scope.transparencyDrawnRegions = [];
$scope.canThirdBRDrawn = false;
$.each(BodyRegionDictionary, function (index, value) {
if (value.bodyRegionId == '3') {
var BR_SixTBData = new jinqJs()
.from($scope.transparencyDrawnRegions)
.where('BRID == 6')
.select();
if (BR_SixTBData != null && BR_SixTBData != undefined && BR_SixTBData.length > 0) {
$scope.canThirdBRDrawn = true;
}
}
var bodyRegionRight = parseInt(value.X) + parseInt(value.Width);
var bodyRegionBottom = parseInt(value.Y) + parseInt(value.Height);
// alert(' $.each(BodyRegionDictionary3. bodyRegionRight: ' + bodyRegionRight + ', bodyRegionBottom: ' + bodyRegionBottom)
if (TransparencyBoxStartX <= bodyRegionRight && value.X <= transparencyBoxRight && TransparencyBoxStartY <= bodyRegionBottom && value.Y <= transparencyBoxBottom) {
//var transNumber = parseInt(document.getElementById("txtTransparencyChange").value);
$scope.layerNumber = parseInt(txtlayerNumber.value);
if (($rootScope.voId == "9" || $rootScope.voId == "11" || $rootScope.voId == "2" || $rootScope.voId == "3" || $rootScope.voId == "6" || $rootScope.voId == "7")) {
if (value.bodyRegionId == "6") {
$scope.loadTransparencyImage(value.bodyRegionId, value.Height, value.Width, value.X, value.Y, value.IsMirror, $scope.TransparencyBoxStartX, $scope.TransparencyEndX, $scope.TransparencyBoxStartY, $scope.TransparencyBoxEndY, $scope, true, false, false);
}
else {
$scope.loadTransparencyImage(value.bodyRegionId, value.Height, value.Width, value.X, value.Y, value.IsMirror, $scope.TransparencyBoxStartX, $scope.TransparencyEndX, $scope.TransparencyBoxStartY, $scope.TransparencyBoxEndY, $scope, true, false, false);
}
}
else {
if (value.bodyRegionId == '3' && $scope.canThirdBRDrawn == true) {
$scope.loadTransparencyImage(value.bodyRegionId, value.Height, value.Width, value.X, value.Y, value.IsMirror, $scope.TransparencyBoxStartX, TransparencyEndX, $scope.TransparencyBoxStartY, TransparencyBoxEndY, $scope, true, false, false);
}
else {
if (value.bodyRegionId == '3' && $scope.canThirdBRDrawn == false) {
//1. draw 6th
var BRSixData = new jinqJs()
.from(BodyRegionDictionary)
.where('bodyRegionId == 6')
.select();
var isMirror = BRSixData[0].IsMirror;
if (isMirror == 'Yes') {
//draw mirror arm
$scope.loadTransparencyImage(BRSixData[0].bodyRegionId, BRSixData[0].Height, BRSixData[0].Width, BRSixData[0].X, BRSixData[0].Y, 'Yes', $scope.TransparencyBoxStartX, TransparencyEndX, $scope.TransparencyBoxStartY, TransparencyBoxEndY, $scope, true, false, false);
//draw non mirror arm
$scope.loadTransparencyImage(BRSixData[1].bodyRegionId, BRSixData[1].Height, BRSixData[1].Width, BRSixData[1].X, BRSixData[1].Y, 'No', $scope.TransparencyBoxStartX, TransparencyEndX, $scope.TransparencyBoxStartY, TransparencyBoxEndY, $scope, true, false, false);
//draw 3rd BR
$timeout(function () {
$scope.loadTransparencyImage(value.bodyRegionId, value.Height, value.Width, value.X, value.Y, value.IsMirror, $scope.TransparencyBoxStartX, TransparencyEndX, $scope.TransparencyBoxStartY, TransparencyBoxEndY, $scope, true, false, false);
}, 200);
}
else {
//draw mirror arm
$scope.loadTransparencyImage(BRSixData[0].bodyRegionId, BRSixData[0].Height, BRSixData[0].Width, BRSixData[0].X, BRSixData[0].Y, 'No', $scope.TransparencyBoxStartX, TransparencyEndX, $scope.TransparencyBoxStartY, TransparencyBoxEndY, $scope, true, false, false);
//draw non mirror arm
$scope.loadTransparencyImage(BRSixData[1].bodyRegionId, BRSixData[1].Height, BRSixData[1].Width, BRSixData[1].X, BRSixData[1].Y, 'Yes', $scope.TransparencyBoxStartX, TransparencyEndX, $scope.TransparencyBoxStartY, TransparencyBoxEndY, $scope, true, false, false);
//draw 3rd BR
$timeout(function () {
$scope.loadTransparencyImage(value.bodyRegionId, value.Height, value.Width, value.X, value.Y, value.IsMirror, $scope.TransparencyBoxStartX, TransparencyEndX, $scope.TransparencyBoxStartY, TransparencyBoxEndY, $scope, true, false, false);
}, 200);
}
}
else {
var BR_SixTBData = new jinqJs()
.from($scope.transparencyDrawnRegions)
.where('BRID == 6')
.select();
if (value.bodyRegionId == "6" && BR_SixTBData != undefined && BR_SixTBData != null && BR_SixTBData.length > 0) { }
else
$scope.loadTransparencyImage(value.bodyRegionId, value.Height, value.Width, value.X, value.Y, value.IsMirror, $scope.TransparencyBoxStartX, TransparencyEndX, $scope.TransparencyBoxStartY, TransparencyBoxEndY, $scope, true, false, false);
}
}
}
}
})
}
else {
//1. Dated:13-07-2016 Issue #4965 : The layer number should not extend beyond its level through layer text box.
var dataLength = $rootScope.BodyLayerData.Layers.DataLayer.length;
if (parseInt($('#txtlayerNumber').val()) > (dataLength - 1)) {
$('#txtlayerNumber').val(dataLength - 1);
$rootScope.currentLayerNumber = parseInt(dataLength - 1);
$scope.layerNumber = parseInt(dataLength - 1);
}
else
$rootScope.currentLayerNumber = parseInt($('#txtlayerNumber').val());
//$scope.isMousUp();
$rootScope.isLoading = true;
$('#spinner').css('visibility', 'visible');
var canDiv = document.getElementById('canvasDiv');
var canDivChildCount = canDiv.childElementCount;
if (canDivChildCount > 0) {
canDiv.innerHTML = '';
}
//2.
$scope.CalculateImageCordinates($rootScope.viewOrientationId);
//3.
$('#canvasDiv').scrollLeft($scope.imageHorizontlScrollPosition)
$('#canvasDiv').scrollTop($scope.imageVerticalScrollPosition)
if ($rootScope.isHighlightBodyByBodySystem) {
$timeout(function () { $scope.DisableProgressBar() }, 20000);
}
else {
$timeout(function () { $scope.DisableProgressBar() }, 2000);
}
}
$('#layerChangeSlider').slider("option", "value", parseInt($rootScope.totalLayers) - parseInt($scope.layerNumber));
// Annotations Closing Code
$('.com_anno').remove();
$('#sppeachBubble_annotation').remove();
$('#dot_annotation').remove();
$('#bord_annotation').remove();
$('#dot').remove();
$('#sppeachBubble').remove();
$(".com").remove();
$("#bord").remove();
if (($("#canvasPaint").css("display") == "block") && ($("#canvas").css("display") == "block")) {
if ($rootScope.isAnnotatiomToolBarPopupActive == false) {
if ($("#transparencyScale").css("display") == "block") {
$rootScope.switchToTransparencycanvas();
}
}
else {
if ($("#OnIdentify").hasClass("annotationtoolbartab")) {
$rootScope.switchToTransparencycanvas();
}
else {
$('.btnCursor').addClass('activebtncolor');
$rootScope.switchCanvas();
}
}
}
else {
if ($rootScope.isAnnotatiomToolBarPopupActive == true) {
$rootScope.CloseAnnotationTool();
}
}
}
$rootScope.PreviouslayerNumbr = 0;
$scope.DisableProgressBar = function () {
if ($rootScope.isHighLight) {
$("#btnHighLight").addClass("btn-primary");
$("#btnHighLight").removeClass("btn-black");
if (!$("#btnNormalMode").hasClass("btn-black")) {
$("#btnNormalMode").addClass("btn-black");
}
if (!$("#btnExtract").hasClass("btn-black")) {
$("#btnExtract").addClass("btn-black");
}
if ($("#btnExtract").hasClass("btn-primary")) {
$("#btnExtract").removeClass("btn-primary");
}
if ($("#btnNormalMode").hasClass("btn-primary")) {
$("#btnNormalMode").removeClass("btn-primary");
}
console.log('highLightBody call from DisableProgressBar')
// $scope.highLightBody();
}
$rootScope.isLoading = false;
$('#spinner').css('visibility', 'hidden');
}
$scope.changeLayer = function () {
//console.log('changeLayer');
// alert('slide')
}
$('layerChangeSlider').slider().on('slideStop', function (ev) {
var newVal = $('.span2').data('slider').getValue();
if (originalVal != newVal) {
}
});
$scope.getMousePos = function (evt) {
return {
x: Math.round(evt.pageX - $('#canvasDiv').offset().left),
y: Math.round(evt.pageY - $('#canvasDiv').offset().top)
}
}
$scope.createDynamicSpeechBubble = function (event, x, y, isAnnotationNotForTBox) {
if (isAnnotationNotForTBox == true) {
if ($scope.MultiLanguageAnnationArray.length > 1) {
$scope.longestAnnotation = $scope.MultiLanguageAnnationArray.reduce(function (firstAnnotation, seconAnnotation) { return firstAnnotation.length > seconAnnotation.length ? firstAnnotation : seconAnnotation; });
}
else {
$scope.longestAnnotation = $scope.MultiLanguageAnnationArray[0];
}
//1. In transparency box we shows two annotation at a time, so we need to decide the max length of annotation in btween two annotation because based on that
// we decide the size of speech bubble
//2.
if (event.ctrlKey) {
console.log('ctrl pressed');
$scope.multiAnnotationIsON = true;
//2.1 create unique speech bubbles
$scope.speechBubbleCounter = $scope.speechBubbleCounter + 1;
var id = "speechBubble" + $scope.speechBubbleCounter;
//2.2 Get clicked locationa and find if it is already clicked earlier too on same location
var pointClicked = parseInt(x) + parseInt(y);
var isClickedOnSamePoint = $("#canvasDiv").find("div[id=" + pointClicked + "]").length;
console.log('isClickedOnSamePoint: ' + isClickedOnSamePoint);
// if user has not clciked on smae point then create speech bubble otherwise not
if (isClickedOnSamePoint == 0) {
console.log('not clicked on same point')
$scope.createSpeechBubbleBasedOnAnnotationLength(pointClicked, x, y, id);
$scope.speechbubbleList.push({ xaxis: x, yaxis: y, ids: id });
}
$('.appendDragg').draggable({
drag: function (evt) {
$(this).prev('div').css("display", "none");
var bor_id = $(this).next('div').attr('id');
var sub_id1 = $(this).attr('id');
var verticalScrollPosition = canvasDiv.scrollTop;
var horizontlScrollPosition = canvasDiv.scrollLeft;
if ($scope.speechbubbleList != null || $scope.speechbubbleList != undefined) {
for (var m = 0; m <= $scope.speechbubbleList.length - 1; m++) {
if ($scope.speechbubbleList[m].ids == sub_id1) {
$scope.angle1($scope.speechbubbleList[m].xaxis, $scope.speechbubbleList[m].yaxis, evt.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left, evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top, bor_id);
break;
}
}
}
},
});
$('.dynCross').on('click', function (evt) {
//$(this).parent().parent().parent().css('display', 'none');
$(this).parent().parent().parent().remove();
});
}
else {
$scope.multiAnnotationIsON = false;
//history maintained issue
if ($rootScope.isAnnotaionToolBarDrawingModeActive == false) {
$("#sppeachBubble").remove();
$("#dot").remove();
}
$(".com").remove();
$("#bord").remove();
$scope.createSpeechBubbleBasedOnAnnotationLengthwithoutCtrl(x, y);
//history maintained issue
if ($rootScope.isAnnotaionToolBarDrawingModeActive == false) { document.getElementById('sppeachBubble').style.zIndex = "60000"; }
$('#sppeachBubble').draggable(
{
drag: function (evt) {
$("#dot").css("visibility", "hidden");
var verticalScrollPosition = canvasDiv.scrollTop;
var horizontlScrollPosition = canvasDiv.scrollLeft;
$scope.angle(x, y, evt.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left, evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top, true);
},
});
$('.crossDiv_temp').on('click', function (evt) {
$('#sppeachBubble').remove();
$("#bord").remove();
$("#dot").remove();
});
}
}
else {
$scope.longest_annotationT1 = $scope.annotationTextArrayT1.reduce(function (a, b) { return a.length > b.length ? a : b; });
$scope.longest_annotationT2 = $scope.annotationTextArrayT2.reduce(function (a, b) { return a.length > b.length ? a : b; });
if (event.ctrlKey) {
$scope.j = $scope.j + 1;
var sub_id_annotation = "black_annotation" + $scope.j;
var pointClicked_annotation = parseInt(x) + parseInt(y);
var Exists_annotation = $("#canvasDiv").find("div[id=" + pointClicked_annotation + "]").length;
$scope.createSpeechBubbleBasedOnTransparencyWithCtrl(pointClicked_annotation, Exists_annotation, x, y, sub_id_annotation);
$scope.speachBubbleArrayAnnotation.push({ xaxis: x, yaxis: y, ids: sub_id_annotation });
$('.appendDragg_annotation').draggable({
drag: function (evt) {
$(this).prev('div').css("display", "none");
var bor_id_anno = $(this).next('div').attr('id');
var sub_id1_anno = $(this).attr('id');
var verticalScrollPosition = canvasDiv.scrollTop;
var horizontlScrollPosition = canvasDiv.scrollLeft;
if ($scope.speachBubbleArrayAnnotation != null || $scope.speachBubbleArrayAnnotation != undefined) {
for (var m = 0; m <= $scope.speachBubbleArrayAnnotation.length - 1; m++) {
if ($scope.speachBubbleArrayAnnotation[m].ids == sub_id1_anno) {
$scope.angle1($scope.speachBubbleArrayAnnotation[m].xaxis, $scope.speachBubbleArrayAnnotation[m].yaxis, evt.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left, evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top, bor_id_anno);
break;
}
}
}
},
});
$('.dynCross_anno').on('click', function (evt) {
$(this).parent().parent().parent().remove();
});
}
else {
$scope.multiAnnotationIsON = false;
$(".com_annotation").css("display", "none");
$("#bord_annotation").css({ "width": "0px", "display": "none" });
$('.dynCross_anno').parent().parent().parent().remove();
$scope.createSpeechBubbleBasedOnTransparencyWithoutCtrl(x, y);
$('#sppeachBubble_annotation').draggable(
{
drag: function (evt) {
$("#dot_annotation").remove();
var verticalScrollPosition = canvasDiv.scrollTop;
var horizontlScrollPosition = canvasDiv.scrollLeft;
$scope.angle(x, y, evt.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left, evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top, false);
},
});
$('.crossDiv_temp_annotation').on('click', function (evt) {
$('#sppeachBubble_annotation').remove();
$("#bord_annotation").remove();
$("#dot_annotation").remove();
});
}
}
if (document.getElementById("btnStrutureBox").name == "showAnnotationStructure") {
$scope.showAnnotation()
}
else {
$scope.hideAnnotation()
}
if ($rootScope.isTBCompleted == true) {
$('#sppeachBubble').remove();
$('#dot').remove();
$('#bord').remove();
$('.com').remove();
$rootScope.isTBCompleted = false;
}
}
$scope.showAnnotation = function () {
$(".com").show();
$('#dot').show();
$('#bord').show();
$('#sppeachBubble').show();
$('#sppeachBubble_annotation').show();
$("#bord_annotation").show();
$("#dot_annotation").show();
$(".dynCross_anno").parent().parent().parent().show();
}
$scope.hideAnnotation = function () {
$(".com").hide();
$('#dot').hide();
$('#bord').hide();
$('#sppeachBubble').hide();
$('#sppeachBubble_annotation').hide();
$("#bord_annotation").hide();
$("#dot_annotation").hide();
$(".dynCross_anno").parent().parent().parent().hide();
}
$scope.createSpeechBubbleBasedOnAnnotationLength = function (pointClicked, x, y, id) {
var sppechBubbleHTML = "
";
//Issue #7286 :Undefined annotation should not appear
for (var i = 0; i <= $scope.MultiLanguageAnnationArray.length - 1; i++) {
var annotation = $scope.MultiLanguageAnnationArray[i];
}
if (annotation == undefined) {
console.log("No text found");
} else {
$("#canvasDiv").append(sppechBubbleHTML);
for (var i = 0; i <= $scope.MultiLanguageAnnationArray.length - 1; i++) {
var annotation = $scope.MultiLanguageAnnationArray[i];
$("#" + id).append("
';
//Issue #7286 :Undefined annotation should not appear
for (var i = 0; i <= $scope.MultiLanguageAnnationArray.length - 1; i++) {
var MultipleLanguage = $scope.MultiLanguageAnnationArray[i];
}
if (MultipleLanguage == undefined) {
console.log("No text is found");
} else {
$('#canvasDiv').append(sppechBubbleDotHTML);
if ($scope.MultiLanguageAnnationArray.length > 0) {
for (var i = 0; i <= $scope.MultiLanguageAnnationArray.length - 1; i++) {
var MultipleLanguage = $scope.MultiLanguageAnnationArray[i];
$("#sppeachBubble").append("
';
$("#sppeachBubble_annotation").css("height", "auto");
if ($scope.longest_annotationT1.length > $scope.longest_annotationT2.length) {
$("#sppeachBubble_annotation p").remove();
$('#canvasDiv').append(sppechBubbleDotHTML_annotation);
for (var l = 0; l <= $scope.annotationTextArrayT1.length - 1; l++) {
var MultipleLang_annotation_T1 = $scope.annotationTextArrayT1[l];
$("#sppeachBubble_annotation").append("
" + MultipleLang_annotation_T1 + "
");
}
$("#sppeachBubble_annotation").append("");
for (var k = 0; k <= $scope.annotationTextArrayT2.length - 1; k++) {
var MultipleLang_annotation_T2 = $scope.annotationTextArrayT2[k];
$("#sppeachBubble_annotation").append("
");
}
$("#sppeachBubble_annotation").append("");
for (var k = 0; k <= $scope.annotationTextArrayT2.length - 1; k++) {
var MultipleLang_annotation_T2 = $scope.annotationTextArrayT2[k];
$("#sppeachBubble_annotation").append("
" + MultipleLang_annotation_T2 + "
");
}
if ($scope.longest_annotationT2.length <= 10) {
$("#sppeachBubble_annotation").css("width", "100px");
}
else if ($scope.longest_annotationT2.length > 10 && $scope.longest_annotationT2.length <= 17) {
$("#sppeachBubble_annotation").css("width", "140px");
}
else if ($scope.longest_annotationT2.length > 17 && $scope.longest_annotationT2.length <= 26) {
$("#sppeachBubble_annotation").css("width", "195px");
}
else if ($scope.longest_annotationT2.length > 26 && $scope.longest_annotationT2.length <= 34) {
$("#sppeachBubble_annotation").css("width", "248px");
}
else if ($scope.longest_annotationT2.length > 34 && $scope.longest_annotationT2.length <= 44) {
$("#sppeachBubble_annotation").css("width", "300px");
}
else if ($scope.longest_annotationT2.length > 44 && $scope.longest_annotationT2.length <= 54) {
$("#sppeachBubble_annotation").css("width", "370px");
}
else if ($scope.longest_annotationT2.length > 54 && $scope.longest_annotationT2.length <= 69) {
$("#sppeachBubble_annotation").css("width", "450px");
}
else if ($scope.longest_annotationT2.length > 69 && $scope.longest_annotationT2.length <= 75) {
$("#sppeachBubble_annotation").css("width", "510px");
}
else {
$("#sppeachBubble_annotation").css("width", ($scope.longest_annotationT2.length) + "%");
}
}
var Globe = [];
Globe.push({ currentX: x, currentY: y });
document.getElementById('dot_annotation').style.display = 'block';
document.getElementById('dot_annotation').style.left = ((Globe[0].currentX) - 10) + 'px';
document.getElementById('dot_annotation').style.top = ((Globe[0].currentY) + 10) + 'px';
document.getElementById('bord_annotation').style.display = 'block';
document.getElementById('bord_annotation').style.left = ((Globe[0].currentX) - 2) + 'px';
document.getElementById('bord_annotation').style.top = ((Globe[0].currentY) + 1) + 'px';
document.getElementById('sppeachBubble_annotation').style.display = 'block';
document.getElementById('sppeachBubble_annotation').style.left = (Globe[0].currentX) + 'px';
document.getElementById('sppeachBubble_annotation').style.top = (Globe[0].currentY) + 'px';
}
$scope.angle1 = function (cx1, cy1, ex1, ey1, id, id2) {
// console.log(cx1 + " " + cy1);
var dy = ey1 - cy1;
var dx = ex1 - cx1;
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 g = Math.sqrt((cx1 - ex1) * (cx1 - ex1) + (cy1 - ey1) * (cy1 - ey1));
var e = cy1;
var f = cx1;
$('#' + id).css({ 'display': 'block', 'width': g + 'px', 'top': e + 'px', 'left': f + 'px', 'transform': 'rotate(' + theta + 'deg)', '-moz-transform': 'rotate(' + theta + 'deg)', '-webkit-transform': 'rotate(' + theta + 'deg)', 'transform-origin': '0% 0%' });
}
function myFunction(crossId) {
$('#' + crossId).parent().parent().parent().css("display", "none");
}
$scope.angle = function (cx, cy, ex, ey, BoolValues) {
var dy = ey - cy;
var dx = ex - cx;
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 d = Math.sqrt((cx - ex) * (cx - ex) + (cy - ey) * (cy - ey));
var e = cy;
var f = cx;
if (BoolValues == true) {
$("#bord").css({ 'display': 'block', 'width': d + 'px', 'top': e + 'px', 'left': f + 'px', 'transform': 'rotate(' + theta + 'deg)', '-moz-transform': 'rotate(' + theta + 'deg)', '-webkit-transform': 'rotate(' + theta + 'deg)', 'transform-origin': '0% 0%' });
}
else {
$("#bord_annotation").css({ 'display': 'block', 'width': d + 'px', 'top': e + 'px', 'left': f + 'px', 'transform': 'rotate(' + theta + 'deg)', '-moz-transform': 'rotate(' + theta + 'deg)', '-webkit-transform': 'rotate(' + theta + 'deg)', 'transform-origin': '0% 0%' });
}
}
$scope.createSpeechBubble = function (event, text, x, y) {
//set z index to make annoation speech buble on top others
$('#canvasDiv').css('cursor', 'pointer');
$('
'
+ '
'
+ '
' + text + '
'
//+'
+ '
').appendTo('#canvasDiv');
$('#speechBubble').on('click', '.BubbleCloseBtn', function (evt) {
$('#speechBubble').css('display', 'none');
});
$('#canvasDiv').attr("data-bubbleid", "speechBubble")
};
$scope.createTransparencyBox = function () {
$scope.isTransparencyBtnClicked = true;
//do not create TBOX if in extarct mode otherwise create
if ($rootScope.isExtract == false) {
$("#btnExtract").addClass("disabled");
$("#btnExtract").css("pointer-events", "none");
//if listanager is visisble then close it
$rootScope.isListManagerSelected = false;
$rootScope.CloseListManager();
$('#btnTranparency').addClass('tButtonActive');
$('#btnIdentity').removeClass(' btn-primary');
$('#btnIdentity').addClass('btn-black');
var canvasDiv = document.getElementById('canvasDiv');
$scope.verticalScrollPosition = canvasDiv.scrollTop;
$scope.horizontlScrollPosition = canvasDiv.scrollLeft;
var canvasDiv = document.getElementById('canvasDiv');
canvasDiv.addEventListener("touchstart", mouseDownListener);
canvasDiv.addEventListener("touchmove", mouseMoveListener);
canvasDiv.addEventListener("touchend", mouseUpListener);
canvasDiv.addEventListener("mousedown", mouseDownListener);
canvasDiv.addEventListener("mousemove", mouseMoveListener);
canvasDiv.addEventListener("mouseup", mouseUpListener);
}
else {
// console.log("extract button is active");
}
//in case of annotation toolbar is open below code will be executed to draw Tbox
if ($rootScope.isAnnotationWindowOpen == true) {
if ($rootScope.isAnnotaionToolBarDrawingModeActive == true) {
$rootScope.DrawingMode();
$rootScope.shapeType = "";
$(".btn-annotation").removeClass("activebtncolor");
$("#annotationpaintbrushsize").removeClass("activebtncolor");
$("#annotationpainteraser").removeClass("activebtncolor");
}
else {
$rootScope.switchCanvas();
}
}
}
function mouseDownListener(e) {
e.preventDefault();
//to prevent screen scroll on ipad while drawing TB
e.preventDefault();
//Dated:18-07-2016 Issue#4975: Transparency box should not be clickable if it is already selected.
var tCanvas = document.getElementById('transparencyCanvas');
if ($('#transparencyScale').css("visibility") == 'visible') {
$('#transparencyScale').css('visibility', 'hidden');
$('#transparencyCanvas').remove();
}
var $container = document.getElementById('canvasDiv');
var $selection = $('
').addClass('rectangle');
document.getElementById("DAView")
$selection.css({
'position': 'absolute',
//'background': 'transparent',
'border': '1px dotted #000'
});
var currentMousePosition = $scope.getMousePos(e);
$scope.TBDrawStartX = currentMousePosition.x;
$scope.TBDrawStartY = currentMousePosition.y;
var canvasDiv = document.getElementById('canvasDiv');
$scope.verticalScrollPosition = canvasDiv.scrollTop;
$scope.horizontlScrollPosition = canvasDiv.scrollLeft;
var actulalX = currentMousePosition.x + $scope.horizontlScrollPosition
var actualY = currentMousePosition.y + $scope.verticalScrollPosition
//alert('$scope.TransparencyBoxStartX in mouseDown: ' + $scope.TransparencyBoxStartX + ' & Y= ' + $scope.TransparencyBoxStartY);
$scope.TransparencyBoxStartX = actulalX;
$scope.TransparencyBoxStartY = actualY
$scope.startX = actulalX;
$scope.startY = actualY;
var tBox = document.getElementById('transparencyCanvas');
if (tBox == null) {
//// canvasDiv.style.cursor = "crosshair";
$selection.css({
'top': actualY,
'left': actulalX,
'width': 0,
'height': 0,
'z-index': 1000
});
$selection.appendTo($container);
}
document.getElementById('canvasDiv').removeEventListener("mousedown", mouseDownListener);
document.getElementById('canvasDiv').removeEventListener("touchstart", mouseDownListener);
//Dated:19-07-2016 Issue#4975: Transparency box should not be clickable if it is already selected.
if ($("#txtlayerNumber").val() != 0 && $rootScope.currentLayerNumber != undefined) {
$('#layerChangeSlider').slider("option", "value", parseInt($rootScope.totalLayers) - parseInt($rootScope.currentLayerNumber));
$("#txtlayerNumber").val(parseInt($rootScope.currentLayerNumber));
}
}
function mouseMoveListener(e) {
e.preventDefault();
//to prevent screen scroll on ipad while drawing TB
e.preventDefault();
var canvasDiv = document.getElementById('canvasDiv');
$scope.verticalScrollPosition = canvasDiv.scrollTop;
$scope.horizontlScrollPosition = canvasDiv.scrollLeft;
var currentMousePosition = $scope.getMousePos(e);
var move_x = currentMousePosition.x + $scope.horizontlScrollPosition,
move_y = currentMousePosition.y + $scope.verticalScrollPosition,
width = move_x - $scope.TransparencyBoxStartX,
height = move_y - $scope.TransparencyBoxStartY,
new_x, new_y;
new_x = (move_x < $scope.TransparencyBoxStartX) ? ($scope.TransparencyBoxStartX - width) : $scope.TransparencyBoxStartX;
new_y = (move_y < $scope.TransparencyBoxStartY) ? ($scope.TransparencyBoxStartY - height) : $scope.TransparencyBoxStartY;
$('.rectangle').css({
'width': width,
'height': height,
//'background': 'transparent'
});
}
function mouseUpListener(e) {
e.preventDefault();
//to prevent screen scroll on ipad while drawing TB
e.preventDefault();
$scope.isTBDrawnOnBodyRegion = false;
$(".com").remove();
$('#dot').remove();
$('#bord').remove();
$('#sppeachBubble').remove();
var previewRectangleWidth = $('.rectangle').width();
var previewRectangleHeight = $('.rectangle').height()
$rootScope.currentLayerNumber = parseInt($('#txtlayerNumber').val());
$('.rectangle').remove();
var currentMousePosition = $scope.getMousePos(e);
var canavsDivScrollPos = $scope.getCanavsDivScrollPosition();
var TransparencyEndX = currentMousePosition.x + canavsDivScrollPos.horizontlScrollPosition;
var TransparencyBoxEndY = currentMousePosition.y + canavsDivScrollPos.verticalScrollPosition;
$scope.isTboxDrwan = true;
$scope.TbEndX = TransparencyEndX;
$scope.TbEndY = TransparencyBoxEndY;
$scope.TransparencyEndX = TransparencyEndX;
$scope.TransparencyBoxEndY = TransparencyBoxEndY;
if ($scope.TransparencyBoxStartX == $scope.TransparencyEndX && $scope.TransparencyBoxStartY == $scope.TransparencyBoxEndY) {
// $('#transparencyScale').css('visibility', 'hidden');
} else {
if (previewRectangleWidth == 0 && previewRectangleHeight == 0) {
}
else {
$scope.DisableUI();
$scope.layerNumberBeforeTBDraw = parseInt($('#txtlayerNumber').val());
//draw temp box to store the canvas data with original transparecy
if (document.getElementById('tempCanvas') != null) {
$('#tempCanvas').remove();
}
if (document.getElementById('tempCanvas') == null || document.getElementById('tempCanvas') == undefined) {
var tempCanvas = document.createElement('canvas');
tempCanvas.id = 'tempCanvas';
// $scope.tempCanvas = transparencyCanvas.id;
tempCanvas.height = TransparencyBoxEndY - $scope.startY;
tempCanvas.width = TransparencyEndX - $scope.startX;
tempCanvas.style.position = "absolute";
tempCanvas.style.left = 200 + 'px';
tempCanvas.style.top = 200 + 'px';
tempCanvas.style.backgroundColor = "transparent";
tempCanvas.style.visibility = 'hidden';
tempCanvas.style.border = "black 1px solid";
document.getElementById('canvasDiv').appendChild(tempCanvas);
}
$rootScope.isTransparencyActivated = true;
$scope.isTransparencyBtnClicked = false;
var BodyRegionDictionary = $rootScope.BodyRegionCordinatesData;
$scope.IncludedBodyRegions = [];
$scope.transparencyDrawnRegions = [];
$scope.canThirdBRDrawn = false;
$.each(BodyRegionDictionary, function (index, value) {
var tBoxDimesions = $scope.getTBoxDimesions($scope.TransparencyBoxStartX, TransparencyEndX, $scope.TransparencyBoxStartY, TransparencyBoxEndY, value.X, value.Y, value.Height, value.Width);
var transparencyBoxHeight = tBoxDimesions.transparencyBoxHeight;
var transparencyBoxWidth = tBoxDimesions.transparencyBoxWidth;
var transparencyBoxBottom = tBoxDimesions.transparencyBoxBottom;
var transparencyBoxRight = tBoxDimesions.transparencyBoxRight;
var bodyRegionRight = tBoxDimesions.bodyRegionRight;
var bodyRegionBottom = tBoxDimesions.bodyRegionBottom;
var transparencyCanvas = document.createElement('canvas');
var tBox = document.getElementById('transparencyCanvas');
if (tBox == null) {
transparencyCanvas.id = 'transparencyCanvas';
$scope.transparencyCanvasId = transparencyCanvas.id;
transparencyCanvas.height = TransparencyBoxEndY - $scope.startY;
transparencyCanvas.width = TransparencyEndX - $scope.startX;
transparencyCanvas.style.position = "absolute";
transparencyCanvas.style.left = $scope.startX + 'px' // x + "px";
transparencyCanvas.style.top = $scope.startY + "px"//y + "px";
transparencyCanvas.style.border = "black 1px solid";
transparencyCanvas.style.backgroundColor = "transparent";
transparencyCanvas.style.zIndex = 200;
document.getElementById('canvasDiv').appendChild(transparencyCanvas);
$scope.transparencyChangeCounter = 0;
$('#transparencyCanvas').resizable({ handles: "e,s,se,w,n,ne,nw,sw", stop: function (event, ui) { resizeTransparencyBox(); }, start: function (event, ui) { clearTransCanvas(); } });
$scope.transparencyCanvasHeight = transparencyCanvas.height;
$scope.transparencyCanvasWidth = transparencyCanvas.width;
//bind click listener
transparencyCanvas.addEventListener('click', TransparencyCanvasClickListener);
$(".ui-wrapper").css("z-index", $rootScope.UIWrapperZIndex);
}
if ($scope.TransparencyBoxStartX <= bodyRegionRight && value.X <= transparencyBoxRight && $scope.TransparencyBoxStartY <= bodyRegionBottom && value.Y <= transparencyBoxBottom) {
$scope.isTBDrawnOnBodyRegion = true;
if (value.bodyRegionId == '3') {
var BR_SixTBData = new jinqJs()
.from($scope.transparencyDrawnRegions)
.where('BRID == 6')
.select();
if (BR_SixTBData != null && BR_SixTBData != undefined && BR_SixTBData.length > 0) {
$scope.canThirdBRDrawn = true;
}
}
if (($rootScope.voId == "9" || $rootScope.voId == "11" || $rootScope.voId == "2" || $rootScope.voId == "3" || $rootScope.voId == "6" || $rootScope.voId == "7")) {
if (value.bodyRegionId == "6") {
$scope.loadTransparencyImage(value.bodyRegionId, value.Height, value.Width, value.X, value.Y, value.IsMirror, $scope.TransparencyBoxStartX, TransparencyEndX, $scope.TransparencyBoxStartY, TransparencyBoxEndY, $scope, false, false, false);
}
else {
$scope.loadTransparencyImage(value.bodyRegionId, value.Height, value.Width, value.X, value.Y, value.IsMirror, $scope.TransparencyBoxStartX, TransparencyEndX, $scope.TransparencyBoxStartY, TransparencyBoxEndY, $scope, false, false, false);
}
}
else {
if (value.bodyRegionId == '3' && $scope.canThirdBRDrawn == true) {
$scope.loadTransparencyImage(value.bodyRegionId, value.Height, value.Width, value.X, value.Y, value.IsMirror, $scope.TransparencyBoxStartX, TransparencyEndX, $scope.TransparencyBoxStartY, TransparencyBoxEndY, $scope, false, false, false);
}
else {
if (value.bodyRegionId == '3' && $scope.canThirdBRDrawn == false) {
//1. draw 6th
var BRSixData = new jinqJs()
.from(BodyRegionDictionary)
.where('bodyRegionId == 6')
.select();
var isMirror = BRSixData[0].IsMirror;
if (isMirror == 'Yes') {
//draw mirror arm
$scope.loadTransparencyImage(BRSixData[0].bodyRegionId, BRSixData[0].Height, BRSixData[0].Width, BRSixData[0].X, BRSixData[0].Y, 'Yes', $scope.TransparencyBoxStartX, TransparencyEndX, $scope.TransparencyBoxStartY, TransparencyBoxEndY, $scope, false, false, false);
//draw non mirror arm
$scope.loadTransparencyImage(BRSixData[1].bodyRegionId, BRSixData[1].Height, BRSixData[1].Width, BRSixData[1].X, BRSixData[1].Y, 'No', $scope.TransparencyBoxStartX, TransparencyEndX, $scope.TransparencyBoxStartY, TransparencyBoxEndY, $scope, false, false, false);
//draw 3rd BR
$timeout(function () {
$scope.loadTransparencyImage(value.bodyRegionId, value.Height, value.Width, value.X, value.Y, value.IsMirror, $scope.TransparencyBoxStartX, TransparencyEndX, $scope.TransparencyBoxStartY, TransparencyBoxEndY, $scope, false, false, false);
}, 200);
}
else {
//draw mirror arm
$scope.loadTransparencyImage(BRSixData[0].bodyRegionId, BRSixData[0].Height, BRSixData[0].Width, BRSixData[0].X, BRSixData[0].Y, 'No', $scope.TransparencyBoxStartX, TransparencyEndX, $scope.TransparencyBoxStartY, TransparencyBoxEndY, $scope, false, false, false);
//draw mirror arm
$scope.loadTransparencyImage(BRSixData[1].bodyRegionId, BRSixData[1].Height, BRSixData[1].Width, BRSixData[1].X, BRSixData[1].Y, 'Yes', $scope.TransparencyBoxStartX, TransparencyEndX, $scope.TransparencyBoxStartY, TransparencyBoxEndY, $scope, false, false, false);
//draw mirror arm
$timeout(function () {
$scope.loadTransparencyImage(value.bodyRegionId, value.Height, value.Width, value.X, value.Y, value.IsMirror, $scope.TransparencyBoxStartX, TransparencyEndX, $scope.TransparencyBoxStartY, TransparencyBoxEndY, $scope, false, false, false);
}, 200);
}
}
else {
var BR_SixTBData = new jinqJs()
.from($scope.transparencyDrawnRegions)
.where('BRID == 6')
.select();
if (value.bodyRegionId == "6" && BR_SixTBData != undefined && BR_SixTBData != null && BR_SixTBData.length > 0) { }
else
$scope.loadTransparencyImage(value.bodyRegionId, value.Height, value.Width, value.X, value.Y, value.IsMirror, $scope.TransparencyBoxStartX, TransparencyEndX, $scope.TransparencyBoxStartY, TransparencyBoxEndY, $scope, false, false, false);
}
}
}
}
else {
//when user draw TB outside body than no bodyRegion
//is covred and nothing is drawn so the function is not called in which we are enabling UI
$scope.EnableUI();
}
})
//for modesty
//if ($rootScope.isModestyOn == true && $scope.modestyImageInfo.length > 0) {
if ($scope.modestyImageInfo.length > 0) {
$.each($scope.modestyImageInfo, function (index, value) {
var tBoxDimesions = $scope.getTBoxDimesions($scope.TransparencyBoxStartX, TransparencyEndX, $scope.TransparencyBoxStartY, TransparencyBoxEndY, value.x, value.y, value.Height, value.Width);
var transparencyBoxHeight = tBoxDimesions.transparencyBoxHeight;
var transparencyBoxWidth = tBoxDimesions.transparencyBoxWidth;
var transparencyBoxBottom = tBoxDimesions.transparencyBoxBottom;
var transparencyBoxRight = tBoxDimesions.transparencyBoxRight;
var bodyRegionRight = tBoxDimesions.bodyRegionRight;
var bodyRegionBottom = tBoxDimesions.bodyRegionBottom;
if ($scope.TransparencyBoxStartX <= bodyRegionRight && value.x <= transparencyBoxRight && $scope.TransparencyBoxStartY <= bodyRegionBottom && value.y <= transparencyBoxBottom) {
$scope.loadTransparencyImage(value.bodyRegionId, value.Height, value.Width, value.x, value.y, value.IsMirror, $scope.TransparencyBoxStartX, TransparencyEndX, $scope.TransparencyBoxStartY, TransparencyBoxEndY, $scope, false, false);
}
})
}
//
// $('#transparencyScale').modal('show');
$('#transparencyScale').css('position', 'fixed')
$('#transparencyScale').css('top', $scope.TBDrawStartY - 10)
$('#transparencyScale').css('left', $scope.TBDrawStartX + 130)
$('#transparencyScale').css('visibility', 'visible')
$('#transparencyScale').css("z-index", "100000") //Dated:16-07-2016 Issue#4962:Transparency box should be on top.
$("#tbSlider .ui-slider-range-min").css("width", "100%");
$("#tbSlider .ui-slider-handle").css("left", "100%");
}
}
document.getElementById('canvasDiv').removeEventListener("mousedown", mouseDownListener);
document.getElementById('canvasDiv').removeEventListener("mousemove", mouseMoveListener);
document.getElementById('canvasDiv').removeEventListener("mouseup", mouseUpListener);
document.getElementById('canvasDiv').removeEventListener("touchstart", mouseDownListener);
document.getElementById('canvasDiv').removeEventListener("touchmove", mouseMoveListener);
document.getElementById('canvasDiv').removeEventListener("touchend", mouseUpListener);
// document.getElementById('canvasDiv').removeEventListener("mousemove", mouseMoveListener);
$('#btnTranparency').removeClass('btn-black');
$('#btnTranparency').addClass('tButtonActive');
// $('#txtlayerNumber').val((parseInt($rootScope.currentLayerNumber)) + 1);
//Dated:18-07-2016 Issue#4975: Transparency box should not be clickable if it is already selected.
$('#btnTranparency').removeClass('tButtonActive');
$('#btnTranparency').addClass('btn-black');
$('#btnIdentity').removeClass('btn-black');
$('#btnIdentity').addClass('btn-primary');
// clear canvas before drawing transparency box
if ($rootScope.isAnnotationWindowOpen == true) {
$('#canvas').removeLayers();
var paintCanvasObj = document.getElementById("canvasPaint");
if (paintCanvasObj != null) {
var ctx = paintCanvasObj.getContext("2d");
ctx.clearRect(0, 0, 2277, 3248);
}
var sktch = $('#canvasPaint').sketch();
$('#canvasPaint').sketch().actions = [];
$("#annotationpaintbrushsize").removeClass("activebtncolor");
$("#annotationpainteraser").removeClass("activebtncolor");
if ($("#DrawMode").hasClass("annotationtoolbartab")) {
if ($rootScope.isTBoxModestyVisible == true) {
$rootScope.switchCanvas();
}
else {
var drawCanvasZindex = $("#canvas").css("z-index");
var paintCanvasZindex = $("#canvasPaint").css("z-index");
drawCanvasZindex = parseInt(drawCanvasZindex) - 1;
paintCanvasZindex = parseInt(paintCanvasZindex) - 1;
if (drawCanvasZindex > paintCanvasZindex) {
$(".ui-wrapper").css("z-index", drawCanvasZindex);
$rootScope.UIWrapperZIndex = drawCanvasZindex;
}
else {
$(".ui-wrapper").css("z-index", paintCanvasZindex);
$rootScope.UIWrapperZIndex = paintCanvasZindex;
}
}
}
else {
$rootScope.switchToTransparencycanvas();
}
}
else
{
$rootScope.UIWrapperZIndex = 12000;
$(".ui-wrapper").css("z-index", $rootScope.UIWrapperZIndex);
}
//hide the speechbubble
if ($rootScope.isAnnotationWindowOpen == true)
$rootScope.isTBCompleted = true;
}
$scope.getCanavsDivScrollPosition = function () {
var canvasDiv = document.getElementById('canvasDiv');
return {
verticalScrollPosition: canvasDiv.scrollTop,
horizontlScrollPosition: canvasDiv.scrollLeft
}
}
$scope.getTBoxDimesions = function (TransparencyBoxStartX, TransparencyEndX, TransparencyBoxStartY, TransparencyBoxEndY, X, Y, Height, Width) {
var tBoxHeight = parseInt(TransparencyBoxEndY) - parseInt(TransparencyBoxStartY);
var tBoxWidth = parseInt(TransparencyEndX) - parseInt(TransparencyBoxStartX);
var tBoxBottom = parseInt(TransparencyBoxStartY) + parseInt(tBoxHeight);
var tBoxRight = parseInt(TransparencyBoxStartX) + parseInt(tBoxWidth);
return {
transparencyBoxHeight: tBoxHeight,
transparencyBoxWidth: tBoxWidth,
transparencyBoxBottom: tBoxBottom,
transparencyBoxRight: tBoxRight,
bodyRegionRight: parseInt(X) + parseInt(Width),
bodyRegionBottom: parseInt(Y) + parseInt(Height)
}
}
$scope.loadTransparencyImage = function (bodyRegionId, Height, Width, X, Y, IsMirror, TransparencyBoxStartX, TransparencyEndX, TransparencyBoxStartY, TransparencyBoxEndY, scope, isLayerChanged, isTransparencyChanged, isResized) {
var transparencyCanvas = document.getElementById('transparencyCanvas');
TransparencyBoxStartX = parseInt((transparencyCanvas.style.left).replace('px', ''));
TransparencyBoxStartY = parseInt((transparencyCanvas.style.top).replace('px', ''));
TransparencyEndX = parseInt(transparencyCanvas.width) + parseInt(TransparencyBoxStartX);
TransparencyBoxEndY = parseInt(transparencyCanvas.height) + parseInt(TransparencyBoxStartY);
var TBImageDimensions = $scope.calculateDimensionsForTBImage(Height, Width, X, Y, IsMirror, TransparencyBoxStartX, TransparencyEndX, TransparencyBoxStartY, TransparencyBoxEndY, bodyRegionId);
var XforCopyImage = TBImageDimensions.XforCopyImageTB;
var YforCopyImage = TBImageDimensions.YforCopyImageTB;
var WidthforCopyImage = TBImageDimensions.WidthforCopyImageTB;
var HeightforCopyImage = TBImageDimensions.HeightforCopyImageTB;
var XforTransImage = TBImageDimensions.XforTransImageTB;
var WidthforTransImage = TBImageDimensions.WidthforTransImageTB;
var HeightforTransImage = TBImageDimensions.HeightforTransImageTB;
var YforTransImage = TBImageDimensions.YforTransImageTB;
//0. get current layer number
if (isResized) {
//do nothing
}
else if (isLayerChanged) {
}
else {
var tranparencyLayer;
var currentLayer = $scope.layerNumberBeforeTBDraw;
if (currentLayer == $rootScope.totalLayers) {
tranparencyLayer = currentLayer;
}
else {
tranparencyLayer = currentLayer + 1;
}
$scope.layerNumber = tranparencyLayer;
}
$('#txtlayerNumber').val($scope.layerNumber);
var tranparencyImgSrc;
var tranparencyMaskImgSrc;
if ((bodyRegionId.match('modestyImg'))) {
var modestyBodyRegionData = new jinqJs()
.from($scope.modestyImageInfo)
.where('bodyRegionId == ' + bodyRegionId)
.select();
tranparencyImgSrc = modestyBodyRegionData[0].SRC;
}
else {
tranparencyImgSrc = $scope.GetImageSource(bodyRegionId);
tranparencyMaskImgSrc = $scope.GetMaskImageSource(tranparencyImgSrc);
}
//remove old canvases
var oldCanvas;
var oldtempTransCanvasMask;
var oldtempTransCanvasMaskMR;
if (IsMirror == 'Yes') {
oldCanvas = document.getElementById('transparencyTempCanvas_MR_' + bodyRegionId);
oldtempTransCanvasMaskMR = document.getElementById('transparencyTempCanvasMask_MR' + bodyRegionId + '_mci');
oldtempTransCanvasMask = document.getElementById('transparencyTempCanvasMask_' + bodyRegionId + '_mci');
if (oldtempTransCanvasMaskMR != null) {
document.getElementById('canvasDiv').removeChild(oldtempTransCanvasMaskMR);
}
}
else {
oldCanvas = document.getElementById('transparencyTempCanvas_' + bodyRegionId)
oldtempTransCanvasMask = document.getElementById('transparencyTempCanvasMask_' + bodyRegionId + '_mci');
}
if (oldCanvas != null) {
document.getElementById('canvasDiv').removeChild(oldCanvas);
}
if (oldtempTransCanvasMask != null) {
document.getElementById('canvasDiv').removeChild(oldtempTransCanvasMask);
}
var transparencyTempCanvas = document.createElement('canvas');
var transparencyTempcanavsMask = document.createElement('canvas');
//if mirror then draw mask image for non mirrored body region for annotation
if (IsMirror == 'Yes') {
transparencyTempCanvas.id = 'transparencyTempCanvas_MR_' + bodyRegionId;
transparencyTempcanavsMask.id = 'transparencyTempCanvasMask_MR' + bodyRegionId + '_mci';
}
else {
if ((bodyRegionId.match('modestyImg'))) {
transparencyTempCanvas.id = 'transparencyTempCanvas_' + bodyRegionId;
}
else {
transparencyTempCanvas.id = 'transparencyTempCanvas_' + bodyRegionId;
transparencyTempcanavsMask.id = 'transparencyTempCanvasMask_' + bodyRegionId + '_mci';
}
}
transparencyTempCanvas.height = Height;
transparencyTempCanvas.width = Width;
transparencyTempCanvas.style.position = "absolute";
transparencyTempCanvas.style.left = X + 'px' // x + "px";
transparencyTempCanvas.style.top = Y + "px"//y + "px";
transparencyTempCanvas.style.visibility = 'hidden';
document.getElementById('canvasDiv').appendChild(transparencyTempCanvas);
//create temp mask canvas
if ((bodyRegionId.match('modestyImg'))) { }
else {
transparencyTempcanavsMask.height = Height;
transparencyTempcanavsMask.width = Width;
transparencyTempcanavsMask.style.position = "absolute";
transparencyTempcanavsMask.style.left = X + 'px' // x + "px";
transparencyTempcanavsMask.style.top = Y + "px"//y + "px";
transparencyTempcanavsMask.style.visibility = 'hidden';
document.getElementById('canvasDiv').appendChild(transparencyTempcanavsMask);
}
//for modesty canvas
if ((bodyRegionId.match('modestyImg'))) {
var modestyTransTempCanvasId = 'tempCanvasModesty_' + bodyRegionId;
var modestyTransCanvasId = 'modestyTransCanavs_' + bodyRegionId;
if (document.getElementById(modestyTransTempCanvasId) != null) {
document.getElementById(modestyTransTempCanvasId).parentNode.removeChild(document.getElementById(modestyTransTempCanvasId));
}
if (document.getElementById(modestyTransTempCanvasId) == null || document.getElementById(modestyTransTempCanvasId) == undefined) {
var tempCanvasModesty = document.createElement('canvas');
tempCanvasModesty.id = modestyTransTempCanvasId;
tempCanvasModesty.height = Height;
tempCanvasModesty.width = Width;
tempCanvasModesty.style.position = "absolute";
tempCanvasModesty.style.left = 10 + 'px';
tempCanvasModesty.style.top = 10 + 'px';
tempCanvasModesty.style.backgroundColor = "transparent";
tempCanvasModesty.style.visibility = 'hidden';
// tempCanvasModesty.style.border = "black 1px solid";
document.getElementById('canvasDiv').appendChild(tempCanvasModesty);
}
if (document.getElementById(modestyTransCanvasId) != null) {
document.getElementById(modestyTransCanvasId).parentNode.removeChild(document.getElementById(modestyTransCanvasId));
}
if (document.getElementById(modestyTransCanvasId) == null || document.getElementById(modestyTransCanvasId) == undefined) {
var canvasModesty = document.createElement('canvas');
canvasModesty.id = modestyTransCanvasId;
canvasModesty.className = 'transModestyImg'
canvasModesty.height = Height;
canvasModesty.width = Width;
canvasModesty.style.position = "absolute";
canvasModesty.style.left = X + 'px';
canvasModesty.style.top = Y + 'px';
if ($rootScope.isModestyOn == true) {
canvasModesty.style.visibility = 'visible';
$rootScope.isTBoxModestyVisible = true;
}
else
canvasModesty.style.visibility = 'hidden';
if ($rootScope.voId == "11") {
canvasModesty.style.zIndex = 11000;
}
else
canvasModesty.style.zIndex = $rootScope.modestyCanvasZindex;
canvasModesty.addEventListener('click', OnClickModestyTransCanvas);
document.getElementById('canvasDiv').appendChild(canvasModesty);
}
}
if (tranparencyImgSrc != undefined) {
var tempImg = new Image();
var tempCanvasID;
if (IsMirror == 'Yes') {
tempCanvasID = 'transparencyTempCanvas_MR_' + bodyRegionId;
}
else {
if ((bodyRegionId.match('modestyImg'))) {
tempCanvasID = 'transparencyTempCanvas_' + bodyRegionId;//bodyRegionId;
}
else
tempCanvasID = 'transparencyTempCanvas_' + bodyRegionId;
}
tempImg.onload = function () {
var tempCtx = transparencyTempCanvas.getContext('2d');
if (IsMirror == 'Yes') {
tempCtx.save();
tempCtx.translate(Width, 0);
tempCtx.scale(-1, 1);
tempCtx.drawImage(tempImg, 0, 0);
if ($rootScope.isHighLight == true) {
// var tempCanvasID = 'transparencyTempCanvas_MR_' + bodyRegionId;
$scope.highlightTempTransparencyCanvas(tempCanvasID, XforCopyImage, YforCopyImage, WidthforCopyImage, HeightforCopyImage,
XforTransImage, YforTransImage, WidthforTransImage, HeightforTransImage, Height, Width, bodyRegionId);
}
}
else {
tempCtx.drawImage(tempImg, 0, 0);
if ($rootScope.isHighLight == true) {
$scope.highlightTempTransparencyCanvas(tempCanvasID, XforCopyImage, YforCopyImage, WidthforCopyImage, HeightforCopyImage, XforTransImage,
YforTransImage, WidthforTransImage, HeightforTransImage, Height, Width, bodyRegionId);
}
}
if ($rootScope.isHighLight != true) {
if ((bodyRegionId.match('modestyImg'))) {
var modestyTempCanvasId = 'tempCanvasModesty_' + bodyRegionId;
if (document.getElementById(modestyTempCanvasId) != undefined || document.getElementById(modestyTempCanvasId) != null) {
var contxModestyTemp = document.getElementById(modestyTempCanvasId).getContext('2d');
var tbTempCanvas = document.getElementById(tempCanvasID)
contxModestyTemp.drawImage(tbTempCanvas, XforCopyImage, YforCopyImage, WidthforCopyImage, HeightforCopyImage, XforTransImage, YforTransImage, WidthforTransImage, HeightforTransImage);
}
}
else {
if (document.getElementById('tempCanvas') != null && document.getElementById('tempCanvas') != undefined) {
var contx = document.getElementById('tempCanvas').getContext('2d');
var tbTempCanvas = document.getElementById(tempCanvasID)
contx.drawImage(tbTempCanvas, XforCopyImage, YforCopyImage, WidthforCopyImage, HeightforCopyImage, XforTransImage, YforTransImage, WidthforTransImage, HeightforTransImage);
}
}
$scope.DrawOnTBWithSelectedTransparency(tempCanvasID, XforCopyImage, YforCopyImage, WidthforCopyImage, HeightforCopyImage, XforTransImage, YforTransImage, WidthforTransImage, HeightforTransImage, Height, Width, bodyRegionId, isLayerChanged, isResized);
}
}
tempImg.src = tranparencyImgSrc;//"http://localhost/AIA/" + tranparencyImgSrc;
}
//mask image code
//draw mask for annotation
var tempMaskImg = new Image();
var tranparencyMaskImgSrc = $scope.GetMaskImageSource(tranparencyImgSrc);
tempMaskImg.src = tranparencyMaskImgSrc;//"http://localhost/AIA/" + tranparencyMaskImgSrc;
tempMaskImg.onload = function () {
var tempmaskCtx = transparencyTempcanavsMask.getContext('2d');
if (IsMirror == 'Yes') {
tempmaskCtx.save();
tempmaskCtx.translate(Width, 0);
tempmaskCtx.scale(-1, 1);
tempmaskCtx.drawImage(tempMaskImg, 0, 0);
}
else {
tempmaskCtx.drawImage(tempMaskImg, 0, 0);
}
}
//set modesty image visiblility true/false as per layer
var BRID = '';
if (bodyRegionId.match('modestyImg') && document.getElementById('modestyTransCanavs_' + bodyRegionId) != null) {
BRID = bodyRegionId[bodyRegionId.length - 1];
}
else if ((bodyRegionId == '2' || bodyRegionId == '3') && document.getElementById('modestyTransCanavs_modestyImg' + bodyRegionId) != null) {
BRID = bodyRegionId;
}
if (BRID != '') {
var layerInfo = new jinqJs()
.from($scope.layerInfoForModesty)
.where('bodyRegionId == ' + BRID)
.select();
if (layerInfo != undefined && layerInfo.length > 0) {
var lowerlayerNumberForModesty = layerInfo[0].lowerlayerNumberForModesty;
var HigherlayerNumberForModesty = layerInfo[0].HigherlayerNumberForModesty;
var modestyTransCanvases = $("canvas[id*='modestyTransCanavs']");
if (modestyTransCanvases != null || modestyTransCanvases != undefined && modestyTransCanvases.length > 0) {
for (var j = 0; j < modestyTransCanvases.length; j++) {
if (modestyTransCanvases[j].id.match(bodyRegionId)) {
var modestyCanavs = document.getElementById(modestyTransCanvases[j].id);
if ($rootScope.isModestyOn == true && (parseInt(lowerlayerNumberForModesty) <= parseInt($scope.layerNumber)) && (HigherlayerNumberForModesty) > parseInt($scope.layerNumber)) {
modestyCanavs.style.visibility = 'visible';
}
else {
modestyCanavs.style.visibility = 'hidden';
}
}
}
}
}
}
}
$scope.calculateDimensionsForTBImage = function (Height, Width, X, Y, IsMirror, TransparencyBoxStartX, TransparencyEndX, TransparencyBoxStartY, TransparencyBoxEndY, bodyRegionId) {
var XforCopyImage = 0;
var YforCopyImage = 0;
var WidthforCopyImage = 0;
var HeightforCopyImage = 0;
var XforTransImage = 0;
var WidthforTransImage = 0;
var HeightforTransImage = 0;
var YforTransImage = 0;
//X ends outside and start outside of bodyregion
if (TransparencyBoxStartX < X && TransparencyEndX > parseInt(X) + parseInt(Width)) {
XforCopyImage = 0;
WidthforCopyImage = Width;
WidthforTransImage = Width;
if ((bodyRegionId.match('modestyImg'))) {
XforTransImage = 0;
}
else
XforTransImage = parseInt(X) - (parseInt(TransparencyBoxStartX));
}
else if (TransparencyBoxStartX < X && TransparencyEndX < parseInt(X) + parseInt(Width)) {
XforCopyImage = 0;
WidthforCopyImage = parseInt(TransparencyEndX) - parseInt(X);
WidthforTransImage = parseInt(TransparencyEndX) - parseInt(X);
if ((bodyRegionId.match('modestyImg'))) {
XforTransImage = 0;
}
else
XforTransImage = parseInt(X) - (parseInt(TransparencyBoxStartX));
}
else if (TransparencyBoxStartX > X && TransparencyEndX > parseInt(X) + parseInt(Width)) {
XforCopyImage = parseInt(TransparencyBoxStartX) - parseInt(X);
WidthforCopyImage = parseInt(X) + parseInt(Width) - parseInt(TransparencyBoxStartX);
WidthforTransImage = parseInt(X) + parseInt(Width) - parseInt(TransparencyBoxStartX);
if ((bodyRegionId.match('modestyImg'))) {
XforTransImage = parseInt(TransparencyBoxStartX) - parseInt(X);
}
else
XforTransImage = 0;
}
else if (TransparencyBoxStartX > X && TransparencyEndX < parseInt(X) + parseInt(Width)) {
XforCopyImage = parseInt(TransparencyBoxStartX) - parseInt(X);//parseInt(X) + parseInt(Width) - parseInt(scope.TransparencyBoxStartX)// scope.TransparencyBoxStartX ;
WidthforCopyImage = parseInt(TransparencyEndX) - parseInt(TransparencyBoxStartX);
WidthforTransImage = parseInt(TransparencyEndX) - parseInt(TransparencyBoxStartX);
if ((bodyRegionId.match('modestyImg'))) {
XforTransImage = parseInt(TransparencyBoxStartX) - parseInt(X);
}
else
XforTransImage = 0;
}
//calculate Y and height for tempTranparency box from where to cut the image
if (TransparencyBoxStartY < Y && TransparencyBoxEndY > parseInt(Y) + parseInt(Height)) {
YforCopyImage = 0;
HeightforCopyImage = Height;
HeightforTransImage = Height;
if ((bodyRegionId.match('modestyImg'))) {
YforTransImage = 0;
}
else
YforTransImage = parseFloat(Y) - parseInt(TransparencyBoxStartY)//parseFloat(Y) - (24.4);
}
else if (TransparencyBoxStartY < Y && TransparencyBoxEndY < (parseInt(Y) + parseInt(Height))) {
YforCopyImage = 0;
HeightforCopyImage = (parseInt(TransparencyBoxEndY)) - parseInt(Y)//(parseInt(Height) + parseInt(Y)) - (parseInt(TransparencyBoxEndY) - parseInt(scope.TransparencyBoxStartY));
HeightforTransImage = (parseInt(TransparencyBoxEndY)) - parseInt(Y)// - parseInt(scope.TransparencyBoxStartY));
if ((bodyRegionId.match('modestyImg'))) {
YforTransImage = 0;
}
else
YforTransImage = parseFloat(Y) - parseInt(TransparencyBoxStartY);// - (24.4);
}
else if (TransparencyBoxStartY > Y && TransparencyBoxEndY > parseInt(Y) + parseInt(Height)) {
YforCopyImage = parseInt(TransparencyBoxStartY) - parseInt(Y);
HeightforCopyImage = parseInt(Y) + parseInt(Height) - parseInt(TransparencyBoxStartY);
HeightforTransImage = parseInt(Y) + parseInt(Height) - parseInt(TransparencyBoxStartY);
if ((bodyRegionId.match('modestyImg'))) {
YforTransImage = parseInt(TransparencyBoxStartY) - parseInt(Y);
}
else
YforTransImage = 0;
}
else if (TransparencyBoxStartY > Y && TransparencyBoxEndY < parseInt(Y) + parseInt(Height)) {
YforCopyImage = parseInt(TransparencyBoxStartY) - parseInt(Y);
HeightforCopyImage = parseInt(TransparencyBoxEndY) - parseInt(TransparencyBoxStartY);
HeightforTransImage = parseInt(TransparencyBoxEndY) - parseInt(TransparencyBoxStartY);
if ((bodyRegionId.match('modestyImg'))) {
YforTransImage = parseInt(TransparencyBoxStartY) - parseInt(Y);
}
else
YforTransImage = 0;
}
return {
XforCopyImageTB: XforCopyImage,
YforCopyImageTB: YforCopyImage,
WidthforCopyImageTB: WidthforCopyImage,
HeightforCopyImageTB: HeightforCopyImage,
XforTransImageTB: XforTransImage,
WidthforTransImageTB: WidthforTransImage,
HeightforTransImageTB: HeightforTransImage,
YforTransImageTB: YforTransImage
}
}
$scope.highlightTempTransparencyCanvas = function (tempCanvasID, XforCopyImage, YforCopyImage, WidthforCopyImage, HeightforCopyImage, XforTransImage, YforTransImage, WidthforTransImage, HeightforTransImage, Height, Width, bodyRegionId) {
var tempTransCanvas = document.getElementById(tempCanvasID);
var tempCanvasContext = tempTransCanvas.getContext('2d');
var dataURL = tempTransCanvas.toDataURL();
var img = new Image();
img.src = dataURL;
img.onload = function () {
var DAData = new BitmapData(parseInt(tempTransCanvas.width), parseInt(tempTransCanvas.height));
DAData.draw(img);
var colorMode = $scope.applyGrayMatrix(img, tempCanvasContext);
if (colorMode != undefined || colorMode != null) {
var zeroPoint = new Point();
DAData.applyFilter(DAData, DAData.rect, zeroPoint, colorMode);
tempCanvasContext.putImageData(DAData.data, 0, 0);
//keep the original image on temp canavs to use it in changing transparency
if ($rootScope.isModestyOn == true && (bodyRegionId.match('modestyImg'))) {
var modestyTempCanvasId = 'tempCanvasModesty_' + bodyRegionId;
if (document.getElementById(modestyTempCanvasId) != undefined || document.getElementById(modestyTempCanvasId) != null) {
var contxModestyTemp = document.getElementById(modestyTempCanvasId).getContext('2d');
var tbTempCanvas = document.getElementById(tempCanvasID)
contxModestyTemp.drawImage(tbTempCanvas, XforCopyImage, YforCopyImage, WidthforCopyImage, HeightforCopyImage, XforTransImage, YforTransImage, WidthforTransImage, HeightforTransImage);
}
}
else {
if (document.getElementById('tempCanvas') != null) {
var contx = document.getElementById('tempCanvas').getContext('2d');
var tbTempCanvas = document.getElementById(tempCanvasID)
contx.drawImage(tbTempCanvas, XforCopyImage, YforCopyImage, WidthforCopyImage, HeightforCopyImage, XforTransImage, YforTransImage, WidthforTransImage, HeightforTransImage);
}
}
$scope.DrawOnTBWithSelectedTransparency(tempCanvasID, XforCopyImage, YforCopyImage, WidthforCopyImage, HeightforCopyImage, XforTransImage, YforTransImage, WidthforTransImage, HeightforTransImage, Height, Width, bodyRegionId);
}
}
}
$scope.DrawOnTBWithSelectedTransparency = function (tempCanvasID, XforCopyImage, YforCopyImage, WidthforCopyImage, HeightforCopyImage, XforTransImage, YforTransImage, WidthforTransImage, HeightforTransImage, Height, Width, bodyRegionId, isLayerChanged, isResized) {
var transNumber = $scope.transNumber;//txtTransparencyChange.value;
//this changes the transparency when transparency is already activated and user resizes or chage the layer
var tempCtx = document.getElementById(tempCanvasID).getContext('2d');
var imageD = tempCtx.getImageData(0, 0, Width, Height);
var imageData = imageD.data;
var length = imageData.length;
//to resolve lateral arm black issue in highlight mode
if ($scope.isHighLight) {
// if ($scope.voId == "9" || $scope.voId == "11") {
var c = 0;
for (var i = 0; i < imageData.length; i += 4) {
if (imageData[i] == imageData[i + 1] && imageData[i + 1] == imageData[i + 2] && imageData[i + 2] === 0) {
imageData[i + 3] = 0;
}
}
tempCtx.putImageData(imageD, 0, 0);
//}
}
// set every fourth value to the desired number of transparency
var imageD1 = tempCtx.getImageData(0, 0, Width, Height);
var imageData1 = imageD1.data;
var length = imageData.length;
for (var i = 3; i < length; i += 4) {
if ($scope.voId == "9" || $scope.voId == "11") {
if (imageData1[i] == 0) {
}
else {
imageData1[i] = ((255) * (parseInt(transNumber))) / 100;
}
}
else {
imageData1[i] = ((255) * (parseInt(transNumber))) / 100;
}
}
tempCtx.putImageData(imageD1, 0, 0);
$scope.widthOfImage = WidthforTransImage;
$scope.heightOfImage = HeightforTransImage;
$scope.xOfImage = XforTransImage;
$scope.yOfImage = YforTransImage;
var ctx = transparencyCanvas.getContext('2d');
var tmpCanvasContext = document.getElementById(tempCanvasID);//.getContext('2d');
var ctx;
if ((bodyRegionId.match('modestyImg'))) {
var modestyTransCanvasId = 'modestyTransCanavs_' + bodyRegionId
ctx = document.getElementById(modestyTransCanvasId).getContext('2d');
}
else
ctx = transparencyCanvas.getContext('2d');
// var ctx = transparencyCanvas.getContext('2d');
ctx.drawImage(tmpCanvasContext, XforCopyImage, YforCopyImage, WidthforCopyImage, HeightforCopyImage, XforTransImage, YforTransImage, WidthforTransImage, HeightforTransImage)
if ((bodyRegionId.match('modestyImg'))) {
var imageD1 = ctx.getImageData(0, 0, Width, Height);
var imageData1 = imageD1.data;
var length1 = imageData1.length;
// set every fourth value to the desired number of transparency
for (var i = 0; i < imageData1.length; i += 4) {
if (imageData1[i] == imageData1[i + 1] && imageData1[i + 1] == imageData1[i + 2] && imageData1[i + 2] === 0) {
imageData1[i + 3] = 0;
}
}
ctx.putImageData(imageD1, 0, 0);
if ($rootScope.isModestyOn)
document.getElementById('modestyTransCanavs_' + bodyRegionId).style.visibility = 'visible';
else
document.getElementById('modestyTransCanavs_' + bodyRegionId).style.visibility = 'hidden';
}
// $scope.transparencyDrawnRegions.push(bodyRegionId);
$scope.transparencyDrawnRegions.push({ 'BRID': bodyRegionId });
$rootScope.isLoading = false;
$('#spinner').css('visibility', 'hidden');
if ($scope.transparencyDrawnRegions.length == $scope.IncludedBodyRegions.length) {
transparencyCanvas.style.visibility = 'visible';
$('.rectangle').remove();
}
//debugger;
$scope.EnableUI();
}
$scope.changeTransparency = function () {
//this changes the transparency when user click on transparency scale(we have already set the original
//data on tras canvas irrespective of the trans number, so we can chnage the transparnecy of original data not the manipulated)
// if (isTransparencyChanged == true) {
// var txtTransparencyChange = document.getElementById("txtTransparencyChange");
var transNumber = $scope.transNumber;
var modestyTransCanvases = $("canvas[id*='modestyTransCanavs']");
var modestyTemCanvas = $("canvas[id*='tempCanvasModesty_']");
if (modestyTransCanvases != null || modestyTransCanvases != undefined && modestyTransCanvases.length > 0) {
//for modesty
for (var j = 0; j < modestyTransCanvases.length; j++) {
var modctx = document.getElementById(modestyTransCanvases[j].id).getContext('2d');
var modimageDa = modctx.getImageData(0, 0, modestyTransCanvases[j].width, modestyTransCanvases[j].height);
//modestyTransCanvases[j].parentNode.removeChild(modestyTransCanvases[j]);
var modimageData = modimageDa.data;
var length = modimageData.length;
if ($scope.isHighLight) {
//if ($scope.voId == "9" || $scope.voId == "11") {
var c = 0;
for (var i = 0; i < modimageData.length; i += 4) {
if (modimageData[i] == modimageData[i + 1] && modimageData[i + 1] == modimageData[i + 2] && modimageData[i + 2] === 0) {
modimageData[i + 3] = 0;
}
}
modctx.putImageData(modimageDa, 0, 0);
// }
}
// set every fourth value to desired transparency
var ctx1 = document.getElementById(modestyTransCanvases[j].id).getContext('2d');
var imageDa1 = ctx1.getImageData(0, 0, modestyTransCanvases[j].width, modestyTransCanvases[j].height);
//modestyTransCanvases[j].parentNode.removeChild(modestyTransCanvases[j]);
var imageData1 = imageDa1.data;
var length = imageData1.length;
for (var i = 3; i < length; i += 4) {
if ($scope.voId == "9" || $scope.voId == "11") {
if (imageData1[i] == 0) {
}
else {
imageData1[i] = ((255) * (parseInt(transNumber))) / 100;
}
}
else {
if (imageData1[i] == 0) {
}
else
imageData1[i] = ((255) * (parseInt(transNumber))) / 100;
}
// imageData[i] = ((255) * (parseInt(transNumber))) / 100;
}
// after the manipulation, reset the data
// imageDa.data = imageData;
// and put the imagedata back to the canvas
//ctx.putImageData(imageDa, XforTransImage, YforTransImage);
ctx1.putImageData(imageDa1, 0, 0);
}
}
var ctx = document.getElementById('transparencyCanvas').getContext('2d');
// var imageDa = ctx.getImageData(XforTransImage, YforTransImage, WidthforTransImage, HeightforTransImage);
var imageDa1 = ctx.getImageData(0, 0, $scope.transparencyCanvasWidth, $scope.transparencyCanvasHeight);
// get the image data values
var imageData1 = imageDa1.data;
var length = imageData1.length;
if ($scope.isHighLight) {
if ($scope.voId == "9" || $scope.voId == "11") {
var c = 0;
for (var i = 0; i < imageData1.length; i += 4) {
if (imageData1[i] == imageData1[i + 1] && imageData1[i + 1] == imageData1[i + 2] && imageData1[i + 2] === 0) {
imageData1[i + 3] = 0;
}
}
ctx.putImageData(imageDa1, 0, 0);
}
}
// set every fourth value to selected transparency
var imageDa = ctx.getImageData(0, 0, $scope.transparencyCanvasWidth, $scope.transparencyCanvasHeight);
// get the image data values
var imageData = imageDa.data;
var length = imageData.length;
for (var i = 3; i < length; i += 4) {
//NIKITA
if ($scope.voId == "9" || $scope.voId == "11") {
if (imageData[i] == 0) {
}
else {
imageData[i] = ((255) * (parseInt(transNumber))) / 100;
}
}
else {
if (imageData[i] == 0) {
}
else
imageData[i] = ((255) * (parseInt(transNumber))) / 100;
}
// imageData[i] = ((255) * (parseInt(transNumber))) / 100;
}
// after the manipulation, reset the data
// imageDa.data = imageData;
// and put the imagedata back to the canvas
//ctx.putImageData(imageDa, XforTransImage, YforTransImage);
ctx.putImageData(imageDa, 0, 0);
//}
}
// History Maintained Issue//
$rootScope.getAnnotationTextBasedOnSelectedBodyRegion = function (event) {
var canvasDiv = document.getElementById('canvasDiv');
var verticalScrollPosition = canvasDiv.scrollTop;
var horizontlScrollPosition = canvasDiv.scrollLeft;
$rootScope.Xaxis = event.pageX - $('#canvasDiv').offset().left + horizontlScrollPosition;
$rootScope.Yaxis = event.pageY - $('#canvasDiv').offset().top + verticalScrollPosition;
$rootScope.setSelectedBodyRegionData();
if ($rootScope.isMirrorBodyRegion == "No") {
var maskCanvasId = "imageCanvas" + $rootScope.BRId + "_mci";
var maskCanvas = document.getElementById(maskCanvasId);
var maskCanvasContext = maskCanvas.getContext("2d");
//var canvasDiv = document.getElementById('canvasDiv');
//var verticalScrollPosition = canvasDiv.scrollTop;
//var horizontlScrollPosition = canvasDiv.scrollLeft;
var actulalX = $rootScope.Xaxis;
var actualY = $rootScope.Yaxis;
var RGBColor = $scope.GetRGBColor(maskCanvasContext, actulalX, actualY, $rootScope.BodyRegionXAxis, $rootScope.BodyRegionYAxis);
var annotationText = $scope.GetAnnotationText(parseInt(RGBColor));
}
else {
var maskCanvasId = "imageCanvas" + $rootScope.BRId + "_MR_mci";
var maskoffsetval = $('#' + maskCanvasId).offset();
var mirrorCanvasX = maskoffsetval.left;
//alert(mirrorCanvasX);
var mirrorImageCanvas = document.getElementById(maskCanvasId);
var mirrorCanvasWidth = mirrorImageCanvas.clientWidth;
// alert(mirrorCanvasWidth);
var maskCanvas = document.getElementById(maskCanvasId);
var maskCanvasContext = maskCanvas.getContext("2d");
var distanceXOnMirrorImage = (parseInt(mirrorCanvasX) + parseInt(mirrorCanvasWidth)) - (parseInt(event.pageX) + horizontlScrollPosition);// - 135);
var mirrorXOnNormalImage = parseInt(maskCanvasContext.canvas.offsetLeft) + parseInt(distanceXOnMirrorImage);
var actulalX = mirrorXOnNormalImage;
var actualY = event.pageY + verticalScrollPosition;
var pixelData = maskCanvasContext.getImageData(Math.round(actulalX - parseInt(maskCanvasContext.canvas.offsetLeft)), Math.round(actualY - $rootScope.BodyRegionYAxis), 1, 1);
pixelData.data[0] = pixelData.data[0] - 9;
pixelData.data[1] = pixelData.data[1] - 9;
pixelData.data[2] = pixelData.data[2] - 9
var Red;
var Green;
var Blue;
var zero = "0";
if ((pixelData.data[0]).toString().length != 2) {
Red = zero.concat((pixelData.data[0]).toString())
}
else {
Red = (pixelData.data[0]).toString()
}
if ((pixelData.data[1]).toString().length != 2) {
Green = zero.concat((pixelData.data[1]).toString())
}
else {
Green = (pixelData.data[1]).toString()
}
if ((pixelData.data[2]).toString().length != 2) {
Blue = zero.concat((pixelData.data[2]).toString())
}
else {
Blue = (pixelData.data[2]).toString()
}
var RGBColor = (Red + Green + Blue);
// alert(RGBColor);
//$rootScope.previousHighlightList.push(RGBColor);
}
// var maskCanvasId = "imageCanvas" + $rootScope.BRId + "_mci";
// alert(annotationText);
$scope.MultiLanguageAnnationArray = [];
for (var i = 0; i <= $rootScope.annotationText.length - 1; i++) {
$scope.MultiLanguageAnnationArray.push($rootScope.annotationText[i]);
}
if (annotationText == "undefined") {
}
else {
$scope.createDynamicSpeechBubble(event, event.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left, event.pageY + verticalScrollPosition - $('#canvasDiv').offset().top, true)
}
}
$rootScope.setSelectedBodyRegionData = function () {
var BodyRegionDictionary = $rootScope.BodyRegionCordinatesData;
$.each(BodyRegionDictionary, function (index, value) {
var bodyRegionRight = parseInt(value.X) + parseInt(value.Width);
var bodyRegionBottom = parseInt(value.Y) + parseInt(value.Height);
if ($rootScope.Xaxis <= bodyRegionRight && $rootScope.Yaxis <= bodyRegionBottom && value.X <= $rootScope.Xaxis && value.Y <= $rootScope.Yaxis) {
if ($rootScope.currentBodyViewId == "11" || $rootScope.currentBodyViewId == "9") {
if (value.bodyRegionId == "6") {
$rootScope.BRId = value.bodyRegionId;
$rootScope.BodyRegionXAxis = value.X;
$rootScope.BodyRegionYAxis = value.Y;
$rootScope.isMirrorBodyRegion = value.IsMirror;
return false;
}
}
else {
$rootScope.BRId = value.bodyRegionId;
$rootScope.BodyRegionXAxis = value.X;
$rootScope.BodyRegionYAxis = value.Y;
$rootScope.isMirrorBodyRegion = value.IsMirror;
return false;
}
}
});
}
function resizeTransparencyBox() {
clearTransCanvas();
if ($('#speechBubbleTrns').length > 0) {
$('#speechBubbleTrns').remove();
}
var tCanvas = document.getElementById('transparencyCanvas');
var tCanvasContext = tCanvas.getContext('2d');
var tCanvasHeight = parseInt((tCanvas.style.height).replace('px', ''));
var tCanvasWidth = parseInt((tCanvas.style.width).replace('px', ''));
var tBoxStartX = parseInt((tCanvas.style.left).replace('px', ''));
var tBoxEndX = parseInt((tCanvas.style.left).replace('px', '')) + parseInt((tCanvas.style.width.replace('px', '')));
var tBoxStartY = parseInt((tCanvas.style.top).replace('px', ''));
var tBoxEndY = parseInt((tCanvas.style.top).replace('px', '')) + parseInt((tCanvas.style.height).replace('px', ''));
var transparencyBoxBottom = parseInt(tBoxStartY) + parseInt(tCanvasHeight);
var transparencyBoxRight = parseInt(tBoxStartX) + parseInt(tCanvasWidth);
if (tCanvas != null) {
$('#transparencyCanvas').remove();
}
var modestyTransCanvases = $("canvas[id*='modestyTransCanavs']");
if (modestyTransCanvases != null || modestyTransCanvases != undefined && modestyTransCanvases.length > 0) {
for (var j = 0; j < modestyTransCanvases.length; j++) {
modestyTransCanvases[j].parentNode.removeChild(modestyTransCanvases[j]);
}
}
var modestyTempCanvases = $("canvas[id*='tempCanvasModesty_']");
if (modestyTempCanvases != null || modestyTransCanvases != undefined && modestyTransCanvases.length > 0) {
for (var j = 0; j < modestyTempCanvases.length; j++) {
modestyTempCanvases[j].parentNode.removeChild(modestyTempCanvases[j]);
}
}
if (tCanvasHeight != $scope.transparencyCanvasHeight || tCanvasWidth != $scope.transparencyCanvasWidth) {
var transparencyCanvas = document.createElement('canvas');
transparencyCanvas.id = 'transparencyCanvas';
$scope.transparencyCanvas = tCanvas.id;
transparencyCanvas.height = tCanvasHeight;
transparencyCanvas.width = tCanvasWidth;
transparencyCanvas.style.position = "absolute";
transparencyCanvas.style.left = tCanvas.style.left; // x + "px";
transparencyCanvas.style.top = tCanvas.style.top//y + "px";
transparencyCanvas.style.border = "black 1px solid";
transparencyCanvas.style.zIndex = 200;
document.getElementById('canvasDiv').appendChild(transparencyCanvas);
$('#transparencyCanvas').resizable({ handles: "e,s,se,w,n,ne,nw,sw", stop: function (event, ui) { resizeTransparencyBox(); }, start: function (event, ui) { clearTransCanvas(); } });
$(".ui-wrapper").css("z-index", $rootScope.UIWrapperZIndex);
//bind click listener
transparencyCanvas.addEventListener('click', TransparencyCanvasClickListener);
}
$scope.transparencyCanvasHeight = tCanvasHeight;
$scope.transparencyCanvasWidth = tCanvasWidth;
//create temp cavas to retain the original anavs data for use in transparency change as
//if u use original canvas data for transprency change then at 0 transparency all data will become transparent and if u increase transparency with this data then the canavs will be blank
if (document.getElementById('tempCanvas') != null) {
$('#tempCanvas').remove();
}
var tempCanvas = document.createElement('canvas');
tempCanvas.id = 'tempCanvas';
$scope.tempCanvas = tempCanvas.id;
tempCanvas.height = $scope.transparencyCanvasHeight;
tempCanvas.width = $scope.transparencyCanvasWidth;
tempCanvas.style.position = "absolute";
tempCanvas.style.left = 200 + 'px';
tempCanvas.style.backgroundColor = "transparent";
tempCanvas.style.visibility = 'hidden';
// tempCanvas.style.border = "black 1px solid";
document.getElementById('canvasDiv').appendChild(tempCanvas);
var BodyRegionDictionary = $rootScope.BodyRegionCordinatesData;
$scope.IncludedBodyRegions = [];
$scope.transparencyDrawnRegions = [];
$scope.canThirdBRDrawn = false;
// $scope.layerNo = parseInt(document.getElementById(''))
var counter = 0;
$.each(BodyRegionDictionary, function (index, value) {
var bodyRegionRight = parseInt(value.X) + parseInt(value.Width);
var bodyRegionBottom = parseInt(value.Y) + parseInt(value.Height);
var TBRight = parseInt((document.getElementById('transparencyCanvas').style.left).replace('px', '')) + parseInt((document.getElementById('transparencyCanvas').style.width).replace('px', ''));
var TBBottom = parseInt((document.getElementById('transparencyCanvas').style.top).replace('px', '')) + parseInt((document.getElementById('transparencyCanvas').style.height).replace('px', ''));
var TBStartX = parseInt((document.getElementById('transparencyCanvas').style.left).replace('px', ''));
var TBStartY = parseInt((document.getElementById('transparencyCanvas').style.top).replace('px', ''));
if (TBStartX <= bodyRegionRight && value.X <= TBRight && TBStartY <= bodyRegionBottom && value.Y <= TBBottom) {
if ($scope.isTBDrawnOnBodyRegion == false) {
$scope.layerNumber = $scope.layerNumber + 1;
}
if (value.bodyRegionId == '3') {
var BR_SixTBData = new jinqJs()
.from($scope.transparencyDrawnRegions)
.where('BRID == 6')
.select();
if (BR_SixTBData != null && BR_SixTBData != undefined && BR_SixTBData.length > 0) {
$scope.canThirdBRDrawn = true;
}
}
//$scope.loadTransparencyImage(value.bodyRegionId, value.Height, value.Width, value.X, value.Y, value.IsMirror, $scope.TransparencyBoxStartX, $scope.TransparencyEndX, $scope.TransparencyBoxStartY, $scope.TransparencyBoxEndY, $scope, false, false);
if (($rootScope.voId == "9" || $rootScope.voId == "11" || $rootScope.voId == "2" || $rootScope.voId == "3" || $rootScope.voId == "6" || $rootScope.voId == "7")) {
if (value.bodyRegionId == "6") {
$scope.loadTransparencyImage(value.bodyRegionId, value.Height, value.Width, value.X, value.Y, value.IsMirror, $scope.TransparencyBoxStartX, $scope.TransparencyEndX, $scope.TransparencyBoxStartY, $scope.TransparencyBoxEndY, $scope, false, false, true);
}
else {
$scope.loadTransparencyImage(value.bodyRegionId, value.Height, value.Width, value.X, value.Y, value.IsMirror, $scope.TransparencyBoxStartX, $scope.TransparencyEndX, $scope.TransparencyBoxStartY, $scope.TransparencyBoxEndY, $scope, false, false, true);
}
}
else
{
if (value.bodyRegionId == '3' && $scope.canThirdBRDrawn == true) {
$scope.loadTransparencyImage(value.bodyRegionId, value.Height, value.Width, value.X, value.Y, value.IsMirror, $scope.TransparencyBoxStartX, $scope.TransparencyEndX, $scope.TransparencyBoxStartY, $scope.TransparencyBoxEndY, $scope, false, false, true);
}
else {
if (value.bodyRegionId == '3' && $scope.canThirdBRDrawn == false) {
//1. draw 6th
var BRSixData = new jinqJs()
.from(BodyRegionDictionary)
.where('bodyRegionId == 6')
.select();
var isMirror = BRSixData[0].IsMirror;
if (isMirror == 'Yes') {
//draw mirror arm
$scope.loadTransparencyImage(BRSixData[0].bodyRegionId, BRSixData[0].Height, BRSixData[0].Width, BRSixData[0].X, BRSixData[0].Y, 'Yes', $scope.TransparencyBoxStartX, $scope.TransparencyEndX, $scope.TransparencyBoxStartY, $scope.TransparencyBoxEndY, $scope, false, false, true);
//draw non mirror arm
$scope.loadTransparencyImage(BRSixData[1].bodyRegionId, BRSixData[1].Height, BRSixData[1].Width, BRSixData[1].X, BRSixData[1].Y, 'No', $scope.TransparencyBoxStartX, $scope.TransparencyEndX, $scope.TransparencyBoxStartY, $scope.TransparencyBoxEndY, $scope, false, false, true);
//draw 3rd BR
$timeout(function () {
$scope.loadTransparencyImage(value.bodyRegionId, value.Height, value.Width, value.X, value.Y, value.IsMirror, $scope.TransparencyBoxStartX, $scope.TransparencyEndX, $scope.TransparencyBoxStartY, $scope.TransparencyBoxEndY, $scope, false, false, true);
}, 200);
}
else {
//draw mirror arm
$scope.loadTransparencyImage(BRSixData[0].bodyRegionId, BRSixData[0].Height, BRSixData[0].Width, BRSixData[0].X, BRSixData[0].Y, 'No', $scope.TransparencyBoxStartX, $scope.TransparencyEndX, $scope.TransparencyBoxStartY, $scope.TransparencyBoxEndY, $scope, false, false, true);
//draw non mirror arm
$scope.loadTransparencyImage(BRSixData[1].bodyRegionId, BRSixData[1].Height, BRSixData[1].Width, BRSixData[1].X, BRSixData[1].Y, 'Yes', $scope.TransparencyBoxStartX, $scope.TransparencyEndX, $scope.TransparencyBoxStartY, $scope.TransparencyBoxEndY, $scope, false, false, true);
//draw 3rd BR
$timeout(function () {
$scope.loadTransparencyImage(value.bodyRegionId, value.Height, value.Width, value.X, value.Y, value.IsMirror, $scope.TransparencyBoxStartX, $scope.TransparencyEndX, $scope.TransparencyBoxStartY, $scope.TransparencyBoxEndY, $scope, false, false, true);
}, 200);
}
}
else {
var BR_SixTBData = new jinqJs()
.from($scope.transparencyDrawnRegions)
.where('BRID == 6')
.select();
if (value.bodyRegionId == "6" && BR_SixTBData != undefined && BR_SixTBData != null && BR_SixTBData.length > 0) {
//do not draw 6 BR again, its already drawn
}
else
$scope.loadTransparencyImage(value.bodyRegionId, value.Height, value.Width, value.X, value.Y, value.IsMirror, $scope.TransparencyBoxStartX, $scope.TransparencyEndX, $scope.TransparencyBoxStartY, $scope.TransparencyBoxEndY, $scope, false, false, true);
}
}
}
$scope.isTBDrawnOnBodyRegion = true;
}
})
//for modesty
if ($rootScope.isModestyOn == true && $scope.modestyImageInfo.length > 0) {
$.each($scope.modestyImageInfo, function (index, value) {
var bodyRegionRight = parseInt(value.x) + parseInt(value.Width);
var bodyRegionBottom = parseInt(value.y) + parseInt(value.Height);
var TBRight = parseInt((document.getElementById('transparencyCanvas').style.left).replace('px', '')) + parseInt((document.getElementById('transparencyCanvas').style.width).replace('px', ''));
var TBBottom = parseInt((document.getElementById('transparencyCanvas').style.top).replace('px', '')) + parseInt((document.getElementById('transparencyCanvas').style.height).replace('px', ''));
var TBStartX = parseInt((document.getElementById('transparencyCanvas').style.left).replace('px', ''));
var TBStartY = parseInt((document.getElementById('transparencyCanvas').style.top).replace('px', ''));
if (TBStartX <= bodyRegionRight && value.x <= TBRight && TBStartY <= bodyRegionBottom && value.y <= TBBottom) {
$scope.loadTransparencyImage(value.bodyRegionId, value.Height, value.Width, value.x, value.y, value.IsMirror, $scope.TransparencyBoxStartX, $scope.TransparencyEndX, $scope.TransparencyBoxStartY, $scope.TransparencyBoxEndY, $scope, false, false, true);
}
})
}
}
function TransparencyCanvasClickListener(evt) {
// alert('tb clicked');
var pixelData;
var pixelDataTrans;
var mousePos = $scope.getMousePos(evt);
// alert(mousePos.x + ',' + mousePos.y);
var canvasDiv = document.getElementById('canvasDiv');
var verticalScrollPosition = canvasDiv.scrollTop;
var horizontlScrollPosition = canvasDiv.scrollLeft;
//We substracted 135, as the difference between flex and html coordinates for same organ is 135
var actulalX = mousePos.x + horizontlScrollPosition;
var actualY = mousePos.y + verticalScrollPosition //- 135; //+ tomenuBarheight + titleBarheight + searchComboheight;
var clickedBodyRegion;
var x;
var y;
var isMirror;
var width;
var BodyRegionDictionary = $rootScope.BodyRegionCordinatesData;
if ($rootScope.viewOrientationId == 5) {
var clickedBodyRegionData = new jinqJs()
.from(BodyRegionDictionary)
.where('bodyRegionId == 6')
.select();
// clickedBodyRegion = clickedBodyRegionData[0].bodyRegionId;
x = clickedBodyRegionData[0].X;
y = clickedBodyRegionData[0].Y;
width = clickedBodyRegionData[0].Width;
var height = clickedBodyRegionData[0].Height;
isMirror = clickedBodyRegionData[0].IsMirror;
var bodyRegionRight = parseInt(x) + parseInt(width);
var bodyRegionBottom = parseInt(y) + parseInt(height);
if (actulalX <= bodyRegionRight && x <= actulalX && actualY <= bodyRegionBottom && y <= actualY) {
clickedBodyRegion = clickedBodyRegionData[0].bodyRegionId;
x = clickedBodyRegionData[0].X;
y = clickedBodyRegionData[0].Y;
width = clickedBodyRegionData[0].Width;
var height = clickedBodyRegionData[0].Height;
isMirror = clickedBodyRegionData[0].IsMirror;
}
}
else {
$.each(BodyRegionDictionary, function (index, value) {
var bodyRegionRight = parseInt(value.X) + parseInt(value.Width);
var bodyRegionBottom = parseInt(value.Y) + parseInt(value.Height);
if (actulalX <= bodyRegionRight && value.X <= actulalX && actualY <= bodyRegionBottom && value.Y <= actualY) {
clickedBodyRegion = value.bodyRegionId;
x = value.X;
y = value.Y;
width = value.Width;
isMirror = value.IsMirror;
return false;
}
})
}
if (isMirror == "Yes") {
var mirrorCanvasX = x;
var mirrorCanvasWidth = width;
var clickedCanvasMaskId = 'imageCanvas' + clickedBodyRegion + '_mci';
var clickedCanavs = document.getElementById(clickedCanvasMaskId);
var maskCanvasId = 'transparencyTempCanvasMask_' + clickedBodyRegion + '_mci';
var maskCanvas = document.getElementById(maskCanvasId);
if (maskCanvas != null) {
x = maskCanvas.style.left;
y = maskCanvas.style.top;
var maskCanvasTransId = 'transparencyTempCanvasMask_' + clickedBodyRegion + '_mci';
var maskCanvastrans = document.getElementById(maskCanvasTransId);
var maskCanvasContexttrans = maskCanvastrans.getContext("2d");
getAnnotationAndCraeteSpeechBubble(mirrorCanvasX, mirrorCanvasWidth, mousePos, maskCanvasContexttrans, clickedBodyRegion, x, y, evt)
}
//if non mirrored canvas does not exist for this irror Body region then draw non mirrored image to get annotation
else if (maskCanvas == null) {
var clickedBodyRegionData = new jinqJs()
.from(BodyRegionDictionary)
.where('bodyRegionId == ' + clickedBodyRegion)
.select();
if (clickedBodyRegionData != null || clickedBodyRegionData != undefined) {
var nomMirroredBodyRegion = new jinqJs()
.from(clickedBodyRegionData)
.where('IsMirror == No')
.select();
var transparencyTempcanavsMask = document.createElement('canvas');
transparencyTempcanavsMask.id = 'transparencyTempCanvasMask_' + clickedBodyRegion + '_mci';
transparencyTempcanavsMask.height = nomMirroredBodyRegion[0].Height;
transparencyTempcanavsMask.width = nomMirroredBodyRegion[0].Width;
transparencyTempcanavsMask.style.position = "absolute";
transparencyTempcanavsMask.style.left = nomMirroredBodyRegion[0].X + 'px' // x + "px";
transparencyTempcanavsMask.style.top = nomMirroredBodyRegion[0].Y + "px"//y + "px";
transparencyTempcanavsMask.style.visibility = 'hidden';
document.getElementById('canvasDiv').appendChild(transparencyTempcanavsMask);
var tranparencyImgSrc = $scope.GetImageSource(clickedBodyRegion);
var tranparencyMaskImgSrc = $scope.GetMaskImageSource(tranparencyImgSrc);
var tempMaskImg = new Image();
tempMaskImg.src = tranparencyMaskImgSrc;
tempMaskImg.onload = function () {
var transparencyTempcanavsMask = document.getElementById(maskCanvasId);
var tempmaskCtx = transparencyTempcanavsMask.getContext('2d');
tempmaskCtx.drawImage(tempMaskImg, 0, 0);
//get x,y of non mirrored canvas for this body region
x = transparencyTempcanavsMask.style.left;
y = transparencyTempcanavsMask.style.top;
getAnnotationAndCraeteSpeechBubble(mirrorCanvasX, mirrorCanvasWidth, mousePos, tempmaskCtx, clickedBodyRegion, x, y, evt)
}
}
}
}
else {
var clickedCanvasMaskId = 'imageCanvas' + clickedBodyRegion + '_mci';
var maskCanvas = document.getElementById(clickedCanvasMaskId);
var maskCanvasContext = maskCanvas.getContext("2d");
//transparecncy canvas
var maskCanvasTransId = 'transparencyTempCanvasMask_' + clickedBodyRegion + '_mci';
var maskCanvastrans = document.getElementById(maskCanvasTransId);
var maskCanvasContexttrans = maskCanvastrans.getContext("2d");
pixelData = maskCanvasContext.getImageData(Math.round(actulalX - x), Math.round(actualY - y), 1, 1);
pixelDataTrans = maskCanvasContexttrans.getImageData(Math.round(actulalX - x), Math.round(actualY - y), 1, 1);
var annotations = $scope.getAnnotationForTransparencyBox(pixelData, pixelDataTrans, $scope);
//var annotations = $scope.getAnnotationForTransparencyBox(pixelData, pixelDataTrans, $scope);
if ($('#speechBubble').length > 0)
$('#speechBubble').remove();
if ($('#speechBubbleTrns').length > 0) {
$('#speechBubbleTrns').remove();
// $scope.createSpeechBubbleOnTransparencyBox(evt, annotations.annotationT1, annotations.annotationT2, evt.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left + 5, evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top - 50)
$scope.annotationTextArrayT1 = [];
$scope.annotationTextArrayT2 = [];
for (var i = 0; i <= $rootScope.annotationTextForTrans1.length - 1; i++) {
$scope.annotationTextArrayT1.push($rootScope.annotationTextForTrans1[i]);
}
for (var i = 0; i <= $rootScope.annotationTextForTrans2.length - 1; i++) {
$scope.annotationTextArrayT2.push($rootScope.annotationTextForTrans2[i]);
}
//$scope.annotationTextArrayT1.push(annotations.annotationT1);
// $scope.annotationTextArrayT2.push(annotations.annotationT2);
$scope.createDynamicSpeechBubble(evt, evt.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left, evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top, false);
}
else
// $scope.createSpeechBubbleOnTransparencyBox(evt, annotations.annotationT1, annotations.annotationT2, evt.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left + 5, evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top - 50)
{
$scope.annotationTextArrayT1 = [];
$scope.annotationTextArrayT2 = [];
for (var i = 0; i <= $rootScope.annotationTextForTrans1.length - 1; i++) {
$scope.annotationTextArrayT1.push($rootScope.annotationTextForTrans1[i]);
}
for (var i = 0; i <= $rootScope.annotationTextForTrans2.length - 1; i++) {
$scope.annotationTextArrayT2.push($rootScope.annotationTextForTrans2[i]);
}
//$scope.annotationTextArrayT1.push(annotations.annotationT1);
// $scope.annotationTextArrayT2.push(annotations.annotationT2);
$scope.createDynamicSpeechBubble(evt, evt.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left, evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top, false);
}
}
}
function OnClickModestyTransCanvas(evt) {
var tCanvasLeft = $(".ui-wrapper").css("left");
var tCanvasLeftAftrSplit = tCanvasLeft.split("p");
var tCanvasTop = $(".ui-wrapper").css("top");
var tCanvasTopAftrSplit = tCanvasTop.split("p");
var tCanvasWidth = $(".ui-wrapper").css("width");
var tCanvasWidthAftrSplit = tCanvasWidth.split("p");
var tCanvasHeight = $(".ui-wrapper").css("height");
var tCanvasHeightAftrSplit = tCanvasHeight.split("p");
// alert("modesty");
var tCanvasTotalWidth = parseInt(tCanvasLeftAftrSplit[0]) + parseInt(tCanvasWidthAftrSplit[0]);
var tCanvasTotalHeight = parseInt(tCanvasTopAftrSplit[0]) + parseInt(tCanvasHeightAftrSplit[0]);
var mousePos = $scope.getMousePos(evt);
var canvasDiv = document.getElementById('canvasDiv');
var verticalScrollPosition = canvasDiv.scrollTop;
var horizontlScrollPosition = canvasDiv.scrollLeft;
var actulalX = mousePos.x + horizontlScrollPosition;
var actualY = mousePos.y + verticalScrollPosition;
var canavsX = evt.currentTarget.offsetLeft;
var canvasY = evt.currentTarget.offsetTop;
if ((tCanvasLeftAftrSplit[0] <= actulalX && (actulalX <= tCanvasTotalWidth)) && (tCanvasTopAftrSplit[0] <= actualY && actualY <= tCanvasTotalHeight)) {
var canvasId = evt.currentTarget.id;
var canavsContext = document.getElementById(canvasId).getContext('2d');
var RGBColor = $scope.GetRGBColor(canavsContext, actulalX, actualY, canavsX, canvasY);
var annotationText;
//Modesty ON
if (canvasId.match('modestyImg') && RGBColor != '000000') {
RGBColor = DA[0].figLeafTermId;
annotationText = $scope.GetAnnotationBasedOnActualTermNo(RGBColor);
$scope.annotationTextArrayT1 = [];
$scope.annotationTextArrayT2 = [];
$scope.annotationTextArrayT1.push(annotationText);
$scope.annotationTextArrayT2.push(annotationText);
}
//Modesty On but clicked somewhre else, we did modesty check because the modesty image covers whole body region so if user will click to
//see the annotation apart from leaf then the actual click will be on modesty canvas, but for annotation er
//
else if (canvasId.match('modestyImg') && RGBColor == '000000') {
var bodyRegionId = canvasId.slice(-1);
var maskCanvasId = 'imageCanvas' + bodyRegionId + '_mci';
var maskCanvas = document.getElementById(maskCanvasId);
var maskCanvasContext = maskCanvas.getContext("2d");
//RGBColor = $scope.GetRGBColor(maskCanvasContext, actulalX, actualY, xcanavsX, canvasY);
//annotationText = $scope.GetAnnotationText(parseInt(RGBColor));
//transparecncy canvas
var maskCanvasTransId = 'transparencyTempCanvasMask_' + bodyRegionId + '_mci';
var maskCanvastrans = document.getElementById(maskCanvasTransId);
var maskCanvasContexttrans = maskCanvastrans.getContext("2d");
var pixelData = maskCanvasContext.getImageData(Math.round(actulalX - canavsX), Math.round(actualY - canvasY), 1, 1);
var pixelDataTrans = maskCanvasContexttrans.getImageData(Math.round(actulalX - canavsX), Math.round(actualY - canvasY), 1, 1);
var annotations = $scope.getAnnotationForTransparencyBox(pixelData, pixelDataTrans, $scope);
// var maskCanvasId = 'imageCanvas' + bodyRegionId + '_mci';
// var maskCanvas = document.getElementById(maskCanvasId);
// var maskCanvasContext = maskCanvas.getContext("2d");
// RGBColor = $scope.GetRGBColor(maskCanvasContext, actulalX, actualY, xcanavsX, canvasY);
// annotationText = $scope.GetAnnotationText(parseInt(RGBColor));
// createSpeechBubbleOnTransparencyBox(evt, annotations.annotationT1, annotations.annotationT2, evt.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left + 5, evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top - 50)
$scope.annotationTextArrayT1 = [];
$scope.annotationTextArrayT2 = [];
for (var i = 0; i <= annotations.annotationT1.length - 1; i++) {
$scope.annotationTextArrayT1.push(annotations.annotationT1[i]);
}
for (var i = 0; i <= annotations.annotationT2.length - 1; i++) {
$scope.annotationTextArrayT2.push(annotations.annotationT2[i]);
}
//$scope.annotationTextArrayT1.push(annotations.annotationT1);
// $scope.annotationTextArrayT2.push(annotations.annotationT2);
}
if ($('#speechBubble').length > 0)
$('#speechBubble').remove();
if ($('#speechBubbleTrns').length > 0) {
$('#speechBubbleTrns').remove();
}
var tCanvasTopPos = $(".ui-wrapper").css("top");
var tCanvasTopPosAftrSplit = tCanvasTopPos.split("p");
var tCanvasHeight = $(".ui-wrapper").css("height");
var tCanvasHeightAftrSplit = tCanvasHeight.split("p");
var tCanvasAttr = parseInt(tCanvasTopPosAftrSplit[0]) + parseInt(tCanvasHeightAftrSplit[0]);
// if ((evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top) >= parseInt(tCanvasTopPosAftrSplit[0]) && (evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top) <= tCanvasAttr) {
$scope.createDynamicSpeechBubble(evt, evt.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left, evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top, false);
//}
//else {
// $rootScope.getAnnotationTextBasedOnSelectedBodyRegion(evt);
//}
}
else
{
$rootScope.getAnnotationTextBasedOnSelectedBodyRegion(evt);
}
}
function getAnnotationAndCraeteSpeechBubble(mirrorCanvasX, mirrorCanvasWidth, mousePos, maskCanvasContexttrans, clickedBodyRegion, x, y, evt) {
var canvasDiv = document.getElementById('canvasDiv');
var verticalScrollPosition = canvasDiv.scrollTop;
var horizontlScrollPosition = canvasDiv.scrollLeft;
var distanceXOnMirrorImage = (parseInt(mirrorCanvasX) + parseInt(mirrorCanvasWidth)) - (parseInt(mousePos.x) + horizontlScrollPosition);// - 135);
var mirrorXOnNormalImage = parseInt(maskCanvasContexttrans.canvas.offsetLeft) + parseInt(distanceXOnMirrorImage);
var actulalX = mirrorXOnNormalImage
var actualY = mousePos.y + verticalScrollPosition
var clickedCanvasMaskId = 'imageCanvas' + clickedBodyRegion + '_mci';
var maskCanvas = document.getElementById(clickedCanvasMaskId);
var maskCanvasContext = maskCanvas.getContext("2d");
var imgX = Math.round(actulalX - parseInt((x).replace('px', '')));
var imgY = Math.round(actualY - parseInt((y).replace('px', '')));
var pixelData = maskCanvasContext.getImageData(imgX, imgY, 1, 1);
//trans layer image data
var pixelDataTrans = maskCanvasContexttrans.getImageData(imgX, imgY, 1, 1);
// console.log('at the time' + pixelData.data[0])
var annotations = $scope.getAnnotationForTransparencyBox(pixelData, pixelDataTrans, $scope);
if ($('#speechBubble').length > 0)
$('#speechBubble').remove();
if ($('#speechBubbleTrns').length > 0) {
$('#speechBubbleTrns').remove();
// createSpeechBubbleOnTransparencyBox(evt, annotations.annotationT1, annotations.annotationT2, evt.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left + 5, evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top - 50)
$scope.annotationTextArrayT1 = [];
$scope.annotationTextArrayT2 = [];
for (var i = 0; i <= $rootScope.annotationTextForTrans1.length - 1; i++) {
$scope.annotationTextArrayT1.push($rootScope.annotationTextForTrans1[i]);
}
for (var i = 0; i <= $rootScope.annotationTextForTrans2.length - 1; i++) {
$scope.annotationTextArrayT2.push($rootScope.annotationTextForTrans2[i]);
}
//$scope.annotationTextArrayT1.push(annotations.annotationT1);
// $scope.annotationTextArrayT2.push(annotations.annotationT2);
$scope.createDynamicSpeechBubble(evt, evt.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left, evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top, false);
}
else {
$scope.annotationTextArrayT1 = [];
$scope.annotationTextArrayT2 = [];
for (var i = 0; i <= $rootScope.annotationTextForTrans1.length - 1; i++) {
$scope.annotationTextArrayT1.push($rootScope.annotationTextForTrans1[i]);
}
for (var i = 0; i <= $rootScope.annotationTextForTrans2.length - 1; i++) {
$scope.annotationTextArrayT2.push($rootScope.annotationTextForTrans2[i]);
}
//$scope.annotationTextArrayT1.push(annotations.annotationT1);
// $scope.annotationTextArrayT2.push(annotations.annotationT2);
$scope.createDynamicSpeechBubble(evt, evt.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left, evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top, false);
}
}
function clearTransCanvas() {
var tCanvas = document.getElementById('transparencyCanvas');
if (tCanvas != null) {
var tCanvasContext = tCanvas.getContext('2d');
tCanvasContext.clearRect(0, 0, parseInt(tCanvas.style.width), parseInt(tCanvas.style.height));
}
}
$scope.getAnnotationForTransparencyBox = function (pixelData, pixelDataTrans, scope) {
pixelData.data[0] = pixelData.data[0] - 9;
pixelData.data[1] = pixelData.data[1] - 9;
pixelData.data[2] = pixelData.data[2] - 9;
//trans pixel data
pixelDataTrans.data[0] = pixelDataTrans.data[0] - 9;
pixelDataTrans.data[1] = pixelDataTrans.data[1] - 9;
pixelDataTrans.data[2] = pixelDataTrans.data[2] - 9;
var Red;
var Green;
var Blue;
var zero = "0";
if ((pixelData.data[0]).toString().length != 2) {
Red = zero.concat((pixelData.data[0]).toString())
}
else {
Red = (pixelData.data[0]).toString()
}
if ((pixelData.data[1]).toString().length != 2) {
Green = zero.concat((pixelData.data[1]).toString())
}
else {
Green = (pixelData.data[1]).toString()
}
if ((pixelData.data[2]).toString().length != 2) {
Blue = zero.concat((pixelData.data[2]).toString())
}
else {
Blue = (pixelData.data[2]).toString()
}
var RGBColor = (Red + Green + Blue);
$rootScope.annotationTextForTrans1 = [];
var annotationText1 = $scope.GetAnnotationText(parseInt(RGBColor));
for (var i = 0; i <= $rootScope.annotationText.length - 1; i++) {
$rootScope.annotationTextForTrans1.push($rootScope.annotationText[i]);
}
//get annotation for trans canavs
var RedTrans;
var GreenTrans;
var BlueTrans;
var zero = "0";
if ((pixelDataTrans.data[0]).toString().length != 2) {
RedTrans = zero.concat((pixelDataTrans.data[0]).toString())
}
else {
RedTrans = (pixelDataTrans.data[0]).toString()
}
if ((pixelDataTrans.data[1]).toString().length != 2) {
GreenTrans = zero.concat((pixelDataTrans.data[1]).toString())
}
else {
GreenTrans = (pixelDataTrans.data[1]).toString()
}
if ((pixelDataTrans.data[2]).toString().length != 2) {
BlueTrans = zero.concat((pixelDataTrans.data[2]).toString())
}
else {
BlueTrans = (pixelDataTrans.data[2]).toString()
}
var RGBColorTrans = (RedTrans + GreenTrans + BlueTrans);
$rootScope.annotationTextForTrans2 = [];
var annotationText2 = $scope.GetAnnotationText(parseInt(RGBColorTrans));
for (var i = 0; i <= $rootScope.annotationText.length - 1; i++) {
$rootScope.annotationTextForTrans2.push($rootScope.annotationText[i]);
}
return {
annotationT1: annotationText1,
annotationT2: annotationText2
}
}
$scope.onTransparencyChange = function (ev, ui) {
$scope.transNumber = ui.value;
var tCanvas = document.getElementById('transparencyCanvas');
var tCanvasContext = tCanvas.getContext('2d');
var tCanvasHeight = parseInt((tCanvas.style.height).replace('px', ''));
var tCanvasWidth = parseInt((tCanvas.style.width).replace('px', ''));
var tBoxStartX = parseInt((tCanvas.style.left).replace('px', ''));
var tBoxEndX = parseInt((tCanvas.style.left).replace('px', '')) + parseInt((tCanvas.style.width.replace('px', '')));
var tBoxStartY = parseInt((tCanvas.style.top).replace('px', ''));
var tBoxEndY = parseInt((tCanvas.style.top).replace('px', '')) + parseInt((tCanvas.style.height).replace('px', ''));
var transparencyBoxBottom = parseInt(tBoxStartY) + parseInt(tCanvasHeight);
var transparencyBoxRight = parseInt(tBoxStartX) + parseInt(tCanvasWidth);
//var scope = angular.element(document.getElementById("DAView")).scope();
//scope.$apply(function () {
var arr = [];
$scope.transparencyChangeCounter++;
//before changing the transparency of first canvas, hold the orignal canvas data on temp canvas
//put original data on transcanvas so that it can be used to change transparency properly
var tempCanavs = document.getElementById('tempCanvas');
var tempCanvasContext = tempCanavs.getContext('2d');
var originalTransparencyData = tempCanvasContext.getImageData(0, 0, $scope.transparencyCanvasWidth, $scope.transparencyCanvasHeight);
var ctx = document.getElementById('transparencyCanvas').getContext('2d');
ctx.putImageData(originalTransparencyData, 0, 0);
$scope.transparencyDrawnRegions = [];
//for modesty
if ($rootScope.isModestyOn == true && $scope.modestyImageInfo.length > 0) {
$.each($scope.modestyImageInfo, function (index, value) {
var brId = value.bodyRegionId;
var modestyTransTempCanvasId = 'tempCanvasModesty_' + brId;
var modestyTransCanvasId = 'modestyTransCanavs_' + brId;
if (document.getElementById(modestyTransTempCanvasId) != null) {
var tempCanvasContext = document.getElementById(modestyTransTempCanvasId).getContext('2d');
var originalTransparencyData = tempCanvasContext.getImageData(0, 0, value.Width, value.Height);
var ctx = document.getElementById(modestyTransCanvasId).getContext('2d');
ctx.putImageData(originalTransparencyData, 0, 0);
}
})
}
$scope.changeTransparency();
// });
}
$scope.CloseTransparencyBox = function () {
$rootScope.isTBoxModestyVisible = false;
//for enabling annoataions.
//Now everything si done on canavases uswed in annotation toolbar.
$rootScope.switchCanvas();
if ($rootScope.isAnnotaionToolBarDrawingModeActive == true) {
$("#OnIdentify").removeClass('annotationtoolbartab');
$("#DrawMode").addClass('annotationtoolbartab');
//$('.btnCursor').trigger('click');
$("#annotationpaintbrushsize").removeClass("activebtncolor");
$("#annotationpainteraser").removeClass("activebtncolor");
$('.btnCursor').addClass('activebtncolor');
}
else {
$("#OnIdentify").addClass('annotationtoolbartab');
$("#DrawMode").removeClass('annotationtoolbartab');
}
// $rootScope.switchCanvas();
//To enable extract button
$rootScope.isTransparencyActivated = false;
$("#btnExtract").removeClass("disabled");
$("#btnExtract").css("pointer-events", "auto");
$('.com_anno').remove();
$('#sppeachBubble_annotation').remove();
$('#dot_annotation').remove();
$('#bord_annotation').remove();
$('#dot').remove();
$('#sppeachBubble').remove();
$(".com").remove();
$("#bord").remove();
// clear canvas on closing of transparency box
if ($rootScope.isAnnotationWindowOpen == true) {
$('#canvas').removeLayers();
var paintCanvasObj = document.getElementById("canvasPaint");
if (paintCanvasObj != null) {
var ctx = paintCanvasObj.getContext("2d");
ctx.clearRect(0, 0, 2277, 3248);
var sktch = $('#canvasPaint').sketch();
$('#canvasPaint').sketch().actions = [];
}
}
// $("#annotationpaintbrushsize").removeClass("activebtncolor");
// $("#annotationpainteraser").removeClass("activebtncolor");
var tBox = document.getElementById('transparencyCanvas');
if (tBox != null) {
tBox.parentNode.removeChild(tBox)
var elements = document.getElementsByClassName('ui-icon ui-icon-gripsmall-diagonal-se');
while (elements.length > 0) {
elements[0].parentNode.removeChild(elements[0]);
}
//var txtTransparencyChange = document.getElementById("txtTransparencyChange");
//txtTransparencyChange.value = 0;
// document.getElementById('txtLayerNumber').value = 0;
$('#layerChangeSlider').slider("option", "value", parseInt($rootScope.totalLayers) - parseInt($rootScope.currentLayerNumber));
//if ($scope.isGenderChnage || $rootScope.isViewChange) {
// $("#txtlayerNumber").val(parseInt(0));
//}
//else
$("#txtlayerNumber").val(parseInt($rootScope.currentLayerNumber));
if (document.getElementById('tempCanvas') != null) {
$('#tempCanvas').remove();
}
if ($('#speechBubbleTrns').length > 0) {
$('#speechBubbleTrns').remove();
}
//var scope = angular.element(document.getElementById("DAView")).scope();
//scope.$apply(function () {
// $scope.layerNumber = 0;
// $rootScope.isTransparencyActivated = false;
//})
var tempCanvases = $("canvas[id*='transparencyTempCanvas']");
for (var i = 0; i < tempCanvases.length; i++) {
tempCanvases[i].parentNode.removeChild(tempCanvases[i]);
}
$('.ui-wrapper').remove();
//$("canvas[name*='transparencyTempCanvas']").nextUntil($("canvas[name*='transparencyTempCanvas']"))
//.remove();
$scope.layerNumber = $rootScope.currentLayerNumber;
$scope.transNumber = 100;
$(".slider").slider({ value: 100 })
}
var modestyTransCanvases = $("canvas[id*='modestyTransCanavs']");
if (modestyTransCanvases != null || modestyTransCanvases != undefined && modestyTransCanvases.length > 0) {
for (var j = 0; j < modestyTransCanvases.length; j++) {
modestyTransCanvases[j].parentNode.removeChild(modestyTransCanvases[j]);
}
}
$('#transparencyScale').css('visibility', 'hidden');
//$rootScope.isTransparencyActivated = false;
// document.getElementById('btnTranparency').className = 't-transparency'
$('#btnTranparency').removeClass('tButtonActive');
$('#btnTranparency').addClass('btn-black');
$('#btnIdentity').removeClass('btn-black');
$('#btnIdentity').addClass('btn-primary');
document.getElementById('btnTranparency').removeEventListener("click", $scope.createTransparencyBox);
}
$scope.createSpeechBubbleOnTransparencyBox = function (event, text1, text2, x, y) {
$('#canvasDiv').css('cursor', 'pointer');
$('
'
+ '