From 625f3c3d47458c034387e633078bde51c3244e61 Mon Sep 17 00:00:00 2001 From: nikita Date: Wed, 1 Feb 2017 17:12:22 +0530 Subject: [PATCH] everthing is drawn at appropraite location. Black/ gray issue in modesty image --- 400-SOURCECODE/AIAHTML5.Web/app/controllers/DAController.js | 195 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++------------------------------------------------------------------------------------- 1 file changed, 110 insertions(+), 85 deletions(-) diff --git a/400-SOURCECODE/AIAHTML5.Web/app/controllers/DAController.js b/400-SOURCECODE/AIAHTML5.Web/app/controllers/DAController.js index 2374fe9..75319f3 100644 --- a/400-SOURCECODE/AIAHTML5.Web/app/controllers/DAController.js +++ b/400-SOURCECODE/AIAHTML5.Web/app/controllers/DAController.js @@ -3913,8 +3913,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo function mouseUpListener(e) { $scope.isTBDrawnOnBodyRegion = false; - //alert('mouse up'); - console.log('MOUSE UP'); + $(".com").remove(); $('#dot').remove(); $('#bord').remove(); @@ -3926,12 +3925,10 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo var currentMousePosition = $scope.getMousePos(e); - var canvasDiv = document.getElementById('canvasDiv'); - var verticalScrollPosition = canvasDiv.scrollTop; - var horizontlScrollPosition = canvasDiv.scrollLeft; + var canavsDivScrollPos = $scope.getCanavsDivScrollPosition(); - var TransparencyEndX = currentMousePosition.x + horizontlScrollPosition - var TransparencyBoxEndY = currentMousePosition.y + verticalScrollPosition + var TransparencyEndX = currentMousePosition.x + canavsDivScrollPos.horizontlScrollPosition; + var TransparencyBoxEndY = currentMousePosition.y + canavsDivScrollPos.verticalScrollPosition; $scope.isTboxDrwan = true; @@ -3940,7 +3937,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo $scope.TransparencyEndX = TransparencyEndX; $scope.TransparencyBoxEndY = TransparencyBoxEndY; - $scope.layerNumberBeforeTrans = parseInt($('#txtlayerNumber').val()); + $scope.layerNumberBeforeTBDraw = parseInt($('#txtlayerNumber').val()); //draw temp box to store the canvas data with original transparecy if (document.getElementById('tempCanvas') != null) { @@ -3968,18 +3965,18 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo $scope.IncludedBodyRegions = []; $scope.transparencyDrawnRegions = []; - ////debugger; + $.each(BodyRegionDictionary, function (index, value) { - // alert(' $.each(BodyRegionDictionary1') - var transparencyBoxHeight = parseInt(TransparencyBoxEndY) - parseInt($scope.TransparencyBoxStartY); - var transparencyBoxWidth = parseInt(TransparencyEndX) - parseInt($scope.TransparencyBoxStartX); - var transparencyBoxBottom = parseInt($scope.TransparencyBoxStartY) + parseInt(transparencyBoxHeight); - var transparencyBoxRight = parseInt($scope.TransparencyBoxStartX) + parseInt(transparencyBoxWidth); - // alert(' $.each(BodyRegionDictionary2. transparencyBoxHeight: ' + transparencyBoxHeight + ',transparencyBoxBottom: ' + transparencyBoxBottom+', transparencyBoxRight: '+transparencyBoxRight) - var bodyRegionRight = parseInt(value.X) + parseInt(value.Width); - var bodyRegionBottom = parseInt(value.Y) + parseInt(value.Height); + + 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'); @@ -3995,7 +3992,6 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo transparencyCanvas.style.border = "black 1px solid"; transparencyCanvas.style.backgroundColor = "transparent"; transparencyCanvas.style.zIndex = 200; - // transparencyCanvas.style.visibility = 'hidden'; document.getElementById('canvasDiv').appendChild(transparencyCanvas); $scope.transparencyChangeCounter = 0; @@ -4032,14 +4028,15 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo //for modesty if ($rootScope.isModestyOn == true && $scope.modestyImageInfo.length > 0) { $.each($scope.modestyImageInfo, function (index, value) { - // alert(' $.each(BodyRegionDictionary1') - var transparencyBoxHeight = parseInt(TransparencyBoxEndY) - parseInt($scope.TransparencyBoxStartY); - var transparencyBoxWidth = parseInt(TransparencyEndX) - parseInt($scope.TransparencyBoxStartX); - var transparencyBoxBottom = parseInt($scope.TransparencyBoxStartY) + parseInt(transparencyBoxHeight); - var transparencyBoxRight = parseInt($scope.TransparencyBoxStartX) + parseInt(transparencyBoxWidth); - // alert(' $.each(BodyRegionDictionary2. transparencyBoxHeight: ' + transparencyBoxHeight + ',transparencyBoxBottom: ' + transparencyBoxBottom+', transparencyBoxRight: '+transparencyBoxRight) - var bodyRegionRight = parseInt(value.x) + parseInt(value.Width); - var bodyRegionBottom = parseInt(value.y) + parseInt(value.Height); + + 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) { @@ -4078,6 +4075,34 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo $('#btnIdentity').addClass('btn-primary'); } + $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) { @@ -4089,16 +4114,16 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo TransparencyBoxEndY = parseInt(transparencyCanvas.height) + parseInt(TransparencyBoxStartY); - var dimensions = $scope.calculateCoordinatesAndDimensionsForTB(Height, Width, X, Y, IsMirror, TransparencyBoxStartX, TransparencyEndX, TransparencyBoxStartY, TransparencyBoxEndY, bodyRegionId); + var TBImageDimensions = $scope.calculateDimensionsForTBImage(Height, Width, X, Y, IsMirror, TransparencyBoxStartX, TransparencyEndX, TransparencyBoxStartY, TransparencyBoxEndY, bodyRegionId); - var XforCopyImage = dimensions.XforCopyImageTB; - var YforCopyImage = dimensions.YforCopyImageTB; - var WidthforCopyImage = dimensions.WidthforCopyImageTB; - var HeightforCopyImage = dimensions.HeightforCopyImageTB; - var XforTransImage = dimensions.XforTransImageTB; - var WidthforTransImage = dimensions.WidthforTransImageTB; - var HeightforTransImage = dimensions.HeightforTransImageTB; - var YforTransImage = dimensions.YforTransImageTB; + 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 ($scope.isResized) { @@ -4106,13 +4131,12 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo } else if (isLayerChanged) { - } else { var tranparencyLayer; - var currentLayer = $scope.layerNumberBeforeTrans; + var currentLayer = $scope.layerNumberBeforeTBDraw; if (currentLayer == $rootScope.totalLayers) { @@ -4135,8 +4159,8 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo var tranparencyImgSrc; var tranparencyMaskImgSrc; - //for modesty image - if ($rootScope.isModestyOn == true && (bodyRegionId.match('modestyImg')))// == "2" || bodyRegionId == "3")) { + + if ($rootScope.isModestyOn == true && (bodyRegionId.match('modestyImg'))) { var modestyBodyRegionData = new jinqJs() .from($scope.modestyImageInfo) @@ -4144,51 +4168,41 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo .select(); tranparencyImgSrc = modestyBodyRegionData[0].SRC; } - - //modesty end - - //1. get the image source - else { tranparencyImgSrc = $scope.GetImageSource(bodyRegionId); tranparencyMaskImgSrc = $scope.GetMaskImageSource(tranparencyImgSrc); } - + //remove old canvases var oldCanvas; - - if (IsMirror == 'Yes') { - oldCanvas = document.getElementById('transparencyTempCanvas_MR_' + bodyRegionId) - } - else { - - oldCanvas = document.getElementById('transparencyTempCanvas_' + bodyRegionId) - - } - - if (oldCanvas != null) { - document.getElementById('canvasDiv').removeChild(oldCanvas); - } - - //remove tempmask canvas 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 @@ -4275,27 +4289,40 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo if (tranparencyImgSrc != undefined) { var tempImg = new Image(); + var tempCanvasID; + + if (IsMirror == 'Yes') { + tempCanvasID = 'transparencyTempCanvas_MR_' + bodyRegionId; + } + else { + if ($rootScope.isModestyOn == true && (bodyRegionId.match('modestyImg'))) { + tempCanvasID = 'transparencyTempCanvas_' + bodyRegionId;//bodyRegionId; + } + else + tempCanvasID = 'transparencyTempCanvas_' + bodyRegionId; + } tempImg.onload = function () { + var tempCtx = transparencyTempCanvas.getContext('2d'); if (IsMirror == 'Yes') { + //debugger; tempCtx.save(); tempCtx.translate(Width, 0); tempCtx.scale(-1, 1); tempCtx.drawImage(tempImg, 0, 0); if ($rootScope.isHighLight == true) { - var tempCanvasID = 'transparencyTempCanvas_MR_' + bodyRegionId; + // 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); - var tempCanvasID = 'transparencyTempCanvas_' + bodyRegionId; - if ($rootScope.isHighLight == true) { $scope.highlightTempTransparencyCanvas(tempCanvasID, XforCopyImage, YforCopyImage, WidthforCopyImage, HeightforCopyImage, XforTransImage, YforTransImage, WidthforTransImage, HeightforTransImage, Height, Width, bodyRegionId); @@ -4303,19 +4330,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo } } - var tempCanvasID; - - if (IsMirror == 'Yes') { - tempCanvasID = 'transparencyTempCanvas_MR_' + bodyRegionId; - } - else { - if ($rootScope.isModestyOn == true && (bodyRegionId.match('modestyImg'))) { - tempCanvasID = 'transparencyTempCanvas_' + bodyRegionId;//bodyRegionId; - } - else - tempCanvasID = 'transparencyTempCanvas_' + bodyRegionId; - } - + if ($rootScope.isHighLight != true) { @@ -4324,9 +4339,9 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo if ($rootScope.isModestyOn == true && (bodyRegionId.match('modestyImg'))) { var modestyTempCanvasId = 'tempCanvasModesty_' + bodyRegionId; if (document.getElementById(modestyTempCanvasId) != undefined || document.getElementById(modestyTempCanvasId) != null) { - var contxModesty = document.getElementById(modestyTempCanvasId).getContext('2d'); + var contxModestyTemp = document.getElementById(modestyTempCanvasId).getContext('2d'); var tbTempCanvas = document.getElementById(tempCanvasID) - contxModesty.drawImage(tbTempCanvas, XforCopyImage, YforCopyImage, WidthforCopyImage, HeightforCopyImage, XforTransImage, YforTransImage, WidthforTransImage, HeightforTransImage); + contxModestyTemp.drawImage(tbTempCanvas, XforCopyImage, YforCopyImage, WidthforCopyImage, HeightforCopyImage, XforTransImage, YforTransImage, WidthforTransImage, HeightforTransImage); } } @@ -4338,7 +4353,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo 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); @@ -4413,7 +4428,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo } - $scope.calculateCoordinatesAndDimensionsForTB = function (Height, Width, X, Y, IsMirror, TransparencyBoxStartX, TransparencyEndX, TransparencyBoxStartY, TransparencyBoxEndY, bodyRegionId) { + $scope.calculateDimensionsForTBImage = function (Height, Width, X, Y, IsMirror, TransparencyBoxStartX, TransparencyEndX, TransparencyBoxStartY, TransparencyBoxEndY, bodyRegionId) { var XforCopyImage = 0; var YforCopyImage = 0; @@ -4573,13 +4588,23 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo 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); - if (document.getElementById('tempCanvas') != null) { + } + } + 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); + 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); -- libgit2 0.21.4