Pin Issue Resolved

unknown
1 parent f7ecf31e
Showing 2 changed files with 236 additions and 167 deletions
400-SOURCECODE/AIAHTML5.Web/app/controllers/TileViewListController.js
400-SOURCECODE/AIAHTML5.Web/app/views/aa/atlas-anatomy-detail.html
@@ -335,7 +335,7 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
             openedImage.onerror = loadFailure;
             openedImage.src = $rootScope.OpenItemImagePath;
         }
-
+       
     }
@@ -349,25 +349,26 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
             if (ui.value == 25 || ui.value == 40 || ui.value == 55 || ui.value == 70 || ui.value == 85 || ui.value == 100) {
                                     $("#listManager").css("display", "none");
                                     $("#optionsListManagerTab").removeClass("active");
+                                 //   scope.isBodySystemSelected = false;
                                     //make the head green
-                                    setTimeout(function () {
+                                    //setTimeout(function () {
-                                        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)'
-                                        });
-                                        console.log(scope.listMangerID);
-                                        for (var i = 0; i <= scope.listMangerID.length - 1; i++) {
-                                            $('#aaDetailViewCanvas').setLayer(scope.listMangerID[i], {
-                                                fillStyle: radialAfterClick,
-                                            }).drawLayers();
-                                        }
+                                    //    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)'
+                                    //    });
+                                    //    console.log(scope.listMangerID);
+                                    //    for (var i = 0; i <= scope.listMangerID.length - 1; i++) {
+                                    //        $('#aaDetailViewCanvas').setLayer(scope.listMangerID[i], {
+                                    //            fillStyle: radialAfterClick,
+                                    //        }).drawLayers();
+                                    //    }
-                                    }, 1000);
+                                    //}, 1000);
                 if (ui.value == 100) {
                     relativeWidth = scope.ViewImageWidth;
@@ -438,7 +439,6 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
                     case "hidePinBtn":
                         break;
                     case "allPinBtn":
-                       
                         if ($("#bodySystemList li.activeAASystemSelect a").attr("id") != undefined) {
                             scope.showSelectedSystemPins($("#bodySystemList li.activeAASystemSelect a").attr("id"))
                             setTimeout(function () {
@@ -516,13 +516,10 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
     $rootScope.aaPinDataArray = [];
     $rootScope.isShowSelectedSystemPinsClicked = false;
     $scope.showAllPins = function () {
-     
         $scope.allPinDataArray = [];
         var promise = ModuleService.getPinDataForImage($rootScope.imageName)
-
           .then(
             function (result) {
-
                 //load navigator image
                 if (result.data.Root._NavigatorImage != undefined) {
                     document.getElementById('navimg').src = '~/../content/images/aa/images/navigator/' + result.data.Root._NavigatorImage;
@@ -533,7 +530,6 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
                     document.getElementById('navigatorDiv').style.visibility = 'hidden';
                 }
-
                 //draw pins
                 $scope.aaPinData = result.data.Root.Item;
                 if ($scope.aaPinData != null && $scope.aaPinData.length > 0) {
@@ -543,7 +539,6 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
                         $scope.drawStaticPinsOnImage('aaDetailViewCanvas', value._PinId, value._PinX, value._PinY, value._HeadX, value._HeadY)
                     })
-                   
                     if ($rootScope.isShowSelectedSystemPinsClicked == false) {
                         $rootScope.isShowSelectedSystemPinsClicked = true;
                         //load search/vocab data
@@ -553,8 +548,6 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
                         $rootScope.isLoading = false;
                         $('#spinner').css('visibility', 'hidden');
                     }
-
-                  
                 }
             },
              function (error) {
@@ -775,114 +768,206 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
         $scope.FilterByImage(1, query);
     }
-    $scope.isSelectedSystemSelected = false;
+    $scope.isBodySystemSelected = false;
+    $scope.SelectedSystemTitle = "Current Structure";
     $scope.showSelectedSystemPins = function (event) {
-      
-        if (typeof event == "string") {
+    
+        if (typeof event == "object") {
+            if (event.currentTarget.title == $("#bodySystemList li.activeAASystemSelect a").attr("title")) {
+             
+            }
+            else {
+                    $scope.typeOfEvent = typeof event;
+                    $scope.SelectedSystemID = event.currentTarget.id;
+                    $scope.SelectedSystemTitle = event.currentTarget.title;
+                    if (event.currentTarget.title == "Current Structure") {
+                       
+                    }
+                    else
+                    {
+                         $scope.clickedPins = [];
+                        $scope.activePinArray = [];
+                    }
+                $scope.isBodySystemSelected = true;
+                $rootScope.isShowSelectedSystemPinsClicked = true;
+                var bodySystemListObj = document.getElementById("bodySystemList").getElementsByTagName("a");
+                var bodySystemListlength = bodySystemListObj.length;
+                for (var i = 0; i < bodySystemListlength; i++) {
+
+                    $("#" + i).parent().removeClass("activeAASystemSelect");
+                }
+                $("#" + $scope.SelectedSystemID).parent().addClass("activeAASystemSelect");
+
+                $rootScope.isLoading = true;
+                $('#spinner').css('visibility', 'visible');
+
+                $scope.removeSpeechBubble();
+                if ($scope.SelectedSystemID == "0") {
+
+                    $scope.selectedSystemName = null;
+                    if ($scope.isHidePinBtnClicked) {
+                        $scope.showAllPinsAfterHide();
+                    }
+                    else {
+                        $scope.showAllPins();
+                    }
+                }
+                else {
+
+                    $scope.selectedSystemName = $scope.SelectedSystemTitle;
+                    // get termText info
+                    var promise = ModuleService.getTermTextDataForPin($scope.moduleName)
+                   .then(
+                    function (response) {
+
+                        $scope.TermInfo = response.data.Terms.Term;
+                      
+                        //on gettng all required data, draw pins
+                        if ($scope.aaPinData != null && $scope.aaPinData.length > 0) {
+
+                            $scope.selectedSystemPinData = new jinqJs()
+                                    .from($scope.aaPinData)
+                                    .where("_BodySystemName == " + $scope.selectedSystemName)
+                                    .select();
+                            if ($scope.isHidePinBtnClicked) {
+                                // $scope.showAllPinsAfterHide($scope.selectedSystemPinData);
+                                $scope.showAllPinsAfterHide();
+
+                            }
+                            else {
+                                //remove other system pins
+                                if ($scope.selectedSystemPinData != null && $scope.selectedSystemPinData.length > 0) {
+
+                                    angular.forEach($scope.aaPinData, function (aaPinDataValue, aaPinDataKey) {
+
+                                        if (aaPinDataValue._BodySystemName != $scope.selectedSystemName)
+                                        {
+                                            $scope.removePin('aaDetailViewCanvas', aaPinDataValue._PinId);
+                                        }
+                                           
+                                    })
+
+                                    angular.forEach($scope.selectedSystemPinData, function (value, key) {
+                                        $scope.drawStaticPinsOnImage('aaDetailViewCanvas', value._PinId, value._PinX, value._PinY, value._HeadX, value._HeadY)
+                                    });
+
+                                  //  make all pin heads grey
+                                    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();
+
+                                    //show annotation on first pin of the sysyem
+                                    $scope.showAnnotation($scope.selectedSystemPinData, false, false, false);
+                                }
+                            }
+                        }
+                    },
+                   function (error) {
+                       // handle errors here
+                       console.log(' error: ' + error.statusText);
+                   }
+                  )
+
+                }
+
+
+            }
+        }
+
+        else
+        {
                 $scope.SelectedSystemID = event;
                 $scope.SelectedSystemTitle = $("#bodySystemList li.activeAASystemSelect a").attr("title");
-               $scope.typeOfEvent = typeof event;
+                $scope.typeOfEvent = typeof event;
+          //  $scope.isBodySystemSelected = true;
+            $rootScope.isShowSelectedSystemPinsClicked = true;
+            var bodySystemListObj = document.getElementById("bodySystemList").getElementsByTagName("a");
+            var bodySystemListlength = bodySystemListObj.length;
+            for (var i = 0; i < bodySystemListlength; i++) {
+
+                $("#" + i).parent().removeClass("activeAASystemSelect");
             }
-        else {
-            $scope.typeOfEvent = typeof event;
-                $scope.SelectedSystemID = event.currentTarget.id;
-                $scope.SelectedSystemTitle = event.currentTarget.title;
-                $scope.clickedPins = [];
-            }
-     
-        $scope.isSelectedSystemSelected = true;
-        $rootScope.isShowSelectedSystemPinsClicked = true;
-        var bodySystemListObj = document.getElementById("bodySystemList").getElementsByTagName("a");
-        var bodySystemListlength = bodySystemListObj.length;
-        for (var i = 0; i < bodySystemListlength; i++) {
+            $("#" + $scope.SelectedSystemID).parent().addClass("activeAASystemSelect");
-            $("#" + i).parent().removeClass("activeAASystemSelect");
-        }
-        $("#" + $scope.SelectedSystemID).parent().addClass("activeAASystemSelect");
+            $rootScope.isLoading = true;
+            $('#spinner').css('visibility', 'visible');
-        $rootScope.isLoading = true;
-        $('#spinner').css('visibility', 'visible');
+            $scope.removeSpeechBubble();
+            if ($scope.SelectedSystemID == "0") {
-        $scope.removeSpeechBubble();
-        if ($scope.SelectedSystemID == "0") {
-        
-            $scope.selectedSystemName = null;
-            if ($scope.isHidePinBtnClicked) {
-                $scope.showAllPinsAfterHide();
+                $scope.selectedSystemName = null;
+                if ($scope.isHidePinBtnClicked) {
+                    $scope.showAllPinsAfterHide();
+                }
+                else {
+                    $scope.showAllPins();
+                }
             }
             else {
-                $scope.showAllPins();
-            }
-        }
-        else {
-    
-            $scope.selectedSystemName = $scope.SelectedSystemTitle;
-            // get termText info
-            var promise = ModuleService.getTermTextDataForPin($scope.moduleName)
-           .then(
-            function (response) {
-             
-                $scope.TermInfo = response.data.Terms.Term;
-                //on gettng all required data, draw pins
-                if ($scope.aaPinData != null && $scope.aaPinData.length > 0) {
+                $scope.selectedSystemName = $scope.SelectedSystemTitle;
+                // get termText info
+                var promise = ModuleService.getTermTextDataForPin($scope.moduleName)
+               .then(
+                function (response) {
+                    $scope.TermInfo = response.data.Terms.Term;
-                    $scope.selectedSystemPinData = new jinqJs()
-                            .from($scope.aaPinData)
-                            .where("_BodySystemName == " + $scope.selectedSystemName)
-                            .select();
-                    if ($scope.isHidePinBtnClicked) {
-                        // $scope.showAllPinsAfterHide($scope.selectedSystemPinData);
-                        $scope.showAllPinsAfterHide();
+                    //on gettng all required data, draw pins
+                    if ($scope.aaPinData != null && $scope.aaPinData.length > 0) {
-                    }
-                    else {
-                        //remove other system pins
-                        if ($scope.selectedSystemPinData != null && $scope.selectedSystemPinData.length > 0) {
-
-                            angular.forEach($scope.aaPinData, function (aaPinDataValue, aaPinDataKey) {
-
-                                if (aaPinDataValue._BodySystemName != $scope.selectedSystemName)
-                                    $scope.removePin('aaDetailViewCanvas', aaPinDataValue._PinId);
-                            })
-
-                            angular.forEach($scope.selectedSystemPinData, function (value, key) {
-                                $scope.drawStaticPinsOnImage('aaDetailViewCanvas', value._PinId, value._PinX, value._PinY, value._HeadX, value._HeadY)
-                            });
-
-                            //make all pin heads grey
-                            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();
-                           
-                            //show annotation on first pin of the sysyem
-                            $scope.showAnnotation($scope.selectedSystemPinData, false, false, false);
+                        $scope.selectedSystemPinData = new jinqJs()
+                                .from($scope.aaPinData)
+                                .where("_BodySystemName == " + $scope.selectedSystemName)
+                                .select();
+                        if ($scope.isHidePinBtnClicked) {
+                            // $scope.showAllPinsAfterHide($scope.selectedSystemPinData);
+                            $scope.showAllPinsAfterHide();
+
+                        }
+                        else {
+                            //remove other system pins
+                            if ($scope.selectedSystemPinData != null && $scope.selectedSystemPinData.length > 0) {
+
+                                angular.forEach($scope.aaPinData, function (aaPinDataValue, aaPinDataKey) {
+
+                                    if (aaPinDataValue._BodySystemName != $scope.selectedSystemName)
+                                        $scope.removePin('aaDetailViewCanvas', aaPinDataValue._PinId);
+                                })
+
+                                angular.forEach($scope.selectedSystemPinData, function (value, key) {
+                                    $scope.drawStaticPinsOnImage('aaDetailViewCanvas', value._PinId, value._PinX, value._PinY, value._HeadX, value._HeadY)
+                                });
+                                //show annotation on first pin of the sysyem
+                                $scope.showAnnotation($scope.selectedSystemPinData, false, false, false);
+                            }
                         }
                     }
-                }
-            },
-           function (error) {
-               // handle errors here
-               console.log(' error: ' + error.statusText);
-           }
-          )
+                },
+               function (error) {
+                   // handle errors here
+                   console.log(' error: ' + error.statusText);
+               }
+              )
+            }
         }
+       
     }
     $scope.listMangerID = [];
     $scope.activePinArray = [];
     $scope.isSearchOptionClicked = false;
     $scope.showAnnotation = function (selectedPinData, isCtrlPressed, isPinClicked, isItemSearched) {
+      
         $scope.selectedPin = [];
         var isSameTermWithMultiPin = false;
         var firstPinId = selectedPinData[0]._PinId;
@@ -896,14 +981,13 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
                                              .where("_TermId == " + pinTermNumber)
                                              .select();
-            if ($scope.isSearchOptionClicked == true) {
-                $scope.activePinArray = [];
-                $scope.clickedPins = [];
-                $scope.isSearchOptionClicked = false;
-            }
-            if ($scope.isSelectedSystemSelected == true) {
-                $scope.activePinArray = [];
-                $scope.isSelectedSystemSelected = false;
+            //if ($scope.isSearchOptionClicked == true) {
+            //    $scope.activePinArray = [];
+            //    $scope.clickedPins = [];
+            //    $scope.isSearchOptionClicked = false;
+            //}
+            if ($scope.isBodySystemSelected == true) {
+            
                 $scope.isSelectedSystemSelectedAftrChange = true;
             }
             for (var i = 0; i <= pinDataWithFirstTermNumber.length - 1; i++) {
@@ -952,10 +1036,12 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
             if (pinDataWithFirstTermNumber.length > 1) {
                 isSameTermWithMultiPin = true;
             }
-
             angular.forEach(pinDataWithFirstTermNumber, function (value, key) {
                 $scope.selectedPin.push(value._PinId);
-                $scope.clickedPins.push({ 'id': value._PinId });
+                if ($scope.isBodySystemSelected == true) {
+                    $scope.clickedPins.push({ 'id': value._PinId });
+                    $scope.isBodySystemSelected = false;
+                }
                 var headX = (parseInt(value._HeadX));
                 var headY = (parseInt(value._HeadY));
                 $scope.createSpeechBubble(parseInt(headX) + 10, parseInt(headY) + 10, value._PinId, isCtrlPressed, isPinClicked, isSameTermWithMultiPin);
@@ -1024,8 +1110,6 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
     };
     $scope.hideSpeechBubble = function () {
-
-
         //clear speech bubbles
         var speechBubbles = $("div[id*='speechBubble']");
         if (speechBubbles != null || speechBubbles != undefined && speechBubbles.length > 0) {
@@ -1230,7 +1314,7 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
                     fillStyle: radial,
                 }).drawLayers();
             });
-
+          
             //make the head green
             var radialAfterClick = $('#aaDetailViewCanvas').createGradient({
                 x1: 50, y1: 50,
@@ -1242,12 +1326,20 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
             var pinHeadName = 'PinArc_' + PinId;
             var pin = $('#aaDetailViewCanvas').getLayer(pinHeadName);
             // pin.fillStyle = radialAfterClick;
-
+          
             $('#aaDetailViewCanvas').setLayer(pinHeadName, {
                 fillStyle: radialAfterClick,
             }).drawLayers();
-       
-
+        
+            if ($scope.typeOfEvent == "string") {
+                for (var i = 0; i <= $scope.clickedPins.length - 1; i++) {
+                    var pinHeadName = 'PinArc_' + $scope.clickedPins[i].id;
+                    $('#aaDetailViewCanvas').setLayer(pinHeadName, {
+                        fillStyle: radialAfterClick,
+                    }).drawLayers();
+                }
+            }
+        
     }
     $scope.angle = function (id, cx, cy, ex, ey, BoolValues) {
@@ -1292,13 +1384,13 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
     $scope.drawStaticPinsOnImage = function (canvasId, PinId, offsetX1, offsetY1, x, y) {
-       
-        if ($scope.isSearchOptionClicked == true) {
-            $scope.clickedPins = [];
-            $scope.isSearchOptionClicked = false;
-        }
+     
+        //if ($scope.isSearchOptionClicked == true) {
+        //    $scope.clickedPins = [];
+        //    $scope.isSearchOptionClicked = false;
+        //}
-
+       
         var multipliedByValue = 5;
         var $ua = navigator.userAgent;
         if (($ua.match(/(iPod|iPhone|iPad|android)/i))) {
@@ -1337,7 +1429,7 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
             radius: 10,
             click: function (clickedPin) {
-              
+               
                 if (clickedPin.event.ctrlKey == false) {    
                     $scope.clickedPins = [];
                     $scope.listMangerID = [];
@@ -1416,6 +1508,7 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
             }
         }).drawLayers();
+      
     }
@@ -1705,7 +1798,7 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
     }
     $scope.showAllPinsAfterHide = function (event) {
-     
+       
         if ($("#dropdownMenu221").hasClass("aaSystemDisable")) {
             $("#dropdownMenu221").removeClass("aaSystemDisable");
         }
@@ -1742,7 +1835,7 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
     $scope.showSelectedPins = function () {
-       
+      
         $("#listManager").css("display", "none");
         $("#optionsListManagerTab").removeClass("active");
         $("#dropdownMenu221").addClass("aaSystemDisable");
@@ -1786,8 +1879,7 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
     $scope.showSystemPins = function (seletedSystemPinData, isShowSelectedPins) {
-      
-        console.log("$scope.activePinArray"+ $scope.activePinArray);
+       
         if (isShowSelectedPins) {
             angular.forEach($scope.clickedPins, function (value, key) {
@@ -1907,10 +1999,12 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
     }
     $scope.highlightPinBasedOnSerachItem = function (id) {
+      
         $scope.isSelectedSystemSelectedAftrChange = false;
         $scope.isSearchOptionClicked = true;
         $scope.listMangerID = [];
         $scope.searchItemId = id;
+      
         $scope.searchItemText = $("#" + id).val();
         $rootScope.searchSelectedText = $("#" + id).val();
         $('#termList option[selected="selected"]').prop("selected", false);
@@ -1944,7 +2038,9 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
         $('#aaDetailViewCanvas').setLayers({
             fillStyle: radial,
         }).drawLayers();
-
+        console.log(pinDataForTerm[0]._PinId);
+        $scope.clickedPins = [];
+        $scope.clickedPins.push({ 'id': pinDataForTerm[0]._PinId });
         $scope.showAnnotation(pinDataForTerm, false, false, true);
         // maintaing scroll position on selection of options in list manager.
         var annotationTopPos = $(".common-drag").css("top").split("p");
@@ -1993,25 +2089,6 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
     }
     $scope.activePinOnLayerChange = function () {
-        if ($scope.isSelectedSystemSelectedAftrChange == true) {
-            //make all pin heads grey
-            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();
-            
-        }
-      
-        if ($("#bodySystemList li.activeAASystemSelect a").attr("id") == "0") {
-           $scope.activePinArray = [];
-        }
-        console.log($scope.activePinArray);
         for (var i = 0; i <= $scope.activePinArray.length - 1; i++) {
             var radialAfterClick = $('#aaDetailViewCanvas').createGradient({
                 x1: 50, y1: 50,
@@ -2026,12 +2103,7 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
             }).drawLayers();
         }
-
-
-
     }
-
-
     angular.element(document).click(function () {
         $("#bodySystemList").css("display","none");
         var $ua = navigator.userAgent;
@@ -2040,11 +2112,6 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
         }
     });
-    //angulaar.element(document).click(function () {
-    //    $("#bodySystemList").css("display", "none");
-    //});
-
-
     $scope.activePinOnSliderChange = function () {
         if ($scope.activePinArray.length == 1) {
@@ -231,6 +231,8 @@
 <script>
     var isSideBarBtnClicked = true;
     $(document).ready(function () {
+    
+        $("#bodySystemList li:nth-child(1)").addClass("activeAASystemSelect");
         $('[data-toggle="tooltip"]').tooltip();
         $("#sideBarToggle").click(function () {
             if (isSideBarBtnClicked == true) {