ADAM / AIAHTML5

Merged
Merge Request #899 · created by Ayush Jain

Aia pin annotaton issue 1

From AIAPinAnnotatonIssue_1 into Develop

Merged by Amrita Vishnoi

3 participants
Inline Side-by-side
Showing 1 changed file
400-SOURCECODE/AIAHTML5.Web/app/controllers/TileViewListController.js
  Edit  View file @88824d7
... ... @@ -350,9 +350,9 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
350 350 $("#listManager").css("display", "none");
351 351 $("#optionsListManagerTab").removeClass("active");
352 352 //make the head green
353   -
  353 +
354 354 setTimeout(function () {
355   -
  355 +
356 356 var radialAfterClick = $('#aaDetailViewCanvas').createGradient({
357 357 x1: 50, y1: 50,
358 358 x2: 50, y2: 50,
... ... @@ -360,6 +360,7 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
360 360 c1: 'rgba(100, 50, 0,0)',
361 361 c2: 'rgb(126, 187, 83)'
362 362 });
  363 + console.log(scope.listMangerID);
363 364 for (var i = 0; i <= scope.listMangerID.length - 1; i++) {
364 365 $('#aaDetailViewCanvas').setLayer(scope.listMangerID[i], {
365 366 fillStyle: radialAfterClick,
... ... @@ -408,10 +409,7 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
408 409 $("#modItemImage").css("height", relativeHeight + "px");
409 410 $("#aaDetailViewCanvas").css("width", relativeWidth + "px");
410 411 $("#modItemImage").css("height", relativeHeight + "px");
411   -
412 412 $("#modItemImage").attr('src', '');
413   -
414   -
415 413 $("#aaDetailViewCanvas").remove();
416 414 //0.5 create canvas on the top of image so that I can draw a line over the canvas.
417 415 var canvas = document.createElement('canvas');
... ... @@ -422,7 +420,6 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
422 420 canvas.style.left = '0px';
423 421 canvas.style.top = '0px';
424 422 canvas.style.position = "absolute";
425   -
426 423 $("#canvasDiv").append(canvas);
427 424 scope.context = canvas.getContext("2d")
428 425 $("#modItemImage").attr('src', scope.OpenItemImagePath);
... ... @@ -436,23 +433,32 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
436 433 }
437 434 });
438 435 scope.isSelectedPinBtnClickedAftrSliderCange = true;
  436 +
439 437 switch (btnID) {
440   -
441 438 case "hidePinBtn":
442 439 break;
443 440 case "allPinBtn":
444   - scope.showAllPins();
  441 +
  442 + if ($("#bodySystemList li.activeAASystemSelect a").attr("id") != undefined) {
  443 + scope.showSelectedSystemPins($("#bodySystemList li.activeAASystemSelect a").attr("id"))
  444 + setTimeout(function () {
  445 + scope.removeSpeechBubble();
  446 + }, 1000);
  447 + }
  448 + else
  449 + {
  450 + scope.showAllPins();
  451 + }
445 452 break;
446 453 case "selectedPin":
447   - scope.showAllPins();
448   - setTimeout(function () {
449   - console.log(scope.allPinDataArray);
450   - scope.activePinOnSliderChange();
451   - }, 1000);
  454 + scope.showAllPins();
  455 + setTimeout(function () {
  456 + console.log(scope.allPinDataArray);
  457 + scope.activePinOnSliderChange();
  458 + }, 1000);
452 459 break;
453 460 }
454 461 }
455   -
456 462 });
457 463 }
458 464 $scope.highlightBodySystemList = function () {
... ... @@ -464,7 +470,6 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
464 470 for (var j = 0; j < $rootScope.bodySystemNames.length; j++) {
465 471 if ((bodySystemListObj[i].innerHTML) == ($rootScope.bodySystemNames[j])) {
466 472 $("#" + i).parent().removeClass("disabledSelectedSystem");
467   -
468 473 }
469 474 }
470 475  
... ... @@ -511,6 +516,7 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
511 516 $rootScope.aaPinDataArray = [];
512 517 $rootScope.isShowSelectedSystemPinsClicked = false;
513 518 $scope.showAllPins = function () {
  519 +
514 520 $scope.allPinDataArray = [];
515 521 var promise = ModuleService.getPinDataForImage($rootScope.imageName)
516 522  
... ... @@ -713,7 +719,7 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
713 719 //"$$hashKey": value._Summary
714 720  
715 721 });
716   - console.log($scope.searchAAListViewData);
  722 +
717 723 if ($('#searchItem').length > 0)
718 724 $('#searchItem').remove();
719 725 }
... ... @@ -727,8 +733,7 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
727 733  
728 734 $('#ListViewDiv').append('<tr id="searchItem"><td colspan="6"><strong style="color:black;">No illustration found for the selected search criteria!</strong></td></tr>');
729 735 }
730   - //console.log(JSON.stringify(result, null, 4));
731   - console.log('SearchAAListViewData--' + $scope.searchAAListViewData);
  736 +
732 737 },
733 738 function (error) {
734 739 // handle errors here
... ... @@ -770,8 +775,22 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
770 775 $scope.FilterByImage(1, query);
771 776  
772 777 }
773   -
  778 + $scope.isSelectedSystemSelected = false;
774 779 $scope.showSelectedSystemPins = function (event) {
  780 +
  781 + if (typeof event == "string") {
  782 + $scope.SelectedSystemID = event;
  783 + $scope.SelectedSystemTitle = $("#bodySystemList li.activeAASystemSelect a").attr("title");
  784 + $scope.typeOfEvent = typeof event;
  785 + }
  786 + else {
  787 + $scope.typeOfEvent = typeof event;
  788 + $scope.SelectedSystemID = event.currentTarget.id;
  789 + $scope.SelectedSystemTitle = event.currentTarget.title;
  790 + $scope.clickedPins = [];
  791 + }
  792 +
  793 + $scope.isSelectedSystemSelected = true;
775 794 $rootScope.isShowSelectedSystemPinsClicked = true;
776 795 var bodySystemListObj = document.getElementById("bodySystemList").getElementsByTagName("a");
777 796 var bodySystemListlength = bodySystemListObj.length;
... ... @@ -779,18 +798,16 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
779 798  
780 799 $("#" + i).parent().removeClass("activeAASystemSelect");
781 800 }
782   - $("#" + event.currentTarget.id).parent().addClass("activeAASystemSelect");
  801 + $("#" + $scope.SelectedSystemID).parent().addClass("activeAASystemSelect");
783 802  
784 803 $rootScope.isLoading = true;
785 804 $('#spinner').css('visibility', 'visible');
786 805  
787 806 $scope.removeSpeechBubble();
788   - if (event.currentTarget.id == "0") {
789   -
  807 + if ($scope.SelectedSystemID == "0") {
  808 +
790 809 $scope.selectedSystemName = null;
791 810 if ($scope.isHidePinBtnClicked) {
792   -
793   - // $scope.showAllPinsAfterHide($scope.aaPinData);
794 811 $scope.showAllPinsAfterHide();
795 812 }
796 813 else {
... ... @@ -798,13 +815,13 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
798 815 }
799 816 }
800 817 else {
801   -
802   - $scope.selectedSystemName = event.currentTarget.title;
  818 +
  819 + $scope.selectedSystemName = $scope.SelectedSystemTitle;
803 820 // get termText info
804 821 var promise = ModuleService.getTermTextDataForPin($scope.moduleName)
805 822 .then(
806 823 function (response) {
807   -
  824 +
808 825 $scope.TermInfo = response.data.Terms.Term;
809 826  
810 827 //on gettng all required data, draw pins
... ... @@ -830,11 +847,23 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
830 847 })
831 848  
832 849 angular.forEach($scope.selectedSystemPinData, function (value, key) {
833   -
834   -
835 850 $scope.drawStaticPinsOnImage('aaDetailViewCanvas', value._PinId, value._PinX, value._PinY, value._HeadX, value._HeadY)
836   -
837   - })
  851 + });
  852 +
  853 + //make all pin heads grey
  854 + var radial = $('#aaDetailViewCanvas').createGradient({
  855 + x1: 50, y1: 50,
  856 + x2: 50, y2: 50,
  857 + r1: 10, r2: 30,
  858 + c1: 'rgba(100, 50, 0,0)',
  859 + c2: 'rgb(216, 216, 216)'
  860 + });
  861 +
  862 +
  863 + $('#aaDetailViewCanvas').setLayers({
  864 + fillStyle: radial,
  865 + }).drawLayers();
  866 +
838 867 //show annotation on first pin of the sysyem
839 868 $scope.showAnnotation($scope.selectedSystemPinData, false, false, false);
840 869 }
... ... @@ -848,11 +877,12 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
848 877 )
849 878  
850 879 }
  880 +
851 881 }
852 882 $scope.listMangerID = [];
  883 + $scope.activePinArray = [];
  884 + $scope.isSearchOptionClicked = false;
853 885 $scope.showAnnotation = function (selectedPinData, isCtrlPressed, isPinClicked, isItemSearched) {
854   -
855   - $scope.clickedPins = [];
856 886 $scope.selectedPin = [];
857 887 var isSameTermWithMultiPin = false;
858 888 var firstPinId = selectedPinData[0]._PinId;
... ... @@ -865,20 +895,22 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
865 895 .from($scope.aaPinData)
866 896 .where("_TermId == " + pinTermNumber)
867 897 .select();
868   -
869   - $scope.listMangerID = [];
870   - $scope.activePinArray = [];
  898 +
  899 + if ($scope.isSearchOptionClicked == true) {
  900 + $scope.activePinArray = [];
  901 + $scope.clickedPins = [];
  902 + $scope.isSearchOptionClicked = false;
  903 + }
  904 + if ($scope.isSelectedSystemSelected == true) {
  905 + $scope.activePinArray = [];
  906 + $scope.isSelectedSystemSelected = false;
  907 + $scope.isSelectedSystemSelectedAftrChange = true;
  908 + }
871 909 for (var i = 0; i <= pinDataWithFirstTermNumber.length - 1; i++) {
872 910 $scope.listMangerID.push('PinArc_' + pinDataWithFirstTermNumber[i]._PinId);
873 911 $scope.activePinArray.push('PinArc_' + pinDataWithFirstTermNumber[i]._PinId);
874 912 }
875   -
876   -
877   -
878 913  
879   -
880   -
881   - console.log($scope.listMangerID);
882 914 $scope.MultiLanguageAnnationArray = [];
883 915  
884 916 $scope.GetAnnotationBasedOnActualTermNo(pinTermNumber);
... ... @@ -891,7 +923,7 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
891 923 var existingSpeechBubble = $("div[id*='speechBubble']");
892 924 for (var i = 0; i < existingSpeechBubble.length; i++) {
893 925 existingSpeechBubble[i].parentNode.removeChild(existingSpeechBubble[i]);
894   -
  926 +
895 927 //make all pin heads grey
896 928 var radial = $('#aaDetailViewCanvas').createGradient({
897 929 x1: 50, y1: 50,
... ... @@ -930,15 +962,14 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
930 962 })
931 963  
932 964 }
933   -
  965 +
934 966 $rootScope.isLoading = false;
935 967 $('#spinner').css('visibility', 'hidden');
936 968  
937 969 }
938 970  
939 971 $scope.removeSpeechBubble = function () {
940   -
941   -
  972 +
942 973 //clear speech bubbles
943 974 var speechBubbles = $("div[id*='speechBubble']");
944 975 if (speechBubbles != null || speechBubbles != undefined && speechBubbles.length > 0) {
... ... @@ -1040,170 +1071,184 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
1040 1071 }
1041 1072 $scope.sliderVal = 100;
1042 1073 $scope.createSpeechBubbleBasedOnAnnotationLength = function (x, y, PinId) {
1043   -
1044 1074 x = x * $scope.sliderPercentValue;
1045 1075 y = y * $scope.sliderPercentValue;
1046   -
1047   - var speechBubbleHTML = '<div id="speechBubbleLine' + PinId + '" style="position:absolute;height:15px;width:35px;display:none;z-index:13000;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>'
1048   - + '<div id="speechBubble' + PinId + '" class="common-drag" style="height:auto!important;z-index:13000;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;">'
1049   - + '<span style="position:absolute;right:-3px;top:-4px;color:#ffffff;cursor:pointer;">'
1050   - + '<img id="closeBtn' + PinId + ' " class="crossDiv_temp" style="width:18px" src=' + $rootScope.closeBtnImgPath + '></span></div>'
1051   -
1052   - + '<div style="position:absolute;border:1px solid #000;display:none;z-index:12000;" id="speechBubbleDraggedLine' + PinId + '">'
1053   - + '</div>';
1054   -
1055   - //Issue #7286 :Undefined annotation should not appear
1056   - for (var i = 0; i <= $scope.MultiLanguageAnnationArray.length - 1; i++) {
1057   - var MultipleLanguage = $scope.MultiLanguageAnnationArray[i];
  1076 + if ($("#canvasDiv").find("div").length > 0) {
  1077 + $("#canvasDiv").find("div").each(function () {
  1078 + var str = $(this).attr("id");
  1079 + if (str.substr(0, 16) == "speechBubbleLine") {
  1080 + var res = str.substr(16);
  1081 + if (res == PinId) {
  1082 + $scope.isAnnotationDivAlreadyPresent = false;
  1083 + }
  1084 + else {
  1085 + $scope.isAnnotationDivAlreadyPresent = true;
  1086 + }
  1087 + }
  1088 + });
1058 1089 }
  1090 + else {
  1091 + $scope.isAnnotationDivAlreadyPresent = true;
  1092 + }
  1093 + if ($scope.isAnnotationDivAlreadyPresent == true) {
  1094 + var speechBubbleHTML = '<div id="speechBubbleLine' + PinId + '" style="position:absolute;height:15px;width:35px;display:none;z-index:13000;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>'
  1095 + + '<div id="speechBubble' + PinId + '" class="common-drag" style="height:auto!important;z-index:13000;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;">'
  1096 + + '<span style="position:absolute;right:-3px;top:-4px;color:#ffffff;cursor:pointer;">'
  1097 + + '<img id="closeBtn' + PinId + ' " class="crossDiv_temp" style="width:18px" src=' + $rootScope.closeBtnImgPath + '></span></div>'
1059 1098  
1060   - if (MultipleLanguage == undefined) {
1061   - console.log("No text is found");
1062   - } else {
1063   - $('#canvasDiv').append(speechBubbleHTML);
  1099 + + '<div style="position:absolute;border:1px solid #000;display:none;z-index:12000;" id="speechBubbleDraggedLine' + PinId + '">'
  1100 + + '</div>';
1064 1101  
1065   - if ($scope.MultiLanguageAnnationArray.length > 0) {
1066   - for (var i = 0; i <= $scope.MultiLanguageAnnationArray.length - 1; i++) {
1067   - var MultipleLanguage = $scope.MultiLanguageAnnationArray[i];
1068   - $rootScope.clickedPinAnnotation = $scope.MultiLanguageAnnationArray[0];
1069   - $("#speechBubble" + PinId).append("<p style='margin-bottom:2px;'>" + MultipleLanguage + "</p>");
1070   - }
1071   - }
1072   - else {
1073   - console.log('MultiLanguageAnnationArray.length is :' + $scope.MultiLanguageAnnationArray.length)
  1102 + //Issue #7286 :Undefined annotation should not appear
  1103 + for (var i = 0; i <= $scope.MultiLanguageAnnationArray.length - 1; i++) {
  1104 + var MultipleLanguage = $scope.MultiLanguageAnnationArray[i];
1074 1105 }
1075 1106  
1076   -
  1107 + if (MultipleLanguage == undefined) {
  1108 + console.log("No text is found");
  1109 + } else {
  1110 + $('#canvasDiv').append(speechBubbleHTML);
1077 1111  
1078   -
  1112 + if ($scope.MultiLanguageAnnationArray.length > 0) {
  1113 + for (var i = 0; i <= $scope.MultiLanguageAnnationArray.length - 1; i++) {
  1114 + var MultipleLanguage = $scope.MultiLanguageAnnationArray[i];
  1115 + $rootScope.clickedPinAnnotation = $scope.MultiLanguageAnnationArray[0];
  1116 + $("#speechBubble" + PinId).append("<p style='margin-bottom:2px;'>" + MultipleLanguage + "</p>");
  1117 + }
  1118 + }
  1119 + else {
  1120 + console.log('MultiLanguageAnnationArray.length is :' + $scope.MultiLanguageAnnationArray.length)
  1121 + }
1079 1122  
1080   - if ($scope.longestAnnotation != null || $scope.longestAnnotation != undefined) {
1081   - if ($scope.longestAnnotation.length <= 10) {
  1123 + if ($scope.longestAnnotation != null || $scope.longestAnnotation != undefined) {
  1124 + if ($scope.longestAnnotation.length <= 10) {
1082 1125  
1083 1126  
1084   - $("#speechBubble").css("width", "100px");
  1127 + $("#speechBubble").css("width", "100px");
1085 1128  
1086   - }
  1129 + }
1087 1130  
1088   - else if ($scope.longestAnnotation.length > 10 && $scope.longestAnnotation.length <= 17) {
  1131 + else if ($scope.longestAnnotation.length > 10 && $scope.longestAnnotation.length <= 17) {
1089 1132  
1090 1133  
1091 1134  
1092   - $("#speechBubble").css("width", "140px");
  1135 + $("#speechBubble").css("width", "140px");
1093 1136  
1094   - }
1095   - else if ($scope.longestAnnotation.length > 17 && $scope.longestAnnotation.length <= 26) {
  1137 + }
  1138 + else if ($scope.longestAnnotation.length > 17 && $scope.longestAnnotation.length <= 26) {
1096 1139  
1097 1140  
1098   - $("#speechBubble").css("width", "195px");
  1141 + $("#speechBubble").css("width", "195px");
1099 1142  
1100   - }
1101   - else if ($scope.longestAnnotation.length > 26 && $scope.longestAnnotation.length <= 34) {
  1143 + }
  1144 + else if ($scope.longestAnnotation.length > 26 && $scope.longestAnnotation.length <= 34) {
1102 1145  
1103   - $("#speechBubble").css("width", "248px");
  1146 + $("#speechBubble").css("width", "248px");
1104 1147  
1105   - }
1106   - else if ($scope.longestAnnotation.length > 34 && $scope.longestAnnotation.length <= 44) {
  1148 + }
  1149 + else if ($scope.longestAnnotation.length > 34 && $scope.longestAnnotation.length <= 44) {
1107 1150  
1108 1151  
1109   - $("#speechBubble").css("width", "300px");
1110   - }
  1152 + $("#speechBubble").css("width", "300px");
  1153 + }
1111 1154  
1112   - else if ($scope.longestAnnotation.length > 44 && $scope.longestAnnotation.length <= 54) {
  1155 + else if ($scope.longestAnnotation.length > 44 && $scope.longestAnnotation.length <= 54) {
1113 1156  
1114   - $("#speechBubble").css("width", "370px");
1115   - }
  1157 + $("#speechBubble").css("width", "370px");
  1158 + }
1116 1159  
1117   - else if ($scope.longestAnnotation.length > 54 && $scope.longestAnnotation.length <= 69) {
1118   - $("#speechBubble").css("width", "450px");
1119   - }
1120   - else if ($scope.longestAnnotation.length > 69 && $scope.longestAnnotation.length <= 75) {
1121   - $("#speechBubble").css("width", "510px");
1122   - }
1123   - else {
1124   - $("#speechBubble").css("width", ($scope.longestAnnotation.length) + "%");
  1160 + else if ($scope.longestAnnotation.length > 54 && $scope.longestAnnotation.length <= 69) {
  1161 + $("#speechBubble").css("width", "450px");
  1162 + }
  1163 + else if ($scope.longestAnnotation.length > 69 && $scope.longestAnnotation.length <= 75) {
  1164 + $("#speechBubble").css("width", "510px");
  1165 + }
  1166 + else {
  1167 + $("#speechBubble").css("width", ($scope.longestAnnotation.length) + "%");
  1168 + }
1125 1169 }
1126 1170 }
  1171 + var speechBubbleDims = [];
  1172 +
  1173 + $rootScope.speechBubbleDimaensions.push({ "currentX": x, "currentY": y, "id": PinId });
  1174 + speechBubbleDims.push({ currentX: x, currentY: y });
  1175 + document.getElementById('speechBubbleLine' + PinId + '').style.display = 'block';
  1176 + document.getElementById('speechBubbleLine' + PinId + '').style.left = ((speechBubbleDims[0].currentX - 12)) + 'px';
  1177 + if ($scope.sliderVal == 25) {
  1178 + document.getElementById('speechBubbleLine' + PinId + '').style.top = ((speechBubbleDims[0].currentY + 5)) + 'px';
  1179 + }
  1180 + else {
  1181 + document.getElementById('speechBubbleLine' + PinId + '').style.top = ((speechBubbleDims[0].currentY)) + 'px';
  1182 + }
  1183 + document.getElementById('speechBubble' + PinId + '').style.display = 'block';
  1184 + document.getElementById('speechBubble' + PinId + '').style.left = (speechBubbleDims[0].currentX - 4) + 'px';
  1185 + document.getElementById('speechBubble' + PinId + '').style.top = (speechBubbleDims[0].currentY) + 'px';
1127 1186 }
1128   - var speechBubbleDims = [];
1129   -
1130   - $rootScope.speechBubbleDimaensions.push({ "currentX": x, "currentY": y, "id": PinId });
1131   - speechBubbleDims.push({ currentX: x, currentY: y });
1132   - document.getElementById('speechBubbleLine' + PinId + '').style.display = 'block';
1133   - document.getElementById('speechBubbleLine' + PinId + '').style.left = ((speechBubbleDims[0].currentX - 12)) + 'px';
1134   - if ($scope.sliderVal == 25) {
1135   - document.getElementById('speechBubbleLine' + PinId + '').style.top = ((speechBubbleDims[0].currentY + 5)) + 'px';
1136   - }
1137   - else {
1138   - document.getElementById('speechBubbleLine' + PinId + '').style.top = ((speechBubbleDims[0].currentY)) + 'px';
1139   - }
1140   - document.getElementById('speechBubble' + PinId + '').style.display = 'block';
1141   - document.getElementById('speechBubble' + PinId + '').style.left = (speechBubbleDims[0].currentX - 4) + 'px';
1142   - document.getElementById('speechBubble' + PinId + '').style.top = (speechBubbleDims[0].currentY) + 'px';
1143   - $('.common-drag').draggable(
1144   - {
  1187 + $('.common-drag').draggable(
  1188 + {
1145 1189  
1146   - drag: function (evt) {
  1190 + drag: function (evt) {
1147 1191  
1148   - var verticalScrollPosition = document.getElementById('canvasDiv').scrollTop;
1149   - var horizontlScrollPosition = document.getElementById('canvasDiv').scrollLeft;
1150   - var clickedSpeechBubbleId = $(this).attr("id");
  1192 + var verticalScrollPosition = document.getElementById('canvasDiv').scrollTop;
  1193 + var horizontlScrollPosition = document.getElementById('canvasDiv').scrollLeft;
  1194 + var clickedSpeechBubbleId = $(this).attr("id");
1151 1195  
1152   - var clickedPinId = clickedSpeechBubbleId.substring(12, clickedSpeechBubbleId.length);
  1196 + var clickedPinId = clickedSpeechBubbleId.substring(12, clickedSpeechBubbleId.length);
1153 1197  
1154   - $("#speechBubbleLine" + clickedPinId).css("visibility", "hidden");
1155   - $("#speechBubbleLine" + clickedPinId).css("display", "none");
  1198 + $("#speechBubbleLine" + clickedPinId).css("visibility", "hidden");
  1199 + $("#speechBubbleLine" + clickedPinId).css("display", "none");
1156 1200  
1157   - for (var i = 0; i <= $rootScope.speechBubbleDimaensions.length - 1; i++) {
1158   - if ($rootScope.speechBubbleDimaensions[i].id == clickedPinId) {
1159   - $scope.angle(clickedPinId, $rootScope.speechBubbleDimaensions[i].currentX, $rootScope.speechBubbleDimaensions[i].currentY, evt.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left, evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top, true);
  1201 + for (var i = 0; i <= $rootScope.speechBubbleDimaensions.length - 1; i++) {
  1202 + if ($rootScope.speechBubbleDimaensions[i].id == clickedPinId) {
  1203 + $scope.angle(clickedPinId, $rootScope.speechBubbleDimaensions[i].currentX, $rootScope.speechBubbleDimaensions[i].currentY, evt.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left, evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top, true);
  1204 + }
1160 1205 }
1161   - }
1162 1206  
1163   - },
1164   - });
1165   - $('.crossDiv_temp').on('click', function (evt) {
  1207 + },
  1208 + });
  1209 +
  1210 + $('.crossDiv_temp').on('click', function (evt) {
  1211 +
  1212 + var imgId = $(this).attr("id");
  1213 + var pinId = imgId.substring(8, imgId.length);
  1214 + $('#speechBubble' + pinId).remove();
  1215 + $("#speechBubbleDraggedLine" + pinId).remove();
  1216 + $("#speechBubbleLine" + pinId).remove();
  1217 +
  1218 + //make all pin heads grey
  1219 + var pinHeadName = 'PinArc_' + pinId;
  1220 + var radial = $('#aaDetailViewCanvas').createGradient({
  1221 + x1: 50, y1: 50,
  1222 + x2: 50, y2: 50,
  1223 + r1: 10, r2: 30,
  1224 + c1: 'rgba(100, 50, 0,0)',
  1225 + c2: 'rgb(216, 216, 216)'
  1226 + });
1166 1227  
1167   - var imgId = $(this).attr("id");
1168   - var pinId = imgId.substring(8, imgId.length);
1169   - $('#speechBubble' + pinId).remove();
1170   - $("#speechBubbleDraggedLine" + pinId).remove();
1171   - $("#speechBubbleLine" + pinId).remove();
1172 1228  
1173   - //make all pin heads grey
1174   - var pinHeadName = 'PinArc_' + pinId;
1175   - var radial = $('#aaDetailViewCanvas').createGradient({
  1229 + $('#aaDetailViewCanvas').setLayer(pinHeadName, {
  1230 + fillStyle: radial,
  1231 + }).drawLayers();
  1232 + });
  1233 +
  1234 + //make the head green
  1235 + var radialAfterClick = $('#aaDetailViewCanvas').createGradient({
1176 1236 x1: 50, y1: 50,
1177 1237 x2: 50, y2: 50,
1178 1238 r1: 10, r2: 30,
1179 1239 c1: 'rgba(100, 50, 0,0)',
1180   - c2: 'rgb(216, 216, 216)'
  1240 + c2: 'rgb(126, 187, 83)'
1181 1241 });
1182   -
  1242 + var pinHeadName = 'PinArc_' + PinId;
  1243 + var pin = $('#aaDetailViewCanvas').getLayer(pinHeadName);
  1244 + // pin.fillStyle = radialAfterClick;
1183 1245  
1184 1246 $('#aaDetailViewCanvas').setLayer(pinHeadName, {
1185   - fillStyle: radial,
  1247 + fillStyle: radialAfterClick,
1186 1248 }).drawLayers();
1187   - });
1188   -
1189   - //make the head green
1190   - var radialAfterClick = $('#aaDetailViewCanvas').createGradient({
1191   - x1: 50, y1: 50,
1192   - x2: 50, y2: 50,
1193   - r1: 10, r2: 30,
1194   - c1: 'rgba(100, 50, 0,0)',
1195   - c2: 'rgb(126, 187, 83)'
1196   - });
1197   - var pinHeadName = 'PinArc_' + PinId;
1198   - var pin = $('#aaDetailViewCanvas').getLayer(pinHeadName);
1199   - // pin.fillStyle = radialAfterClick;
  1249 +
1200 1250  
1201   - $('#aaDetailViewCanvas').setLayer(pinHeadName, {
1202   - fillStyle: radialAfterClick,
1203   - }).drawLayers();
1204 1251 }
1205   -
1206   -
1207 1252 $scope.angle = function (id, cx, cy, ex, ey, BoolValues) {
1208 1253  
1209 1254 var dy = ey - cy;
... ... @@ -1242,14 +1287,17 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
1242 1287 else {
1243 1288 $("#bord_annotation").css({ 'display': 'block', 'width': d + 'px', 'top': e + 'px', 'left': f + 'px', 'transform': 'rotate(' + theta + 'deg)', '-moz-transform': 'rotate(' + theta + 'deg)', '-webkit-transform': 'rotate(' + theta + 'deg)', 'transform-origin': '0% 0%' });
1244 1289 }
1245   -
1246   -
1247   -
  1290 +
1248 1291 }
1249 1292  
1250 1293  
1251 1294 $scope.drawStaticPinsOnImage = function (canvasId, PinId, offsetX1, offsetY1, x, y) {
1252   - $scope.clickedPins = [];
  1295 +
  1296 + if ($scope.isSearchOptionClicked == true) {
  1297 + $scope.clickedPins = [];
  1298 + $scope.isSearchOptionClicked = false;
  1299 + }
  1300 +
1253 1301  
1254 1302 var multipliedByValue = 5;
1255 1303 var $ua = navigator.userAgent;
... ... @@ -1290,9 +1338,11 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
1290 1338  
1291 1339 click: function (clickedPin) {
1292 1340  
1293   - if (clickedPin.event.ctrlKey == false) {
  1341 + if (clickedPin.event.ctrlKey == false) {
1294 1342 $scope.clickedPins = [];
  1343 + $scope.listMangerID = [];
1295 1344 }
  1345 + $scope.isSelectedSystemSelectedAftrChange = false;
1296 1346 var pinID = (clickedPin.name).substring(7, (clickedPin.name).length);
1297 1347 var pinData = new jinqJs()
1298 1348 .from($scope.aaPinData)
... ... @@ -1307,16 +1357,14 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
1307 1357 .from($scope.aaPinData)
1308 1358 .where("_TermId == " + pinTermNumber)
1309 1359 .select();
1310   -
1311   -
1312 1360 if (pinWithSameTerm != undefined && pinWithSameTerm != null && pinWithSameTerm.length > 0) {
1313 1361  
1314 1362 for (var i = 0; i < pinWithSameTerm.length; i++) {
1315   -
1316 1363 $scope.clickedPins.push({ 'id': pinWithSameTerm[i]._PinId })
1317 1364 }
1318   -
1319 1365 }
  1366 +
  1367 +
1320 1368 $scope.isSelectedPinBtnClickedAftrSliderCange = false;
1321 1369 var selectedPinData = new jinqJs()
1322 1370 .from($scope.aaPinData)
... ... @@ -1657,6 +1705,7 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
1657 1705 }
1658 1706  
1659 1707 $scope.showAllPinsAfterHide = function (event) {
  1708 +
1660 1709 if ($("#dropdownMenu221").hasClass("aaSystemDisable")) {
1661 1710 $("#dropdownMenu221").removeClass("aaSystemDisable");
1662 1711 }
... ... @@ -1664,6 +1713,8 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
1664 1713 $('#spinner').css('visibility', 'visible');
1665 1714 $scope.isHidePinBtnClicked = false;
1666 1715 $rootScope.isshowAllPinsBtnAfterHideClicked = true;
  1716 +
  1717 +
1667 1718 if ($scope.selectedSystemName != null && $scope.selectedSystemName != undefined) {
1668 1719  
1669 1720 $scope.showSystemPins($scope.selectedSystemPinData, false);
... ... @@ -1677,21 +1728,27 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
1677 1728 $(".tooltip-custom").addClass("btn-black");
1678 1729 $("#allPinBtn").addClass("btn-primary");
1679 1730 $("#allPinBtn").removeClass("btn-black");
1680   - if ($scope.isSliderChange == true) {
1681   - $scope.isSliderChange = false;
1682   - $scope.showAllPins();
  1731 + if ($("#bodySystemList li.activeAASystemSelect a").attr("title") == "Current Structure" || $("#bodySystemList li.activeAASystemSelect a").attr("title") == undefined)
  1732 + {
  1733 + if ($scope.isSliderChange == true) {
  1734 + $scope.isSliderChange = false;
  1735 + $scope.showAllPins();
1683 1736  
  1737 + }
1684 1738 }
  1739 +
  1740 +
1685 1741 };
1686 1742  
1687 1743  
1688 1744 $scope.showSelectedPins = function () {
  1745 +
1689 1746 $("#listManager").css("display", "none");
1690 1747 $("#optionsListManagerTab").removeClass("active");
1691 1748 $("#dropdownMenu221").addClass("aaSystemDisable");
1692 1749 $rootScope.isLoading = true;
1693 1750 $('#spinner').css('visibility', 'visible');
1694   -
  1751 +
1695 1752 $scope.isHidePinBtnClicked = false;
1696 1753  
1697 1754 if ($scope.selectedSystemName != null && $scope.selectedSystemName != undefined) {
... ... @@ -1729,7 +1786,8 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
1729 1786  
1730 1787  
1731 1788 $scope.showSystemPins = function (seletedSystemPinData, isShowSelectedPins) {
1732   -
  1789 +
  1790 + console.log("$scope.activePinArray"+ $scope.activePinArray);
1733 1791 if (isShowSelectedPins) {
1734 1792  
1735 1793 angular.forEach($scope.clickedPins, function (value, key) {
... ... @@ -1738,7 +1796,8 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
1738 1796 .from(seletedSystemPinData)
1739 1797 .where('_PinId != ' + value.id)
1740 1798 .select();
1741   - })
  1799 + });
  1800 +
1742 1801 angular.forEach($scope.clickedPins, function (value1, key1) {
1743 1802  
1744 1803 // if (aaPinDataValue._PinId != value.id) {
... ... @@ -1846,8 +1905,11 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
1846 1905 }, 1000);
1847 1906  
1848 1907 }
1849   -
  1908 +
1850 1909 $scope.highlightPinBasedOnSerachItem = function (id) {
  1910 + $scope.isSelectedSystemSelectedAftrChange = false;
  1911 + $scope.isSearchOptionClicked = true;
  1912 + $scope.listMangerID = [];
1851 1913 $scope.searchItemId = id;
1852 1914 $scope.searchItemText = $("#" + id).val();
1853 1915 $rootScope.searchSelectedText = $("#" + id).val();
... ... @@ -1862,24 +1924,32 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
1862 1924 //selectedTermName.placeholder = $("#" + id).text();
1863 1925 selectedTermName.value = $("#" + id).val();
1864 1926 selectedTermName.placeholder = "search... ";
1865   -
  1927 +
1866 1928 //get data from pindata for this trem
1867   -
  1929 +
1868 1930 var pinDataForTerm = new jinqJs()
1869 1931 .from($scope.aaPinData)
1870 1932 .where("_TermId == " + $scope.searchItemId)
1871 1933 .select();
1872   -
  1934 + //make all pin heads grey
  1935 + var radial = $('#aaDetailViewCanvas').createGradient({
  1936 + x1: 50, y1: 50,
  1937 + x2: 50, y2: 50,
  1938 + r1: 10, r2: 30,
  1939 + c1: 'rgba(100, 50, 0,0)',
  1940 + c2: 'rgb(216, 216, 216)'
  1941 + });
  1942 +
  1943 +
  1944 + $('#aaDetailViewCanvas').setLayers({
  1945 + fillStyle: radial,
  1946 + }).drawLayers();
  1947 +
1873 1948 $scope.showAnnotation(pinDataForTerm, false, false, true);
1874 1949 // maintaing scroll position on selection of options in list manager.
1875 1950 var annotationTopPos = $(".common-drag").css("top").split("p");
1876 1951 $("#canvasDiv").scrollTop(annotationTopPos[0]);
1877   -
1878 1952 $scope.IsSearchVisible = false;
1879   -
1880   -
1881   -
1882   -
1883 1953 }
1884 1954  
1885 1955 $rootScope.isShowHideButtonClicked = true;
... ... @@ -1922,6 +1992,26 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
1922 1992 }
1923 1993 }
1924 1994 $scope.activePinOnLayerChange = function () {
  1995 +
  1996 + if ($scope.isSelectedSystemSelectedAftrChange == true) {
  1997 + //make all pin heads grey
  1998 + var radial = $('#aaDetailViewCanvas').createGradient({
  1999 + x1: 50, y1: 50,
  2000 + x2: 50, y2: 50,
  2001 + r1: 10, r2: 30,
  2002 + c1: 'rgba(100, 50, 0,0)',
  2003 + c2: 'rgb(216, 216, 216)'
  2004 + });
  2005 + $('#aaDetailViewCanvas').setLayers({
  2006 + fillStyle: radial,
  2007 + }).drawLayers();
  2008 +
  2009 + }
  2010 +
  2011 + if ($("#bodySystemList li.activeAASystemSelect a").attr("id") == "0") {
  2012 + $scope.activePinArray = [];
  2013 + }
  2014 + console.log($scope.activePinArray);
1925 2015 for (var i = 0; i <= $scope.activePinArray.length - 1; i++) {
1926 2016 var radialAfterClick = $('#aaDetailViewCanvas').createGradient({
1927 2017 x1: 50, y1: 50,
... ... @@ -1936,6 +2026,9 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
1936 2026 }).drawLayers();
1937 2027  
1938 2028 }
  2029 +
  2030 +
  2031 +
1939 2032 }
1940 2033  
1941 2034  
... ... @@ -1953,6 +2046,7 @@ function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeou
1953 2046  
1954 2047  
1955 2048 $scope.activePinOnSliderChange = function () {
  2049 +
1956 2050 if ($scope.activePinArray.length == 1) {
1957 2051 for (var i = 0; i <= $scope.allPinDataArray.length - 1; i++) {
1958 2052 var activeArc = $scope.activePinArray[0].split("_");
... ...