changes in select system code

Nikita Kulshreshtha
1 parent 6b5549ac
Showing 3 changed files with 128 additions and 124 deletions
400-SOURCECODE/AIAHTML5.Web/app/controllers/TileViewListController.js
400-SOURCECODE/AIAHTML5.Web/app/services/ModuleService.js
400-SOURCECODE/AIAHTML5.Web/app/views/aa/atlas-anatomy-detail.html
@@ -191,7 +191,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
                 $scope.aaPinData = result.data.Root.Item;
                 angular.forEach($scope.aaPinData, function (value, key) {
-                    $scope.DrawStaticPinsOnImage('aaDetailViewCanvas', value._PinId, value._PinX, value._PinY, value._HeadX, value._HeadY)
+                    $scope.drawStaticPinsOnImage('aaDetailViewCanvas', value._PinId, value._PinX, value._PinY, value._HeadX, value._HeadY)
                 })
             },
@@ -404,53 +404,53 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
     $scope.showSelectedSystemPins = function (event) {
-        //1.Remove all the pins first
-        $scope.ClearAllPins();
-
-        var selectedSystemName = event.currentTarget.title;
-        //2. get pinData
-        var promise = ModuleService.getPinDataForImage($rootScope.imageName)
-
-          .then(
-            function (result) {
-                $scope.aaPinData = result.data.Root.Item;
-
-                //3. get termText info
-                var promise = ModuleService.getTermTextForPin($scope.moduleName)
-               .then(
-                function (response) {
-
-                    $scope.TermInfo = response.data.Terms.Term;
-
-                    //on gettng all required data, draw pins
-                    var selectedSystemPinData = new jinqJs()
-                             .from($scope.aaPinData)
-                             .where("_BodySystemName == " + selectedSystemName)
-                             .select();
-                    angular.forEach(selectedSystemPinData, function (value, key) {
+        
+        if (event.currentTarget.id == "0") {
-                      
-                        $scope.DrawStaticPinsOnImage('aaDetailViewCanvas', value._PinId, value._PinX, value._PinY, value._HeadX, value._HeadY)
-
-                    })
-                    //show annotation on first pin of the sysyem
-                    $scope.showAnnotation(selectedSystemPinData, false, false);
-                },
-               function (error) {
-                   // handle errors here
-                   console.log(' error: ' + error.statusText);
-               }
-              )
+            $scope.removeSpeechBubble();
+            $scope.showAllPins();
+        }
+        else {
+            var selectedSystemName = event.currentTarget.title;
-                console.log(JSON.stringify(result, null, 4));
-            },
-             function (error) {
-                 // handle errors here
-                 console.log(' error: ' + error.statusText);
-             }
-            )
+           
+                    // 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
+                        var selectedSystemPinData = new jinqJs()
+                                 .from($scope.aaPinData)
+                                 .where("_BodySystemName == " + selectedSystemName)
+                                 .select();
+                        //remove other system pins
+                        angular.forEach($scope.aaPinData, function (aaPinDataValue, aaPinDataKey) {
+                            //  angular.forEach(selectedSystemPinData, function (selectedSystemPinDataValue, selectedSystemPinDataKey) {
+                            if (aaPinDataValue._BodySystemName != selectedSystemName)
+                                $scope.removePin('aaDetailViewCanvas', aaPinDataValue._PinId);
+                        })
+
+                        angular.forEach(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(selectedSystemPinData, false, false);
+                    },
+                   function (error) {
+                       // handle errors here
+                       console.log(' error: ' + error.statusText);
+                   }
+                  )
+
+       }
     }
     $scope.showAnnotation = function (selectedSystemPinData, isCtrlPressed, isPinClicked) {
@@ -468,8 +468,8 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
-        //3. get termText info
-        var promise = ModuleService.getTermTextForPin($scope.moduleName)
+        // get termText info
+        var promise = ModuleService.getTermTextDataForPin($scope.moduleName)
        .then(
         function (response) {
@@ -490,7 +490,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
             }
             else {
                 if (isPinClicked) {
-                    var existingSpeechBubble = $("div[id*='sppeachBubble']");
+                    var existingSpeechBubble = $("div[id*='speechBubble']");
                     for (var i = 0; i < existingSpeechBubble.length; i++) {
                         existingSpeechBubble[i].parentNode.removeChild(existingSpeechBubble[i]);
@@ -534,30 +534,32 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
         function (error) { })
     }
-    $scope.ClearAllPins = function () {
-
-        //var canvasHeight = document.getElementById('aaDetailViewCanvas').height;
-        //var canvasWidth = document.getElementById('aaDetailViewCanvas').width;
-
-        //$scope.context.clearRect(0, 0, canvasWidth, canvasHeight);
-
-        $('#aaDetailViewCanvas').clearCanvas();
+    $scope.removeSpeechBubble = function () {
+       
         //clear speech bubbles
-        var speechBubbles = $("div[id*='sppeachBubble']");
+        var speechBubbles = $("div[id*='speechBubble']");
         if (speechBubbles != null || speechBubbles != undefined && speechBubbles.length > 0) {
             for (var j = 0; j < speechBubbles.length; j++) {
                 speechBubbles[j].parentNode.removeChild(speechBubbles[j]);
             }
         }
-        var speechBubbleLines = $("div[id*='sppeachBubbleLine']");
+        var speechBubbleLines = $("div[id*='speechBubbleLine']");
         if (speechBubbleLines != null || speechBubbleLines != undefined && speechBubbleLines.length > 0) {
             for (var j = 0; j < speechBubbleLines.length; j++) {
                 speechBubbleLines[j].parentNode.removeChild(speechBubbleLines[j]);
             }
         }
+
+        var speechBubbleDraggedLines = $("div[id*='speechBubbleDraggedLine']");
+        if (speechBubbleDraggedLines != null || speechBubbleDraggedLines != undefined && speechBubbleDraggedLines.length > 0) {
+            for (var j = 0; j < speechBubbleDraggedLines.length; j++) {
+
+                speechBubbleDraggedLines[j].parentNode.removeChild(speechBubbleDraggedLines[j]);
+            }
+        }
     };
@@ -568,7 +570,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
         $scope.createSpeechBubbleBasedOnAnnotationLength(x, y, PinId);
-        $('#sppeachBubble').draggable(
+        $('#speechBubble').draggable(
         {
             drag: function (evt) {
                 $("#dot").css("visibility", "hidden");
@@ -580,7 +582,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
     }
-    $scope.GetAnnotationBasedOnActualTermNo = function (actualTermNo, language) {
+    $scope.getAnnotationBasedOnActualTermNo = function (actualTermNo, language) {
         var Annotation;
         $scope.ActualTermNo = actualTermNo;
@@ -614,54 +616,54 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
     }
-    $scope.GetAnnotationText = function (termNumber) {
-        $rootScope.annotationText = [];
-        var annotationText;
-        var annotation = [];
-        //0
-        var figLeafTermNo = 5868; // to do declare constant for this
-
-        if (parseInt(termNumber) != parseInt(figLeafTermNo)) {
-            $scope.TermNumber = termNumber;
-            for (var j = 0; j <= $rootScope.lexiconLanguageArray.length - 1; j++) {
-                if ($rootScope.TermNumberData != null || $rootScope.TermNumberData != undefined) {
-                    $scope.matchedTermNoData = new jinqJs()
-                                               .from($rootScope.TermNumberData.TermData.Term)
-                                               .where('_TermNumber == ' + termNumber)
-                                               .select();
-
-                    if ($scope.matchedTermNoData != null || $scope.matchedTermNoData != undefined) {
-                        //1.
-                        var actualTermNo = 0;
-                        for (var z = 0; z < $scope.matchedTermNoData.length; z++) {
-                            //send actual term no to get the term text.
-                            actualTermNo = $scope.matchedTermNoData[0]._ActualTermNumber;
-                            annotationText = $scope.GetAnnotationBasedOnActualTermNo(actualTermNo, $rootScope.lexiconLanguageArray[j].language);
-                            annotation.push(annotationText);
-                            $rootScope.annotationText.push(annotationText);
-                            $rootScope.actualTermNumber = actualTermNo;
-                            break;
-                        };
-
-                        //2.
-
-                    }
-                    else {
-                        // send term no to vocab json data to get the text 
-                    }
-                }
-            }
-        }
-
-        return annotation;
-    }
+    //$scope.getAnnotationText = function (termNumber) {
+    //    $rootScope.annotationText = [];
+    //    var annotationText;
+    //    var annotation = [];
+    //    //0
+    //    var figLeafTermNo = 5868; // to do declare constant for this
+
+    //    if (parseInt(termNumber) != parseInt(figLeafTermNo)) {
+    //        $scope.TermNumber = termNumber;
+    //        for (var j = 0; j <= $rootScope.lexiconLanguageArray.length - 1; j++) {
+    //            if ($rootScope.TermNumberData != null || $rootScope.TermNumberData != undefined) {
+    //                $scope.matchedTermNoData = new jinqJs()
+    //                                           .from($rootScope.TermNumberData.TermData.Term)
+    //                                           .where('_TermNumber == ' + termNumber)
+    //                                           .select();
+
+    //                if ($scope.matchedTermNoData != null || $scope.matchedTermNoData != undefined) {
+    //                    //1.
+    //                    var actualTermNo = 0;
+    //                    for (var z = 0; z < $scope.matchedTermNoData.length; z++) {
+    //                        //send actual term no to get the term text.
+    //                        actualTermNo = $scope.matchedTermNoData[0]._ActualTermNumber;
+    //                        annotationText = $scope.getAnnotationBasedOnActualTermNo(actualTermNo, $rootScope.lexiconLanguageArray[j].language);
+    //                        annotation.push(annotationText);
+    //                        $rootScope.annotationText.push(annotationText);
+    //                        $rootScope.actualTermNumber = actualTermNo;
+    //                        break;
+    //                    };
+
+    //                    //2.
+
+    //                }
+    //                else {
+    //                    // send term no to vocab json data to get the text 
+    //                }
+    //            }
+    //        }
+    //    }
+
+    //    return annotation;
+    //}
     $scope.createSpeechBubbleBasedOnAnnotationLength = function (x, y, PinId) {
         var speechBubbleHTML = '<div id="speechBubbleLine' + PinId + '" 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' + PinId + '" class="common-drag" style="height:auto!important;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;">'
+                  + '<div id="speechBubble' + PinId + '" class="common-drag" style="height:auto!important;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;">'
                   + '<span style="position:absolute;right:-3px;top:-4px;color:#ffffff;cursor:pointer;">'
                   + '<img id="closeBtn' + PinId + ' " class="crossDiv_temp" style="width:18px" src=' + $rootScope.closeBtnImgPath + '></span></div>'
@@ -681,7 +683,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
             if ($scope.MultiLanguageAnnationArray.length > 0) {
                 for (var i = 0; i <= $scope.MultiLanguageAnnationArray.length - 1; i++) {
                     var MultipleLanguage = $scope.MultiLanguageAnnationArray[i];
-                    $("#sppeachBubble" + PinId).append("<p style='margin-bottom:2px;'>" + MultipleLanguage + "</p>");
+                    $("#speechBubble" + PinId).append("<p style='margin-bottom:2px;'>" + MultipleLanguage + "</p>");
                 }
             }
             else {
@@ -691,7 +693,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
                 if ($scope.longestAnnotation.length <= 10) {
-                    $("#sppeachBubble").css("width", "100px");
+                    $("#speechBubble").css("width", "100px");
                 }
@@ -699,39 +701,39 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
-                    $("#sppeachBubble").css("width", "140px");
+                    $("#speechBubble").css("width", "140px");
                 }
                 else if ($scope.longestAnnotation.length > 17 && $scope.longestAnnotation.length <= 26) {
-                    $("#sppeachBubble").css("width", "195px");
+                    $("#speechBubble").css("width", "195px");
                 }
                 else if ($scope.longestAnnotation.length > 26 && $scope.longestAnnotation.length <= 34) {
-                    $("#sppeachBubble").css("width", "248px");
+                    $("#speechBubble").css("width", "248px");
                 }
                 else if ($scope.longestAnnotation.length > 34 && $scope.longestAnnotation.length <= 44) {
-                    $("#sppeachBubble").css("width", "300px");
+                    $("#speechBubble").css("width", "300px");
                 }
                 else if ($scope.longestAnnotation.length > 44 && $scope.longestAnnotation.length <= 54) {
-                    $("#sppeachBubble").css("width", "370px");
+                    $("#speechBubble").css("width", "370px");
                 }
                 else if ($scope.longestAnnotation.length > 54 && $scope.longestAnnotation.length <= 69) {
-                    $("#sppeachBubble").css("width", "450px");
+                    $("#speechBubble").css("width", "450px");
                 }
                 else if ($scope.longestAnnotation.length > 69 && $scope.longestAnnotation.length <= 75) {
-                    $("#sppeachBubble").css("width", "510px");
+                    $("#speechBubble").css("width", "510px");
                 }
                 else {
-                    $("#sppeachBubble").css("width", ($scope.longestAnnotation.length) + "%");
+                    $("#speechBubble").css("width", ($scope.longestAnnotation.length) + "%");
                 }
             }
         }
@@ -742,9 +744,9 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
         document.getElementById('speechBubbleLine' + PinId + '').style.display = 'block';
         document.getElementById('speechBubbleLine' + PinId + '').style.left = ((Globe[0].currentX - 45)) + 'px';
         document.getElementById('speechBubbleLine' + PinId + '').style.top = ((Globe[0].currentY) - 20) + 'px';
-        document.getElementById('sppeachBubble' + PinId + '').style.display = 'block';
-        document.getElementById('sppeachBubble' + PinId + '').style.left = (Globe[0].currentX - 70) + 'px';
-        document.getElementById('sppeachBubble' + PinId + '').style.top = (Globe[0].currentY - 58) + 'px';
+        document.getElementById('speechBubble' + PinId + '').style.display = 'block';
+        document.getElementById('speechBubble' + PinId + '').style.left = (Globe[0].currentX - 70) + 'px';
+        document.getElementById('speechBubble' + PinId + '').style.top = (Globe[0].currentY - 58) + 'px';
         $('.common-drag').draggable(
         {
@@ -774,7 +776,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
             var imgId = $(this).attr("id");
             var pinId = imgId.substring(8, imgId.length);
-            $('#sppeachBubble' + pinId).remove();
+            $('#speechBubble' + pinId).remove();
             $("#speechBubbleDraggedLine" + pinId).remove();
             $("#speechBubbleLine" + pinId).remove();
@@ -847,7 +849,7 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
     }
-    $scope.DrawStaticPinsOnImage = function (canvasId, PinId, offsetX1, offsetY1, x, y) {
+    $scope.drawStaticPinsOnImage = function (canvasId, PinId, offsetX1, offsetY1, x, y) {
         var radial = $('#' + canvasId).createGradient({
             x1: 50, y1: 50,
@@ -914,13 +916,15 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
     }
-    $scope.onCloseBtnClick = function (event) {
-        alert('closed')
-    }
+    $scope.removePin = function (canvasId,pinId) {
-    $("#closeBtn").click(function () {
-        alert('closed')
-    });
+        var pinName = 'Pin_' + pinId;
+        var pinArcName = 'PinArc_' + pinId;
+        $('#' + canvasId).removeLayer(pinName).drawLayers();
+        $('#' + canvasId).removeLayer(pinArcName).drawLayers();
+
+        $scope.removeSpeechBubble();
+    }
 }]);
 function showSelectedSystemPins(event) {
@@ -92,7 +92,7 @@ AIA.service(&#39;ModuleService&#39;, function($http, DataService) {
         },
-        getTermTextForPin: function (moduleName) {
+        getTermTextDataForPin: function (moduleName) {
             var jsonPath;
             if (moduleName == ATLAS_ANATOMY) {
@@ -17,7 +17,7 @@
             <div class="col-sm-6" title="Select System">
                 <button class="btn btn-black btn-sm pull-right marginTop5 dropdown-toggle" type="button" id="dropdownMenu221" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true"><img src="../../../content/images/aa/LeftMenu/icon-highlight.png" alt="" title=""></button>
                 <ul class="dropdown-menu" aria-labelledby="dropdownMenu221">
-                    <li><a href="#" title="Current Structure">All</a></li>
+                    <li><a id="0" href="#" title="Current Structure" onclick="showSelectedSystemPins(event)">All</a></li>
                     <li role="separator" class="divider"></li>
                     <li><a id="1" href="#" title="Cardiovascular"  onclick="showSelectedSystemPins(event)">Cardiovascular</a></li>
                     <li><a id="2" href="#" title="Digestive" onclick="showSelectedSystemPins(event)">Digestive</a></li>