diff --git a/400-SOURCECODE/AIAHTML5.Web/app/controllers/DAController.js b/400-SOURCECODE/AIAHTML5.Web/app/controllers/DAController.js
index ba1c54b..6ead278 100644
--- a/400-SOURCECODE/AIAHTML5.Web/app/controllers/DAController.js
+++ b/400-SOURCECODE/AIAHTML5.Web/app/controllers/DAController.js
@@ -1380,6 +1380,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
                 //    $scope.createDynamicSpeechBubble(evt, annotationText, evt.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left, evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top);
                 $scope.MultiLanguageAnnationArray = [];
                 $scope.MultiLanguageAnnationArray.push(annotationText);
+                
                 $scope.createDynamicSpeechBubble(evt, evt.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left, evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top, true);
             }
             else {
@@ -1395,6 +1396,8 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
                     // $scope.createDynamicSpeechBubble(evt, annotationText, evt.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left, evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top);
                     $scope.MultiLanguageAnnationArray = [];
                     $scope.MultiLanguageAnnationArray.push(annotationText);
+
+                   
                     $scope.createDynamicSpeechBubble(evt, evt.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left, evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top, true);
                 }
                 else {
@@ -1402,6 +1405,8 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
                     //  $scope.createDynamicSpeechBubble(evt, annotationText, evt.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left, evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top);
                     $scope.MultiLanguageAnnationArray = [];
                     $scope.MultiLanguageAnnationArray.push(annotationText);
+
+                    
                     $scope.createDynamicSpeechBubble(evt, evt.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left, evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top, true);
                 }
 
@@ -1461,6 +1466,22 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
                                                 }
                                                );
 
+                //-NIKI-for solving extarct issue 8286
+
+                var imageCanvas = document.getElementById('imageCanvas' + bodyRegionId + '_MR');
+
+                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)
 
@@ -1717,6 +1738,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
                 //   $scope.createDynamicSpeechBubble(evt, annotationText, evt.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left, evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top);
                 $scope.MultiLanguageAnnationArray = [];
                 $scope.MultiLanguageAnnationArray.push(annotationText);
+              
                 $scope.createDynamicSpeechBubble(evt, evt.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left, evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top, true);
             }
             else {
@@ -1752,6 +1774,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
                     $scope.MultiLanguageAnnationArray.push(annotationText);
 
                     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);
                 }
 
@@ -1797,6 +1820,21 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
                                       );
 
 
+                    //-NIKI-for solving extarct issue 8286
+
+                    var imageCanvas = document.getElementById('imageCanvas' + bodyRegionId);
+
+                    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)) {
@@ -2016,8 +2054,8 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
 
 
                             grayCanvasContext.putImageData(updatedData, 0, 0);
-
-
+                          
+                        
                             //to resolve lateral arm black issue in highlight mode
 
                             if ($rootScope.viewOrientationId == 5 && (bodyRegionId == 6 || bodyRegionId == 4)) {
@@ -2748,7 +2786,8 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
 
 
                 $('.dynCross').on('click', function (evt) {
-                    $(this).parent().parent().parent().css('display', 'none');
+                    //$(this).parent().parent().parent().css('display', 'none');
+                    $(this).parent().parent().parent().remove();
 
                 });
 
@@ -2757,9 +2796,12 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
 
             else {
                 $scope.multiAnnotationIsON = false;
+              
+                //$(".com").css("display", "none");
+                //$("#bord").css({ "width": "0px", "display": "none" });
+                $(".com").remove();
+                $("#bord").remove();
 
-                $(".com").css("display", "none");
-                $("#bord").css({ "width": "0px", "display": "none" });
                 var sppechBubbleDotHTML = '<div id="dot" 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" 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;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:0px;top:0px;color:#ffffff;cursor:pointer;">'
@@ -2863,7 +2905,8 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
          {
              drag: function (evt) {
 
-                 $("#dot").css("display", "none");
+                 //$("#dot").css("display", "none");
+                 $("#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);
@@ -2874,11 +2917,14 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
 
 
                 $('.crossDiv_temp').on('click', function (evt) {
-                    $('#sppeachBubble').css('display', 'none');
+                    //$('#sppeachBubble').css('display', 'none');
 
-                    $("#bord").css("display", "none");
-                    $("#dot").css("display", "none");
+                    //$("#bord").css("display", "none");
+                    //$("#dot").css("display", "none");
+                  $('#sppeachBubble').remove();
 
+                 $("#bord").remove();
+                  $("#dot").remove();
 
                 });
 
@@ -3109,8 +3155,8 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
 
 
                 $('.dynCross_anno').on('click', function (evt) {
-                    $(this).parent().parent().parent().css('display', 'none');
-
+                    //$(this).parent().parent().parent().css('display', 'none');
+                    $(this).parent().parent().parent().remove();
                     // $("#bord").css("display", "none");
                     //  $("#dot").css("display", "none");
 
@@ -3122,12 +3168,12 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
             }
 
             else {
-
+              
                 $scope.multiAnnotationIsON = false;
 
                 $(".com_annotation").css("display", "none");
                 $("#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;">'
            + '<span style="position:absolute;right:0px;top:0px;color:#ffffff;cursor:pointer;">'
@@ -3304,7 +3350,9 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
              {
                  drag: function (evt) {
 
-                     $("#dot_annotation").css("display", "none");
+                     //$("#dot_annotation").css("display", "none");
+                    $("#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);
@@ -3315,11 +3363,16 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
 
 
                     $('.crossDiv_temp_annotation').on('click', function (evt) {
-                        $('#sppeachBubble_annotation').css('display', 'none');
+                        //$('#sppeachBubble_annotation').css('display', 'none');
+
+                        //$("#bord_annotation").css("display", "none");
+                        //$("#dot_annotation").css("display", "none");
+
 
-                        $("#bord_annotation").css("display", "none");
-                        $("#dot_annotation").css("display", "none");
+                        $('#sppeachBubble_annotation').remove();
 
+                        $("#bord_annotation").remove();
+                        $("#dot_annotation").remove();
 
                     });
                 }
@@ -3600,6 +3653,10 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
 
         //alert('mouse up');
         console.log('MOUSE UP');
+        $(".com").remove();
+        $('#dot').remove();
+        $('#bord').remove();
+        $('#sppeachBubble').remove();
 
         $scope.currentLayerNumber = parseInt($('#txtlayerNumber').val());
         $('.rectangle').remove();
@@ -4404,7 +4461,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
                     $scope.annotationTextArrayT2 = [];
                     $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);
                 }
                 tempMaskImg.src = "http://localhost/AIAHtml/" + tranparencyMaskImgSrc;
@@ -4442,6 +4499,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
                 $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
@@ -4453,6 +4511,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
             $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);
 
 
@@ -4616,11 +4675,18 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
         $scope.isTransparencyActivated  = false;
         $("#btnExtract").removeClass("disabled");
 
-        $('.com_anno').css('display', 'none');
+        //$('.com_anno').css('display', 'none');
+
+        //$('#sppeachBubble_annotation').css('display', 'none');
+        //$('#dot_annotation').css('display', 'none');
+        //$('#bord_annotation').css('display', 'none');
+
 
-        $('#sppeachBubble_annotation').css('display', 'none');
-        $('#dot_annotation').css('display', 'none');
-        $('#bord_annotation').css('display', 'none');
+        $('.com_anno').remove();
+
+        $('#sppeachBubble_annotation').remove();
+        $('#dot_annotation').remove();
+        $('#bord_annotation').remove();
 
         var tBox = document.getElementById('transparencyCanvas');
 
@@ -4865,21 +4931,26 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
         //        }
         //    }
         //}
-        var loopLength = 0;
+        var endIndex = 0;
+        var startIndex = 0;
         if (($rootScope.viewOrientationId == '1') || ($rootScope.viewOrientationId == '4')) {
-            loopLength = 7;
+            endIndex = 6;
+            startIndex = 1;
         }
-        else if (($rootScope.viewOrientationId == '2') || ($rootScope.viewOrientationId == '3')){
-            loopLength = 5;
+        else if (($rootScope.viewOrientationId == '2') || ($rootScope.viewOrientationId == '3')) {
+            endIndex = 5;
+            startIndex = 1;
         }
         else if (($rootScope.viewOrientationId == '5')) {
-            loopLength = 4;
+            endIndex = 6;
+            startIndex = 2;
         }
-        else if (($rootScope.viewOrientationId == '6'))  {
-            loopLength = 1;
+        else if (($rootScope.viewOrientationId == '6')) {
+            endIndex = 6;
+            startIndex = 6;
         }
 
-        for (var i = 1; i < loopLength; i++) {
+        for (var i = startIndex; i <= endIndex; i++) {
 
             var id;
             var maskId;
@@ -4895,7 +4966,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
             if (maskcanvas != null || maskcanvas != undefined)
                 document.getElementById('canvasDiv').removeChild(maskcanvas);
 
-            if (loopLength == 7) {
+            if (endIndex == 6) {
 
                 if (i == 4 || i == 5 || i == 6) {
                     id = 'imageCanvas' + i + '_MR';
@@ -4922,7 +4993,6 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
 
 
     }
-
     $scope.terminateCurrentlyRunningWPs = function () {
         if ($scope.runningWorkers != null || $scope.runningWorkers != undefined) {
             var workerCount = $scope.runningWorkers.length;
@@ -5213,7 +5283,13 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
 
         $(".com").toggle();
         $('#dot').toggle();
+        $('#bord').toggle();
         $('#sppeachBubble').toggle();
+        $('#sppeachBubble_annotation').toggle();
+
+        $("#bord_annotation").toggle();
+        $("#dot_annotation").toggle();
+        $(".dynCross_anno").parent().parent().parent().toggle();
 
     }
 
@@ -5275,15 +5351,15 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
                         var coloredImageDataVar = coloredImageData;
 
 
-                        if (value.haveMirror == 'true') {
-                            $rootScope.coloredImageMRCanvasList[parseInt(value.bodyRegionId)] = coloredImageDataVar;
-                        }
-                        else {
+                        //if (value.haveMirror == 'true') {
+                        //    $rootScope.coloredImageMRCanvasList[parseInt(value.bodyRegionId)] = coloredImageDataVar;
+                        //}
+                        //else {
 
 
-                            $rootScope.coloredImageCanvasList[parseInt(value.bodyRegionId - 1)] = coloredImageDataVar;
+                        //    $rootScope.coloredImageCanvasList[parseInt(value.bodyRegionId - 1)] = coloredImageDataVar;
 
-                        }
+                        //}
 
 
                         var context_gray = imageCanvas.getContext('2d');
@@ -5482,14 +5558,14 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
                         var coloredImageDataVar = coloredImageData;
 
 
-                        if (value.haveMirror == 'true') {
-                            $rootScope.coloredImageMRCanvasList[parseInt(value.bodyRegionId)] = coloredImageDataVar;
-                        }
-                        else {
+                        //if (value.haveMirror == 'true') {
+                        //    $rootScope.coloredImageMRCanvasList[parseInt(value.bodyRegionId)] = coloredImageDataVar;
+                        //}
+                        //else {
 
-                            $rootScope.coloredImageCanvasList[parseInt(value.bodyRegionId - 1)] = coloredImageDataVar;
+                        //    $rootScope.coloredImageCanvasList[parseInt(value.bodyRegionId - 1)] = coloredImageDataVar;
 
-                        }
+                        //}
 
 
                         var context = imageCanvas.getContext('2d');
diff --git a/400-SOURCECODE/AIAHTML5.Web/app/controllers/HomeController.js b/400-SOURCECODE/AIAHTML5.Web/app/controllers/HomeController.js
index a74e3b4..01931ea 100644
--- a/400-SOURCECODE/AIAHTML5.Web/app/controllers/HomeController.js
+++ b/400-SOURCECODE/AIAHTML5.Web/app/controllers/HomeController.js
@@ -171,6 +171,18 @@ AIA.controller("HomeController", ["$rootScope", "Modules", "$log", "$location", 
 
         }
 
+        //   Dissectible Anatomy > Settings should be disable if Annotation is Open.
+        $rootScope.ShowSettingWindow = function () {
+            if ($(".annotationTollbar").css("display") == "block") {
+                // alert("already open");
+            }
+            else {
+                $('#modal-settings').modal('toggle');
+            }
+
+
+        }
+
 
 
         //----Annotation Toolbar: Jcanvas-----
diff --git a/400-SOURCECODE/AIAHTML5.Web/app/widget/TopMenu.html b/400-SOURCECODE/AIAHTML5.Web/app/widget/TopMenu.html
index b540b99..a02f42f 100644
--- a/400-SOURCECODE/AIAHTML5.Web/app/widget/TopMenu.html
+++ b/400-SOURCECODE/AIAHTML5.Web/app/widget/TopMenu.html
@@ -35,7 +35,7 @@
                 <li><a href="#" id="annotationToolBarOptions" ng-click="ShowAnnotationWindow()">Annotation Toolbar</a></li>
 
                 <li><a href="#">Add to Existing Curriculum</a></li>
-                <li><a data-toggle="modal" data-target="#modal-settings" class="cursor-pointer">Settings</a></li>
+                <li><a ng-click="ShowSettingWindow()" class="cursor-pointer">Settings</a></li>
                 <li role="separator" class="divider"></li>
                 <li><a href="#">Lab Exercises PDF</a></li>
             </ul>
diff --git a/400-SOURCECODE/AIAHTML5.Web/index.html b/400-SOURCECODE/AIAHTML5.Web/index.html
index 341d3da..5902108 100644
--- a/400-SOURCECODE/AIAHTML5.Web/index.html
+++ b/400-SOURCECODE/AIAHTML5.Web/index.html
@@ -506,8 +506,8 @@
                                     <div>
                                         <button type="button" class="btn btn-primary btn-xs pull-left btn-annotation" id="paintLine" data-toggle="tooltip" data-placement="top" title="Paint" style="margin-right:1%;" ng-click="paintBrush()"><i class="fa fa-paint-brush"></i></button>
                                         <button type="button" class="btn btn-primary btn-xs pull-left btn-annotation" data-toggle="tooltip" data-placement="top" title="Erase" ng-click="EraseDrawing()"><i class="fa fa-eraser"></i></button>&nbsp;
-                                        <div class="marginL2 pull-left"><input type="number" id="amount-2" step="1" style="width:60px;" min="1" max="60" oninput="Brushsize(this)"></div>&nbsp;
-                                        <div class="pull-left" style="width:45%; margin-left:2%;">
+                                        <div class="marginL2 pull-left"><input type="number" id="amount-2" step="1" style="width:60px;height:21px;" min="1" max="60" oninput="Brushsize(this)"></div>&nbsp;
+                                        <div class="pull-left" style="width:45%; margin-left:2%;margin-top:5px;">
                                             <div id="slider-range-min-2"></div>
                                         </div>
                                         <div class="clearfix"></div>