Commit 3f238331b92e48e412ab817f936bc5770ef23af4
1 parent
5fadfdd4
Transparency Box Issue
Showing
2 changed files
with
136 additions
and
12 deletions
400-SOURCECODE/AIAHTML5.Web/app/controllers/DAController.js
... | ... | @@ -77,7 +77,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo |
77 | 77 | |
78 | 78 | //extract |
79 | 79 | $rootScope.isExtract = false; |
80 | - | |
80 | + $rootScope.UIWrapperZIndex = 12000; | |
81 | 81 | |
82 | 82 | $rootScope.whiteImageDataList = []; |
83 | 83 | $rootScope.whiteImageMRDataList = []; |
... | ... | @@ -2880,6 +2880,34 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo |
2880 | 2880 | } |
2881 | 2881 | |
2882 | 2882 | $('#layerChangeSlider').slider("option", "value", parseInt($rootScope.totalLayers) - parseInt($scope.layerNumber)); |
2883 | + | |
2884 | + if (($("#canvasPaint").css("display") == "block") && ($("#canvas").css("display") == "block")){ | |
2885 | + if ($rootScope.isAnnotatiomToolBarPopupOpenOnLayerChange == false) { | |
2886 | + | |
2887 | + if ($("#transparencyScale").css("display") == "block") { | |
2888 | + $rootScope.switchToTransparencycanvas(); | |
2889 | + } | |
2890 | + } | |
2891 | + else { | |
2892 | + | |
2893 | + if ($("#OnIdentify").hasClass("annotationtoolbartab")) { | |
2894 | + $rootScope.switchToTransparencycanvas(); | |
2895 | + } | |
2896 | + else { | |
2897 | + $('.btnCursor').addClass('activebtncolor'); | |
2898 | + $rootScope.switchCanvas(); | |
2899 | + } | |
2900 | + } | |
2901 | + | |
2902 | + } | |
2903 | + else | |
2904 | + { | |
2905 | + if ($rootScope.isAnnotatiomToolBarPopupOpenOnLayerChange == true) { | |
2906 | + | |
2907 | + $rootScope.CloseAnnotationTool(); | |
2908 | + | |
2909 | + } | |
2910 | + } | |
2883 | 2911 | } |
2884 | 2912 | $rootScope.PreviouslayerNumbr = 0; |
2885 | 2913 | $scope.LayerChangeOnMouseUpDown = function (e) { |
... | ... | @@ -3247,7 +3275,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo |
3247 | 3275 | var Exists_annotation = $("#canvasDiv").find("div[id=" + pointClicked_annotation + "]").length; |
3248 | 3276 | // alert(Exists_annotation); |
3249 | 3277 | // alert(pointClicked_annotation); |
3250 | - var sppechBubbleHTML_annotation = "<div id ='" + pointClicked_annotation + "' class='com_anno'><div style='z-index:10000;position:absolute;border-top:2px solid #000;transform:rotate(40deg);-moz-transform:rotate(40deg);-o-transform:rotate(40deg);-ms-transform:rotate(40deg);-webkit-transform:rotate(40deg);height:15px;width:35px;left:" + (x - 10) + "px;top:" + (y + 10) + "px;'' id='bubble" + $scope.j + "'></div><div data=" + $scope.j + " id=" + sub_id_annotation + " class='appendDragg_annotation' style='z-index:10000;margin-left:25px;border:1px solid #000;padding:5px 10px;position:absolute;color:#fff;text-align:left;font-size: 12px;background-color:#19100e;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;-o-border-radius:5px;-ms-border-radius:5px;font-weight:bold;left:" + x + "px;top:" + y + "px;'><div style='z-index:7000;position:absolute;right:-3px;top:-4px;color:#ffffff;cursor:pointer;'><img id=" + $scope.j + " class='dynCross_anno' style='width:18px' src=" + $rootScope.path + "></div></div><div style='position:absolute;border:1px solid #000;display:none;z-index:9000;' id='bord_annotation" + $scope.j + "'></div></div>"; | |
3278 | + var sppechBubbleHTML_annotation = "<div id ='" + pointClicked_annotation + "' class='com_anno'><div style='z-index:10000;position:absolute;border-top:2px solid #000;transform:rotate(40deg);-moz-transform:rotate(40deg);-o-transform:rotate(40deg);-ms-transform:rotate(40deg);-webkit-transform:rotate(40deg);height:15px;width:35px;left:" + (x - 10) + "px;top:" + (y + 10) + "px;'' id='bubble" + $scope.j + "'></div><div data=" + $scope.j + " id=" + sub_id_annotation + " class='appendDragg_annotation' style='z-index:60000;margin-left:25px;border:1px solid #000;padding:5px 10px;position:absolute;color:#fff;text-align:left;font-size: 12px;background-color:#19100e;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;-o-border-radius:5px;-ms-border-radius:5px;font-weight:bold;left:" + x + "px;top:" + y + "px;'><div style='z-index:7000;position:absolute;right:-3px;top:-4px;color:#ffffff;cursor:pointer;'><img id=" + $scope.j + " class='dynCross_anno' style='width:18px' src=" + $rootScope.path + "></div></div><div style='position:absolute;border:1px solid #000;display:none;z-index:9000;' id='bord_annotation" + $scope.j + "'></div></div>"; | |
3251 | 3279 | if ($scope.longest_annotationT1.length > $scope.longest_annotationT2.length) { |
3252 | 3280 | if (Exists_annotation == 0) { |
3253 | 3281 | $("#canvasDiv").append(sppechBubbleHTML_annotation); |
... | ... | @@ -3473,7 +3501,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo |
3473 | 3501 | $("#bord_annotation").css({ "width": "0px", "display": "none" }); |
3474 | 3502 | $('.dynCross_anno').parent().parent().parent().remove(); |
3475 | 3503 | var sppechBubbleDotHTML_annotation = '<div id="dot_annotation" style="position:absolute;height:15px;width:35px;display:none;z-index:10000;border-top:2px solid #000;transform:rotate(40deg);-moz-transform:rotate(40deg);-o-transform:rotate(40deg);-ms-transform:rotate(40deg);-webkit-transform:rotate(40deg);"></div>' |
3476 | - + '<div id="sppeachBubble_annotation" style="height:auto!important;z-index:10000;margin-left:25px;border:1px solid #000;display:none;padding:5px 10px;position:absolute;color:#fff;text-align:left;font-size:12px;background-color:#19100e;font-weight:bold;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;-o-border-radius:5px;-ms-border-radius:5px;font-weight:bold;">' | |
3504 | + + '<div id="sppeachBubble_annotation" style="height:auto!important;z-index:60000;margin-left:25px;border:1px solid #000;display:none;padding:5px 10px;position:absolute;color:#fff;text-align:left;font-size:12px;background-color:#19100e;font-weight:bold;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;-o-border-radius:5px;-ms-border-radius:5px;font-weight:bold;">' | |
3477 | 3505 | + '<span style="position:absolute;right:-3px;top:-4px;color:#ffffff;cursor:pointer;">' |
3478 | 3506 | + '<img class="crossDiv_temp_annotation" style="width:18px" src=' + $rootScope.path + '></span></div>' |
3479 | 3507 | |
... | ... | @@ -4115,7 +4143,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo |
4115 | 4143 | //bind click listener |
4116 | 4144 | transparencyCanvas.addEventListener('click', TransparencyCanvasClickListener); |
4117 | 4145 | |
4118 | - $(".ui-wrapper").css("z-index", "600"); | |
4146 | + $(".ui-wrapper").css("z-index", $rootScope.UIWrapperZIndex); | |
4119 | 4147 | |
4120 | 4148 | } |
4121 | 4149 | if ($scope.TransparencyBoxStartX <= bodyRegionRight && value.X <= transparencyBoxRight && $scope.TransparencyBoxStartY <= bodyRegionBottom && value.Y <= transparencyBoxBottom) { |
... | ... | @@ -4201,6 +4229,24 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo |
4201 | 4229 | $('#canvasPaint').sketch().actions = []; |
4202 | 4230 | $("#annotationpaintbrushsize").removeClass("activebtncolor"); |
4203 | 4231 | $("#annotationpainteraser").removeClass("activebtncolor"); |
4232 | + if ($("#DrawMode").hasClass("annotationtoolbartab")) | |
4233 | + { | |
4234 | + var drawCanvasZindex = $("#canvas").css("z-index"); | |
4235 | + var paintCanvasZindex = $("#canvasPaint").css("z-index"); | |
4236 | + drawCanvasZindex = parseInt(drawCanvasZindex) - 1; | |
4237 | + paintCanvasZindex = parseInt(paintCanvasZindex) - 1; | |
4238 | + if (drawCanvasZindex > paintCanvasZindex) { | |
4239 | + $(".ui-wrapper").css("z-index", drawCanvasZindex); | |
4240 | + $rootScope.UIWrapperZIndex = drawCanvasZindex; | |
4241 | + } | |
4242 | + else { | |
4243 | + $(".ui-wrapper").css("z-index", paintCanvasZindex); | |
4244 | + $rootScope.UIWrapperZIndex = paintCanvasZindex; | |
4245 | + } | |
4246 | + } | |
4247 | + else { | |
4248 | + $rootScope.switchToTransparencycanvas(); | |
4249 | + } | |
4204 | 4250 | } |
4205 | 4251 | |
4206 | 4252 | //hide the speechbubble |
... | ... | @@ -5079,7 +5125,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo |
5079 | 5125 | document.getElementById('canvasDiv').appendChild(transparencyCanvas); |
5080 | 5126 | |
5081 | 5127 | $('#transparencyCanvas').resizable({ handles: "e,s,se,w,n,ne,nw,sw", stop: function (event, ui) { resizeTransparencyBox(); }, start: function (event, ui) { clearTransCanvas(); } }); |
5082 | - $(".ui-wrapper").css("z-index", "600"); | |
5128 | + $(".ui-wrapper").css("z-index", $rootScope.UIWrapperZIndex); | |
5083 | 5129 | |
5084 | 5130 | //bind click listener |
5085 | 5131 | transparencyCanvas.addEventListener('click', TransparencyCanvasClickListener); | ... | ... |
400-SOURCECODE/AIAHTML5.Web/app/controllers/HomeController.js
... | ... | @@ -511,6 +511,7 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic |
511 | 511 | //annotation tool custom events |
512 | 512 | $rootScope.ShowAnnotationWindow = function () { |
513 | 513 | //7904 |
514 | + $rootScope.isAnnotatiomToolBarPopupOpenOnLayerChange = true; | |
514 | 515 | $rootScope.isAnnotatiomToolBarPopupClosed = false; |
515 | 516 | $rootScope.isAnnotaionToolBarDrawingModeActive = false; |
516 | 517 | if ($rootScope.MenuModuleName == "DA" || $rootScope.MenuModuleName == "CI") { |
... | ... | @@ -570,10 +571,16 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic |
570 | 571 | |
571 | 572 | } |
572 | 573 | |
574 | + if ($("#transparencyScale").css("display") == "block") { | |
575 | + | |
576 | + $rootScope.switchToTransparencycanvas(); | |
577 | + } | |
578 | + | |
573 | 579 | } |
574 | 580 | |
575 | 581 | $rootScope.CloseAnnotationTool = function () { |
576 | 582 | console.log('close'); |
583 | + $rootScope.isAnnotatiomToolBarPopupOpenOnLayerChange = false; | |
577 | 584 | $rootScope.isAnnotatiomToolBarPopupClosed = true; |
578 | 585 | $("#OnIdentify").removeClass("annotationtoolbartab"); |
579 | 586 | $("#DrawMode").removeClass("annotationtoolbartab"); |
... | ... | @@ -589,8 +596,14 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic |
589 | 596 | $('.btnCursor').removeClass('activebtncolor'); |
590 | 597 | $(".btn-annotation").removeClass("activebtncolor"); |
591 | 598 | $rootScope.isAnnotaionToolBarDrawingModeActive = false; |
592 | - | |
593 | - $rootScope.switchCanvas(); | |
599 | + | |
600 | + if ($("#transparencyScale").css("display") == "block") { | |
601 | + $rootScope.switchToTransparencycanvas(); | |
602 | + } | |
603 | + else | |
604 | + { | |
605 | + $rootScope.switchCanvas(); | |
606 | + } | |
594 | 607 | $rootScope.shapeType = ''; |
595 | 608 | } |
596 | 609 | $rootScope.CIAnotationIdentifyModeOff = false; |
... | ... | @@ -620,9 +633,33 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic |
620 | 633 | |
621 | 634 | $rootScope.isAnnotaionToolBarDrawingModeActive = false; |
622 | 635 | $rootScope.switchCanvas(); |
636 | + | |
637 | + if ($("#transparencyScale").css("display") == "block") { | |
638 | + | |
639 | + $rootScope.switchToTransparencycanvas(); | |
640 | + } | |
641 | + | |
623 | 642 | } |
624 | 643 | |
644 | + $rootScope.switchToTransparencycanvas = function () { | |
625 | 645 | |
646 | + var x = $("#canvas").css("z-index"); | |
647 | + var y = $("#canvasPaint").css("z-index"); | |
648 | + x = parseInt(x) + 1; | |
649 | + y = parseInt(y) + 1; | |
650 | + if (x > y) { | |
651 | + $(".ui-wrapper").css("z-index", x); | |
652 | + $("#canvas").css("z-index", x); | |
653 | + $rootScope.UIWrapperZIndex = x; | |
654 | + | |
655 | + } | |
656 | + else { | |
657 | + $(".ui-wrapper").css("z-index", y); | |
658 | + $("#canvas").css("z-index", y); | |
659 | + $rootScope.UIWrapperZIndex = y; | |
660 | + } | |
661 | + | |
662 | + } | |
626 | 663 | |
627 | 664 | $rootScope.DrawingMode = function () { |
628 | 665 | //Annotation History |
... | ... | @@ -634,9 +671,6 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic |
634 | 671 | $("#annotationpaintbrushsize").removeClass("activebtncolor"); |
635 | 672 | $("#annotationpainteraser").removeClass("activebtncolor"); |
636 | 673 | $rootScope.isEraseToolSelected = false; |
637 | - // $("#canvasPaint").css("display", "block"); | |
638 | - // $("#canvas").css("display", "block"); | |
639 | - | |
640 | 674 | } |
641 | 675 | |
642 | 676 | // Dissectible Anatomy > Settings should be disable if Annotation is Open. |
... | ... | @@ -1919,7 +1953,14 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic |
1919 | 1953 | width: $rootScope.rectDimension[$rootScope.rectDimension.length - 1].width, |
1920 | 1954 | height: $rootScope.rectDimension[$rootScope.rectDimension.length - 1].height, |
1921 | 1955 | resizeFromCenter: false, |
1956 | + add: function(layer){ | |
1957 | + var TextAreaLayerName = layer.name; | |
1958 | + var TextAreaLayerNameAftrSplit = TextAreaLayerName.split("_"); | |
1959 | + $rootScope.postFixLayerNumber = TextAreaLayerNameAftrSplit[1]; | |
1960 | + }, | |
1961 | + | |
1922 | 1962 | click: function (layer) { |
1963 | + | |
1923 | 1964 | if ($rootScope.isAnnotaionToolBarDrawingModeActive == true) { |
1924 | 1965 | //jcanvas property |
1925 | 1966 | layer.draggable = true; |
... | ... | @@ -1939,8 +1980,10 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic |
1939 | 1980 | strokeWidth: 2, |
1940 | 1981 | width: 5, height: 5, |
1941 | 1982 | cornerRadius: 3 |
1983 | + | |
1942 | 1984 | } |
1943 | 1985 | }).drawLayers(); |
1986 | + | |
1944 | 1987 | } |
1945 | 1988 | else { |
1946 | 1989 | //jcanvas property |
... | ... | @@ -2090,6 +2133,7 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic |
2090 | 2133 | |
2091 | 2134 | }, |
2092 | 2135 | mouseout: function (layer) { |
2136 | + | |
2093 | 2137 | if ($rootScope.isAnnotaionToolBarDrawingModeActive == true) { |
2094 | 2138 | //jcanvas property |
2095 | 2139 | layer.draggable = true; |
... | ... | @@ -2102,13 +2146,17 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic |
2102 | 2146 | strokeWidth: 0, |
2103 | 2147 | width: 0, height: 0, |
2104 | 2148 | cornerRadius: 0 |
2149 | + | |
2105 | 2150 | } |
2106 | 2151 | }).drawLayers(); |
2152 | + $rootScope.TextAreaRectXAxisAftrResize = layer.x; | |
2153 | + $rootScope.TextAreaRectYAxisAftrResize = layer.y; | |
2107 | 2154 | } |
2108 | 2155 | else { |
2109 | 2156 | //jcanvas property |
2110 | 2157 | layer.draggable = false; |
2111 | 2158 | } |
2159 | + | |
2112 | 2160 | }, |
2113 | 2161 | mouseover: function (layer) { |
2114 | 2162 | if ($rootScope.isAnnotaionToolBarDrawingModeActive == true) { |
... | ... | @@ -2122,6 +2170,7 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic |
2122 | 2170 | strokeWidth: 2, |
2123 | 2171 | width: 5, height: 5, |
2124 | 2172 | cornerRadius: 3 |
2173 | + | |
2125 | 2174 | } |
2126 | 2175 | }).drawLayers(); |
2127 | 2176 | } |
... | ... | @@ -2129,6 +2178,17 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic |
2129 | 2178 | //jcanvas property |
2130 | 2179 | layer.draggable = false; |
2131 | 2180 | } |
2181 | + }, | |
2182 | + change: function (layer) { | |
2183 | + if ($rootScope.isAnnotaionToolBarDrawingModeActive == true) { | |
2184 | + if ((layer.x > $rootScope.TextAreaRectXAxisAftrResize && layer.y > $rootScope.TextAreaRectYAxisAftrResize) || (layer.x == $rootScope.TextAreaRectXAxisAftrResize && layer.y > $rootScope.TextAreaRectYAxisAftrResize) || (layer.x > $rootScope.TextAreaRectXAxisAftrResize && layer.y == $rootScope.TextAreaRectYAxisAftrResize)) { | |
2185 | + var CangedTextAreaName = 'TextAreaNew_' + $rootScope.postFixLayerNumber; | |
2186 | + $('#canvas').setLayer(CangedTextAreaName, { | |
2187 | + x: layer.x, | |
2188 | + y: layer.y | |
2189 | + }); | |
2190 | + } | |
2191 | + } | |
2132 | 2192 | } |
2133 | 2193 | }).drawText({ |
2134 | 2194 | layer: true, |
... | ... | @@ -2148,7 +2208,7 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic |
2148 | 2208 | maxWidth: $rootScope.rectDimension[$rootScope.rectDimension.length - 1].width, |
2149 | 2209 | maxHeight: $rootScope.rectDimension[$rootScope.rectDimension.length - 1].height, |
2150 | 2210 | add: function (layer) { |
2151 | - | |
2211 | + | |
2152 | 2212 | //$rootScope.TextPropertyArray.push({ Text1: '', Align: '', FontColor: '', FontSize: '', FontStyle: '', FontFamily: '' }); |
2153 | 2213 | $rootScope.TextPropertyArray.push({ layerName: layer.name, Rect_Text: layer.text, Align: layer.align, FontColor: layer.fillStyle, FontSize: layer.fontSize, FontStyle: layer.fontStyle, FontFamily: layer.fontFamily, TextDecoration: $rootScope.underlineText }); |
2154 | 2214 | } |
... | ... | @@ -2221,6 +2281,11 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic |
2221 | 2281 | width: $rootScope.rectDimension[$rootScope.rectDimension.length - 1].width, |
2222 | 2282 | height: $rootScope.rectDimension[$rootScope.rectDimension.length - 1].height, |
2223 | 2283 | resizeFromCenter: false, |
2284 | + add: function (layer) { | |
2285 | + var TextAreaLayerName = layer.name; | |
2286 | + var TextAreaLayerNameAftrSplit = TextAreaLayerName.split("_"); | |
2287 | + $rootScope.postFixLayerNumber = TextAreaLayerNameAftrSplit[1]; | |
2288 | + }, | |
2224 | 2289 | click: function (layer) { |
2225 | 2290 | if ($rootScope.isAnnotaionToolBarDrawingModeActive == true) { |
2226 | 2291 | //jcanvas property |
... | ... | @@ -2361,11 +2426,14 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic |
2361 | 2426 | cornerRadius: 0 |
2362 | 2427 | } |
2363 | 2428 | }).drawLayers(); |
2429 | + $rootScope.RectXAxisAftrResize = layer.x; | |
2430 | + $rootScope.RectYAxisAftrResize = layer.y; | |
2364 | 2431 | } |
2365 | 2432 | else { |
2366 | 2433 | //jcanvas property |
2367 | 2434 | layer.draggable = false; |
2368 | 2435 | } |
2436 | + | |
2369 | 2437 | }, |
2370 | 2438 | mouseover: function (layer) { |
2371 | 2439 | if ($rootScope.isAnnotaionToolBarDrawingModeActive == true) { |
... | ... | @@ -2388,8 +2456,18 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic |
2388 | 2456 | //jcanvas property |
2389 | 2457 | layer.draggable = false; |
2390 | 2458 | } |
2459 | + }, | |
2460 | + change: function (layer) { | |
2461 | + if ($rootScope.isAnnotaionToolBarDrawingModeActive == true) { | |
2462 | + if ((layer.x > $rootScope.RectXAxisAftrResize && layer.y > $rootScope.RectYAxisAftrResize) || (layer.x == $rootScope.RectXAxisAftrResize && layer.y > $rootScope.RectYAxisAftrResize) || (layer.x > $rootScope.RectXAxisAftrResize && layer.y == $rootScope.RectYAxisAftrResize)) { | |
2463 | + var CangedTextAreaName = 'TextAreaNew_' + $rootScope.postFixLayerNumber; | |
2464 | + $('#canvas').setLayer(CangedTextAreaName, { | |
2465 | + x: layer.x, | |
2466 | + y: layer.y | |
2467 | + }); | |
2468 | + } | |
2469 | + } | |
2391 | 2470 | } |
2392 | - | |
2393 | 2471 | }).drawText({ |
2394 | 2472 | layer: true, |
2395 | 2473 | draggable: true, | ... | ... |