diff --git a/400-SOURCECODE/AIAHTML5.Web/app/controllers/DAController.js b/400-SOURCECODE/AIAHTML5.Web/app/controllers/DAController.js
index a9de6f4..28f2228 100644
--- a/400-SOURCECODE/AIAHTML5.Web/app/controllers/DAController.js
+++ b/400-SOURCECODE/AIAHTML5.Web/app/controllers/DAController.js
@@ -77,7 +77,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
 
     //extract
     $rootScope.isExtract = false;
-
+    $rootScope.UIWrapperZIndex = 12000;
 
     $rootScope.whiteImageDataList = [];
     $rootScope.whiteImageMRDataList = [];
@@ -2880,6 +2880,34 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
         }
 
         $('#layerChangeSlider').slider("option", "value", parseInt($rootScope.totalLayers) - parseInt($scope.layerNumber));
+    
+        if (($("#canvasPaint").css("display") == "block") && ($("#canvas").css("display") == "block")){
+            if ($rootScope.isAnnotatiomToolBarPopupOpenOnLayerChange == false) {
+                
+            if ($("#transparencyScale").css("display") == "block") {
+                $rootScope.switchToTransparencycanvas();
+            }
+        }
+        else {
+
+                if ($("#OnIdentify").hasClass("annotationtoolbartab")) {
+                    $rootScope.switchToTransparencycanvas();
+                }
+                else {
+                    $('.btnCursor').addClass('activebtncolor');
+                    $rootScope.switchCanvas();
+                }
+        }
+
+        }
+        else
+        {
+            if ($rootScope.isAnnotatiomToolBarPopupOpenOnLayerChange == true) {
+
+                $rootScope.CloseAnnotationTool();
+
+            }
+        }
     }
     $rootScope.PreviouslayerNumbr = 0;
     
@@ -3195,7 +3223,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
                 var Exists_annotation = $("#canvasDiv").find("div[id=" + pointClicked_annotation + "]").length;
                 // alert(Exists_annotation);
                 //  alert(pointClicked_annotation);
-                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>";
+                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>";
                 if ($scope.longest_annotationT1.length > $scope.longest_annotationT2.length) {
                     if (Exists_annotation == 0) {
                         $("#canvasDiv").append(sppechBubbleHTML_annotation);
@@ -3421,7 +3449,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
                 $("#bord_annotation").css({ "width": "0px", "display": "none" });
                 $('.dynCross_anno').parent().parent().parent().remove();
                 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>'
-           + '<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;">'
+           + '<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;">'
            + '<span style="position:absolute;right:-3px;top:-4px;color:#ffffff;cursor:pointer;">'
            + '<img class="crossDiv_temp_annotation" style="width:18px" src=' + $rootScope.path + '></span></div>'
 
@@ -4063,7 +4091,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
                         //bind click listener
                         transparencyCanvas.addEventListener('click', TransparencyCanvasClickListener);
 
-                        $(".ui-wrapper").css("z-index", "600");
+                        $(".ui-wrapper").css("z-index", $rootScope.UIWrapperZIndex);
 
                     }
                     if ($scope.TransparencyBoxStartX <= bodyRegionRight && value.X <= transparencyBoxRight && $scope.TransparencyBoxStartY <= bodyRegionBottom && value.Y <= transparencyBoxBottom) {
@@ -4149,6 +4177,24 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
             $('#canvasPaint').sketch().actions = [];
             $("#annotationpaintbrushsize").removeClass("activebtncolor");
             $("#annotationpainteraser").removeClass("activebtncolor");
+            if ($("#DrawMode").hasClass("annotationtoolbartab"))
+            {
+                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();
+            }
         }
 
         //hide the speechbubble
@@ -5027,7 +5073,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
             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", "600");
+            $(".ui-wrapper").css("z-index", $rootScope.UIWrapperZIndex);
 
             //bind click listener
             transparencyCanvas.addEventListener('click', TransparencyCanvasClickListener);
diff --git a/400-SOURCECODE/AIAHTML5.Web/app/controllers/HomeController.js b/400-SOURCECODE/AIAHTML5.Web/app/controllers/HomeController.js
index 2ae19a1..1b3c58a 100644
--- a/400-SOURCECODE/AIAHTML5.Web/app/controllers/HomeController.js
+++ b/400-SOURCECODE/AIAHTML5.Web/app/controllers/HomeController.js
@@ -511,6 +511,7 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
     //annotation tool custom events
     $rootScope.ShowAnnotationWindow = function () {
         //7904
+        $rootScope.isAnnotatiomToolBarPopupOpenOnLayerChange = true;
         $rootScope.isAnnotatiomToolBarPopupClosed = false;
         $rootScope.isAnnotaionToolBarDrawingModeActive = false;
         if ($rootScope.MenuModuleName == "DA" || $rootScope.MenuModuleName == "CI") {
@@ -573,10 +574,16 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
 
         }
 
+        if ($("#transparencyScale").css("display") == "block") {
+
+            $rootScope.switchToTransparencycanvas();
+        }
+
     }
 
     $rootScope.CloseAnnotationTool = function () {
         console.log('close');
+        $rootScope.isAnnotatiomToolBarPopupOpenOnLayerChange = false;
         $rootScope.isAnnotatiomToolBarPopupClosed = true;
         $("#OnIdentify").removeClass("annotationtoolbartab");
         $("#DrawMode").removeClass("annotationtoolbartab");
@@ -592,8 +599,14 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
         $('.btnCursor').removeClass('activebtncolor');
         $(".btn-annotation").removeClass("activebtncolor");
         $rootScope.isAnnotaionToolBarDrawingModeActive = false;
-
-        $rootScope.switchCanvas();
+     
+        if ($("#transparencyScale").css("display") == "block") {
+            $rootScope.switchToTransparencycanvas();
+        }
+        else
+        {
+            $rootScope.switchCanvas();
+        }
         $rootScope.shapeType = '';
     }
     $rootScope.CIAnotationIdentifyModeOff = false;
@@ -623,9 +636,33 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
 
         $rootScope.isAnnotaionToolBarDrawingModeActive = false;
         $rootScope.switchCanvas();
+
+        if ($("#transparencyScale").css("display") == "block") {
+
+            $rootScope.switchToTransparencycanvas();
+        }
+     
     }
 
+    $rootScope.switchToTransparencycanvas = function () {
 
+        var x = $("#canvas").css("z-index");
+        var y = $("#canvasPaint").css("z-index");
+        x = parseInt(x) + 1;
+        y = parseInt(y) + 1;
+        if (x > y) {
+            $(".ui-wrapper").css("z-index", x);
+            $("#canvas").css("z-index", x);
+            $rootScope.UIWrapperZIndex = x;
+
+        }
+        else {
+            $(".ui-wrapper").css("z-index", y);
+            $("#canvas").css("z-index", y);
+            $rootScope.UIWrapperZIndex = y;
+        }
+
+    }
 
     $rootScope.DrawingMode = function () {
         //Annotation History
@@ -637,9 +674,6 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
         $("#annotationpaintbrushsize").removeClass("activebtncolor");
         $("#annotationpainteraser").removeClass("activebtncolor");
         $rootScope.isEraseToolSelected = false;
-        //   $("#canvasPaint").css("display", "block");
-        //   $("#canvas").css("display", "block");
-
     }
 
     //   Dissectible Anatomy > Settings should be disable if Annotation is Open.
@@ -1923,6 +1957,7 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
                 height: $rootScope.rectDimension[$rootScope.rectDimension.length - 1].height,
                 resizeFromCenter: false,
                 click: function (layer) {
+                  
                     if ($rootScope.isAnnotaionToolBarDrawingModeActive == true) {
                         //jcanvas property
                         layer.draggable = true;
@@ -1942,8 +1977,10 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
                                 strokeWidth: 2,
                                 width: 5, height: 5,
                                 cornerRadius: 3
+                                
                             }
                         }).drawLayers();
+
                     }
                     else {
                         //jcanvas property
@@ -2093,6 +2130,7 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
 
                 },
                 mouseout: function (layer) {
+                    
                     if ($rootScope.isAnnotaionToolBarDrawingModeActive == true) {
                         //jcanvas property
                         layer.draggable = true;
@@ -2105,6 +2143,7 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
                                 strokeWidth: 0,
                                 width: 0, height: 0,
                                 cornerRadius: 0
+                                                            
                             }
                         }).drawLayers();
                     }
@@ -2112,6 +2151,7 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
                         //jcanvas property
                         layer.draggable = false;
                     }
+                 
                 },
                 mouseover: function (layer) {
                     if ($rootScope.isAnnotaionToolBarDrawingModeActive == true) {
@@ -2125,6 +2165,7 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
                                 strokeWidth: 2,
                                 width: 5, height: 5,
                                 cornerRadius: 3
+                              
                             }
                         }).drawLayers();
                     }
@@ -2151,7 +2192,7 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
                 maxWidth: $rootScope.rectDimension[$rootScope.rectDimension.length - 1].width,
                 maxHeight: $rootScope.rectDimension[$rootScope.rectDimension.length - 1].height,
                 add: function (layer) {
-
+                 
                     //$rootScope.TextPropertyArray.push({ Text1: '', Align: '', FontColor: '', FontSize: '', FontStyle: '', FontFamily: '' });
                     $rootScope.TextPropertyArray.push({ layerName: layer.name, Rect_Text: layer.text, Align: layer.align, FontColor: layer.fillStyle, FontSize: layer.fontSize, FontStyle: layer.fontStyle, FontFamily: layer.fontFamily, TextDecoration: $rootScope.underlineText });
                 }
@@ -2207,7 +2248,7 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
             $rootScope.resetTextSave = $rootScope.ObjectIndexSave++;
 
             // generating new text area 
-            $('#canvas')
+           // $('#canvas')
             // Draw rect as wide as the text
             $('#canvas').drawRect({
                 name: 'TextAreaAfterEditRect_' + $rootScope.resetTextSave,
@@ -2224,6 +2265,7 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
                 width: $rootScope.rectDimension[$rootScope.rectDimension.length - 1].width,
                 height: $rootScope.rectDimension[$rootScope.rectDimension.length - 1].height,
                 resizeFromCenter: false,
+             
                 click: function (layer) {
                     if ($rootScope.isAnnotaionToolBarDrawingModeActive == true) {
                         //jcanvas property
@@ -2364,11 +2406,13 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
                                 cornerRadius: 0
                             }
                         }).drawLayers();
+                       
                     }
                     else {
                         //jcanvas property
                         layer.draggable = false;
                     }
+                
                 },
                 mouseover: function (layer) {
                     if ($rootScope.isAnnotaionToolBarDrawingModeActive == true) {
@@ -2392,7 +2436,7 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic
                         layer.draggable = false;
                     }
                 }
-
+               
             }).drawText({
                 layer: true,
                 draggable: true,