diff --git a/400-SOURCECODE/AIAHTML5.Web/app/controllers/TileViewListController.js b/400-SOURCECODE/AIAHTML5.Web/app/controllers/TileViewListController.js
index 6f2e2af..0dd350a 100644
--- a/400-SOURCECODE/AIAHTML5.Web/app/controllers/TileViewListController.js
+++ b/400-SOURCECODE/AIAHTML5.Web/app/controllers/TileViewListController.js
@@ -916,9 +916,9 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
 
 
     $scope.drawStaticPinsOnImage = function (canvasId, PinId, offsetX1, offsetY1, x, y) {
+
         $scope.clickedPins = [];
-       // if ($scope.isSliderChange == true) {
-            console.log('isSliderrChange')
+
             var radial = $('#' + canvasId).createGradient({
                 x1: 50, y1: 50,
                 x2: 50, y2: 50,
@@ -950,7 +950,6 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
                 radius: 5 * $scope.sliderPercentValue,
 
                 click: function (clickedPin) {
-                   // alert('pin clciked = ' + clickedPin.name)
                     //change the head color to green
                     var radialAfterClick = $('#aaDetailViewCanvas').createGradient({
                         x1: 50, y1: 50,
@@ -962,9 +961,12 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
 
                     clickedPin.fillStyle = radialAfterClick;
 
+                    if (clickedPin.event.ctrlKey == false) {
+                        $scope.clickedPins = [];
+                    }
+
                     var pinID = (clickedPin.name).substring(7, (clickedPin.name).length);
-                    // alert('pinId: ' + pinID);
-                    //showAnnotation();
+                  
 
                     var pinData = new jinqJs()
                                   .from($scope.aaPinData)
@@ -1007,97 +1009,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
                 }
 
             }).drawLayers();
-        //}
-    //    else
-    // {
-    //    var radial = $('#' + canvasId).createGradient({
-    //        x1: 50, y1: 50,
-    //        x2: 50, y2: 50,
-    //        r1: 10, r2: 30,
-    //        c1: 'rgba(100, 50, 0,0)',
-    //        c2: 'rgb(216, 216, 216)'
-    //    });
-    //    $('#' + canvasId).drawLine({
-
-    //        layer: true,
-    //        name: "Pin_" + PinId,
-    //        groups: ["Pin_" + PinId],
-    //        strokeStyle: 'black',
-    //        strokeWidth: 2,
-    //        visible: true,
-    //        x1: offsetX1, y1: offsetY1,
-    //        x2: x, y2: y,
-
-    //    }).drawArc({
-    //        name: "PinArc_" + PinId,
-    //        layer: true,
-    //        groups: ["Pin_" + PinId],
-    //        strokeStyle: 'grey',
-    //        strokeWidth: 2,
-    //        visible: true,
-    //        fillStyle: radial,
-    //        x: x, y: y,
-    //        radius: 5,
-
-    //        click: function (clickedPin) {
-    //            alert('pin clciked = ' + clickedPin.name)                //change the head color to green
-    //            var radialAfterClick = $('#aaDetailViewCanvas').createGradient({
-    //                x1: 50, y1: 50,
-    //                x2: 50, y2: 50,
-    //                r1: 10, r2: 30,
-    //                c1: 'rgba(100, 50, 0,0)',
-    //                c2: 'rgb(126, 187, 83)'
-    //            });
-
-    //            clickedPin.fillStyle = radialAfterClick;
-
-    //            var pinID = (clickedPin.name).substring(7, (clickedPin.name).length);
-    //            // alert('pinId: ' + pinID);
-    //            //showAnnotation();
-
-    //            var pinData = new jinqJs()
-    //                          .from($scope.aaPinData)
-    //                          .where("_PinId == " + pinID)
-    //                          .select();
-
-
-    //            var pinTermNumber = pinData[0]._TermId;
-
-    //            var pinWithSameTerm = new jinqJs()
-
-    //                                 .from($scope.aaPinData)
-    //                                 .where("_TermId == " + pinTermNumber)
-    //                                 .select();
-
-
-    //            if (pinWithSameTerm != undefined && pinWithSameTerm != null && pinWithSameTerm.length > 0) {
-
-    //                for (var i = 0; i < pinWithSameTerm.length; i++) {
-
-    //                    $scope.clickedPins.push({ 'id': pinWithSameTerm[i]._PinId })
-    //                }
-
-    //            }
-
-    //            var selectedPinData = new jinqJs()
-    //                        .from($scope.aaPinData)
-    //                        .where("_PinId == " + pinID)
-    //                        .select();
-    //            if (clickedPin.event.ctrlKey == true) {
-    //                $scope.showAnnotation(selectedPinData, true, true, false);
-
-    //            }
-    //            else {
-    //                $scope.showAnnotation(selectedPinData, false, true, false);
-
-    //            }
-
-
-    //        }
-
-    //    }).drawLayers();
-    //}
-
+   
     }
 
 
@@ -1118,8 +1030,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
 
           $scope.removeSpeechBubble();
 
-        //$rootScope.isSliderChanged = true;
-        //$('#aaDetailViewCanvas').removeLayers();
+       
     }
 
     $rootScope.$on('annotationToolEvent', function (event, data) {
@@ -1304,7 +1215,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
             })
             angular.forEach($scope.clickedPins, function (value1, key1) {
 
-                // if (aaPinDataValue._PinId != value.id) {
+               
                 var pinName = 'Pin_' + value1.id;
                 var pinArcName = 'PinArc_' + value1.id;
 
@@ -1315,27 +1226,25 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
                 $('#aaDetailViewCanvas').setLayer(pinArcName, {
                     visible: true // set to true instead to show the layer again
                 }).drawLayers();
-                // }
+               
             })
             
             angular.forEach(seletedSystemPinData, function (aaPinDataValue, aaPinDataKey) {
 
-                // if (aaPinDataValue._PinId != value.id) {
+                
                 var pinName = 'Pin_' + aaPinDataValue._PinId;
                 var pinArcName = 'PinArc_' + aaPinDataValue._PinId;
 
                 $('#aaDetailViewCanvas').setLayer(pinName, {
-                    visible: false // set to true instead to show the layer again
+                    visible: false 
                 }).drawLayers();
 
                 $('#aaDetailViewCanvas').setLayer(pinArcName, {
-                    visible: false // set to true instead to show the layer again
+                    visible: false
                 }).drawLayers();
-                // }
+              
             })
 
-            // })
-           // $scope.clickedPins = [];
         }
 
         else {
@@ -1345,11 +1254,11 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
                 var pinArcName = 'PinArc_' + aaPinDataValue._PinId;
 
                 $('#aaDetailViewCanvas').setLayer(pinName, {
-                    visible: true // set to true instead to show the layer again
+                    visible: true 
                 }).drawLayers();
 
                 $('#aaDetailViewCanvas').setLayer(pinArcName, {
-                    visible: true // set to true instead to show the layer again
+                    visible: true 
                 }).drawLayers();
             })
         }
@@ -1526,30 +1435,10 @@ function showSelectedPins(event) {
     });
 }
 
-function onZoom(scope) {
-   
-    //$(".common-drag").remove();
-    //$(".commonDot").remove();
-    //$(".commonDraggedLine").remove();
-    //var radial = $('#aaDetailViewCanvas').createGradient({
-    //    x1: 50, y1: 50,
-    //    x2: 50, y2: 50,
-    //    r1: 10, r2: 30,
-    //    c1: 'rgba(100, 50, 0,0)',
-    //    c2: 'rgb(216, 216, 216)'
-    //});
-    //$('#aaDetailViewCanvas').setLayers({
-    //    fillStyle: radial,
-    //}).drawLayers();
-    //  scope.removePin();
-    //    scope.showAllPins();
-  
-
-    //6. Show all pins on AA opened item
-}
-
 
 $(document).ready(function () {
+
+    //for zoom 
     $(".slider").slider({
         min: 25,
         max: 100,
@@ -1558,8 +1447,6 @@ $(document).ready(function () {
         orientation: "vertical",
         slide: function (event, ui) {
           
-         
-
             var scope = angular.element(document.getElementById("aaDetailPageDiv")).scope();
             scope.$apply(function () {
                 scope.sliderVal = ui.value;