Commit a2aeb1dca2f2bd34a1f7df7e6b07053dd320baa4
1 parent
6fe695b8
taken these files from develop
Showing
2 changed files
with
2613 additions
and
2615 deletions
400-SOURCECODE/AIAHTML5.Web/app/controllers/TileViewListController.js
| 1 | -'use strict'; | ||
| 2 | - | ||
| 3 | -AIA.controller("TileViewListController", ["$scope", "$window", "$rootScope", "$compile", "$http", "$log", "$location", "$timeout", "DA", "Modules", "$routeParams", "BodyRegions", "BodySystems", "ViewOrientations", "ImageTypes", "DataService", "ModuleService", | ||
| 4 | -function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeout, DA, Modules, $routeParam, BodyRegions, BodySystems, ViewOrientations, ImageTypes, DataService, ModuleService) { | ||
| 5 | - | ||
| 6 | - | ||
| 7 | - $rootScope.OpenedTileData = []; | ||
| 8 | - var DISSECTIBLE_ANATOMY = 'Dissectible Anatomy'; | ||
| 9 | - var ATLAS_ANATOMY = 'Atlas Anatomy'; | ||
| 10 | - var CLINICAL_ILLUSTRATION = 'Clinical Illustrations'; | ||
| 11 | - var CLINICAL_ANIMATION = 'Clinical Animations'; | ||
| 12 | - $rootScope.closeBtnImgPath = "~/../content/images/speeachBubbleClose.png"; | ||
| 13 | - $rootScope.listArray = []; | ||
| 14 | - //variables to bind Filter by Controls | ||
| 15 | - $scope.searchAAListViewData = []; | ||
| 16 | - $scope.SelectedAAthumbImage = []; | ||
| 17 | - $scope.SelectedAAImage = []; | ||
| 18 | - $scope.SelectedAASummary = []; | ||
| 19 | - $scope.SelectedAAId = []; | ||
| 20 | - $scope.SelectedAATitle = []; | ||
| 21 | - $scope.selectedAAListViewData = []; | ||
| 22 | - $scope.filterstring = false; | ||
| 23 | - $scope.AllBodyRegion = []; | ||
| 24 | - $scope.AllBodySystem = []; | ||
| 25 | - $scope.AllOrientation = []; | ||
| 26 | - $scope.AllImageType = []; | ||
| 27 | - $rootScope.speechBubbleDimaensions = []; | ||
| 28 | - $scope.runningSearchWorkers = []; | ||
| 29 | - $scope.clickedPins = []; | ||
| 30 | - $scope.sliderPercentValue = 1; | ||
| 31 | - $scope.query = { | ||
| 32 | - selectedbodyregion: '', | ||
| 33 | - selectedbodysystem: '', | ||
| 34 | - selectedorientation: '', | ||
| 35 | - selectedimagetype: '', | ||
| 36 | - }; | ||
| 37 | - $scope.activePinArray = []; | ||
| 38 | - $scope.showTabButton = true; | ||
| 39 | - $scope.isListViewDataLoaded = true; | ||
| 40 | - | ||
| 41 | - $scope.setActiveTab = function (tabToSet) { | ||
| 42 | - | ||
| 43 | - $scope.activeTab = tabToSet; | ||
| 44 | - localStorage.setItem("activeTab", $scope.activeTab); | ||
| 45 | - if ($scope.activeTab == 1) { | ||
| 46 | - $('#grid-view').css("display", "block"); | ||
| 47 | - $('#list-view').css("display", "none"); | ||
| 48 | - $("#demoView").remove(); | ||
| 49 | - } | ||
| 50 | - else { | ||
| 51 | - | ||
| 52 | - $('#grid-view').css("display", "none"); | ||
| 53 | - $('#list-view').css("display", "block"); | ||
| 54 | - } | ||
| 55 | - }; | ||
| 56 | - | ||
| 57 | - $scope.loadForModuleById = function (moduleId) { | ||
| 58 | - $rootScope.openModules.push({ "ModuleId": 2 }); | ||
| 59 | - if ($rootScope.refreshcheck == null) { | ||
| 60 | - $location.path('/'); | ||
| 61 | - } | ||
| 62 | - $scope.moduleId = moduleId; | ||
| 63 | - $scope.activeTab = 1; | ||
| 64 | - console.log('loadForModuleById is called') | ||
| 65 | - $rootScope.moduleName = Modules[moduleId].Name; | ||
| 66 | - $rootScope.currentActiveModuleTitle = $rootScope.moduleName; | ||
| 67 | - $scope.AllBodyRegion = BodyRegions; | ||
| 68 | - $scope.AllBodySystem = BodySystems; | ||
| 69 | - $scope.AllOrientation = ViewOrientations; | ||
| 70 | - $scope.AllImageType = ImageTypes; | ||
| 71 | - var promise = ModuleService.loadModuleDataBasedOnModuleName($scope.moduleName) | ||
| 72 | - .then( | ||
| 73 | - function (result) { | ||
| 74 | - | ||
| 75 | - $scope.moduleLandingData = result; | ||
| 76 | - // setTimeout(function () { $('#' + $rootScope.highlightid).find('.thumbnail').addClass('hightlightstate'); }, 100); | ||
| 77 | - setTimeout(function () { | ||
| 78 | - if ($rootScope.getLocalStorageValue('AAGridViewHighlightThumbnail') !== null) { | ||
| 79 | - $('#' + $rootScope.getLocalStorageValue("AAGridViewHighlightThumbnail")).find('.thumbnail').addClass('HightLightThumbnail'); | ||
| 80 | - } | ||
| 81 | - if ($rootScope.getLocalStorageValue('AAGridViewScroll') !== null && $location.url() == "/tile-view-list") { | ||
| 82 | - $('html, body').animate({ scrollTop: $rootScope.getLocalStorageValue('AAGridViewScroll') }, 'slow'); | ||
| 83 | - } | ||
| 84 | - }, 100); | ||
| 85 | - //console.log(JSON.stringify(result, null, 4)); | ||
| 86 | - }, | ||
| 87 | - function (error) { | ||
| 88 | - // handle errors here | ||
| 89 | - console.log(' error: ' + error.statusText); | ||
| 90 | - } | ||
| 91 | - ) | ||
| 92 | - $('#list-view').css('display', 'none'); | ||
| 93 | - } | ||
| 94 | - | ||
| 95 | - //$scope.$on('$viewContentLoaded', function (event) { | ||
| 96 | - | ||
| 97 | - // $scope.loadForModuleById(); | ||
| 98 | - | ||
| 99 | - //}); | ||
| 100 | - $scope.isOpenBtnClicked = false; | ||
| 101 | - $scope.openModuleItemView = function (event) { | ||
| 102 | - $rootScope.MenuModuleName = "AA"; | ||
| 103 | - localStorage.setItem("activeTab", $scope.activeTab); | ||
| 104 | - //0. Get selected Image Id | ||
| 105 | - if ($scope.isListViewButtonClicked == true) { | ||
| 106 | - if ($scope.isOpenBtnClicked == true) { | ||
| 107 | - | ||
| 108 | - var moduleItemDataToBeSaved = $("#demoText").text().trim(); | ||
| 109 | - $scope.isOpenBtnClicked = false; | ||
| 110 | - } | ||
| 111 | - else { | ||
| 112 | - var moduleItemDataToBeSavedID = event.currentTarget.id; | ||
| 113 | - localStorage.setItem("listViewSelectedID", moduleItemDataToBeSavedID); | ||
| 114 | - var moduleItemDataToBeSaved = $("#list-view table tbody #" + moduleItemDataToBeSavedID).find('td:eq(0)').text().trim(); | ||
| 115 | - } | ||
| 116 | - } | ||
| 117 | - else { | ||
| 118 | - var moduleItemDataToBeSaved = event.target.id; | ||
| 119 | - localStorage.setItem("listViewSelectedID", event.currentTarget.id); | ||
| 120 | - $scope.isListViewButtonClicked = false; | ||
| 121 | - } | ||
| 122 | - | ||
| 123 | - //1.Filter selected module ietem data and get the pushed opened moduile array object | ||
| 124 | - $rootScope.OpenedTileData = ModuleService.GetOpenedTileData(moduleItemDataToBeSaved, $scope.moduleLandingData); | ||
| 125 | - | ||
| 126 | - //2. Pick the image name to create a source to open | ||
| 127 | - $rootScope.imageId = $rootScope.OpenedTileData[0]; | ||
| 128 | - $rootScope.imageName = $rootScope.OpenedTileData[3]; | ||
| 129 | - $rootScope.bodySystemName = $rootScope.OpenedTileData[2]; | ||
| 130 | - $rootScope.OpenItemImagePath = "../../../content/images/aa/images/" + $rootScope.OpenedTileData[3]; | ||
| 131 | - $scope.OpenItemImagePath = "../../../content/images/aa/images/" + $rootScope.OpenedTileData[3]; | ||
| 132 | - //$rootScope.listArray = []; | ||
| 133 | - $rootScope.listArray.push({ "imageName": $rootScope.OpenItemImagePath, "text": moduleItemDataToBeSaved }); | ||
| 134 | - //3. set opened module item ti | ||
| 135 | - localStorage.setItem("currentViewTitle", $rootScope.OpenedTileData[6]); | ||
| 136 | - localStorage.setItem("AAGridViewScroll", $($window).scrollTop()); | ||
| 137 | - localStorage.setItem("AAGridViewHighlightThumbnail", $(event.target).parent().parent().parent().attr('id')); | ||
| 138 | - | ||
| 139 | - //3. Navigate to the Module-item-view | ||
| 140 | - var u = $location.url(); | ||
| 141 | - $location.url('/module-item-view'); | ||
| 142 | - } | ||
| 143 | - | ||
| 144 | - | ||
| 145 | - $scope.openListViewModuleItem = function (event) { | ||
| 146 | - $("#demoView").remove(); | ||
| 147 | - var moduleItemDataToBeSavedID = event.currentTarget.id; | ||
| 148 | - $("#list-view table tbody tr").removeClass("active"); | ||
| 149 | - localStorage.setItem("listViewSelectedID", moduleItemDataToBeSavedID); | ||
| 150 | - $("#list-view table tbody #" + moduleItemDataToBeSavedID).addClass("active"); | ||
| 151 | - localStorage.setItem("AAListViewScroll", $("#list-view table tbody").scrollTop()); | ||
| 152 | - var moduleItemDataToBeSaved = $("#list-view table tbody #" + moduleItemDataToBeSavedID).find('td:eq(0)').text().trim(); | ||
| 153 | - $rootScope.OpenedTileData = ModuleService.GetOpenedTileData(moduleItemDataToBeSaved, $scope.moduleLandingData); | ||
| 154 | - $rootScope.OpenItemImagePath = "../../../content/images/aa/images/" + $rootScope.OpenedTileData[3]; | ||
| 155 | - //$rootScope.listArray = []; | ||
| 156 | - $rootScope.listArray.push({ "imageName": $rootScope.OpenItemImagePath, "text": moduleItemDataToBeSaved }); | ||
| 157 | - $("#viewList").append("<div class='col-xs-12 text-center' style='padding-top:15px;padding-bottom:15px;' id='demoView'><div class='col-xs-12' style='padding:15px;background-color:#fff;'><div class='col-xs-2' style='border:1px solid #000;padding:5px;color:#000;font-size:12px;'><div class='thumbnail' style='margin-bottom:10px;'><img style='width:auto;height:95px!important;' src=" + $rootScope.OpenItemImagePath + "></div><div class='col-xs-12' id='demoText' style='padding:0;'>" + moduleItemDataToBeSaved + "</div></div></div><a style='position:absolute;right:30px;bottom:34px;' onclick='openCurrentView(event)' href='javascript:void(0)' class='pull-right btn btn-primary'>Open</a></div>"); | ||
| 158 | - } | ||
| 159 | - | ||
| 160 | - | ||
| 161 | - $scope.openModuleItem = function () { | ||
| 162 | - if ($rootScope.refreshcheck == null) { | ||
| 163 | - $location.path('/'); | ||
| 164 | - } | ||
| 165 | - var jsContentURL; | ||
| 166 | - var moduleItemViewDivId; | ||
| 167 | - | ||
| 168 | - //1. create a jsPanel and load the module item view | ||
| 169 | - if ($rootScope.moduleName == ATLAS_ANATOMY) { | ||
| 170 | - | ||
| 171 | - jsContentURL = 'app/views/aa/atlas-anatomy-detail.html'; | ||
| 172 | - moduleItemViewDivId = 'aaDetailPageDiv'; | ||
| 173 | - } | ||
| 174 | - else if ($rootScope.moduleName == CLINICAL_ANIMATION) { | ||
| 175 | - //to do, in next phase of project | ||
| 176 | - | ||
| 177 | - } | ||
| 178 | - else if ($rootScope.moduleName == CLINICAL_ILLUSTRATION) { | ||
| 179 | - //to do, in next phase of project | ||
| 180 | - | ||
| 181 | - } | ||
| 182 | - | ||
| 183 | - //1. create a jsPanel and load the module item view | ||
| 184 | - if ($rootScope.moduleName == ATLAS_ANATOMY) { | ||
| 185 | - $.jsPanel({ | ||
| 186 | - id: 'ImagePanel', | ||
| 187 | - selector: '.aaBodyView', | ||
| 188 | - theme: 'success', | ||
| 189 | - currentController: 'TileViewListController', | ||
| 190 | - parentSlug: 'tile-view-list', | ||
| 191 | - ajax: { | ||
| 192 | - url: jsContentURL | ||
| 193 | - }, | ||
| 194 | - title: $rootScope.getLocalStorageValue("currentViewTitle"), | ||
| 195 | - | ||
| 196 | - position: { | ||
| 197 | - top: 70, | ||
| 198 | - left: 1, | ||
| 199 | - }, | ||
| 200 | - | ||
| 201 | - size: { width: $(window).outerWidth() - 10, height: $(window).outerHeight() - 125 }, | ||
| 202 | - | ||
| 203 | - }); | ||
| 204 | - | ||
| 205 | - console.log('jsPanel loaded ImagePanel exist= ' + document.getElementById('ImagePanel')) | ||
| 206 | - | ||
| 207 | - //0.3 | ||
| 208 | - var aaViewElement = angular.element(document.getElementById(moduleItemViewDivId)); | ||
| 209 | - | ||
| 210 | - //0.4 for Opening module item, load it into image | ||
| 211 | - $rootScope.isLoading = true; | ||
| 212 | - $('#spinner').css('visibility', 'visible'); | ||
| 213 | - var openedImage = new Image(); | ||
| 214 | - openedImage.id = 'modItemImage'; | ||
| 215 | - openedImage.name = $rootScope.OpenItemImagePath; | ||
| 216 | - | ||
| 217 | - openedImage.onload = function () { | ||
| 218 | - $scope.imageWidth = this.width; | ||
| 219 | - $scope.imageHeight = this.height; | ||
| 220 | - | ||
| 221 | - | ||
| 222 | - $timeout(function () { | ||
| 223 | - $compile(aaViewElement.contents())($scope); | ||
| 224 | - | ||
| 225 | - //if (document.getElementById('aaDetailPageDiv') != null) { | ||
| 226 | - if (document.getElementById('aaBodyView') != null) { | ||
| 227 | - | ||
| 228 | - //0.4 added some stylesheets | ||
| 229 | - $('#aaBodyView').css("height", $(window).outerHeight() - 65); | ||
| 230 | - | ||
| 231 | - $('#aaBodyView').css("width", $(window).outerWidth() - 15); | ||
| 232 | - | ||
| 233 | - $rootScope.canvasDivHeight = $('.jsPanel-content').height() - $('.main2 .stickey-area').height(); | ||
| 234 | - | ||
| 235 | - $('.canvasDivClass').css("height", $rootScope.canvasDivHeight); | ||
| 236 | - | ||
| 237 | - $scope.currentTitleFromJson = $rootScope.getLocalStorageValue("currentViewTitle"); | ||
| 238 | - $("#modItemImage").attr('src', $rootScope.OpenItemImagePath); | ||
| 239 | - | ||
| 240 | - | ||
| 241 | - $rootScope.ViewImageWidth = $("#modItemImage").width(); | ||
| 242 | - $scope.ViewImageWidth = $("#modItemImage").width(); | ||
| 243 | - $scope.ViewImageHeight = $("#modItemImage").height(); | ||
| 244 | - | ||
| 245 | - $scope.relativeDimesion = 0; | ||
| 246 | - $("#modItemImage").css("width", $rootScope.ViewImageWidth + "px"); | ||
| 247 | - //0.5 create canvas on the top of image so that I can draw a line over the canvas. | ||
| 248 | - var canvas = document.createElement('canvas'); | ||
| 249 | - canvas.id = 'aaDetailViewCanvas'; | ||
| 250 | - canvas.className = '.aaCanvas' | ||
| 251 | - canvas.height = parseInt(($scope.imageHeight)); | ||
| 252 | - canvas.width = parseInt($scope.imageWidth); | ||
| 253 | - canvas.style.left = '0px'; | ||
| 254 | - canvas.style.top = '0px'; | ||
| 255 | - canvas.style.position = "absolute"; | ||
| 256 | - $("#canvasDiv").append(canvas); | ||
| 257 | - $scope.context = canvas.getContext("2d") | ||
| 258 | - //6. Show all pins on AA opened item | ||
| 259 | - $scope.showAllPins(); | ||
| 260 | - //7. Highlight all system body list in left side | ||
| 261 | - $scope.highlightBodySystemList(); | ||
| 262 | - } | ||
| 263 | - $(".slider").slider({ | ||
| 264 | - min: 25, | ||
| 265 | - max: 100, | ||
| 266 | - value: 100, | ||
| 267 | - range: "min", | ||
| 268 | - orientation: "vertical", | ||
| 269 | - slide: function (event, ui) { | ||
| 270 | - var scope = angular.element(document.getElementById("aaDetailPageDiv")).scope(); | ||
| 271 | - scope.$apply(function () { | ||
| 272 | - scope.sliderVal = ui.value; | ||
| 273 | - scope.removeSpeechBubble(); | ||
| 274 | - var relativeWidth = 0; | ||
| 275 | - var relativeHeight = 0; | ||
| 276 | - if (ui.value == 25 || ui.value == 40 || ui.value == 55 || ui.value == 70 || ui.value == 85 || ui.value == 100) { | ||
| 277 | - if (ui.value == 100) { | ||
| 278 | - relativeWidth = scope.ViewImageWidth; | ||
| 279 | - relativeHeight = scope.ViewImageHeight | ||
| 280 | - scope.sliderPercentValue = 1.0; | ||
| 281 | - } | ||
| 282 | - else if (ui.value == 85) { | ||
| 283 | - relativeWidth = scope.ViewImageWidth * 0.85; | ||
| 284 | - relativeHeight = scope.ViewImageHeight * 0.85; | ||
| 285 | - scope.sliderPercentValue = 0.85; | ||
| 286 | - | ||
| 287 | - } else if (ui.value == 70) { | ||
| 288 | - relativeWidth = scope.ViewImageWidth * 0.70; | ||
| 289 | - relativeHeight = scope.ViewImageHeight * 0.70; | ||
| 290 | - scope.sliderPercentValue = 0.70; | ||
| 291 | - } else if (ui.value == 55) { | ||
| 292 | - | ||
| 293 | - relativeWidth = scope.ViewImageWidth * 0.55; | ||
| 294 | - relativeHeight = scope.ViewImageHeight * 0.55; | ||
| 295 | - scope.sliderPercentValue = 0.55; | ||
| 296 | - | ||
| 297 | - } else if (ui.value == 40) { | ||
| 298 | - | ||
| 299 | - relativeWidth = scope.ViewImageWidth * 0.40; | ||
| 300 | - relativeHeight = scope.ViewImageHeight * 0.40; | ||
| 301 | - scope.sliderPercentValue = 0.40; | ||
| 302 | - | ||
| 303 | - } else if (ui.value == 25) { | ||
| 304 | - | ||
| 305 | - relativeWidth = scope.ViewImageWidth * 0.25; | ||
| 306 | - relativeHeight = scope.ViewImageHeight * 0.25; | ||
| 307 | - scope.sliderPercentValue = 0.25; | ||
| 308 | - | ||
| 309 | - } | ||
| 310 | - } | ||
| 311 | - | ||
| 312 | - if (ui.value == 25 || ui.value == 40 || ui.value == 55 || ui.value == 70 || ui.value == 85 || ui.value == 100) { | ||
| 313 | - $("#modItemImage").css("width", relativeWidth + "px"); | ||
| 314 | - $("#modItemImage").css("height", relativeHeight + "px"); | ||
| 315 | - $("#aaDetailViewCanvas").css("width", relativeWidth + "px"); | ||
| 316 | - $("#modItemImage").css("height", relativeHeight + "px"); | ||
| 317 | - | ||
| 318 | - $("#modItemImage").attr('src', ''); | ||
| 319 | - | ||
| 320 | - | ||
| 321 | - $("#aaDetailViewCanvas").remove(); | ||
| 322 | - //0.5 create canvas on the top of image so that I can draw a line over the canvas. | ||
| 323 | - var canvas = document.createElement('canvas'); | ||
| 324 | - canvas.id = 'aaDetailViewCanvas'; | ||
| 325 | - canvas.className = 'aaCanvas'; | ||
| 326 | - canvas.height = relativeHeight; | ||
| 327 | - canvas.width = relativeWidth; | ||
| 328 | - canvas.style.left = '0px'; | ||
| 329 | - canvas.style.top = '0px'; | ||
| 330 | - canvas.style.position = "absolute"; | ||
| 331 | - | ||
| 332 | - $("#canvasDiv").append(canvas); | ||
| 333 | - scope.context = canvas.getContext("2d") | ||
| 334 | - $("#modItemImage").attr('src', scope.OpenItemImagePath); | ||
| 335 | - scope.isSliderChange = true; | ||
| 336 | - var btnID = ''; | ||
| 337 | - $("div.tools div:eq(1) div").each(function () { | ||
| 338 | - if ($(this).find("button").hasClass("btn-primary")) { | ||
| 339 | - btnID = $(this).find("button").attr("id"); | ||
| 340 | - $('#' + btnID).removeClass("btn-black"); | ||
| 341 | - $('#' + btnID).addClass("btn-primary"); | ||
| 342 | - } | ||
| 343 | - }); | ||
| 344 | - scope.isSelectedPinBtnClickedAftrSliderCange = true; | ||
| 345 | - switch (btnID) { | ||
| 346 | - | ||
| 347 | - case "hidePinBtn": | ||
| 348 | - break; | ||
| 349 | - case "allPinBtn": | ||
| 350 | - scope.showAllPins(); | ||
| 351 | - break; | ||
| 352 | - case "selectedPin": | ||
| 353 | - scope.showAllPins(); | ||
| 354 | - setTimeout(function () { | ||
| 355 | - console.log(scope.allPinDataArray); | ||
| 356 | - scope.activePinOnSliderChange(); | ||
| 357 | - }, 1000); | ||
| 358 | - break; | ||
| 359 | - } | ||
| 360 | - } | ||
| 361 | - | ||
| 362 | - }); | ||
| 363 | - } | ||
| 364 | - }) | ||
| 365 | - .slider("pips", { | ||
| 366 | - rest: "label", | ||
| 367 | - step: "15" | ||
| 368 | - }); | ||
| 369 | - }, 500); | ||
| 370 | - } | ||
| 371 | - | ||
| 372 | - openedImage.onerror = loadFailure; | ||
| 373 | - openedImage.src = $rootScope.OpenItemImagePath; | ||
| 374 | - } | ||
| 375 | - | ||
| 376 | - } | ||
| 377 | - | ||
| 378 | - $scope.highlightBodySystemList = function () { | ||
| 379 | - $rootScope.bodySystemNames = $rootScope.bodySystemName.trim().split(/\s*,\s*/); | ||
| 380 | - var bodySystemListObj = document.getElementById("bodySystemList").getElementsByTagName("a"); | ||
| 381 | - var bodySystemListlength = bodySystemListObj.length; | ||
| 382 | - for (var i = 0; i < bodySystemListlength; i++) { | ||
| 383 | - //var boldTag = lis[i]; | ||
| 384 | - for (var j = 0; j < $rootScope.bodySystemNames.length; j++) { | ||
| 385 | - if ((bodySystemListObj[i].innerHTML) == ($rootScope.bodySystemNames[j])) { | ||
| 386 | - $("#" + i).parent().removeClass("disabledSelectedSystem"); | ||
| 387 | - | ||
| 388 | - } | ||
| 389 | - } | ||
| 390 | - | ||
| 391 | - } | ||
| 392 | - } | ||
| 393 | - function loadFailure() { | ||
| 394 | - console.log('unable to load opened module ietem'); | ||
| 395 | - return true; | ||
| 396 | - } | ||
| 397 | - | ||
| 398 | - | ||
| 399 | - angular.element(document).ready(function (e) { | ||
| 400 | - $("#ImagePanel").resize(function () { | ||
| 401 | - $("#canvasDiv").scrollLeft($rootScope.CanvasDivLeftPosition); | ||
| 402 | - $("#canvasDiv").scrollTop($rootScope.CanvasDivTopPosition); | ||
| 403 | - }); | ||
| 404 | - $(document).on("click", "#ImagePanel .jsPanel-hdr .jsPanel-hdr-r .jsPanel-btn-close .jsglyph-remove", function () { | ||
| 405 | - $scope.setActiveTab(parseInt($rootScope.getLocalStorageValue("activeTab"))); | ||
| 406 | - $(".tools").css("z-index", "15000"); | ||
| 407 | - $rootScope.selectedBodySystemName = 'All'; | ||
| 408 | - $rootScope.selectedBodySystemId = 0; | ||
| 409 | - $rootScope.searchSelectedText = ''; | ||
| 410 | - | ||
| 411 | - }); | ||
| 412 | - | ||
| 413 | - $(document).on("click", "#dvPrintPreview .jsPanel-hdr .jsPanel-hdr-r .jsPanel-btn-close .jsglyph-remove", function () { | ||
| 414 | - | ||
| 415 | - if ($rootScope.isShowAllPinBtnActiveInPrintPreviewMode == true) { | ||
| 416 | - $("#allPinBtn").trigger("click"); | ||
| 417 | - $rootScope.isShowAllPinBtnActiveInPrintPreviewMode = false; | ||
| 418 | - } | ||
| 419 | - if ($rootScope.isHidePinBtnActiveInPrintPreview == true) { | ||
| 420 | - $("#hidePinBtn").trigger("click"); | ||
| 421 | - $rootScope.isHidePinBtnActiveInPrintPreview = false; | ||
| 422 | - } | ||
| 423 | - if($rootScope.isShowSelectedPinActiveInPrintPrevMode == true) | ||
| 424 | - { | ||
| 425 | - $("#selectedPin").trigger("click"); | ||
| 426 | - $rootScope.isShowSelectedPinActiveInPrintPrevMode = false; | ||
| 427 | - } | ||
| 428 | - }); | ||
| 429 | - | ||
| 430 | - }) | ||
| 431 | - $rootScope.aaPinDataArray = []; | ||
| 432 | - $scope.showAllPins = function () { | ||
| 433 | - | ||
| 434 | - $scope.allPinDataArray = []; | ||
| 435 | - var promise = ModuleService.getPinDataForImage($rootScope.imageName) | ||
| 436 | - | ||
| 437 | - .then( | ||
| 438 | - function (result) { | ||
| 439 | - | ||
| 440 | - //load navigator image | ||
| 441 | - if (result.data.Root._NavigatorImage != undefined) { | ||
| 442 | - document.getElementById('navimg').src = '~/../content/images/aa/images/navigator/' + result.data.Root._NavigatorImage; | ||
| 443 | - } | ||
| 444 | - else { | ||
| 445 | - document.getElementById('navimg').style.visibility = 'hidden'; | ||
| 446 | - document.getElementById('navigatorBtn').style.visibility = 'hidden'; | ||
| 447 | - document.getElementById('navigatorDiv').style.visibility = 'hidden'; | ||
| 448 | - | ||
| 449 | - } | ||
| 450 | - | ||
| 451 | - //draw pins | ||
| 452 | - $scope.aaPinData = result.data.Root.Item; | ||
| 453 | - if ($scope.aaPinData != null && $scope.aaPinData.length > 0) { | ||
| 454 | - $rootScope.aaPinDataArray = $scope.aaPinData | ||
| 455 | - angular.forEach($scope.aaPinData, function (value, key) { | ||
| 456 | - $scope.allPinDataArray.push(value._PinId); | ||
| 457 | - $scope.drawStaticPinsOnImage('aaDetailViewCanvas', value._PinId, value._PinX, value._PinY, value._HeadX, value._HeadY) | ||
| 458 | - }) | ||
| 459 | - | ||
| 460 | - | ||
| 461 | - | ||
| 462 | - //load search/vocab data | ||
| 463 | - $rootScope.loadSearchData(); | ||
| 464 | - } | ||
| 465 | - }, | ||
| 466 | - function (error) { | ||
| 467 | - | ||
| 468 | - console.log(' error in showAllPins: ' + error.statusText); | ||
| 469 | - } | ||
| 470 | - ) | ||
| 471 | - if ($scope.isSliderChange == true) { | ||
| 472 | - $timeout(function () { | ||
| 473 | - $scope.activePinOnLayerChange(); | ||
| 474 | - }, 1000); | ||
| 475 | - | ||
| 476 | - } | ||
| 477 | - | ||
| 478 | - } | ||
| 479 | - | ||
| 480 | - | ||
| 481 | - $scope.FilterByImage = function (moduleId, query) { | ||
| 482 | - $scope.moduleId = moduleId; | ||
| 483 | - $scope.filterstring = true; | ||
| 484 | - | ||
| 485 | - console.log('loadForModuleById is called'); | ||
| 486 | - | ||
| 487 | - $rootScope.moduleName = Modules[moduleId].Name; | ||
| 488 | - while ($scope.searchAAListViewData.length) { | ||
| 489 | - $scope.searchAAListViewData.pop(); | ||
| 490 | - } | ||
| 491 | - | ||
| 492 | - var filtercount = 0; | ||
| 493 | - if (typeof (query.selectedbodyregion) !== "undefined" && (query.selectedbodyregion !== null && query.selectedbodyregion !== "")) { | ||
| 494 | - filtercount = filtercount + 1; | ||
| 495 | - localStorage.setItem("CurrentBodyRegion", query.selectedbodyregion); | ||
| 496 | - } | ||
| 497 | - else { | ||
| 498 | - localStorage.setItem("CurrentBodyRegion", ''); | ||
| 499 | - } | ||
| 500 | - | ||
| 501 | - if (typeof (query.selectedbodysystem) !== "undefined" && (query.selectedbodysystem !== null && query.selectedbodysystem !== "")) { | ||
| 502 | - filtercount = filtercount + 1; | ||
| 503 | - localStorage.setItem("CurrentBodySystem", query.selectedbodysystem); | ||
| 504 | - } | ||
| 505 | - else { | ||
| 506 | - localStorage.setItem("CurrentBodySystem", ''); | ||
| 507 | - } | ||
| 508 | - | ||
| 509 | - if (typeof (query.selectedorientation) !== "undefined" && (query.selectedorientation !== null && query.selectedorientation !== '')) { | ||
| 510 | - filtercount = filtercount + 1; | ||
| 511 | - localStorage.setItem("CurrentOrientation", query.selectedorientation); | ||
| 512 | - } | ||
| 513 | - else { | ||
| 514 | - localStorage.setItem("CurrentOrientation", ''); | ||
| 515 | - } | ||
| 516 | - | ||
| 517 | - if (typeof (query.selectedimagetype) !== "undefined" && (query.selectedimagetype !== null && query.selectedimagetype !== '')) { | ||
| 518 | - filtercount = filtercount + 1; | ||
| 519 | - localStorage.setItem("CurrentImageType", query.selectedimagetype); | ||
| 520 | - } | ||
| 521 | - else { | ||
| 522 | - localStorage.setItem("CurrentImageType", ''); | ||
| 523 | - } | ||
| 524 | - | ||
| 525 | - var promise = ModuleService.loadModuleDataBasedOnModuleName($scope.moduleName) | ||
| 526 | - .then( | ||
| 527 | - function (result) { | ||
| 528 | - // alert(JSON.stringify($scope.moduleLandingData)); | ||
| 529 | - $scope.moduleLandingData = result; | ||
| 530 | - $scope.selectedAAListViewData = new jinqJs() | ||
| 531 | - .from($scope.moduleLandingData.data.root.Item) | ||
| 532 | - .orderBy([{ field: '_Title', sort: 'asc' }]) | ||
| 533 | - .select(); | ||
| 534 | - | ||
| 535 | - $('#grid-view').empty(); | ||
| 536 | - //alert(JSON.stringify($scope.selectedAAListViewData)) | ||
| 537 | - angular.forEach($scope.selectedAAListViewData, function (value, key) { | ||
| 538 | - | ||
| 539 | - var selectimg = true; | ||
| 540 | - var count = 0; | ||
| 541 | - | ||
| 542 | - | ||
| 543 | - if (typeof (query.selectedbodyregion) !== "undefined" && (query.selectedbodyregion !== null && query.selectedbodyregion !== "")) { | ||
| 544 | - var posbodyregion = value._BodyRegion.indexOf((query.selectedbodyregion.trim())); | ||
| 545 | - if (posbodyregion > -1) { | ||
| 546 | - selectimg = true; | ||
| 547 | - count = count + 1; | ||
| 548 | - } | ||
| 549 | - else { | ||
| 550 | - selectimg = false; | ||
| 551 | - count = count - 1; | ||
| 552 | - } | ||
| 553 | - | ||
| 554 | - } | ||
| 555 | - | ||
| 556 | - if (typeof (query.selectedbodysystem) !== "undefined" && (query.selectedbodysystem !== null && query.selectedbodysystem !== "")) { | ||
| 557 | - var posbodysystem = value._BodySystem.indexOf(query.selectedbodysystem); | ||
| 558 | - if (posbodysystem > -1) { | ||
| 559 | - count = count + 1; | ||
| 560 | - selectimg = true; | ||
| 561 | - } else { | ||
| 562 | - selectimg = false; | ||
| 563 | - count = count - 1; | ||
| 564 | - } | ||
| 565 | - } | ||
| 566 | - | ||
| 567 | - if (typeof (query.selectedorientation) !== "undefined" && (query.selectedorientation !== null && query.selectedorientation !== "")) { | ||
| 568 | - var posorientation = value._ViewOrientation.indexOf(query.selectedorientation); | ||
| 569 | - if (posorientation > -1) { | ||
| 570 | - count = count + 1; | ||
| 571 | - selectimg = true; | ||
| 572 | - | ||
| 573 | - } else { | ||
| 574 | - selectimg = false; | ||
| 575 | - count = count - 1; | ||
| 576 | - } | ||
| 577 | - | ||
| 578 | - } | ||
| 579 | - | ||
| 580 | - if (typeof (query.selectedimagetype) !== "undefined" && (query.selectedimagetype !== null && query.selectedimagetype !== "")) { | ||
| 581 | - var posimagetype = value._ImageType.indexOf(query.selectedimagetype); | ||
| 582 | - if (posimagetype > -1) { | ||
| 583 | - count = count + 1; | ||
| 584 | - selectimg = true; | ||
| 585 | - | ||
| 586 | - } else { | ||
| 587 | - selectimg = false; | ||
| 588 | - count = count - 1; | ||
| 589 | - } | ||
| 590 | - | ||
| 591 | - } | ||
| 592 | - | ||
| 593 | - if (selectimg === true && count >= filtercount) { | ||
| 594 | - | ||
| 595 | - $scope.imagePath = "../content/images/aa/thumbnails/" + value._TileImageName; | ||
| 596 | - | ||
| 597 | - | ||
| 598 | - var $el = $('<div id="' + value._Title + '" class="col-sm-3 col-lg-2" title = "' + value._Title + '" data-ng-click="openModuleItemView($event)">' | ||
| 599 | - + '<div class="thumbnail" ><a href="#">' | ||
| 600 | - + '<img class="tinyImg" id="' + value._Title + '"ng-src="' + $scope.imagePath + '" alt="" title="" >' | ||
| 601 | - + '<div class="caption"><p>' + value._Title + '</p></div></a></div></div>').appendTo('#grid-view'); | ||
| 602 | - | ||
| 603 | - | ||
| 604 | - $compile($el)($scope); | ||
| 605 | - | ||
| 606 | - $(".sidebar").mCustomScrollbar({ | ||
| 607 | - autoHideScrollbar: true, | ||
| 608 | - //theme:"rounded" | ||
| 609 | - }); | ||
| 610 | - | ||
| 611 | - | ||
| 612 | - $scope.searchAAListViewData.push( | ||
| 613 | - { | ||
| 614 | - "_Id": value._Id, | ||
| 615 | - "_ImageId": value._ImageId, | ||
| 616 | - "_Title": value._Title, | ||
| 617 | - "_ImageName": value._contentImage, | ||
| 618 | - "_TileImageName": value._ThumbnailImage, | ||
| 619 | - "_BodySystem": value._BodySystem, | ||
| 620 | - "_BodyRegion": value._BodyRegion, | ||
| 621 | - "_ViewOrientation": value._ViewOrientation, | ||
| 622 | - "_ImageType": value._ImageType | ||
| 623 | - //"$$hashKey": value._Summary | ||
| 624 | - | ||
| 625 | - }); | ||
| 626 | - console.log($scope.searchAAListViewData); | ||
| 627 | - if ($('#searchItem').length > 0) | ||
| 628 | - $('#searchItem').remove(); | ||
| 629 | - } | ||
| 630 | - }); | ||
| 631 | - | ||
| 632 | - //Show Error Message in case of gridview/ ListView [if no data is found] | ||
| 633 | - if ($scope.searchAAListViewData.length == 0) { | ||
| 634 | - var $el = $('<div class="col-sm-12" style="padding-left:25px;padding-top:10px;"><strong style="color:white">No illustration found for the selected search criteria!</strong></div>').appendTo('#grid-view'); | ||
| 635 | - $compile($el)($scope); | ||
| 636 | - $('table > #ListViewDiv > #searchItem').remove(); | ||
| 637 | - | ||
| 638 | - $('#ListViewDiv').append('<tr id="searchItem"><td colspan="6"><strong style="color:black;">No illustration found for the selected search criteria!</strong></td></tr>'); | ||
| 639 | - } | ||
| 640 | - //console.log(JSON.stringify(result, null, 4)); | ||
| 641 | - console.log('SearchAAListViewData--' + $scope.searchAAListViewData); | ||
| 642 | - }, | ||
| 643 | - function (error) { | ||
| 644 | - // handle errors here | ||
| 645 | - console.log(' error: ' + error.statusText); | ||
| 646 | - } | ||
| 647 | - ) | ||
| 648 | - } | ||
| 649 | - | ||
| 650 | - $scope.Reset = function (moduleId, query) { | ||
| 651 | - | ||
| 652 | - query.selectedbodyregion = ""; | ||
| 653 | - query.selectedbodysystem = ""; | ||
| 654 | - query.selectedorientation = ""; | ||
| 655 | - query.selectedimagetype = ""; | ||
| 656 | - query.selectedspecialty = ""; | ||
| 657 | - | ||
| 658 | - | ||
| 659 | - //set localstorage values | ||
| 660 | - localStorage.setItem("CurrentBodyRegion", ''); | ||
| 661 | - localStorage.setItem("CurrentBodySystem", ''); | ||
| 662 | - localStorage.setItem("CurrentOrientation", ''); | ||
| 663 | - localStorage.setItem("CurrentImageType", ''); | ||
| 664 | - //localStorage.setItem("CISelectedRowId", ""); | ||
| 665 | - //localStorage.setItem("CIListViewScroll", ''); | ||
| 666 | - | ||
| 667 | - if ($('.selected').hasClass("selected")) { $('.selected').removeClass("selected"); } | ||
| 668 | - | ||
| 669 | - $('#ListViewDiv').scrollTop(0); | ||
| 670 | - | ||
| 671 | - if ($('#demoView').length > 0) | ||
| 672 | - $('#demoView').remove(); | ||
| 673 | - // $scope.HideListViewDiv(); | ||
| 674 | - | ||
| 675 | - $scope.filterstring = false; | ||
| 676 | - //while ($scope.searchCIListViewData.length) { | ||
| 677 | - // $scope.searchCIListViewData.pop(); | ||
| 678 | - //} | ||
| 679 | - | ||
| 680 | - $scope.FilterByImage(1, query); | ||
| 681 | - | ||
| 682 | - } | ||
| 683 | - | ||
| 684 | - $scope.showSelectedSystemPins = function (event) { | ||
| 685 | - var bodySystemListObj = document.getElementById("bodySystemList").getElementsByTagName("a"); | ||
| 686 | - var bodySystemListlength = bodySystemListObj.length; | ||
| 687 | - for (var i = 0; i < bodySystemListlength; i++) { | ||
| 688 | - | ||
| 689 | - $("#" + i).parent().removeClass("activeAASystemSelect"); | ||
| 690 | - } | ||
| 691 | - $("#" + event.currentTarget.id).parent().addClass("activeAASystemSelect"); | ||
| 692 | - | ||
| 693 | - $rootScope.isLoading = true; | ||
| 694 | - $('#spinner').css('visibility', 'visible'); | ||
| 695 | - | ||
| 696 | - $scope.removeSpeechBubble(); | ||
| 697 | - if (event.currentTarget.id == "0") { | ||
| 698 | - | ||
| 699 | - $scope.selectedSystemName = null; | ||
| 700 | - if ($scope.isHidePinBtnClicked) { | ||
| 701 | - | ||
| 702 | - // $scope.showAllPinsAfterHide($scope.aaPinData); | ||
| 703 | - $scope.showAllPinsAfterHide(); | ||
| 704 | - } | ||
| 705 | - else { | ||
| 706 | - $scope.showAllPins(); | ||
| 707 | - } | ||
| 708 | - } | ||
| 709 | - else { | ||
| 710 | - | ||
| 711 | - $scope.selectedSystemName = event.currentTarget.title; | ||
| 712 | - // get termText info | ||
| 713 | - var promise = ModuleService.getTermTextDataForPin($scope.moduleName) | ||
| 714 | - .then( | ||
| 715 | - function (response) { | ||
| 716 | - | ||
| 717 | - $scope.TermInfo = response.data.Terms.Term; | ||
| 718 | - | ||
| 719 | - //on gettng all required data, draw pins | ||
| 720 | - if ($scope.aaPinData != null && $scope.aaPinData.length > 0) { | ||
| 721 | - | ||
| 722 | - $scope.selectedSystemPinData = new jinqJs() | ||
| 723 | - .from($scope.aaPinData) | ||
| 724 | - .where("_BodySystemName == " + $scope.selectedSystemName) | ||
| 725 | - .select(); | ||
| 726 | - if ($scope.isHidePinBtnClicked) { | ||
| 727 | - // $scope.showAllPinsAfterHide($scope.selectedSystemPinData); | ||
| 728 | - $scope.showAllPinsAfterHide(); | ||
| 729 | - | ||
| 730 | - } | ||
| 731 | - else { | ||
| 732 | - //remove other system pins | ||
| 733 | - if ($scope.selectedSystemPinData != null && $scope.selectedSystemPinData.length > 0) { | ||
| 734 | - | ||
| 735 | - angular.forEach($scope.aaPinData, function (aaPinDataValue, aaPinDataKey) { | ||
| 736 | - | ||
| 737 | - if (aaPinDataValue._BodySystemName != $scope.selectedSystemName) | ||
| 738 | - $scope.removePin('aaDetailViewCanvas', aaPinDataValue._PinId); | ||
| 739 | - }) | ||
| 740 | - | ||
| 741 | - angular.forEach($scope.selectedSystemPinData, function (value, key) { | ||
| 742 | - | ||
| 743 | - | ||
| 744 | - $scope.drawStaticPinsOnImage('aaDetailViewCanvas', value._PinId, value._PinX, value._PinY, value._HeadX, value._HeadY) | ||
| 745 | - | ||
| 746 | - }) | ||
| 747 | - //show annotation on first pin of the sysyem | ||
| 748 | - $scope.showAnnotation($scope.selectedSystemPinData, false, false, false); | ||
| 749 | - } | ||
| 750 | - } | ||
| 751 | - } | ||
| 752 | - }, | ||
| 753 | - function (error) { | ||
| 754 | - // handle errors here | ||
| 755 | - console.log(' error: ' + error.statusText); | ||
| 756 | - } | ||
| 757 | - ) | ||
| 758 | - | ||
| 759 | - } | ||
| 760 | - } | ||
| 761 | - | ||
| 762 | - $scope.showAnnotation = function (selectedPinData, isCtrlPressed, isPinClicked, isItemSearched) { | ||
| 763 | - $scope.clickedPins = []; | ||
| 764 | - $scope.selectedPin = []; | ||
| 765 | - var isSameTermWithMultiPin = false; | ||
| 766 | - var firstPinId = selectedPinData[0]._PinId; | ||
| 767 | - var pinTermNumber = selectedPinData[0]._TermId; | ||
| 768 | - | ||
| 769 | - //check if other pin have same termNumber | ||
| 770 | - if ($scope.aaPinData != null && $scope.aaPinData.length > 0) { | ||
| 771 | - | ||
| 772 | - var pinDataWithFirstTermNumber = new jinqJs() | ||
| 773 | - .from($scope.aaPinData) | ||
| 774 | - .where("_TermId == " + pinTermNumber) | ||
| 775 | - .select(); | ||
| 776 | - | ||
| 777 | - $scope.MultiLanguageAnnationArray = []; | ||
| 778 | - | ||
| 779 | - $scope.GetAnnotationBasedOnActualTermNo(pinTermNumber); | ||
| 780 | - | ||
| 781 | - if (isCtrlPressed) { | ||
| 782 | - | ||
| 783 | - } | ||
| 784 | - else { | ||
| 785 | - if (isPinClicked || isItemSearched) { | ||
| 786 | - var existingSpeechBubble = $("div[id*='speechBubble']"); | ||
| 787 | - for (var i = 0; i < existingSpeechBubble.length; i++) { | ||
| 788 | - existingSpeechBubble[i].parentNode.removeChild(existingSpeechBubble[i]); | ||
| 789 | - | ||
| 790 | - //make all pin heads grey | ||
| 791 | - var radial = $('#aaDetailViewCanvas').createGradient({ | ||
| 792 | - x1: 50, y1: 50, | ||
| 793 | - x2: 50, y2: 50, | ||
| 794 | - r1: 10, r2: 30, | ||
| 795 | - c1: 'rgba(100, 50, 0,0)', | ||
| 796 | - c2: 'rgb(216, 216, 216)' | ||
| 797 | - }); | ||
| 798 | - | ||
| 799 | - | ||
| 800 | - $('#aaDetailViewCanvas').setLayers({ | ||
| 801 | - fillStyle: radial, | ||
| 802 | - }).drawLayers(); | ||
| 803 | - } | ||
| 804 | - | ||
| 805 | - var existingSpeechBubbleLine = $("div[id*='speechBubbleLine']"); | ||
| 806 | - for (var i = 0; i < existingSpeechBubbleLine.length; i++) { | ||
| 807 | - existingSpeechBubbleLine[i].parentNode.removeChild(existingSpeechBubbleLine[i]); | ||
| 808 | - } | ||
| 809 | - var speechBubbleDraggedLine = $("div[id*='speechBubbleDraggedLine']"); | ||
| 810 | - for (var i = 0; i < speechBubbleDraggedLine.length; i++) { | ||
| 811 | - speechBubbleDraggedLine[i].parentNode.removeChild(speechBubbleDraggedLine[i]); | ||
| 812 | - } | ||
| 813 | - } | ||
| 814 | - } | ||
| 815 | - if (pinDataWithFirstTermNumber.length > 1) { | ||
| 816 | - isSameTermWithMultiPin = true; | ||
| 817 | - } | ||
| 818 | - | ||
| 819 | - angular.forEach(pinDataWithFirstTermNumber, function (value, key) { | ||
| 820 | - $scope.selectedPin.push(value._PinId); | ||
| 821 | - $scope.clickedPins.push({ 'id': value._PinId }); | ||
| 822 | - var headX = (parseInt(value._HeadX)); | ||
| 823 | - var headY = (parseInt(value._HeadY)); | ||
| 824 | - $scope.createSpeechBubble(parseInt(headX) + 10, parseInt(headY) + 10, value._PinId, isCtrlPressed, isPinClicked, isSameTermWithMultiPin); | ||
| 825 | - }) | ||
| 826 | - | ||
| 827 | - } | ||
| 828 | - | ||
| 829 | - $rootScope.isLoading = false; | ||
| 830 | - $('#spinner').css('visibility', 'hidden'); | ||
| 831 | - // $scope.MultiLanguageAnnationArray.push($rootScope.annotationText[i]) | ||
| 832 | - } | ||
| 833 | - | ||
| 834 | - $scope.removeSpeechBubble = function () { | ||
| 835 | - | ||
| 836 | - | ||
| 837 | - //clear speech bubbles | ||
| 838 | - var speechBubbles = $("div[id*='speechBubble']"); | ||
| 839 | - if (speechBubbles != null || speechBubbles != undefined && speechBubbles.length > 0) { | ||
| 840 | - for (var j = 0; j < speechBubbles.length; j++) { | ||
| 841 | - | ||
| 842 | - speechBubbles[j].parentNode.removeChild(speechBubbles[j]); | ||
| 843 | - } | ||
| 844 | - } | ||
| 845 | - var speechBubbleLines = $("div[id*='speechBubbleLine']"); | ||
| 846 | - if (speechBubbleLines != null || speechBubbleLines != undefined && speechBubbleLines.length > 0) { | ||
| 847 | - for (var j = 0; j < speechBubbleLines.length; j++) { | ||
| 848 | - | ||
| 849 | - speechBubbleLines[j].parentNode.removeChild(speechBubbleLines[j]); | ||
| 850 | - } | ||
| 851 | - } | ||
| 852 | - | ||
| 853 | - var speechBubbleDraggedLines = $("div[id*='speechBubbleDraggedLine']"); | ||
| 854 | - if (speechBubbleDraggedLines != null || speechBubbleDraggedLines != undefined && speechBubbleDraggedLines.length > 0) { | ||
| 855 | - for (var j = 0; j < speechBubbleDraggedLines.length; j++) { | ||
| 856 | - | ||
| 857 | - speechBubbleDraggedLines[j].parentNode.removeChild(speechBubbleDraggedLines[j]); | ||
| 858 | - } | ||
| 859 | - } | ||
| 860 | - }; | ||
| 861 | - | ||
| 862 | - $scope.showSpeechBubble = function () { | ||
| 863 | - | ||
| 864 | - | ||
| 865 | - //clear speech bubbles | ||
| 866 | - var speechBubbles = $("div[id*='speechBubble']"); | ||
| 867 | - if (speechBubbles != null || speechBubbles != undefined && speechBubbles.length > 0) { | ||
| 868 | - for (var j = 0; j < speechBubbles.length; j++) { | ||
| 869 | - | ||
| 870 | - document.getElementById(speechBubbles[j].id).style.visibility = 'visible'; | ||
| 871 | - } | ||
| 872 | - } | ||
| 873 | - var speechBubbleLines = $("div[id*='speechBubbleLine']"); | ||
| 874 | - if (speechBubbleLines != null || speechBubbleLines != undefined && speechBubbleLines.length > 0) { | ||
| 875 | - for (var j = 0; j < speechBubbleLines.length; j++) { | ||
| 876 | - | ||
| 877 | - document.getElementById(speechBubbleLines[j].id).style.visibility = 'visible'; | ||
| 878 | - } | ||
| 879 | - } | ||
| 880 | - | ||
| 881 | - var speechBubbleDraggedLines = $("div[id*='speechBubbleDraggedLine']"); | ||
| 882 | - if (speechBubbleDraggedLines != null || speechBubbleDraggedLines != undefined && speechBubbleDraggedLines.length > 0) { | ||
| 883 | - for (var j = 0; j < speechBubbleDraggedLines.length; j++) { | ||
| 884 | - | ||
| 885 | - document.getElementById(speechBubbleDraggedLines[j].id).style.visibility = 'visible'; | ||
| 886 | - } | ||
| 887 | - } | ||
| 888 | - }; | ||
| 889 | - | ||
| 890 | - $scope.hideSpeechBubble = function () { | ||
| 891 | - | ||
| 892 | - | ||
| 893 | - //clear speech bubbles | ||
| 894 | - var speechBubbles = $("div[id*='speechBubble']"); | ||
| 895 | - if (speechBubbles != null || speechBubbles != undefined && speechBubbles.length > 0) { | ||
| 896 | - for (var j = 0; j < speechBubbles.length; j++) { | ||
| 897 | - | ||
| 898 | - document.getElementById(speechBubbles[j].id).style.visibility = 'hidden'; | ||
| 899 | - } | ||
| 900 | - } | ||
| 901 | - var speechBubbleLines = $("div[id*='speechBubbleLine']"); | ||
| 902 | - if (speechBubbleLines != null || speechBubbleLines != undefined && speechBubbleLines.length > 0) { | ||
| 903 | - for (var j = 0; j < speechBubbleLines.length; j++) { | ||
| 904 | - | ||
| 905 | - document.getElementById(speechBubbleLines[j].id).style.visibility = 'hidden'; | ||
| 906 | - } | ||
| 907 | - } | ||
| 908 | - | ||
| 909 | - var speechBubbleDraggedLines = $("div[id*='speechBubbleDraggedLine']"); | ||
| 910 | - if (speechBubbleDraggedLines != null || speechBubbleDraggedLines != undefined && speechBubbleDraggedLines.length > 0) { | ||
| 911 | - for (var j = 0; j < speechBubbleDraggedLines.length; j++) { | ||
| 912 | - | ||
| 913 | - document.getElementById(speechBubbleDraggedLines[j].id).style.visibility = 'hidden'; | ||
| 914 | - } | ||
| 915 | - } | ||
| 916 | - }; | ||
| 917 | - | ||
| 918 | - | ||
| 919 | - $scope.createSpeechBubble = function (x, y, PinId, isCtrlPressed, isPinClicked, isSameTermWithMultiPin) { | ||
| 920 | - | ||
| 921 | - $scope.longestAnnotation = $scope.MultiLanguageAnnationArray.reduce(function (firstAnnotation, seconAnnotation) { return firstAnnotation.length > seconAnnotation.length ? firstAnnotation : seconAnnotation; }); | ||
| 922 | - | ||
| 923 | - $scope.createSpeechBubbleBasedOnAnnotationLength(x, y, PinId); | ||
| 924 | - | ||
| 925 | - $('#speechBubble').draggable( | ||
| 926 | - { | ||
| 927 | - drag: function (evt) { | ||
| 928 | - $("#dot").css("visibility", "hidden"); | ||
| 929 | - var verticalScrollPosition = canvasDiv.scrollTop; | ||
| 930 | - var horizontlScrollPosition = canvasDiv.scrollLeft; | ||
| 931 | - $scope.angle(x * $scope.sliderPercentValue, y * $scope.sliderPercentValue, evt.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left, evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top, true); | ||
| 932 | - }, | ||
| 933 | - }); | ||
| 934 | - | ||
| 935 | - } | ||
| 936 | - $scope.sliderVal = 100; | ||
| 937 | - $scope.createSpeechBubbleBasedOnAnnotationLength = function (x, y, PinId) { | ||
| 938 | - | ||
| 939 | - x = x * $scope.sliderPercentValue; | ||
| 940 | - y = y * $scope.sliderPercentValue; | ||
| 941 | - | ||
| 942 | - 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>' | ||
| 943 | - + '<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;">' | ||
| 944 | - + '<span style="position:absolute;right:-3px;top:-4px;color:#ffffff;cursor:pointer;">' | ||
| 945 | - + '<img id="closeBtn' + PinId + ' " class="crossDiv_temp" style="width:18px" src=' + $rootScope.closeBtnImgPath + '></span></div>' | ||
| 946 | - | ||
| 947 | - + '<div style="position:absolute;border:1px solid #000;display:none;z-index:12000;" id="speechBubbleDraggedLine' + PinId + '">' | ||
| 948 | - + '</div>'; | ||
| 949 | - | ||
| 950 | - //Issue #7286 :Undefined annotation should not appear | ||
| 951 | - for (var i = 0; i <= $scope.MultiLanguageAnnationArray.length - 1; i++) { | ||
| 952 | - var MultipleLanguage = $scope.MultiLanguageAnnationArray[i]; | ||
| 953 | - } | ||
| 954 | - | ||
| 955 | - if (MultipleLanguage == undefined) { | ||
| 956 | - console.log("No text is found"); | ||
| 957 | - } else { | ||
| 958 | - $('#canvasDiv').append(speechBubbleHTML); | ||
| 959 | - | ||
| 960 | - if ($scope.MultiLanguageAnnationArray.length > 0) { | ||
| 961 | - for (var i = 0; i <= $scope.MultiLanguageAnnationArray.length - 1; i++) { | ||
| 962 | - var MultipleLanguage = $scope.MultiLanguageAnnationArray[i]; | ||
| 963 | - $rootScope.clickedPinAnnotation = $scope.MultiLanguageAnnationArray[0]; | ||
| 964 | - $("#speechBubble" + PinId).append("<p style='margin-bottom:2px;'>" + MultipleLanguage + "</p>"); | ||
| 965 | - } | ||
| 966 | - } | ||
| 967 | - else { | ||
| 968 | - console.log('MultiLanguageAnnationArray.length is :' + $scope.MultiLanguageAnnationArray.length) | ||
| 969 | - } | ||
| 970 | - | ||
| 971 | - | ||
| 972 | - | ||
| 973 | - | ||
| 974 | - | ||
| 975 | - if ($scope.longestAnnotation != null || $scope.longestAnnotation != undefined) { | ||
| 976 | - if ($scope.longestAnnotation.length <= 10) { | ||
| 977 | - | ||
| 978 | - | ||
| 979 | - $("#speechBubble").css("width", "100px"); | ||
| 980 | - | ||
| 981 | - } | ||
| 982 | - | ||
| 983 | - else if ($scope.longestAnnotation.length > 10 && $scope.longestAnnotation.length <= 17) { | ||
| 984 | - | ||
| 985 | - | ||
| 986 | - | ||
| 987 | - $("#speechBubble").css("width", "140px"); | ||
| 988 | - | ||
| 989 | - } | ||
| 990 | - else if ($scope.longestAnnotation.length > 17 && $scope.longestAnnotation.length <= 26) { | ||
| 991 | - | ||
| 992 | - | ||
| 993 | - $("#speechBubble").css("width", "195px"); | ||
| 994 | - | ||
| 995 | - } | ||
| 996 | - else if ($scope.longestAnnotation.length > 26 && $scope.longestAnnotation.length <= 34) { | ||
| 997 | - | ||
| 998 | - $("#speechBubble").css("width", "248px"); | ||
| 999 | - | ||
| 1000 | - } | ||
| 1001 | - else if ($scope.longestAnnotation.length > 34 && $scope.longestAnnotation.length <= 44) { | ||
| 1002 | - | ||
| 1003 | - | ||
| 1004 | - $("#speechBubble").css("width", "300px"); | ||
| 1005 | - } | ||
| 1006 | - | ||
| 1007 | - else if ($scope.longestAnnotation.length > 44 && $scope.longestAnnotation.length <= 54) { | ||
| 1008 | - | ||
| 1009 | - $("#speechBubble").css("width", "370px"); | ||
| 1010 | - } | ||
| 1011 | - | ||
| 1012 | - else if ($scope.longestAnnotation.length > 54 && $scope.longestAnnotation.length <= 69) { | ||
| 1013 | - $("#speechBubble").css("width", "450px"); | ||
| 1014 | - } | ||
| 1015 | - else if ($scope.longestAnnotation.length > 69 && $scope.longestAnnotation.length <= 75) { | ||
| 1016 | - $("#speechBubble").css("width", "510px"); | ||
| 1017 | - } | ||
| 1018 | - else { | ||
| 1019 | - $("#speechBubble").css("width", ($scope.longestAnnotation.length) + "%"); | ||
| 1020 | - } | ||
| 1021 | - } | ||
| 1022 | - } | ||
| 1023 | - var speechBubbleDims = []; | ||
| 1024 | - | ||
| 1025 | - $rootScope.speechBubbleDimaensions.push({ "currentX": x, "currentY": y, "id": PinId }); | ||
| 1026 | - speechBubbleDims.push({ currentX: x, currentY: y }); | ||
| 1027 | - document.getElementById('speechBubbleLine' + PinId + '').style.display = 'block'; | ||
| 1028 | - document.getElementById('speechBubbleLine' + PinId + '').style.left = ((speechBubbleDims[0].currentX - 12)) + 'px'; | ||
| 1029 | - if ($scope.sliderVal == 25) { | ||
| 1030 | - document.getElementById('speechBubbleLine' + PinId + '').style.top = ((speechBubbleDims[0].currentY + 5)) + 'px'; | ||
| 1031 | - } | ||
| 1032 | - else { | ||
| 1033 | - document.getElementById('speechBubbleLine' + PinId + '').style.top = ((speechBubbleDims[0].currentY)) + 'px'; | ||
| 1034 | - } | ||
| 1035 | - document.getElementById('speechBubble' + PinId + '').style.display = 'block'; | ||
| 1036 | - document.getElementById('speechBubble' + PinId + '').style.left = (speechBubbleDims[0].currentX - 4) + 'px'; | ||
| 1037 | - document.getElementById('speechBubble' + PinId + '').style.top = (speechBubbleDims[0].currentY) + 'px'; | ||
| 1038 | - $('.common-drag').draggable( | ||
| 1039 | - { | ||
| 1040 | - | ||
| 1041 | - drag: function (evt) { | ||
| 1042 | - | ||
| 1043 | - var verticalScrollPosition = document.getElementById('canvasDiv').scrollTop; | ||
| 1044 | - var horizontlScrollPosition = document.getElementById('canvasDiv').scrollLeft; | ||
| 1045 | - var clickedSpeechBubbleId = $(this).attr("id"); | ||
| 1046 | - | ||
| 1047 | - var clickedPinId = clickedSpeechBubbleId.substring(12, clickedSpeechBubbleId.length); | ||
| 1048 | - | ||
| 1049 | - $("#speechBubbleLine" + clickedPinId).css("visibility", "hidden"); | ||
| 1050 | - $("#speechBubbleLine" + clickedPinId).css("display", "none"); | ||
| 1051 | - | ||
| 1052 | - for (var i = 0; i <= $rootScope.speechBubbleDimaensions.length - 1; i++) { | ||
| 1053 | - if ($rootScope.speechBubbleDimaensions[i].id == clickedPinId) { | ||
| 1054 | - $scope.angle(clickedPinId, $rootScope.speechBubbleDimaensions[i].currentX, $rootScope.speechBubbleDimaensions[i].currentY, evt.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left, evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top, true); | ||
| 1055 | - } | ||
| 1056 | - } | ||
| 1057 | - | ||
| 1058 | - }, | ||
| 1059 | - }); | ||
| 1060 | - $('.crossDiv_temp').on('click', function (evt) { | ||
| 1061 | - | ||
| 1062 | - var imgId = $(this).attr("id"); | ||
| 1063 | - var pinId = imgId.substring(8, imgId.length); | ||
| 1064 | - $('#speechBubble' + pinId).remove(); | ||
| 1065 | - $("#speechBubbleDraggedLine" + pinId).remove(); | ||
| 1066 | - $("#speechBubbleLine" + pinId).remove(); | ||
| 1067 | - | ||
| 1068 | - //make all pin heads grey | ||
| 1069 | - var pinHeadName = 'PinArc_' + pinId; | ||
| 1070 | - var radial = $('#aaDetailViewCanvas').createGradient({ | ||
| 1071 | - x1: 50, y1: 50, | ||
| 1072 | - x2: 50, y2: 50, | ||
| 1073 | - r1: 10, r2: 30, | ||
| 1074 | - c1: 'rgba(100, 50, 0,0)', | ||
| 1075 | - c2: 'rgb(216, 216, 216)' | ||
| 1076 | - }); | ||
| 1077 | - | ||
| 1078 | - | ||
| 1079 | - $('#aaDetailViewCanvas').setLayer(pinHeadName, { | ||
| 1080 | - fillStyle: radial, | ||
| 1081 | - }).drawLayers(); | ||
| 1082 | - }); | ||
| 1083 | - | ||
| 1084 | - //make the head green | ||
| 1085 | - var radialAfterClick = $('#aaDetailViewCanvas').createGradient({ | ||
| 1086 | - x1: 50, y1: 50, | ||
| 1087 | - x2: 50, y2: 50, | ||
| 1088 | - r1: 10, r2: 30, | ||
| 1089 | - c1: 'rgba(100, 50, 0,0)', | ||
| 1090 | - c2: 'rgb(126, 187, 83)' | ||
| 1091 | - }); | ||
| 1092 | - var pinHeadName = 'PinArc_' + PinId; | ||
| 1093 | - var pin = $('#aaDetailViewCanvas').getLayer(pinHeadName); | ||
| 1094 | - // pin.fillStyle = radialAfterClick; | ||
| 1095 | - | ||
| 1096 | - $('#aaDetailViewCanvas').setLayer(pinHeadName, { | ||
| 1097 | - fillStyle: radialAfterClick, | ||
| 1098 | - }).drawLayers(); | ||
| 1099 | - } | ||
| 1100 | - | ||
| 1101 | - | ||
| 1102 | - $scope.angle = function (id, cx, cy, ex, ey, BoolValues) { | ||
| 1103 | - | ||
| 1104 | - var dy = ey - cy; | ||
| 1105 | - var dx = ex - cx; | ||
| 1106 | - var theta = 0; | ||
| 1107 | - if (dx < 0) { | ||
| 1108 | - theta = Math.atan(dy / dx) * (180 / Math.PI); | ||
| 1109 | - theta = theta + 180; | ||
| 1110 | - | ||
| 1111 | - } | ||
| 1112 | - else if (dy < 0) { | ||
| 1113 | - theta = Math.atan(dy / dx) * (180 / Math.PI); | ||
| 1114 | - theta = theta + 360; | ||
| 1115 | - | ||
| 1116 | - } | ||
| 1117 | - else { | ||
| 1118 | - theta = Math.atan(dy / dx) * (180 / Math.PI); | ||
| 1119 | - } | ||
| 1120 | - | ||
| 1121 | - var d = Math.sqrt((cx - ex) * (cx - ex) + (cy - ey) * (cy - ey)); | ||
| 1122 | - var e = cy; | ||
| 1123 | - var f = cx; | ||
| 1124 | - | ||
| 1125 | - if (BoolValues == true) { | ||
| 1126 | - if ($scope.sliderVal == 40) { | ||
| 1127 | - $("#speechBubbleDraggedLine" + id).css({ 'display': 'block', 'width': d + 'px', 'top': (e - 5) + 'px', 'left': (f - 5) + 'px', 'transform': 'rotate(' + theta + 'deg)', '-moz-transform': 'rotate(' + theta + 'deg)', '-webkit-transform': 'rotate(' + theta + 'deg)', 'transform-origin': '0% 0%' }); | ||
| 1128 | - } | ||
| 1129 | - else if ($scope.sliderVal == 25) { | ||
| 1130 | - $("#speechBubbleDraggedLine" + id).css({ 'display': 'block', 'width': d + 'px', 'top': (e - 2) + 'px', 'left': (f - 2) + 'px', 'transform': 'rotate(' + theta + 'deg)', '-moz-transform': 'rotate(' + theta + 'deg)', '-webkit-transform': 'rotate(' + theta + 'deg)', 'transform-origin': '0% 0%' }); | ||
| 1131 | - } | ||
| 1132 | - else { | ||
| 1133 | - $("#speechBubbleDraggedLine" + id).css({ 'display': 'block', 'width': d + 'px', 'top': (e - 10) + 'px', 'left': (f - 5) + 'px', 'transform': 'rotate(' + theta + 'deg)', '-moz-transform': 'rotate(' + theta + 'deg)', '-webkit-transform': 'rotate(' + theta + 'deg)', 'transform-origin': '0% 0%' }); | ||
| 1134 | - } | ||
| 1135 | - | ||
| 1136 | - } | ||
| 1137 | - else { | ||
| 1138 | - $("#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%' }); | ||
| 1139 | - } | ||
| 1140 | - | ||
| 1141 | - | ||
| 1142 | - | ||
| 1143 | - } | ||
| 1144 | - | ||
| 1145 | - | ||
| 1146 | - $scope.drawStaticPinsOnImage = function (canvasId, PinId, offsetX1, offsetY1, x, y) { | ||
| 1147 | - $scope.clickedPins = []; | ||
| 1148 | - // if ($scope.isSliderChange == true) { | ||
| 1149 | - console.log('isSliderrChange') | ||
| 1150 | - var radial = $('#' + canvasId).createGradient({ | ||
| 1151 | - x1: 50, y1: 50, | ||
| 1152 | - x2: 50, y2: 50, | ||
| 1153 | - r1: 10, r2: 30, | ||
| 1154 | - c1: 'rgba(100, 50, 0,0)', | ||
| 1155 | - c2: 'rgb(216, 216, 216)' | ||
| 1156 | - }); | ||
| 1157 | - $('#' + canvasId).drawLine({ | ||
| 1158 | - layer: true, | ||
| 1159 | - name: "Pin_" + PinId, | ||
| 1160 | - groups: ["Pin_" + PinId], | ||
| 1161 | - strokeStyle: '#565656', | ||
| 1162 | - strokeWidth: 2, | ||
| 1163 | - visible: true, | ||
| 1164 | - x1: offsetX1 * $scope.sliderPercentValue, y1: offsetY1 * $scope.sliderPercentValue, | ||
| 1165 | - x2: x * $scope.sliderPercentValue, y2: y * $scope.sliderPercentValue, | ||
| 1166 | - | ||
| 1167 | - | ||
| 1168 | - }).drawArc({ | ||
| 1169 | - name: "PinArc_" + PinId, | ||
| 1170 | - layer: true, | ||
| 1171 | - groups: ["Pin_" + PinId], | ||
| 1172 | - strokeStyle: 'grey', | ||
| 1173 | - strokeWidth: 2, | ||
| 1174 | - visible: true, | ||
| 1175 | - fillStyle: radial, | ||
| 1176 | - x: x * $scope.sliderPercentValue, y: y * $scope.sliderPercentValue, | ||
| 1177 | - radius: 5 * $scope.sliderPercentValue, | ||
| 1178 | - | ||
| 1179 | - click: function (clickedPin) { | ||
| 1180 | - if (clickedPin.event.ctrlKey == false) { | ||
| 1181 | - $scope.clickedPins = []; | ||
| 1182 | - } | ||
| 1183 | - var pinID = (clickedPin.name).substring(7, (clickedPin.name).length); | ||
| 1184 | - var pinData = new jinqJs() | ||
| 1185 | - .from($scope.aaPinData) | ||
| 1186 | - .where("_PinId == " + pinID) | ||
| 1187 | - .select(); | ||
| 1188 | - | ||
| 1189 | - | ||
| 1190 | - var pinTermNumber = pinData[0]._TermId; | ||
| 1191 | - | ||
| 1192 | - var pinWithSameTerm = new jinqJs() | ||
| 1193 | - | ||
| 1194 | - .from($scope.aaPinData) | ||
| 1195 | - .where("_TermId == " + pinTermNumber) | ||
| 1196 | - .select(); | ||
| 1197 | - | ||
| 1198 | - | ||
| 1199 | - if (pinWithSameTerm != undefined && pinWithSameTerm != null && pinWithSameTerm.length > 0) { | ||
| 1200 | - | ||
| 1201 | - for (var i = 0; i < pinWithSameTerm.length; i++) { | ||
| 1202 | - | ||
| 1203 | - $scope.clickedPins.push({ 'id': pinWithSameTerm[i]._PinId }) | ||
| 1204 | - } | ||
| 1205 | - | ||
| 1206 | - } | ||
| 1207 | - $scope.isSelectedPinBtnClickedAftrSliderCange = false; | ||
| 1208 | - var selectedPinData = new jinqJs() | ||
| 1209 | - .from($scope.aaPinData) | ||
| 1210 | - .where("_PinId == " + pinID) | ||
| 1211 | - .select(); | ||
| 1212 | - if (clickedPin.event.ctrlKey == true) { | ||
| 1213 | - | ||
| 1214 | - $scope.activePinArray.push(clickedPin.name); | ||
| 1215 | - var radialAfterClick = $('#aaDetailViewCanvas').createGradient({ | ||
| 1216 | - x1: 50, y1: 50, | ||
| 1217 | - x2: 50, y2: 50, | ||
| 1218 | - r1: 10, r2: 30, | ||
| 1219 | - c1: 'rgba(100, 50, 0,0)', | ||
| 1220 | - c2: 'rgb(126, 187, 83)' | ||
| 1221 | - }); | ||
| 1222 | - clickedPin.fillStyle = radialAfterClick; | ||
| 1223 | - $scope.showAnnotation(selectedPinData, true, true, false); | ||
| 1224 | - } | ||
| 1225 | - else { | ||
| 1226 | - $scope.activePinArray = []; | ||
| 1227 | - $scope.activePinArray.push(clickedPin.name); | ||
| 1228 | - var radial = $('#aaDetailViewCanvas').createGradient({ | ||
| 1229 | - x1: 50, y1: 50, | ||
| 1230 | - x2: 50, y2: 50, | ||
| 1231 | - r1: 10, r2: 30, | ||
| 1232 | - c1: 'rgba(100, 50, 0,0)', | ||
| 1233 | - c2: 'rgb(216, 216, 216)' | ||
| 1234 | - }); | ||
| 1235 | - | ||
| 1236 | - | ||
| 1237 | - $('#aaDetailViewCanvas').setLayers({ | ||
| 1238 | - fillStyle: radial, | ||
| 1239 | - }).drawLayers(); | ||
| 1240 | - | ||
| 1241 | - //change the head color to green | ||
| 1242 | - var radialAfterClick = $('#aaDetailViewCanvas').createGradient({ | ||
| 1243 | - x1: 50, y1: 50, | ||
| 1244 | - x2: 50, y2: 50, | ||
| 1245 | - r1: 10, r2: 30, | ||
| 1246 | - c1: 'rgba(100, 50, 0,0)', | ||
| 1247 | - c2: 'rgb(126, 187, 83)' | ||
| 1248 | - }); | ||
| 1249 | - | ||
| 1250 | - clickedPin.fillStyle = radialAfterClick; | ||
| 1251 | - $scope.showAnnotation(selectedPinData, false, true, false); | ||
| 1252 | - | ||
| 1253 | - } | ||
| 1254 | - | ||
| 1255 | - } | ||
| 1256 | - | ||
| 1257 | - }).drawLayers(); | ||
| 1258 | - } | ||
| 1259 | - | ||
| 1260 | - | ||
| 1261 | - $scope.getMousePos = function (evt) { | ||
| 1262 | - | ||
| 1263 | - return { | ||
| 1264 | - x: Math.round(evt.pageX - $('#canvasDiv').offset().left), | ||
| 1265 | - y: Math.round(evt.pageY - $('#canvasDiv').offset().top) | ||
| 1266 | - } | ||
| 1267 | - } | ||
| 1268 | - | ||
| 1269 | - $scope.removePin = function (canvasId, pinId) { | ||
| 1270 | - | ||
| 1271 | - var pinName = 'Pin_' + pinId; | ||
| 1272 | - var pinArcName = 'PinArc_' + pinId; | ||
| 1273 | - $('#' + canvasId).removeLayer(pinName).drawLayers(); | ||
| 1274 | - $('#' + canvasId).removeLayer(pinArcName).drawLayers(); | ||
| 1275 | - | ||
| 1276 | - $scope.removeSpeechBubble(); | ||
| 1277 | - | ||
| 1278 | - //$rootScope.isSliderChanged = true; | ||
| 1279 | - //$('#aaDetailViewCanvas').removeLayers(); | ||
| 1280 | - } | ||
| 1281 | - | ||
| 1282 | - $rootScope.$on('annotationToolEvent', function (event, data) { | ||
| 1283 | - $('#editstylebackgroundcolor .minicolors >.minicolors-swatch > .minicolors-swatch-color').css("background-color", "rgb(255,255,255)") | ||
| 1284 | - $('#editstylebackgroundcolor .minicolors >.minicolors-panel > .minicolors-grid >.minicolors-picker').css({ "top": "145px", "left": "4px" }); | ||
| 1285 | - $('#outlineColor .minicolors >.minicolors-swatch > .minicolors-swatch-color').css("background-color", "rgb(0,0,0)") | ||
| 1286 | - $('#outlineColor .minicolors >.minicolors-panel > .minicolors-grid >.minicolors-picker').css({ "top": "145px", "left": "4px" }); | ||
| 1287 | - | ||
| 1288 | - $("#canvas").css("display", "block"); | ||
| 1289 | - $("#canvasPaint").css("display", "block"); | ||
| 1290 | - $rootScope.onDrawingCanvasClick(); | ||
| 1291 | - $rootScope.FreeStylePaint(); | ||
| 1292 | - }); | ||
| 1293 | - | ||
| 1294 | - $rootScope.loadSearchData = function () { | ||
| 1295 | - | ||
| 1296 | - //$("#termList").find("option").css({ "background-color": "#ffffff", "color": "#000000" }); | ||
| 1297 | - var imageId = $rootScope.imageId; | ||
| 1298 | - var promise = ModuleService.getTermTextDataForAAImage(imageId) | ||
| 1299 | - .then( | ||
| 1300 | - function (response) { | ||
| 1301 | - | ||
| 1302 | - $scope.AAPinTermData = response.data.PinTermData.TermData; | ||
| 1303 | - | ||
| 1304 | - $rootScope.isLoading = false; | ||
| 1305 | - $('#setting-spinner').css('visibility', 'hidden'); | ||
| 1306 | - | ||
| 1307 | - $scope.pinTermData = []; | ||
| 1308 | - var primaryLexicon = $rootScope.lexiconLanguageArray[0].id; | ||
| 1309 | - $scope.matchedLanguageTermData = new jinqJs() | ||
| 1310 | - .from($scope.AAPinTermData) | ||
| 1311 | - .where('_LanguageId == ' + primaryLexicon) | ||
| 1312 | - .select(); | ||
| 1313 | - var sortedTermTextArray = []; | ||
| 1314 | - for (var i = 0; i < $scope.matchedLanguageTermData.length; i++) { | ||
| 1315 | - sortedTermTextArray.push($scope.matchedLanguageTermData[i]._TermText); | ||
| 1316 | - sortedTermTextArray.sort(); | ||
| 1317 | - } | ||
| 1318 | - | ||
| 1319 | - for (var i = 0; i <= sortedTermTextArray.length - 1; i++) { | ||
| 1320 | - for (var j = 0; j <= $scope.matchedLanguageTermData.length - 1; j++) { | ||
| 1321 | - if ($scope.matchedLanguageTermData[j]._TermText == sortedTermTextArray[i]) { | ||
| 1322 | - $scope.pinTermData.push({ "LanguageId": $scope.matchedLanguageTermData[j]._LanguageId, "TermNumber": $scope.matchedLanguageTermData[j]._TermNumber, "TermTxt": $scope.matchedLanguageTermData[j]._TermText }); | ||
| 1323 | - break; | ||
| 1324 | - } | ||
| 1325 | - } | ||
| 1326 | - } | ||
| 1327 | - | ||
| 1328 | - | ||
| 1329 | - $scope.$watch('$scope.pinTermData', function (newValue, oldValue, scope) { | ||
| 1330 | - | ||
| 1331 | - if (($('#termlistfilter').html() != "")) | ||
| 1332 | - | ||
| 1333 | - $('#termlistfilter').empty(); | ||
| 1334 | - if ($scope.pinTermData.length > 0) { | ||
| 1335 | - $timeout(function () { | ||
| 1336 | - console.log('pinTermData= ' + $scope.pinTermData.length); | ||
| 1337 | - $('#termList').empty(); | ||
| 1338 | - $('#termlistfilter').empty(); | ||
| 1339 | - for (var j = 0; j < $scope.pinTermData.length; j++) { | ||
| 1340 | - var $el = $('<li><a id= "' + $scope.pinTermData[j].TermNumber + '" href="" onclick="onSearchItemSelection(this.id)" >' + $scope.pinTermData[j].TermTxt + '</a></li>').appendTo('#termlistfilter') | ||
| 1341 | - //var $el = $('<li><a id= "' + $scope.pinTermData[j].TermNumber + '" href="" >' + $scope.pinTermData[j].TermTxt + '</a></li>').appendTo('#termlistfilter') | ||
| 1342 | - $compile($el)($scope); | ||
| 1343 | - var $selectedOptions = $('<option title= "' + $scope.pinTermData[j].TermTxt + '" id= "' + $scope.pinTermData[j].TermNumber + '" >' + $scope.pinTermData[j].TermTxt + '</option>').appendTo("#termList") | ||
| 1344 | - | ||
| 1345 | - $compile($selectedOptions)($scope); | ||
| 1346 | - | ||
| 1347 | - $("#AABodySystems").empty(); | ||
| 1348 | - $("#bodySystems").css("display", "none"); | ||
| 1349 | - $("#AABodySystems").css("display", "block"); | ||
| 1350 | - $("#bodySystemList li a").each(function (key, value) { | ||
| 1351 | - var $systemOptions = $('<option id=' + $(this).attr('id') + ' >' + $(this).text() + '</option>').appendTo("#AABodySystems") | ||
| 1352 | - $compile($systemOptions)($scope); | ||
| 1353 | - }); | ||
| 1354 | - } | ||
| 1355 | - }, 500); | ||
| 1356 | - } | ||
| 1357 | - }) | ||
| 1358 | - }, | ||
| 1359 | - function (error) { | ||
| 1360 | - // handle errors here | ||
| 1361 | - console.log(' error: ' + error.statusText); | ||
| 1362 | - } | ||
| 1363 | - ) | ||
| 1364 | - } | ||
| 1365 | - | ||
| 1366 | - | ||
| 1367 | - | ||
| 1368 | - | ||
| 1369 | - $scope.$on('listManagerEvent', function (event, data) { | ||
| 1370 | - | ||
| 1371 | - $("#viewName").empty(); | ||
| 1372 | - | ||
| 1373 | - var currentView = $rootScope.getLocalStorageValue("currentViewTitle"); | ||
| 1374 | - var viewNmeHtml = '<option>' + currentView + '</option>' | ||
| 1375 | - $('#viewName').append(viewNmeHtml); | ||
| 1376 | - //$("#viewName").append("<option>" + $rootScope.listArray[0].text + "</option>"); | ||
| 1377 | - $rootScope.isLoading = false; | ||
| 1378 | - $('#spinner').css('visibility', 'hidden'); | ||
| 1379 | - | ||
| 1380 | - if ($rootScope.bodySystemSeletedId == null) { | ||
| 1381 | - | ||
| 1382 | - $rootScope.loadSearchData(); | ||
| 1383 | - } | ||
| 1384 | - else { | ||
| 1385 | - | ||
| 1386 | - $rootScope.refreshTermListOnAASystemSelection($rootScope.bodySystemSeletedId); | ||
| 1387 | - } | ||
| 1388 | - $timeout(function () { | ||
| 1389 | - $("#totalTerms").empty(); | ||
| 1390 | - $("#totalTerms").html("<span class='pull-left marginTop5'>" + $("#termList option").length + " Structures</span>"); | ||
| 1391 | - }, 1000); | ||
| 1392 | - }); | ||
| 1393 | - | ||
| 1394 | - | ||
| 1395 | - | ||
| 1396 | - $rootScope.refreshTermListOnAASystemSelection = function (bodySystemId) { | ||
| 1397 | - $rootScope.bodySystemSeletedId = bodySystemId; | ||
| 1398 | - $('#termList').empty(); | ||
| 1399 | - var bodySystemName = $("#AABodySystems #" + bodySystemId).val(); | ||
| 1400 | - if (bodySystemName == "All") { | ||
| 1401 | - for (var j = 0; j <= $scope.pinTermData.length - 1; j++) { | ||
| 1402 | - var $selectedOptions = $('<option title= "' + $scope.pinTermData[j].TermTxt + '" id= "' + $scope.pinTermData[j].TermNumber + '">' + $scope.pinTermData[j].TermTxt + '</option>').appendTo("#termList") | ||
| 1403 | - | ||
| 1404 | - $compile($selectedOptions)($scope); | ||
| 1405 | - } | ||
| 1406 | - $("#totalTerms").empty(); | ||
| 1407 | - $("#totalTerms").html("<span class='pull-left marginTop5'>" + $("#termList option").length + " Structures</span>"); | ||
| 1408 | - } | ||
| 1409 | - else { | ||
| 1410 | - var imageId = $rootScope.imageId; | ||
| 1411 | - $scope.pinDataUrl = "aa_dat_pinterm_" + imageId; | ||
| 1412 | - $rootScope.bodySystemTermArray = []; | ||
| 1413 | - $rootScope.sortedListArray = []; | ||
| 1414 | - $rootScope.duplicateListArray = []; | ||
| 1415 | - $.ajax({ | ||
| 1416 | - url: '~/../content/data/json/aa/aa_pinterm/' + $scope.pinDataUrl + '.json', | ||
| 1417 | - type: 'GET', | ||
| 1418 | - dataType: "json", | ||
| 1419 | - async: false, | ||
| 1420 | - success: function (result) { | ||
| 1421 | - $(result.PinTermData.TermData).each(function (key, value) { | ||
| 1422 | - $rootScope.bodySystemTermArray.push({ "termNumbr": result.PinTermData.TermData[key]._TermNumber, "text": result.PinTermData.TermData[key]._TermText, "language": result.PinTermData.TermData[key]._LanguageId }); | ||
| 1423 | - }); | ||
| 1424 | - for (var i = 0; i <= $scope.aaPinData.length - 1; i++) { | ||
| 1425 | - if ($scope.aaPinData[i]._BodySystemName.toLowerCase() == bodySystemName.toLowerCase()) { | ||
| 1426 | - for (var j = 0 ; j <= $rootScope.bodySystemTermArray.length - 1; j++) { | ||
| 1427 | - if ($scope.aaPinData[i]._TermId == $rootScope.bodySystemTermArray[j].termNumbr) { | ||
| 1428 | - if ($rootScope.bodySystemTermArray[j].language == $rootScope.lexiconLanguageArray[0].id) { | ||
| 1429 | - console.log($rootScope.bodySystemTermArray[j].text); | ||
| 1430 | - $rootScope.duplicateListArray.push({ "title": $rootScope.bodySystemTermArray[j].text, "id": $rootScope.bodySystemTermArray[j].termNumbr }); | ||
| 1431 | - } | ||
| 1432 | - } | ||
| 1433 | - } | ||
| 1434 | - } | ||
| 1435 | - } | ||
| 1436 | - var temp = []; | ||
| 1437 | - for (var i = 0; i <= $rootScope.duplicateListArray.length - 1; i++) { | ||
| 1438 | - var termID = $rootScope.duplicateListArray[i].id; | ||
| 1439 | - if ($.inArray(termID, temp) == -1) { | ||
| 1440 | - temp.push(termID); | ||
| 1441 | - $rootScope.sortedListArray.push({ "title": $rootScope.duplicateListArray[i].title, "id": termID }); | ||
| 1442 | - } | ||
| 1443 | - } | ||
| 1444 | - | ||
| 1445 | - for (var i = 0; i <= $rootScope.sortedListArray.length - 1; i++) { | ||
| 1446 | - | ||
| 1447 | - for (j = i + 1; j <= $rootScope.sortedListArray.length - 1; j++) { | ||
| 1448 | - | ||
| 1449 | - if ($rootScope.sortedListArray[i].title.substr(0, 1) > $rootScope.sortedListArray[j].title.substr(0, 1)) { | ||
| 1450 | - | ||
| 1451 | - var termText = $rootScope.sortedListArray[i].title; | ||
| 1452 | - var termNumbr = $rootScope.sortedListArray[i].termNumbr; | ||
| 1453 | - var termLanguage = $rootScope.sortedListArray[i].language; | ||
| 1454 | - | ||
| 1455 | - $rootScope.sortedListArray[i].title = $rootScope.sortedListArray[j].title; | ||
| 1456 | - $rootScope.sortedListArray[i].termNumbr = $rootScope.sortedListArray[j].termNumbr; | ||
| 1457 | - $rootScope.sortedListArray[i].language = $rootScope.sortedListArray[j].language; | ||
| 1458 | - | ||
| 1459 | - $rootScope.sortedListArray[j].title = termText; | ||
| 1460 | - $rootScope.sortedListArray[j].termNumbr = termNumbr; | ||
| 1461 | - $rootScope.sortedListArray[j].language = termLanguage; | ||
| 1462 | - } | ||
| 1463 | - } | ||
| 1464 | - } | ||
| 1465 | - | ||
| 1466 | - for (var j = 0; j <= $rootScope.sortedListArray.length - 1; j++) { | ||
| 1467 | - var $selectedOptions = $('<option title= "' + $rootScope.sortedListArray[j].title + '" id= "' + $rootScope.sortedListArray[j].id + '" >' + $rootScope.sortedListArray[j].title + '</option>').appendTo("#termList") | ||
| 1468 | - $compile($selectedOptions)($scope); | ||
| 1469 | - } | ||
| 1470 | - } | ||
| 1471 | - }); | ||
| 1472 | - $("#totalTerms").empty(); | ||
| 1473 | - $("#totalTerms").html("<span class='pull-left marginTop5'>" + $("#termList option").length + " Structures</span>"); | ||
| 1474 | - } | ||
| 1475 | - } | ||
| 1476 | - $scope.GetAnnotationBasedOnActualTermNo = function (actualTermNo) { | ||
| 1477 | - | ||
| 1478 | - | ||
| 1479 | - var languageArray = $rootScope.lexiconLanguageArray; | ||
| 1480 | - | ||
| 1481 | - if ($scope.AAPinTermData != null || $scope.AAPinTermData != undefined) { | ||
| 1482 | - | ||
| 1483 | - $scope.matchedTermNoData = new jinqJs() | ||
| 1484 | - .from($scope.AAPinTermData) | ||
| 1485 | - .where('_TermNumber == ' + actualTermNo) | ||
| 1486 | - .select(); | ||
| 1487 | - | ||
| 1488 | - if ($scope.matchedTermNoData != null || $scope.matchedTermNoData != undefined) { | ||
| 1489 | - | ||
| 1490 | - for (var j = 0; j <= languageArray.length - 1; j++) { | ||
| 1491 | - | ||
| 1492 | - $scope.matchedLanguageTermNoData = new jinqJs() | ||
| 1493 | - .from($scope.matchedTermNoData) | ||
| 1494 | - .where('_LanguageId == ' + languageArray[j].id) | ||
| 1495 | - .select(); | ||
| 1496 | - var termText = $scope.matchedLanguageTermNoData[0]._TermText; | ||
| 1497 | - $scope.MultiLanguageAnnationArray.push(termText); | ||
| 1498 | - }; | ||
| 1499 | - } | ||
| 1500 | - } | ||
| 1501 | - } | ||
| 1502 | - | ||
| 1503 | - $rootScope.hidePins = function () { | ||
| 1504 | - $("#dropdownMenu221").addClass("aaSystemDisable"); | ||
| 1505 | - $rootScope.isLoading = true; | ||
| 1506 | - $('#spinner').css('visibility', 'visible'); | ||
| 1507 | - $scope.hideSpeechBubble(); | ||
| 1508 | - | ||
| 1509 | - $scope.isHidePinBtnClicked = true; | ||
| 1510 | - angular.forEach($scope.aaPinData, function (aaPinDataValue, aaPinDataKey) { | ||
| 1511 | - | ||
| 1512 | - var pinName = 'Pin_' + aaPinDataValue._PinId; | ||
| 1513 | - var pinArcName = 'PinArc_' + aaPinDataValue._PinId; | ||
| 1514 | - | ||
| 1515 | - $('#aaDetailViewCanvas').setLayer(pinName, { | ||
| 1516 | - visible: false // set to true instead to show the layer again | ||
| 1517 | - }).drawLayers(); | ||
| 1518 | - | ||
| 1519 | - $('#aaDetailViewCanvas').setLayer(pinArcName, { | ||
| 1520 | - visible: false // set to true instead to show the layer again | ||
| 1521 | - }).drawLayers(); | ||
| 1522 | - }) | ||
| 1523 | - | ||
| 1524 | - $rootScope.isLoading = false; | ||
| 1525 | - $('#spinner').css('visibility', 'hidden'); | ||
| 1526 | - $(".tooltip-custom").removeClass("btn-primary"); | ||
| 1527 | - $(".tooltip-custom").addClass("btn-black"); | ||
| 1528 | - $("#hidePinBtn").addClass("btn-primary"); | ||
| 1529 | - $("#hidePinBtn").removeClass("btn-black"); | ||
| 1530 | - } | ||
| 1531 | - | ||
| 1532 | - $scope.showAllPinsAfterHide = function (event) { | ||
| 1533 | - if ($("#dropdownMenu221").hasClass("aaSystemDisable")) { | ||
| 1534 | - $("#dropdownMenu221").removeClass("aaSystemDisable"); | ||
| 1535 | - } | ||
| 1536 | - $rootScope.isLoading = true; | ||
| 1537 | - $('#spinner').css('visibility', 'visible'); | ||
| 1538 | - $scope.isHidePinBtnClicked = false; | ||
| 1539 | - $rootScope.isshowAllPinsBtnAfterHideClicked = true; | ||
| 1540 | - if ($scope.selectedSystemName != null && $scope.selectedSystemName != undefined) { | ||
| 1541 | - | ||
| 1542 | - $scope.showSystemPins($scope.selectedSystemPinData, false); | ||
| 1543 | - | ||
| 1544 | - } else { | ||
| 1545 | - | ||
| 1546 | - $scope.showSystemPins($scope.aaPinData, false); | ||
| 1547 | - } | ||
| 1548 | - $scope.showSpeechBubble(); | ||
| 1549 | - $(".tooltip-custom").removeClass("btn-primary"); | ||
| 1550 | - $(".tooltip-custom").addClass("btn-black"); | ||
| 1551 | - $("#allPinBtn").addClass("btn-primary"); | ||
| 1552 | - $("#allPinBtn").removeClass("btn-black"); | ||
| 1553 | - if ($scope.isSliderChange == true) { | ||
| 1554 | - $scope.isSliderChange = false; | ||
| 1555 | - $scope.showAllPins(); | ||
| 1556 | - | ||
| 1557 | - } | ||
| 1558 | - }; | ||
| 1559 | - | ||
| 1560 | - | ||
| 1561 | - $scope.showSelectedPins = function () { | ||
| 1562 | - $("#dropdownMenu221").addClass("aaSystemDisable"); | ||
| 1563 | - $rootScope.isLoading = true; | ||
| 1564 | - $('#spinner').css('visibility', 'visible'); | ||
| 1565 | - | ||
| 1566 | - $scope.isHidePinBtnClicked = false; | ||
| 1567 | - | ||
| 1568 | - if ($scope.selectedSystemName != null && $scope.selectedSystemName != undefined) { | ||
| 1569 | - | ||
| 1570 | - $scope.showSystemPins($scope.selectedSystemPinData, true); | ||
| 1571 | - | ||
| 1572 | - } | ||
| 1573 | - else { | ||
| 1574 | - $scope.showSystemPins($scope.aaPinData, true); | ||
| 1575 | - | ||
| 1576 | - } | ||
| 1577 | - $scope.showSpeechBubble(); | ||
| 1578 | - $(".tooltip-custom").removeClass("btn-primary"); | ||
| 1579 | - $(".tooltip-custom").addClass("btn-black"); | ||
| 1580 | - $("#selectedPin").addClass("btn-primary"); | ||
| 1581 | - $("#selectedPin").removeClass("btn-black"); | ||
| 1582 | - | ||
| 1583 | - if ($scope.isSelectedPinBtnClickedAftrSliderCange == true) { | ||
| 1584 | - | ||
| 1585 | - for (var i = 0; i <= $scope.activePinArray.length - 1; i++) { | ||
| 1586 | - var pinName = $scope.activePinArray[i].split("_"); | ||
| 1587 | - var activePinName = 'Pin_' + pinName[1]; | ||
| 1588 | - var pinArcName = 'PinArc_' + pinName[1]; | ||
| 1589 | - $('#aaDetailViewCanvas').setLayer(activePinName, { | ||
| 1590 | - visible: true // set to true instead to show the layer again | ||
| 1591 | - }).drawLayers(); | ||
| 1592 | - $('#aaDetailViewCanvas').setLayer(pinArcName, { | ||
| 1593 | - visible: true // set to true instead to show the layer again | ||
| 1594 | - }).drawLayers(); | ||
| 1595 | - } | ||
| 1596 | - | ||
| 1597 | - } | ||
| 1598 | - | ||
| 1599 | - }; | ||
| 1600 | - | ||
| 1601 | - | ||
| 1602 | - $scope.showSystemPins = function (seletedSystemPinData, isShowSelectedPins) { | ||
| 1603 | - | ||
| 1604 | - if (isShowSelectedPins) { | ||
| 1605 | - | ||
| 1606 | - angular.forEach($scope.clickedPins, function (value, key) { | ||
| 1607 | - | ||
| 1608 | - seletedSystemPinData = new jinqJs() | ||
| 1609 | - .from(seletedSystemPinData) | ||
| 1610 | - .where('_PinId != ' + value.id) | ||
| 1611 | - .select(); | ||
| 1612 | - }) | ||
| 1613 | - angular.forEach($scope.clickedPins, function (value1, key1) { | ||
| 1614 | - | ||
| 1615 | - // if (aaPinDataValue._PinId != value.id) { | ||
| 1616 | - var pinName = 'Pin_' + value1.id; | ||
| 1617 | - var pinArcName = 'PinArc_' + value1.id; | ||
| 1618 | - | ||
| 1619 | - $('#aaDetailViewCanvas').setLayer(pinName, { | ||
| 1620 | - visible: true // set to true instead to show the layer again | ||
| 1621 | - }).drawLayers(); | ||
| 1622 | - | ||
| 1623 | - $('#aaDetailViewCanvas').setLayer(pinArcName, { | ||
| 1624 | - visible: true // set to true instead to show the layer again | ||
| 1625 | - }).drawLayers(); | ||
| 1626 | - // } | ||
| 1627 | - }) | ||
| 1628 | - | ||
| 1629 | - angular.forEach(seletedSystemPinData, function (aaPinDataValue, aaPinDataKey) { | ||
| 1630 | - | ||
| 1631 | - var pinName = 'Pin_' + aaPinDataValue._PinId; | ||
| 1632 | - var pinArcName = 'PinArc_' + aaPinDataValue._PinId; | ||
| 1633 | - | ||
| 1634 | - $('#aaDetailViewCanvas').setLayer(pinName, { | ||
| 1635 | - visible: false // set to true instead to show the layer again | ||
| 1636 | - }).drawLayers(); | ||
| 1637 | - | ||
| 1638 | - $('#aaDetailViewCanvas').setLayer(pinArcName, { | ||
| 1639 | - visible: false // set to true instead to show the layer again | ||
| 1640 | - }).drawLayers(); | ||
| 1641 | - }) | ||
| 1642 | - | ||
| 1643 | - } | ||
| 1644 | - | ||
| 1645 | - else { | ||
| 1646 | - angular.forEach(seletedSystemPinData, function (aaPinDataValue, aaPinDataKey) { | ||
| 1647 | - | ||
| 1648 | - var pinName = 'Pin_' + aaPinDataValue._PinId; | ||
| 1649 | - var pinArcName = 'PinArc_' + aaPinDataValue._PinId; | ||
| 1650 | - | ||
| 1651 | - $('#aaDetailViewCanvas').setLayer(pinName, { | ||
| 1652 | - visible: true // set to true instead to show the layer again | ||
| 1653 | - }).drawLayers(); | ||
| 1654 | - | ||
| 1655 | - $('#aaDetailViewCanvas').setLayer(pinArcName, { | ||
| 1656 | - visible: true // set to true instead to show the layer again | ||
| 1657 | - }).drawLayers(); | ||
| 1658 | - }) | ||
| 1659 | - } | ||
| 1660 | - | ||
| 1661 | - $rootScope.isLoading = false; | ||
| 1662 | - $('#spinner').css('visibility', 'hidden'); | ||
| 1663 | - | ||
| 1664 | - | ||
| 1665 | - } | ||
| 1666 | - $rootScope.isshowAllPinsBtnAfterHideClicked = true; | ||
| 1667 | - $scope.showItemsForSearch = function () { | ||
| 1668 | - if($rootScope.isshowAllPinsBtnAfterHideClicked == true){ | ||
| 1669 | - console.log('showItemsForSearch is called'); | ||
| 1670 | - //this check is for log only because we are writing length so need to check if its not null or undefined | ||
| 1671 | - | ||
| 1672 | - | ||
| 1673 | - $timeout(function () { | ||
| 1674 | - if (($scope.AAPinTermData != null || $scope.AAPinTermData != undefined) && ($scope.AAPinTermData.length > 0)) { | ||
| 1675 | - | ||
| 1676 | - $scope.IsSearchVisible = true; | ||
| 1677 | - document.getElementById("termlistfilter").style.display = "block"; | ||
| 1678 | - } | ||
| 1679 | - else { | ||
| 1680 | - $rootScope.loadSearchData(); | ||
| 1681 | - if ($scope.AAPinTermData.length > 0) { | ||
| 1682 | - $scope.showItemsForSearch(); | ||
| 1683 | - } | ||
| 1684 | - } | ||
| 1685 | - | ||
| 1686 | - if ($rootScope.isSearchInputClicked == true) { | ||
| 1687 | - $rootScope.isSearchInputClicked = false; | ||
| 1688 | - $rootScope.searchListArray = []; | ||
| 1689 | - $("#backdrop > #searchListDivAA > #termlistfilter > li").each(function (key, value) { | ||
| 1690 | - $rootScope.searchListArray.push({ "name": $(this).find("a").html(), "id": $(this).find("a").attr("id") }); | ||
| 1691 | - }); | ||
| 1692 | - | ||
| 1693 | - } | ||
| 1694 | - | ||
| 1695 | - }, 500); | ||
| 1696 | - } | ||
| 1697 | - } | ||
| 1698 | - | ||
| 1699 | - | ||
| 1700 | - $scope.HideSearchList = function () { | ||
| 1701 | - | ||
| 1702 | - $timeout(function () { | ||
| 1703 | - | ||
| 1704 | - $("#termlistfilter").css("display", "none"); | ||
| 1705 | - | ||
| 1706 | - | ||
| 1707 | - }, 1000); | ||
| 1708 | - | ||
| 1709 | - } | ||
| 1710 | - | ||
| 1711 | - $scope.highlightPinBasedOnSerachItem = function (id) { | ||
| 1712 | - $scope.searchItemId = id; | ||
| 1713 | - $scope.searchItemText = $("#" + id).text(); | ||
| 1714 | - $rootScope.searchSelectedText = $("#" + id).text(); | ||
| 1715 | - $('#termList option[selected="selected"]').prop("selected", false); | ||
| 1716 | - $('#termList option[value="' + $rootScope.searchSelectedText + '"]').prop("selected", true); | ||
| 1717 | - $("#termList").find("option").css({ "background-color": "#ffffff", "color": "#000000" }); | ||
| 1718 | - $('#termList option[value="' + $rootScope.searchSelectedText + '"]').css({ "background-color": "#3399FF", "color": "#ffffff" }); | ||
| 1719 | - | ||
| 1720 | - $("#termlistfilter li a").css({ "background-color": "#ffffff", "color": "#000000" }); | ||
| 1721 | - $("#termlistfilter li #" + $scope.searchItemId).css({ "background-color": "#3399FF", "color": "#ffffff" }); | ||
| 1722 | - $scope.searchFilter = $("#" + id).text(); | ||
| 1723 | - //selectedTermName.placeholder = $("#" + id).text(); | ||
| 1724 | - selectedTermName.value = $("#" + id).text(); | ||
| 1725 | - selectedTermName.placeholder = "search... "; | ||
| 1726 | - | ||
| 1727 | - //get data from pindata for this trem | ||
| 1728 | - | ||
| 1729 | - var pinDataForTerm = new jinqJs() | ||
| 1730 | - .from($scope.aaPinData) | ||
| 1731 | - .where("_TermId == " + $scope.searchItemId) | ||
| 1732 | - .select(); | ||
| 1733 | - | ||
| 1734 | - $scope.showAnnotation(pinDataForTerm, false, false, true); | ||
| 1735 | - // maintaing scroll position on selection of options in list manager. | ||
| 1736 | - var annotationTopPos = $(".common-drag").css("top").split("p"); | ||
| 1737 | - $("#canvasDiv").scrollTop(annotationTopPos[0]); | ||
| 1738 | - | ||
| 1739 | - $scope.IsSearchVisible = false; | ||
| 1740 | - } | ||
| 1741 | - | ||
| 1742 | - $rootScope.isShowHideButtonClicked = true; | ||
| 1743 | - $scope.ShowHideAnnotation = function () { | ||
| 1744 | - if ($rootScope.isShowHideButtonClicked == true) { | ||
| 1745 | - $rootScope.annotationArray = []; | ||
| 1746 | - $("#canvasDiv").find(".common-drag").each(function () { | ||
| 1747 | - var speechBubbleID = $(this).attr("id"); | ||
| 1748 | - var sppechBubbleId = $(this).attr("id").substring(12); | ||
| 1749 | - var b = $("#speechBubbleDraggedLine" + sppechBubbleId).css("display"); | ||
| 1750 | - var speechBubbleLineDispProp = $("#speechBubbleLine" + sppechBubbleId).css("display"); | ||
| 1751 | - var speechBubbleLineID = "speechBubbleLine" + sppechBubbleId; | ||
| 1752 | - var speechBubbleDraggedLineID = "speechBubbleDraggedLine" + sppechBubbleId; | ||
| 1753 | - $("#comment-box").addClass("btn-primary"); | ||
| 1754 | - $("#comment-box").removeClass("btn-black"); | ||
| 1755 | - | ||
| 1756 | - if (speechBubbleLineDispProp == "block") { | ||
| 1757 | - $rootScope.annotationArray.push({ "speechBuubleId": speechBubbleID, "speechBubbleLineId": speechBubbleLineID }); | ||
| 1758 | - } | ||
| 1759 | - else { | ||
| 1760 | - $rootScope.annotationArray.push({ "speechBuubleId": speechBubbleID, "speechBubbleLineId": speechBubbleDraggedLineID }); | ||
| 1761 | - } | ||
| 1762 | - }); | ||
| 1763 | - $rootScope.isShowHideButtonClicked = false; | ||
| 1764 | - for (var i = 0; i <= $rootScope.annotationArray.length - 1; i++) { | ||
| 1765 | - $("#" + $rootScope.annotationArray[i].speechBuubleId).css("display", "none"); | ||
| 1766 | - $("#" + $rootScope.annotationArray[i].speechBubbleLineId).css("display", "none"); | ||
| 1767 | - } | ||
| 1768 | - } | ||
| 1769 | - else { | ||
| 1770 | - $rootScope.isShowHideButtonClicked = true; | ||
| 1771 | - for (var i = 0; i <= $rootScope.annotationArray.length - 1; i++) { | ||
| 1772 | - $("#" + $rootScope.annotationArray[i].speechBuubleId).css("display", "block"); | ||
| 1773 | - $("#" + $rootScope.annotationArray[i].speechBubbleLineId).css("display", "block"); | ||
| 1774 | - } | ||
| 1775 | - | ||
| 1776 | - $("#comment-box").removeClass("btn-primary"); | ||
| 1777 | - $("#comment-box").addClass("btn-black"); | ||
| 1778 | - | ||
| 1779 | - } | ||
| 1780 | - } | ||
| 1781 | - $scope.activePinOnLayerChange = function () { | ||
| 1782 | - for (var i = 0; i <= $scope.activePinArray.length - 1; i++) { | ||
| 1783 | - var radialAfterClick = $('#aaDetailViewCanvas').createGradient({ | ||
| 1784 | - x1: 50, y1: 50, | ||
| 1785 | - x2: 50, y2: 50, | ||
| 1786 | - r1: 10, r2: 30, | ||
| 1787 | - c1: 'rgba(100, 50, 0,0)', | ||
| 1788 | - c2: 'rgb(126, 187, 83)' | ||
| 1789 | - }); | ||
| 1790 | - var clickedPin = $scope.activePinArray[i]; | ||
| 1791 | - $('#aaDetailViewCanvas').setLayer(clickedPin, { | ||
| 1792 | - fillStyle: radialAfterClick | ||
| 1793 | - }).drawLayers(); | ||
| 1794 | - | ||
| 1795 | - } | ||
| 1796 | - } | ||
| 1797 | - | ||
| 1798 | - $scope.activePinOnSliderChange = function () { | ||
| 1799 | - if ($scope.activePinArray.length == 1) { | ||
| 1800 | - for (var i = 0; i <= $scope.allPinDataArray.length - 1; i++) { | ||
| 1801 | - var activeArc = $scope.activePinArray[0].split("_"); | ||
| 1802 | - if ($scope.allPinDataArray[i] == activeArc[1]) { | ||
| 1803 | - var pinName = 'Pin_' + $scope.allPinDataArray[i]; | ||
| 1804 | - var pinArcName = 'PinArc_' + $scope.allPinDataArray[i]; | ||
| 1805 | - $('#aaDetailViewCanvas').setLayer(pinName, { | ||
| 1806 | - visible: true // set to true instead to show the layer again | ||
| 1807 | - }).drawLayers(); | ||
| 1808 | - $('#aaDetailViewCanvas').setLayer(pinArcName, { | ||
| 1809 | - visible: true // set to true instead to show the layer again | ||
| 1810 | - }).drawLayers(); | ||
| 1811 | - } | ||
| 1812 | - else { | ||
| 1813 | - var pinName = 'Pin_' + $scope.allPinDataArray[i]; | ||
| 1814 | - var pinArcName = 'PinArc_' + $scope.allPinDataArray[i]; | ||
| 1815 | - $('#aaDetailViewCanvas').setLayer(pinName, { | ||
| 1816 | - visible: false // set to true instead to show the layer again | ||
| 1817 | - }).drawLayers(); | ||
| 1818 | - $('#aaDetailViewCanvas').setLayer(pinArcName, { | ||
| 1819 | - visible: false // set to true instead to show the layer again | ||
| 1820 | - }).drawLayers(); | ||
| 1821 | - } | ||
| 1822 | - } | ||
| 1823 | - } | ||
| 1824 | - else { | ||
| 1825 | - var seletedSystemPinData; | ||
| 1826 | - angular.forEach($scope.activePinArray, function (value, key) { | ||
| 1827 | - var pinID = value.split("_"); | ||
| 1828 | - seletedSystemPinData = new jinqJs() | ||
| 1829 | - .from($scope.allPinDataArray) | ||
| 1830 | - .where('_PinId != ' + pinID[1]) | ||
| 1831 | - .select(); | ||
| 1832 | - }) | ||
| 1833 | - | ||
| 1834 | - angular.forEach(seletedSystemPinData, function (aaPinDataValue, aaPinDataKey) { | ||
| 1835 | - | ||
| 1836 | - var pinName = 'Pin_' + aaPinDataValue; | ||
| 1837 | - var pinArcName = 'PinArc_' + aaPinDataValue; | ||
| 1838 | - | ||
| 1839 | - $('#aaDetailViewCanvas').setLayer(pinName, { | ||
| 1840 | - visible: false // set to true instead to show the layer again | ||
| 1841 | - }).drawLayers(); | ||
| 1842 | - | ||
| 1843 | - $('#aaDetailViewCanvas').setLayer(pinArcName, { | ||
| 1844 | - visible: false // set to true instead to show the layer again | ||
| 1845 | - }).drawLayers(); | ||
| 1846 | - | ||
| 1847 | - }) | ||
| 1848 | - for (var i = 0; i <= $scope.activePinArray.length - 1; i++) { | ||
| 1849 | - var pinName = $scope.activePinArray[i].split("_"); | ||
| 1850 | - var activePinName = 'Pin_' + pinName[1]; | ||
| 1851 | - var pinArcName = 'PinArc_' + pinName[1]; | ||
| 1852 | - $('#aaDetailViewCanvas').setLayer(activePinName, { | ||
| 1853 | - visible: true // set to true instead to show the layer again | ||
| 1854 | - }).drawLayers(); | ||
| 1855 | - $('#aaDetailViewCanvas').setLayer(pinArcName, { | ||
| 1856 | - visible: true // set to true instead to show the layer again | ||
| 1857 | - }).drawLayers(); | ||
| 1858 | - } | ||
| 1859 | - } | ||
| 1860 | - } | ||
| 1861 | - $(document).ready(function () { | ||
| 1862 | - var $ua = navigator.userAgent; | ||
| 1863 | - if (($ua.match(/(iPod|iPhone|iPad|android)/i))) { | ||
| 1864 | - | ||
| 1865 | - var jspanelContainerWidth = $(".jsPanel-content").css("width"); | ||
| 1866 | - $(".jsPanel-content").css({ "width": "100%", "min-width": jspanelContainerWidth }); | ||
| 1867 | - $("#ImagePanel").css("width", "100%"); | ||
| 1868 | - | ||
| 1869 | - //hide pin button clicked | ||
| 1870 | - $("#hidePinBtn").removeAttr("onclick"); | ||
| 1871 | - $("#hidePinBtn").on("touchstart", function () { | ||
| 1872 | - var rootScope = angular.element(document.getElementById("aaDetailPageDiv")).scope(); | ||
| 1873 | - rootScope.$apply(function () { | ||
| 1874 | - rootScope.hidePins(event); | ||
| 1875 | - }); | ||
| 1876 | - }); | ||
| 1877 | - //selected pin button clicked | ||
| 1878 | - $("#selectedPin").removeAttr("onclick"); | ||
| 1879 | - $("#selectedPin").on("touchstart", function () { | ||
| 1880 | - console.log('showSelectedPins is called') | ||
| 1881 | - var scope = angular.element(document.getElementById("aaDetailPageDiv")).scope(); | ||
| 1882 | - scope.$apply(function () { | ||
| 1883 | - scope.showSelectedPins(event); | ||
| 1884 | - }); | ||
| 1885 | - }); | ||
| 1886 | - //all pin button clicked | ||
| 1887 | - $("#allPinBtn").removeAttr("onclick"); | ||
| 1888 | - $("#allPinBtn").on("touchstart", function () { | ||
| 1889 | - var scope = angular.element(document.getElementById("aaDetailPageDiv")).scope(); | ||
| 1890 | - scope.$apply(function () { | ||
| 1891 | - scope.showAllPinsAfterHide(event); | ||
| 1892 | - }); | ||
| 1893 | - }); | ||
| 1894 | - //comment-box button clicked | ||
| 1895 | - $("#comment-box").removeAttr("onclick"); | ||
| 1896 | - $("#comment-box").on("touchstart", function () { | ||
| 1897 | - var scope = angular.element(document.getElementById("aaDetailPageDiv")).scope(); | ||
| 1898 | - scope.$apply(function () { | ||
| 1899 | - scope.ShowHideAnnotation(event); | ||
| 1900 | - }); | ||
| 1901 | - }); | ||
| 1902 | - | ||
| 1903 | - } | ||
| 1904 | - | ||
| 1905 | - }); | ||
| 1906 | -}]); | ||
| 1907 | - | ||
| 1908 | - | ||
| 1909 | -function refreshTermListOnSystemSel(bodySystemId) { | ||
| 1910 | - var rootScope = angular.element(document.getElementById("aaDetailPageDiv")).scope(); | ||
| 1911 | - rootScope.$apply(function () { | ||
| 1912 | - rootScope.refreshTermListOnAASystemSelection(bodySystemId); | ||
| 1913 | - }); | ||
| 1914 | -} | ||
| 1915 | - | ||
| 1916 | - | ||
| 1917 | -function showSelectedSystemPins(event) { | ||
| 1918 | - console.log('OnBodySystem chnaged is called outside '); | ||
| 1919 | - var scope = angular.element(document.getElementById("aaDetailPageDiv")).scope(); | ||
| 1920 | - scope.$apply(function () { | ||
| 1921 | - scope.showSelectedSystemPins(event); | ||
| 1922 | - }); | ||
| 1923 | -} | ||
| 1924 | - | ||
| 1925 | -function hidePins(event) { | ||
| 1926 | - | ||
| 1927 | - var rootScope = angular.element(document.getElementById("aaDetailPageDiv")).scope(); | ||
| 1928 | - rootScope.$apply(function () { | ||
| 1929 | - rootScope.hidePins(event); | ||
| 1930 | - }); | ||
| 1931 | -} | ||
| 1932 | - | ||
| 1933 | -function showAllPins(event) { | ||
| 1934 | - | ||
| 1935 | - var scope = angular.element(document.getElementById("aaDetailPageDiv")).scope(); | ||
| 1936 | - scope.$apply(function () { | ||
| 1937 | - scope.showAllPinsAfterHide(event); | ||
| 1938 | - }); | ||
| 1939 | -} | ||
| 1940 | - | ||
| 1941 | -function onSearchAA(event) { | ||
| 1942 | - console.log('AA search is called') | ||
| 1943 | - var scope = angular.element(document.getElementById("aaDetailPageDiv")).scope(); | ||
| 1944 | - scope.$apply(function () { | ||
| 1945 | - scope.showItemsForSearch(); | ||
| 1946 | - }); | ||
| 1947 | -} | ||
| 1948 | - | ||
| 1949 | -function hideSearchList(event) { | ||
| 1950 | - console.log('AA hide search is called') | ||
| 1951 | - var scope = angular.element(document.getElementById("aaDetailPageDiv")).scope(); | ||
| 1952 | - scope.$apply(function () { | ||
| 1953 | - scope.HideSearchList(); | ||
| 1954 | - }); | ||
| 1955 | -} | ||
| 1956 | - | ||
| 1957 | -function onSearchItemSelection(id) { | ||
| 1958 | - | ||
| 1959 | - console.log('AA hide search is called'); | ||
| 1960 | - var scope = angular.element(document.getElementById("aaDetailPageDiv")).scope(); | ||
| 1961 | - scope.$apply(function () { | ||
| 1962 | - scope.highlightPinBasedOnSerachItem(id); | ||
| 1963 | - }); | ||
| 1964 | -} | ||
| 1965 | - | ||
| 1966 | -//function onListManagerTermSelection(event) { | ||
| 1967 | -// var scope = angular.element(document.getElementById("aaDetailPageDiv")).scope(); | ||
| 1968 | -// scope.isTermListOptionClicked = true; | ||
| 1969 | -// scope.$apply(function () { | ||
| 1970 | -// scope.highlightPinBasedOnSerachItem1(event); | ||
| 1971 | -// }); | ||
| 1972 | - | ||
| 1973 | -//} | ||
| 1974 | - | ||
| 1975 | - | ||
| 1976 | -function showHideAnnotation(event) { | ||
| 1977 | - | ||
| 1978 | - var scope = angular.element(document.getElementById("aaDetailPageDiv")).scope(); | ||
| 1979 | - scope.$apply(function () { | ||
| 1980 | - scope.ShowHideAnnotation(event); | ||
| 1981 | - }); | ||
| 1982 | -} | ||
| 1983 | - | ||
| 1984 | -function showSelectedPins(event) { | ||
| 1985 | - | ||
| 1986 | - console.log('showSelectedPins is called') | ||
| 1987 | - var scope = angular.element(document.getElementById("aaDetailPageDiv")).scope(); | ||
| 1988 | - scope.$apply(function () { | ||
| 1989 | - scope.showSelectedPins(event); | ||
| 1990 | - }); | ||
| 1991 | -} | ||
| 1992 | - | ||
| 1993 | - | ||
| 1994 | -function openModuleItemView(event) { | ||
| 1995 | - var scope = angular.element(document.getElementById("list-view")).scope(); | ||
| 1996 | - scope.isListViewButtonClicked = true; | ||
| 1997 | - scope.$apply(function () { | ||
| 1998 | - scope.openModuleItemView(event); | ||
| 1999 | - }); | ||
| 2000 | -} | ||
| 2001 | - | ||
| 2002 | -function openListViewModuleItem(event) { | ||
| 2003 | - | ||
| 2004 | - var scope = angular.element(document.getElementById("list-view")).scope(); | ||
| 2005 | - scope.isListViewButtonClicked = true; | ||
| 2006 | - scope.$apply(function () { | ||
| 2007 | - scope.openListViewModuleItem(event); | ||
| 2008 | - }); | ||
| 2009 | -} | ||
| 2010 | - | ||
| 2011 | -function openCurrentView(event) { | ||
| 2012 | - var scope = angular.element(document.getElementById("list-view")).scope(); | ||
| 2013 | - scope.isListViewButtonClicked = true; | ||
| 2014 | - scope.isOpenBtnClicked = true; | ||
| 2015 | - scope.$apply(function () { | ||
| 2016 | - scope.openModuleItemView(event); | ||
| 2017 | - }); | ||
| 2018 | - | ||
| 2019 | -} | ||
| 2020 | - | ||
| 2021 | -function onZoom(scope) { | ||
| 2022 | - | ||
| 2023 | - //$(".common-drag").remove(); | ||
| 2024 | - //$(".commonDot").remove(); | ||
| 2025 | - //$(".commonDraggedLine").remove(); | ||
| 2026 | - //var radial = $('#aaDetailViewCanvas').createGradient({ | ||
| 2027 | - // x1: 50, y1: 50, | ||
| 2028 | - // x2: 50, y2: 50, | ||
| 2029 | - // r1: 10, r2: 30, | ||
| 2030 | - // c1: 'rgba(100, 50, 0,0)', | ||
| 2031 | - // c2: 'rgb(216, 216, 216)' | ||
| 2032 | - //}); | ||
| 2033 | - //$('#aaDetailViewCanvas').setLayers({ | ||
| 2034 | - // fillStyle: radial, | ||
| 2035 | - //}).drawLayers(); | ||
| 2036 | - // scope.removePin(); | ||
| 2037 | - // scope.showAllPins(); | ||
| 2038 | - | ||
| 2039 | - | ||
| 2040 | - //6. Show all pins on AA opened item | ||
| 2041 | -} | ||
| 2042 | - | ||
| 2043 | - | 1 | +'use strict'; |
| 2 | + | ||
| 3 | +AIA.controller("TileViewListController", ["$scope", "$window", "$rootScope", "$compile", "$http", "$log", "$location", "$timeout", "DA", "Modules", "$routeParams", "BodyRegions", "BodySystems", "ViewOrientations", "ImageTypes", "DataService", "ModuleService", | ||
| 4 | +function ($scope, $window, $rootScope, $compile, $http, $log, $location, $timeout, DA, Modules, $routeParam, BodyRegions, BodySystems, ViewOrientations, ImageTypes, DataService, ModuleService) { | ||
| 5 | + | ||
| 6 | + | ||
| 7 | + $rootScope.OpenedTileData = []; | ||
| 8 | + var DISSECTIBLE_ANATOMY = 'Dissectible Anatomy'; | ||
| 9 | + var ATLAS_ANATOMY = 'Atlas Anatomy'; | ||
| 10 | + var CLINICAL_ILLUSTRATION = 'Clinical Illustrations'; | ||
| 11 | + var CLINICAL_ANIMATION = 'Clinical Animations'; | ||
| 12 | + $rootScope.closeBtnImgPath = "~/../content/images/speeachBubbleClose.png"; | ||
| 13 | + $rootScope.listArray = []; | ||
| 14 | + //variables to bind Filter by Controls | ||
| 15 | + $scope.searchAAListViewData = []; | ||
| 16 | + $scope.SelectedAAthumbImage = []; | ||
| 17 | + $scope.SelectedAAImage = []; | ||
| 18 | + $scope.SelectedAASummary = []; | ||
| 19 | + $scope.SelectedAAId = []; | ||
| 20 | + $scope.SelectedAATitle = []; | ||
| 21 | + $scope.selectedAAListViewData = []; | ||
| 22 | + $scope.filterstring = false; | ||
| 23 | + $scope.AllBodyRegion = []; | ||
| 24 | + $scope.AllBodySystem = []; | ||
| 25 | + $scope.AllOrientation = []; | ||
| 26 | + $scope.AllImageType = []; | ||
| 27 | + $rootScope.speechBubbleDimaensions = []; | ||
| 28 | + $scope.runningSearchWorkers = []; | ||
| 29 | + $scope.clickedPins = []; | ||
| 30 | + $scope.sliderPercentValue = 1; | ||
| 31 | + $scope.query = { | ||
| 32 | + selectedbodyregion: '', | ||
| 33 | + selectedbodysystem: '', | ||
| 34 | + selectedorientation: '', | ||
| 35 | + selectedimagetype: '', | ||
| 36 | + }; | ||
| 37 | + $scope.activePinArray = []; | ||
| 38 | + $scope.showTabButton = true; | ||
| 39 | + $scope.isListViewDataLoaded = true; | ||
| 40 | + | ||
| 41 | + $scope.setActiveTab = function (tabToSet) { | ||
| 42 | + | ||
| 43 | + $scope.activeTab = tabToSet; | ||
| 44 | + localStorage.setItem("activeTab", $scope.activeTab); | ||
| 45 | + if ($scope.activeTab == 1) { | ||
| 46 | + $('#grid-view').css("display", "block"); | ||
| 47 | + $('#list-view').css("display", "none"); | ||
| 48 | + $("#demoView").remove(); | ||
| 49 | + } | ||
| 50 | + else { | ||
| 51 | + | ||
| 52 | + $('#grid-view').css("display", "none"); | ||
| 53 | + $('#list-view').css("display", "block"); | ||
| 54 | + } | ||
| 55 | + }; | ||
| 56 | + | ||
| 57 | + $scope.loadForModuleById = function (moduleId) { | ||
| 58 | + $rootScope.openModules.push({ "ModuleId": 2 }); | ||
| 59 | + if ($rootScope.refreshcheck == null) { | ||
| 60 | + $location.path('/'); | ||
| 61 | + } | ||
| 62 | + $scope.moduleId = moduleId; | ||
| 63 | + $scope.activeTab = 1; | ||
| 64 | + console.log('loadForModuleById is called') | ||
| 65 | + $rootScope.moduleName = Modules[moduleId].Name; | ||
| 66 | + $rootScope.currentActiveModuleTitle = $rootScope.moduleName; | ||
| 67 | + $scope.AllBodyRegion = BodyRegions; | ||
| 68 | + $scope.AllBodySystem = BodySystems; | ||
| 69 | + $scope.AllOrientation = ViewOrientations; | ||
| 70 | + $scope.AllImageType = ImageTypes; | ||
| 71 | + var promise = ModuleService.loadModuleDataBasedOnModuleName($scope.moduleName) | ||
| 72 | + .then( | ||
| 73 | + function (result) { | ||
| 74 | + | ||
| 75 | + $scope.moduleLandingData = result; | ||
| 76 | + // setTimeout(function () { $('#' + $rootScope.highlightid).find('.thumbnail').addClass('hightlightstate'); }, 100); | ||
| 77 | + setTimeout(function () { | ||
| 78 | + if ($rootScope.getLocalStorageValue('AAGridViewHighlightThumbnail') !== null) { | ||
| 79 | + $('#' + $rootScope.getLocalStorageValue("AAGridViewHighlightThumbnail")).find('.thumbnail').addClass('HightLightThumbnail'); | ||
| 80 | + } | ||
| 81 | + if ($rootScope.getLocalStorageValue('AAGridViewScroll') !== null && $location.url() == "/tile-view-list") { | ||
| 82 | + $('html, body').animate({ scrollTop: $rootScope.getLocalStorageValue('AAGridViewScroll') }, 'slow'); | ||
| 83 | + } | ||
| 84 | + }, 100); | ||
| 85 | + //console.log(JSON.stringify(result, null, 4)); | ||
| 86 | + }, | ||
| 87 | + function (error) { | ||
| 88 | + // handle errors here | ||
| 89 | + console.log(' error: ' + error.statusText); | ||
| 90 | + } | ||
| 91 | + ) | ||
| 92 | + $('#list-view').css('display', 'none'); | ||
| 93 | + } | ||
| 94 | + | ||
| 95 | + //$scope.$on('$viewContentLoaded', function (event) { | ||
| 96 | + | ||
| 97 | + // $scope.loadForModuleById(); | ||
| 98 | + | ||
| 99 | + //}); | ||
| 100 | + $scope.isOpenBtnClicked = false; | ||
| 101 | + $scope.openModuleItemView = function (event) { | ||
| 102 | + $rootScope.MenuModuleName = "AA"; | ||
| 103 | + localStorage.setItem("activeTab", $scope.activeTab); | ||
| 104 | + //0. Get selected Image Id | ||
| 105 | + if ($scope.isListViewButtonClicked == true) { | ||
| 106 | + if ($scope.isOpenBtnClicked == true) { | ||
| 107 | + | ||
| 108 | + var moduleItemDataToBeSaved = $("#demoText").text().trim(); | ||
| 109 | + $scope.isOpenBtnClicked = false; | ||
| 110 | + } | ||
| 111 | + else { | ||
| 112 | + var moduleItemDataToBeSavedID = event.currentTarget.id; | ||
| 113 | + localStorage.setItem("listViewSelectedID", moduleItemDataToBeSavedID); | ||
| 114 | + var moduleItemDataToBeSaved = $("#list-view table tbody #" + moduleItemDataToBeSavedID).find('td:eq(0)').text().trim(); | ||
| 115 | + } | ||
| 116 | + } | ||
| 117 | + else { | ||
| 118 | + var moduleItemDataToBeSaved = event.target.id; | ||
| 119 | + localStorage.setItem("listViewSelectedID", event.currentTarget.id); | ||
| 120 | + $scope.isListViewButtonClicked = false; | ||
| 121 | + } | ||
| 122 | + | ||
| 123 | + //1.Filter selected module ietem data and get the pushed opened moduile array object | ||
| 124 | + $rootScope.OpenedTileData = ModuleService.GetOpenedTileData(moduleItemDataToBeSaved, $scope.moduleLandingData); | ||
| 125 | + | ||
| 126 | + //2. Pick the image name to create a source to open | ||
| 127 | + $rootScope.imageId = $rootScope.OpenedTileData[0]; | ||
| 128 | + $rootScope.imageName = $rootScope.OpenedTileData[3]; | ||
| 129 | + $rootScope.bodySystemName = $rootScope.OpenedTileData[2]; | ||
| 130 | + $rootScope.OpenItemImagePath = "../../../content/images/aa/images/" + $rootScope.OpenedTileData[3]; | ||
| 131 | + $scope.OpenItemImagePath = "../../../content/images/aa/images/" + $rootScope.OpenedTileData[3]; | ||
| 132 | + //$rootScope.listArray = []; | ||
| 133 | + $rootScope.listArray.push({ "imageName": $rootScope.OpenItemImagePath, "text": moduleItemDataToBeSaved }); | ||
| 134 | + //3. set opened module item ti | ||
| 135 | + localStorage.setItem("currentViewTitle", $rootScope.OpenedTileData[6]); | ||
| 136 | + localStorage.setItem("AAGridViewScroll", $($window).scrollTop()); | ||
| 137 | + localStorage.setItem("AAGridViewHighlightThumbnail", $(event.target).parent().parent().parent().attr('id')); | ||
| 138 | + | ||
| 139 | + //3. Navigate to the Module-item-view | ||
| 140 | + var u = $location.url(); | ||
| 141 | + $location.url('/module-item-view'); | ||
| 142 | + } | ||
| 143 | + | ||
| 144 | + | ||
| 145 | + $scope.openListViewModuleItem = function (event) { | ||
| 146 | + $("#demoView").remove(); | ||
| 147 | + var moduleItemDataToBeSavedID = event.currentTarget.id; | ||
| 148 | + $("#list-view table tbody tr").removeClass("active"); | ||
| 149 | + localStorage.setItem("listViewSelectedID", moduleItemDataToBeSavedID); | ||
| 150 | + $("#list-view table tbody #" + moduleItemDataToBeSavedID).addClass("active"); | ||
| 151 | + localStorage.setItem("AAListViewScroll", $("#list-view table tbody").scrollTop()); | ||
| 152 | + var moduleItemDataToBeSaved = $("#list-view table tbody #" + moduleItemDataToBeSavedID).find('td:eq(0)').text().trim(); | ||
| 153 | + $rootScope.OpenedTileData = ModuleService.GetOpenedTileData(moduleItemDataToBeSaved, $scope.moduleLandingData); | ||
| 154 | + $rootScope.OpenItemImagePath = "../../../content/images/aa/images/" + $rootScope.OpenedTileData[3]; | ||
| 155 | + //$rootScope.listArray = []; | ||
| 156 | + $rootScope.listArray.push({ "imageName": $rootScope.OpenItemImagePath, "text": moduleItemDataToBeSaved }); | ||
| 157 | + $("#viewList").append("<div class='col-xs-12 text-center' style='padding-top:15px;padding-bottom:15px;' id='demoView'><div class='col-xs-12' style='padding:15px;background-color:#fff;'><div class='col-xs-2' style='border:1px solid #000;padding:5px;color:#000;font-size:12px;'><div class='thumbnail' style='margin-bottom:10px;'><img style='width:auto;height:95px!important;' src=" + $rootScope.OpenItemImagePath + "></div><div class='col-xs-12' id='demoText' style='padding:0;'>" + moduleItemDataToBeSaved + "</div></div></div><a style='position:absolute;right:30px;bottom:34px;' onclick='openCurrentView(event)' href='javascript:void(0)' class='pull-right btn btn-primary'>Open</a></div>"); | ||
| 158 | + } | ||
| 159 | + | ||
| 160 | + | ||
| 161 | + $scope.openModuleItem = function () { | ||
| 162 | + if ($rootScope.refreshcheck == null) { | ||
| 163 | + $location.path('/'); | ||
| 164 | + } | ||
| 165 | + var jsContentURL; | ||
| 166 | + var moduleItemViewDivId; | ||
| 167 | + | ||
| 168 | + //1. create a jsPanel and load the module item view | ||
| 169 | + if ($rootScope.moduleName == ATLAS_ANATOMY) { | ||
| 170 | + | ||
| 171 | + jsContentURL = 'app/views/aa/atlas-anatomy-detail.html'; | ||
| 172 | + moduleItemViewDivId = 'aaDetailPageDiv'; | ||
| 173 | + } | ||
| 174 | + else if ($rootScope.moduleName == CLINICAL_ANIMATION) { | ||
| 175 | + //to do, in next phase of project | ||
| 176 | + | ||
| 177 | + } | ||
| 178 | + else if ($rootScope.moduleName == CLINICAL_ILLUSTRATION) { | ||
| 179 | + //to do, in next phase of project | ||
| 180 | + | ||
| 181 | + } | ||
| 182 | + | ||
| 183 | + //1. create a jsPanel and load the module item view | ||
| 184 | + if ($rootScope.moduleName == ATLAS_ANATOMY) { | ||
| 185 | + $.jsPanel({ | ||
| 186 | + id: 'ImagePanel', | ||
| 187 | + selector: '.aaBodyView', | ||
| 188 | + theme: 'success', | ||
| 189 | + currentController: 'TileViewListController', | ||
| 190 | + parentSlug: 'tile-view-list', | ||
| 191 | + ajax: { | ||
| 192 | + url: jsContentURL | ||
| 193 | + }, | ||
| 194 | + title: $rootScope.getLocalStorageValue("currentViewTitle"), | ||
| 195 | + | ||
| 196 | + position: { | ||
| 197 | + top: 70, | ||
| 198 | + left: 1, | ||
| 199 | + }, | ||
| 200 | + | ||
| 201 | + size: { width: $(window).outerWidth() - 10, height: $(window).outerHeight() - 125 }, | ||
| 202 | + | ||
| 203 | + }); | ||
| 204 | + | ||
| 205 | + console.log('jsPanel loaded ImagePanel exist= ' + document.getElementById('ImagePanel')) | ||
| 206 | + | ||
| 207 | + //0.3 | ||
| 208 | + var aaViewElement = angular.element(document.getElementById(moduleItemViewDivId)); | ||
| 209 | + | ||
| 210 | + //0.4 for Opening module item, load it into image | ||
| 211 | + $rootScope.isLoading = true; | ||
| 212 | + $('#spinner').css('visibility', 'visible'); | ||
| 213 | + var openedImage = new Image(); | ||
| 214 | + openedImage.id = 'modItemImage'; | ||
| 215 | + openedImage.name = $rootScope.OpenItemImagePath; | ||
| 216 | + | ||
| 217 | + openedImage.onload = function () { | ||
| 218 | + $scope.imageWidth = this.width; | ||
| 219 | + $scope.imageHeight = this.height; | ||
| 220 | + | ||
| 221 | + | ||
| 222 | + $timeout(function () { | ||
| 223 | + $compile(aaViewElement.contents())($scope); | ||
| 224 | + | ||
| 225 | + //if (document.getElementById('aaDetailPageDiv') != null) { | ||
| 226 | + if (document.getElementById('aaBodyView') != null) { | ||
| 227 | + | ||
| 228 | + //0.4 added some stylesheets | ||
| 229 | + $('#aaBodyView').css("height", $(window).outerHeight() - 65); | ||
| 230 | + | ||
| 231 | + $('#aaBodyView').css("width", $(window).outerWidth() - 15); | ||
| 232 | + | ||
| 233 | + $rootScope.canvasDivHeight = $('.jsPanel-content').height() - $('.main2 .stickey-area').height(); | ||
| 234 | + | ||
| 235 | + $('.canvasDivClass').css("height", $rootScope.canvasDivHeight); | ||
| 236 | + | ||
| 237 | + $scope.currentTitleFromJson = $rootScope.getLocalStorageValue("currentViewTitle"); | ||
| 238 | + $("#modItemImage").attr('src', $rootScope.OpenItemImagePath); | ||
| 239 | + | ||
| 240 | + | ||
| 241 | + $rootScope.ViewImageWidth = $("#modItemImage").width(); | ||
| 242 | + $scope.ViewImageWidth = $("#modItemImage").width(); | ||
| 243 | + $scope.ViewImageHeight = $("#modItemImage").height(); | ||
| 244 | + | ||
| 245 | + $scope.relativeDimesion = 0; | ||
| 246 | + $("#modItemImage").css("width", $rootScope.ViewImageWidth + "px"); | ||
| 247 | + //0.5 create canvas on the top of image so that I can draw a line over the canvas. | ||
| 248 | + var canvas = document.createElement('canvas'); | ||
| 249 | + canvas.id = 'aaDetailViewCanvas'; | ||
| 250 | + canvas.className = '.aaCanvas' | ||
| 251 | + canvas.height = parseInt(($scope.imageHeight)); | ||
| 252 | + canvas.width = parseInt($scope.imageWidth); | ||
| 253 | + canvas.style.left = '0px'; | ||
| 254 | + canvas.style.top = '0px'; | ||
| 255 | + canvas.style.position = "absolute"; | ||
| 256 | + $("#canvasDiv").append(canvas); | ||
| 257 | + $scope.context = canvas.getContext("2d") | ||
| 258 | + //6. Show all pins on AA opened item | ||
| 259 | + $scope.showAllPins(); | ||
| 260 | + //7. Highlight all system body list in left side | ||
| 261 | + $scope.highlightBodySystemList(); | ||
| 262 | + } | ||
| 263 | + $(".slider").slider({ | ||
| 264 | + min: 25, | ||
| 265 | + max: 100, | ||
| 266 | + value: 100, | ||
| 267 | + range: "min", | ||
| 268 | + orientation: "vertical", | ||
| 269 | + slide: function (event, ui) { | ||
| 270 | + var scope = angular.element(document.getElementById("aaDetailPageDiv")).scope(); | ||
| 271 | + scope.$apply(function () { | ||
| 272 | + scope.sliderVal = ui.value; | ||
| 273 | + scope.removeSpeechBubble(); | ||
| 274 | + var relativeWidth = 0; | ||
| 275 | + var relativeHeight = 0; | ||
| 276 | + if (ui.value == 25 || ui.value == 40 || ui.value == 55 || ui.value == 70 || ui.value == 85 || ui.value == 100) { | ||
| 277 | + if (ui.value == 100) { | ||
| 278 | + relativeWidth = scope.ViewImageWidth; | ||
| 279 | + relativeHeight = scope.ViewImageHeight | ||
| 280 | + scope.sliderPercentValue = 1.0; | ||
| 281 | + } | ||
| 282 | + else if (ui.value == 85) { | ||
| 283 | + relativeWidth = scope.ViewImageWidth * 0.85; | ||
| 284 | + relativeHeight = scope.ViewImageHeight * 0.85; | ||
| 285 | + scope.sliderPercentValue = 0.85; | ||
| 286 | + | ||
| 287 | + } else if (ui.value == 70) { | ||
| 288 | + relativeWidth = scope.ViewImageWidth * 0.70; | ||
| 289 | + relativeHeight = scope.ViewImageHeight * 0.70; | ||
| 290 | + scope.sliderPercentValue = 0.70; | ||
| 291 | + } else if (ui.value == 55) { | ||
| 292 | + | ||
| 293 | + relativeWidth = scope.ViewImageWidth * 0.55; | ||
| 294 | + relativeHeight = scope.ViewImageHeight * 0.55; | ||
| 295 | + scope.sliderPercentValue = 0.55; | ||
| 296 | + | ||
| 297 | + } else if (ui.value == 40) { | ||
| 298 | + | ||
| 299 | + relativeWidth = scope.ViewImageWidth * 0.40; | ||
| 300 | + relativeHeight = scope.ViewImageHeight * 0.40; | ||
| 301 | + scope.sliderPercentValue = 0.40; | ||
| 302 | + | ||
| 303 | + } else if (ui.value == 25) { | ||
| 304 | + | ||
| 305 | + relativeWidth = scope.ViewImageWidth * 0.25; | ||
| 306 | + relativeHeight = scope.ViewImageHeight * 0.25; | ||
| 307 | + scope.sliderPercentValue = 0.25; | ||
| 308 | + | ||
| 309 | + } | ||
| 310 | + } | ||
| 311 | + | ||
| 312 | + if (ui.value == 25 || ui.value == 40 || ui.value == 55 || ui.value == 70 || ui.value == 85 || ui.value == 100) { | ||
| 313 | + $("#modItemImage").css("width", relativeWidth + "px"); | ||
| 314 | + $("#modItemImage").css("height", relativeHeight + "px"); | ||
| 315 | + $("#aaDetailViewCanvas").css("width", relativeWidth + "px"); | ||
| 316 | + $("#modItemImage").css("height", relativeHeight + "px"); | ||
| 317 | + | ||
| 318 | + $("#modItemImage").attr('src', ''); | ||
| 319 | + | ||
| 320 | + | ||
| 321 | + $("#aaDetailViewCanvas").remove(); | ||
| 322 | + //0.5 create canvas on the top of image so that I can draw a line over the canvas. | ||
| 323 | + var canvas = document.createElement('canvas'); | ||
| 324 | + canvas.id = 'aaDetailViewCanvas'; | ||
| 325 | + canvas.className = 'aaCanvas'; | ||
| 326 | + canvas.height = relativeHeight; | ||
| 327 | + canvas.width = relativeWidth; | ||
| 328 | + canvas.style.left = '0px'; | ||
| 329 | + canvas.style.top = '0px'; | ||
| 330 | + canvas.style.position = "absolute"; | ||
| 331 | + | ||
| 332 | + $("#canvasDiv").append(canvas); | ||
| 333 | + scope.context = canvas.getContext("2d") | ||
| 334 | + $("#modItemImage").attr('src', scope.OpenItemImagePath); | ||
| 335 | + scope.isSliderChange = true; | ||
| 336 | + var btnID = ''; | ||
| 337 | + $("div.tools div:eq(1) div").each(function () { | ||
| 338 | + if ($(this).find("button").hasClass("btn-primary")) { | ||
| 339 | + btnID = $(this).find("button").attr("id"); | ||
| 340 | + $('#' + btnID).removeClass("btn-black"); | ||
| 341 | + $('#' + btnID).addClass("btn-primary"); | ||
| 342 | + } | ||
| 343 | + }); | ||
| 344 | + scope.isSelectedPinBtnClickedAftrSliderCange = true; | ||
| 345 | + switch (btnID) { | ||
| 346 | + | ||
| 347 | + case "hidePinBtn": | ||
| 348 | + break; | ||
| 349 | + case "allPinBtn": | ||
| 350 | + scope.showAllPins(); | ||
| 351 | + break; | ||
| 352 | + case "selectedPin": | ||
| 353 | + scope.showAllPins(); | ||
| 354 | + setTimeout(function () { | ||
| 355 | + console.log(scope.allPinDataArray); | ||
| 356 | + scope.activePinOnSliderChange(); | ||
| 357 | + }, 1000); | ||
| 358 | + break; | ||
| 359 | + } | ||
| 360 | + } | ||
| 361 | + | ||
| 362 | + }); | ||
| 363 | + } | ||
| 364 | + }) | ||
| 365 | + .slider("pips", { | ||
| 366 | + rest: "label", | ||
| 367 | + step: "15" | ||
| 368 | + }); | ||
| 369 | + }, 500); | ||
| 370 | + } | ||
| 371 | + | ||
| 372 | + openedImage.onerror = loadFailure; | ||
| 373 | + openedImage.src = $rootScope.OpenItemImagePath; | ||
| 374 | + } | ||
| 375 | + | ||
| 376 | + } | ||
| 377 | + | ||
| 378 | + $scope.highlightBodySystemList = function () { | ||
| 379 | + $rootScope.bodySystemNames = $rootScope.bodySystemName.trim().split(/\s*,\s*/); | ||
| 380 | + var bodySystemListObj = document.getElementById("bodySystemList").getElementsByTagName("a"); | ||
| 381 | + var bodySystemListlength = bodySystemListObj.length; | ||
| 382 | + for (var i = 0; i < bodySystemListlength; i++) { | ||
| 383 | + //var boldTag = lis[i]; | ||
| 384 | + for (var j = 0; j < $rootScope.bodySystemNames.length; j++) { | ||
| 385 | + if ((bodySystemListObj[i].innerHTML) == ($rootScope.bodySystemNames[j])) { | ||
| 386 | + $("#" + i).parent().removeClass("disabledSelectedSystem"); | ||
| 387 | + | ||
| 388 | + } | ||
| 389 | + } | ||
| 390 | + | ||
| 391 | + } | ||
| 392 | + } | ||
| 393 | + function loadFailure() { | ||
| 394 | + console.log('unable to load opened module ietem'); | ||
| 395 | + return true; | ||
| 396 | + } | ||
| 397 | + | ||
| 398 | + | ||
| 399 | + angular.element(document).ready(function (e) { | ||
| 400 | + $("#ImagePanel").resize(function () { | ||
| 401 | + $("#canvasDiv").scrollLeft($rootScope.CanvasDivLeftPosition); | ||
| 402 | + $("#canvasDiv").scrollTop($rootScope.CanvasDivTopPosition); | ||
| 403 | + }); | ||
| 404 | + $(document).on("click", "#ImagePanel .jsPanel-hdr .jsPanel-hdr-r .jsPanel-btn-close .jsglyph-remove", function () { | ||
| 405 | + $scope.setActiveTab(parseInt($rootScope.getLocalStorageValue("activeTab"))); | ||
| 406 | + $(".tools").css("z-index", "15000"); | ||
| 407 | + $rootScope.selectedBodySystemName = 'All'; | ||
| 408 | + $rootScope.selectedBodySystemId = 0; | ||
| 409 | + $rootScope.searchSelectedText = ''; | ||
| 410 | + | ||
| 411 | + }); | ||
| 412 | + | ||
| 413 | + $(document).on("click", "#dvPrintPreview .jsPanel-hdr .jsPanel-hdr-r .jsPanel-btn-close .jsglyph-remove", function () { | ||
| 414 | + | ||
| 415 | + if ($rootScope.isShowAllPinBtnActiveInPrintPreviewMode == true) { | ||
| 416 | + $("#allPinBtn").trigger("click"); | ||
| 417 | + $rootScope.isShowAllPinBtnActiveInPrintPreviewMode = false; | ||
| 418 | + } | ||
| 419 | + if ($rootScope.isHidePinBtnActiveInPrintPreview == true) { | ||
| 420 | + $("#hidePinBtn").trigger("click"); | ||
| 421 | + $rootScope.isHidePinBtnActiveInPrintPreview = false; | ||
| 422 | + } | ||
| 423 | + if($rootScope.isShowSelectedPinActiveInPrintPrevMode == true) | ||
| 424 | + { | ||
| 425 | + $("#selectedPin").trigger("click"); | ||
| 426 | + $rootScope.isShowSelectedPinActiveInPrintPrevMode = false; | ||
| 427 | + } | ||
| 428 | + }); | ||
| 429 | + | ||
| 430 | + }) | ||
| 431 | + $rootScope.aaPinDataArray = []; | ||
| 432 | + $scope.showAllPins = function () { | ||
| 433 | + | ||
| 434 | + $scope.allPinDataArray = []; | ||
| 435 | + var promise = ModuleService.getPinDataForImage($rootScope.imageName) | ||
| 436 | + | ||
| 437 | + .then( | ||
| 438 | + function (result) { | ||
| 439 | + | ||
| 440 | + //load navigator image | ||
| 441 | + if (result.data.Root._NavigatorImage != undefined) { | ||
| 442 | + document.getElementById('navimg').src = '~/../content/images/aa/images/navigator/' + result.data.Root._NavigatorImage; | ||
| 443 | + } | ||
| 444 | + else { | ||
| 445 | + document.getElementById('navimg').style.visibility = 'hidden'; | ||
| 446 | + document.getElementById('navigatorBtn').style.visibility = 'hidden'; | ||
| 447 | + document.getElementById('navigatorDiv').style.visibility = 'hidden'; | ||
| 448 | + | ||
| 449 | + } | ||
| 450 | + | ||
| 451 | + //draw pins | ||
| 452 | + $scope.aaPinData = result.data.Root.Item; | ||
| 453 | + if ($scope.aaPinData != null && $scope.aaPinData.length > 0) { | ||
| 454 | + $rootScope.aaPinDataArray = $scope.aaPinData | ||
| 455 | + angular.forEach($scope.aaPinData, function (value, key) { | ||
| 456 | + $scope.allPinDataArray.push(value._PinId); | ||
| 457 | + $scope.drawStaticPinsOnImage('aaDetailViewCanvas', value._PinId, value._PinX, value._PinY, value._HeadX, value._HeadY) | ||
| 458 | + }) | ||
| 459 | + | ||
| 460 | + | ||
| 461 | + | ||
| 462 | + //load search/vocab data | ||
| 463 | + $rootScope.loadSearchData(); | ||
| 464 | + } | ||
| 465 | + }, | ||
| 466 | + function (error) { | ||
| 467 | + | ||
| 468 | + console.log(' error in showAllPins: ' + error.statusText); | ||
| 469 | + } | ||
| 470 | + ) | ||
| 471 | + if ($scope.isSliderChange == true) { | ||
| 472 | + $timeout(function () { | ||
| 473 | + $scope.activePinOnLayerChange(); | ||
| 474 | + }, 1000); | ||
| 475 | + | ||
| 476 | + } | ||
| 477 | + | ||
| 478 | + } | ||
| 479 | + | ||
| 480 | + | ||
| 481 | + $scope.FilterByImage = function (moduleId, query) { | ||
| 482 | + $scope.moduleId = moduleId; | ||
| 483 | + $scope.filterstring = true; | ||
| 484 | + | ||
| 485 | + console.log('loadForModuleById is called'); | ||
| 486 | + | ||
| 487 | + $rootScope.moduleName = Modules[moduleId].Name; | ||
| 488 | + while ($scope.searchAAListViewData.length) { | ||
| 489 | + $scope.searchAAListViewData.pop(); | ||
| 490 | + } | ||
| 491 | + | ||
| 492 | + var filtercount = 0; | ||
| 493 | + if (typeof (query.selectedbodyregion) !== "undefined" && (query.selectedbodyregion !== null && query.selectedbodyregion !== "")) { | ||
| 494 | + filtercount = filtercount + 1; | ||
| 495 | + localStorage.setItem("CurrentBodyRegion", query.selectedbodyregion); | ||
| 496 | + } | ||
| 497 | + else { | ||
| 498 | + localStorage.setItem("CurrentBodyRegion", ''); | ||
| 499 | + } | ||
| 500 | + | ||
| 501 | + if (typeof (query.selectedbodysystem) !== "undefined" && (query.selectedbodysystem !== null && query.selectedbodysystem !== "")) { | ||
| 502 | + filtercount = filtercount + 1; | ||
| 503 | + localStorage.setItem("CurrentBodySystem", query.selectedbodysystem); | ||
| 504 | + } | ||
| 505 | + else { | ||
| 506 | + localStorage.setItem("CurrentBodySystem", ''); | ||
| 507 | + } | ||
| 508 | + | ||
| 509 | + if (typeof (query.selectedorientation) !== "undefined" && (query.selectedorientation !== null && query.selectedorientation !== '')) { | ||
| 510 | + filtercount = filtercount + 1; | ||
| 511 | + localStorage.setItem("CurrentOrientation", query.selectedorientation); | ||
| 512 | + } | ||
| 513 | + else { | ||
| 514 | + localStorage.setItem("CurrentOrientation", ''); | ||
| 515 | + } | ||
| 516 | + | ||
| 517 | + if (typeof (query.selectedimagetype) !== "undefined" && (query.selectedimagetype !== null && query.selectedimagetype !== '')) { | ||
| 518 | + filtercount = filtercount + 1; | ||
| 519 | + localStorage.setItem("CurrentImageType", query.selectedimagetype); | ||
| 520 | + } | ||
| 521 | + else { | ||
| 522 | + localStorage.setItem("CurrentImageType", ''); | ||
| 523 | + } | ||
| 524 | + | ||
| 525 | + var promise = ModuleService.loadModuleDataBasedOnModuleName($scope.moduleName) | ||
| 526 | + .then( | ||
| 527 | + function (result) { | ||
| 528 | + // alert(JSON.stringify($scope.moduleLandingData)); | ||
| 529 | + $scope.moduleLandingData = result; | ||
| 530 | + $scope.selectedAAListViewData = new jinqJs() | ||
| 531 | + .from($scope.moduleLandingData.data.root.Item) | ||
| 532 | + .orderBy([{ field: '_Title', sort: 'asc' }]) | ||
| 533 | + .select(); | ||
| 534 | + | ||
| 535 | + $('#grid-view').empty(); | ||
| 536 | + //alert(JSON.stringify($scope.selectedAAListViewData)) | ||
| 537 | + angular.forEach($scope.selectedAAListViewData, function (value, key) { | ||
| 538 | + | ||
| 539 | + var selectimg = true; | ||
| 540 | + var count = 0; | ||
| 541 | + | ||
| 542 | + | ||
| 543 | + if (typeof (query.selectedbodyregion) !== "undefined" && (query.selectedbodyregion !== null && query.selectedbodyregion !== "")) { | ||
| 544 | + var posbodyregion = value._BodyRegion.indexOf((query.selectedbodyregion.trim())); | ||
| 545 | + if (posbodyregion > -1) { | ||
| 546 | + selectimg = true; | ||
| 547 | + count = count + 1; | ||
| 548 | + } | ||
| 549 | + else { | ||
| 550 | + selectimg = false; | ||
| 551 | + count = count - 1; | ||
| 552 | + } | ||
| 553 | + | ||
| 554 | + } | ||
| 555 | + | ||
| 556 | + if (typeof (query.selectedbodysystem) !== "undefined" && (query.selectedbodysystem !== null && query.selectedbodysystem !== "")) { | ||
| 557 | + var posbodysystem = value._BodySystem.indexOf(query.selectedbodysystem); | ||
| 558 | + if (posbodysystem > -1) { | ||
| 559 | + count = count + 1; | ||
| 560 | + selectimg = true; | ||
| 561 | + } else { | ||
| 562 | + selectimg = false; | ||
| 563 | + count = count - 1; | ||
| 564 | + } | ||
| 565 | + } | ||
| 566 | + | ||
| 567 | + if (typeof (query.selectedorientation) !== "undefined" && (query.selectedorientation !== null && query.selectedorientation !== "")) { | ||
| 568 | + var posorientation = value._ViewOrientation.indexOf(query.selectedorientation); | ||
| 569 | + if (posorientation > -1) { | ||
| 570 | + count = count + 1; | ||
| 571 | + selectimg = true; | ||
| 572 | + | ||
| 573 | + } else { | ||
| 574 | + selectimg = false; | ||
| 575 | + count = count - 1; | ||
| 576 | + } | ||
| 577 | + | ||
| 578 | + } | ||
| 579 | + | ||
| 580 | + if (typeof (query.selectedimagetype) !== "undefined" && (query.selectedimagetype !== null && query.selectedimagetype !== "")) { | ||
| 581 | + var posimagetype = value._ImageType.indexOf(query.selectedimagetype); | ||
| 582 | + if (posimagetype > -1) { | ||
| 583 | + count = count + 1; | ||
| 584 | + selectimg = true; | ||
| 585 | + | ||
| 586 | + } else { | ||
| 587 | + selectimg = false; | ||
| 588 | + count = count - 1; | ||
| 589 | + } | ||
| 590 | + | ||
| 591 | + } | ||
| 592 | + | ||
| 593 | + if (selectimg === true && count >= filtercount) { | ||
| 594 | + | ||
| 595 | + $scope.imagePath = "../content/images/aa/thumbnails/" + value._TileImageName; | ||
| 596 | + | ||
| 597 | + | ||
| 598 | + var $el = $('<div id="' + value._Title + '" class="col-sm-3 col-lg-2" title = "' + value._Title + '" data-ng-click="openModuleItemView($event)">' | ||
| 599 | + + '<div class="thumbnail" ><a href="#">' | ||
| 600 | + + '<img class="tinyImg" id="' + value._Title + '"ng-src="' + $scope.imagePath + '" alt="" title="" >' | ||
| 601 | + + '<div class="caption"><p>' + value._Title + '</p></div></a></div></div>').appendTo('#grid-view'); | ||
| 602 | + | ||
| 603 | + | ||
| 604 | + $compile($el)($scope); | ||
| 605 | + | ||
| 606 | + $(".sidebar").mCustomScrollbar({ | ||
| 607 | + autoHideScrollbar: true, | ||
| 608 | + //theme:"rounded" | ||
| 609 | + }); | ||
| 610 | + | ||
| 611 | + | ||
| 612 | + $scope.searchAAListViewData.push( | ||
| 613 | + { | ||
| 614 | + "_Id": value._Id, | ||
| 615 | + "_ImageId": value._ImageId, | ||
| 616 | + "_Title": value._Title, | ||
| 617 | + "_ImageName": value._contentImage, | ||
| 618 | + "_TileImageName": value._ThumbnailImage, | ||
| 619 | + "_BodySystem": value._BodySystem, | ||
| 620 | + "_BodyRegion": value._BodyRegion, | ||
| 621 | + "_ViewOrientation": value._ViewOrientation, | ||
| 622 | + "_ImageType": value._ImageType | ||
| 623 | + //"$$hashKey": value._Summary | ||
| 624 | + | ||
| 625 | + }); | ||
| 626 | + console.log($scope.searchAAListViewData); | ||
| 627 | + if ($('#searchItem').length > 0) | ||
| 628 | + $('#searchItem').remove(); | ||
| 629 | + } | ||
| 630 | + }); | ||
| 631 | + | ||
| 632 | + //Show Error Message in case of gridview/ ListView [if no data is found] | ||
| 633 | + if ($scope.searchAAListViewData.length == 0) { | ||
| 634 | + var $el = $('<div class="col-sm-12" style="padding-left:25px;padding-top:10px;"><strong style="color:white">No illustration found for the selected search criteria!</strong></div>').appendTo('#grid-view'); | ||
| 635 | + $compile($el)($scope); | ||
| 636 | + $('table > #ListViewDiv > #searchItem').remove(); | ||
| 637 | + | ||
| 638 | + $('#ListViewDiv').append('<tr id="searchItem"><td colspan="6"><strong style="color:black;">No illustration found for the selected search criteria!</strong></td></tr>'); | ||
| 639 | + } | ||
| 640 | + //console.log(JSON.stringify(result, null, 4)); | ||
| 641 | + console.log('SearchAAListViewData--' + $scope.searchAAListViewData); | ||
| 642 | + }, | ||
| 643 | + function (error) { | ||
| 644 | + // handle errors here | ||
| 645 | + console.log(' error: ' + error.statusText); | ||
| 646 | + } | ||
| 647 | + ) | ||
| 648 | + } | ||
| 649 | + | ||
| 650 | + $scope.Reset = function (moduleId, query) { | ||
| 651 | + | ||
| 652 | + query.selectedbodyregion = ""; | ||
| 653 | + query.selectedbodysystem = ""; | ||
| 654 | + query.selectedorientation = ""; | ||
| 655 | + query.selectedimagetype = ""; | ||
| 656 | + query.selectedspecialty = ""; | ||
| 657 | + | ||
| 658 | + | ||
| 659 | + //set localstorage values | ||
| 660 | + localStorage.setItem("CurrentBodyRegion", ''); | ||
| 661 | + localStorage.setItem("CurrentBodySystem", ''); | ||
| 662 | + localStorage.setItem("CurrentOrientation", ''); | ||
| 663 | + localStorage.setItem("CurrentImageType", ''); | ||
| 664 | + //localStorage.setItem("CISelectedRowId", ""); | ||
| 665 | + //localStorage.setItem("CIListViewScroll", ''); | ||
| 666 | + | ||
| 667 | + if ($('.selected').hasClass("selected")) { $('.selected').removeClass("selected"); } | ||
| 668 | + | ||
| 669 | + $('#ListViewDiv').scrollTop(0); | ||
| 670 | + | ||
| 671 | + if ($('#demoView').length > 0) | ||
| 672 | + $('#demoView').remove(); | ||
| 673 | + // $scope.HideListViewDiv(); | ||
| 674 | + | ||
| 675 | + $scope.filterstring = false; | ||
| 676 | + //while ($scope.searchCIListViewData.length) { | ||
| 677 | + // $scope.searchCIListViewData.pop(); | ||
| 678 | + //} | ||
| 679 | + | ||
| 680 | + $scope.FilterByImage(1, query); | ||
| 681 | + | ||
| 682 | + } | ||
| 683 | + | ||
| 684 | + $scope.showSelectedSystemPins = function (event) { | ||
| 685 | + var bodySystemListObj = document.getElementById("bodySystemList").getElementsByTagName("a"); | ||
| 686 | + var bodySystemListlength = bodySystemListObj.length; | ||
| 687 | + for (var i = 0; i < bodySystemListlength; i++) { | ||
| 688 | + | ||
| 689 | + $("#" + i).parent().removeClass("activeAASystemSelect"); | ||
| 690 | + } | ||
| 691 | + $("#" + event.currentTarget.id).parent().addClass("activeAASystemSelect"); | ||
| 692 | + | ||
| 693 | + $rootScope.isLoading = true; | ||
| 694 | + $('#spinner').css('visibility', 'visible'); | ||
| 695 | + | ||
| 696 | + $scope.removeSpeechBubble(); | ||
| 697 | + if (event.currentTarget.id == "0") { | ||
| 698 | + | ||
| 699 | + $scope.selectedSystemName = null; | ||
| 700 | + if ($scope.isHidePinBtnClicked) { | ||
| 701 | + | ||
| 702 | + // $scope.showAllPinsAfterHide($scope.aaPinData); | ||
| 703 | + $scope.showAllPinsAfterHide(); | ||
| 704 | + } | ||
| 705 | + else { | ||
| 706 | + $scope.showAllPins(); | ||
| 707 | + } | ||
| 708 | + } | ||
| 709 | + else { | ||
| 710 | + | ||
| 711 | + $scope.selectedSystemName = event.currentTarget.title; | ||
| 712 | + // get termText info | ||
| 713 | + var promise = ModuleService.getTermTextDataForPin($scope.moduleName) | ||
| 714 | + .then( | ||
| 715 | + function (response) { | ||
| 716 | + | ||
| 717 | + $scope.TermInfo = response.data.Terms.Term; | ||
| 718 | + | ||
| 719 | + //on gettng all required data, draw pins | ||
| 720 | + if ($scope.aaPinData != null && $scope.aaPinData.length > 0) { | ||
| 721 | + | ||
| 722 | + $scope.selectedSystemPinData = new jinqJs() | ||
| 723 | + .from($scope.aaPinData) | ||
| 724 | + .where("_BodySystemName == " + $scope.selectedSystemName) | ||
| 725 | + .select(); | ||
| 726 | + if ($scope.isHidePinBtnClicked) { | ||
| 727 | + // $scope.showAllPinsAfterHide($scope.selectedSystemPinData); | ||
| 728 | + $scope.showAllPinsAfterHide(); | ||
| 729 | + | ||
| 730 | + } | ||
| 731 | + else { | ||
| 732 | + //remove other system pins | ||
| 733 | + if ($scope.selectedSystemPinData != null && $scope.selectedSystemPinData.length > 0) { | ||
| 734 | + | ||
| 735 | + angular.forEach($scope.aaPinData, function (aaPinDataValue, aaPinDataKey) { | ||
| 736 | + | ||
| 737 | + if (aaPinDataValue._BodySystemName != $scope.selectedSystemName) | ||
| 738 | + $scope.removePin('aaDetailViewCanvas', aaPinDataValue._PinId); | ||
| 739 | + }) | ||
| 740 | + | ||
| 741 | + angular.forEach($scope.selectedSystemPinData, function (value, key) { | ||
| 742 | + | ||
| 743 | + | ||
| 744 | + $scope.drawStaticPinsOnImage('aaDetailViewCanvas', value._PinId, value._PinX, value._PinY, value._HeadX, value._HeadY) | ||
| 745 | + | ||
| 746 | + }) | ||
| 747 | + //show annotation on first pin of the sysyem | ||
| 748 | + $scope.showAnnotation($scope.selectedSystemPinData, false, false, false); | ||
| 749 | + } | ||
| 750 | + } | ||
| 751 | + } | ||
| 752 | + }, | ||
| 753 | + function (error) { | ||
| 754 | + // handle errors here | ||
| 755 | + console.log(' error: ' + error.statusText); | ||
| 756 | + } | ||
| 757 | + ) | ||
| 758 | + | ||
| 759 | + } | ||
| 760 | + } | ||
| 761 | + | ||
| 762 | + $scope.showAnnotation = function (selectedPinData, isCtrlPressed, isPinClicked, isItemSearched) { | ||
| 763 | + $scope.clickedPins = []; | ||
| 764 | + $scope.selectedPin = []; | ||
| 765 | + var isSameTermWithMultiPin = false; | ||
| 766 | + var firstPinId = selectedPinData[0]._PinId; | ||
| 767 | + var pinTermNumber = selectedPinData[0]._TermId; | ||
| 768 | + | ||
| 769 | + //check if other pin have same termNumber | ||
| 770 | + if ($scope.aaPinData != null && $scope.aaPinData.length > 0) { | ||
| 771 | + | ||
| 772 | + var pinDataWithFirstTermNumber = new jinqJs() | ||
| 773 | + .from($scope.aaPinData) | ||
| 774 | + .where("_TermId == " + pinTermNumber) | ||
| 775 | + .select(); | ||
| 776 | + | ||
| 777 | + $scope.MultiLanguageAnnationArray = []; | ||
| 778 | + | ||
| 779 | + $scope.GetAnnotationBasedOnActualTermNo(pinTermNumber); | ||
| 780 | + | ||
| 781 | + if (isCtrlPressed) { | ||
| 782 | + | ||
| 783 | + } | ||
| 784 | + else { | ||
| 785 | + if (isPinClicked || isItemSearched) { | ||
| 786 | + var existingSpeechBubble = $("div[id*='speechBubble']"); | ||
| 787 | + for (var i = 0; i < existingSpeechBubble.length; i++) { | ||
| 788 | + existingSpeechBubble[i].parentNode.removeChild(existingSpeechBubble[i]); | ||
| 789 | + | ||
| 790 | + //make all pin heads grey | ||
| 791 | + var radial = $('#aaDetailViewCanvas').createGradient({ | ||
| 792 | + x1: 50, y1: 50, | ||
| 793 | + x2: 50, y2: 50, | ||
| 794 | + r1: 10, r2: 30, | ||
| 795 | + c1: 'rgba(100, 50, 0,0)', | ||
| 796 | + c2: 'rgb(216, 216, 216)' | ||
| 797 | + }); | ||
| 798 | + | ||
| 799 | + | ||
| 800 | + $('#aaDetailViewCanvas').setLayers({ | ||
| 801 | + fillStyle: radial, | ||
| 802 | + }).drawLayers(); | ||
| 803 | + } | ||
| 804 | + | ||
| 805 | + var existingSpeechBubbleLine = $("div[id*='speechBubbleLine']"); | ||
| 806 | + for (var i = 0; i < existingSpeechBubbleLine.length; i++) { | ||
| 807 | + existingSpeechBubbleLine[i].parentNode.removeChild(existingSpeechBubbleLine[i]); | ||
| 808 | + } | ||
| 809 | + var speechBubbleDraggedLine = $("div[id*='speechBubbleDraggedLine']"); | ||
| 810 | + for (var i = 0; i < speechBubbleDraggedLine.length; i++) { | ||
| 811 | + speechBubbleDraggedLine[i].parentNode.removeChild(speechBubbleDraggedLine[i]); | ||
| 812 | + } | ||
| 813 | + } | ||
| 814 | + } | ||
| 815 | + if (pinDataWithFirstTermNumber.length > 1) { | ||
| 816 | + isSameTermWithMultiPin = true; | ||
| 817 | + } | ||
| 818 | + | ||
| 819 | + angular.forEach(pinDataWithFirstTermNumber, function (value, key) { | ||
| 820 | + $scope.selectedPin.push(value._PinId); | ||
| 821 | + $scope.clickedPins.push({ 'id': value._PinId }); | ||
| 822 | + var headX = (parseInt(value._HeadX)); | ||
| 823 | + var headY = (parseInt(value._HeadY)); | ||
| 824 | + $scope.createSpeechBubble(parseInt(headX) + 10, parseInt(headY) + 10, value._PinId, isCtrlPressed, isPinClicked, isSameTermWithMultiPin); | ||
| 825 | + }) | ||
| 826 | + | ||
| 827 | + } | ||
| 828 | + | ||
| 829 | + $rootScope.isLoading = false; | ||
| 830 | + $('#spinner').css('visibility', 'hidden'); | ||
| 831 | + // $scope.MultiLanguageAnnationArray.push($rootScope.annotationText[i]) | ||
| 832 | + } | ||
| 833 | + | ||
| 834 | + $scope.removeSpeechBubble = function () { | ||
| 835 | + | ||
| 836 | + | ||
| 837 | + //clear speech bubbles | ||
| 838 | + var speechBubbles = $("div[id*='speechBubble']"); | ||
| 839 | + if (speechBubbles != null || speechBubbles != undefined && speechBubbles.length > 0) { | ||
| 840 | + for (var j = 0; j < speechBubbles.length; j++) { | ||
| 841 | + | ||
| 842 | + speechBubbles[j].parentNode.removeChild(speechBubbles[j]); | ||
| 843 | + } | ||
| 844 | + } | ||
| 845 | + var speechBubbleLines = $("div[id*='speechBubbleLine']"); | ||
| 846 | + if (speechBubbleLines != null || speechBubbleLines != undefined && speechBubbleLines.length > 0) { | ||
| 847 | + for (var j = 0; j < speechBubbleLines.length; j++) { | ||
| 848 | + | ||
| 849 | + speechBubbleLines[j].parentNode.removeChild(speechBubbleLines[j]); | ||
| 850 | + } | ||
| 851 | + } | ||
| 852 | + | ||
| 853 | + var speechBubbleDraggedLines = $("div[id*='speechBubbleDraggedLine']"); | ||
| 854 | + if (speechBubbleDraggedLines != null || speechBubbleDraggedLines != undefined && speechBubbleDraggedLines.length > 0) { | ||
| 855 | + for (var j = 0; j < speechBubbleDraggedLines.length; j++) { | ||
| 856 | + | ||
| 857 | + speechBubbleDraggedLines[j].parentNode.removeChild(speechBubbleDraggedLines[j]); | ||
| 858 | + } | ||
| 859 | + } | ||
| 860 | + }; | ||
| 861 | + | ||
| 862 | + $scope.showSpeechBubble = function () { | ||
| 863 | + | ||
| 864 | + | ||
| 865 | + //clear speech bubbles | ||
| 866 | + var speechBubbles = $("div[id*='speechBubble']"); | ||
| 867 | + if (speechBubbles != null || speechBubbles != undefined && speechBubbles.length > 0) { | ||
| 868 | + for (var j = 0; j < speechBubbles.length; j++) { | ||
| 869 | + | ||
| 870 | + document.getElementById(speechBubbles[j].id).style.visibility = 'visible'; | ||
| 871 | + } | ||
| 872 | + } | ||
| 873 | + var speechBubbleLines = $("div[id*='speechBubbleLine']"); | ||
| 874 | + if (speechBubbleLines != null || speechBubbleLines != undefined && speechBubbleLines.length > 0) { | ||
| 875 | + for (var j = 0; j < speechBubbleLines.length; j++) { | ||
| 876 | + | ||
| 877 | + document.getElementById(speechBubbleLines[j].id).style.visibility = 'visible'; | ||
| 878 | + } | ||
| 879 | + } | ||
| 880 | + | ||
| 881 | + var speechBubbleDraggedLines = $("div[id*='speechBubbleDraggedLine']"); | ||
| 882 | + if (speechBubbleDraggedLines != null || speechBubbleDraggedLines != undefined && speechBubbleDraggedLines.length > 0) { | ||
| 883 | + for (var j = 0; j < speechBubbleDraggedLines.length; j++) { | ||
| 884 | + | ||
| 885 | + document.getElementById(speechBubbleDraggedLines[j].id).style.visibility = 'visible'; | ||
| 886 | + } | ||
| 887 | + } | ||
| 888 | + }; | ||
| 889 | + | ||
| 890 | + $scope.hideSpeechBubble = function () { | ||
| 891 | + | ||
| 892 | + | ||
| 893 | + //clear speech bubbles | ||
| 894 | + var speechBubbles = $("div[id*='speechBubble']"); | ||
| 895 | + if (speechBubbles != null || speechBubbles != undefined && speechBubbles.length > 0) { | ||
| 896 | + for (var j = 0; j < speechBubbles.length; j++) { | ||
| 897 | + | ||
| 898 | + document.getElementById(speechBubbles[j].id).style.visibility = 'hidden'; | ||
| 899 | + } | ||
| 900 | + } | ||
| 901 | + var speechBubbleLines = $("div[id*='speechBubbleLine']"); | ||
| 902 | + if (speechBubbleLines != null || speechBubbleLines != undefined && speechBubbleLines.length > 0) { | ||
| 903 | + for (var j = 0; j < speechBubbleLines.length; j++) { | ||
| 904 | + | ||
| 905 | + document.getElementById(speechBubbleLines[j].id).style.visibility = 'hidden'; | ||
| 906 | + } | ||
| 907 | + } | ||
| 908 | + | ||
| 909 | + var speechBubbleDraggedLines = $("div[id*='speechBubbleDraggedLine']"); | ||
| 910 | + if (speechBubbleDraggedLines != null || speechBubbleDraggedLines != undefined && speechBubbleDraggedLines.length > 0) { | ||
| 911 | + for (var j = 0; j < speechBubbleDraggedLines.length; j++) { | ||
| 912 | + | ||
| 913 | + document.getElementById(speechBubbleDraggedLines[j].id).style.visibility = 'hidden'; | ||
| 914 | + } | ||
| 915 | + } | ||
| 916 | + }; | ||
| 917 | + | ||
| 918 | + | ||
| 919 | + $scope.createSpeechBubble = function (x, y, PinId, isCtrlPressed, isPinClicked, isSameTermWithMultiPin) { | ||
| 920 | + | ||
| 921 | + $scope.longestAnnotation = $scope.MultiLanguageAnnationArray.reduce(function (firstAnnotation, seconAnnotation) { return firstAnnotation.length > seconAnnotation.length ? firstAnnotation : seconAnnotation; }); | ||
| 922 | + | ||
| 923 | + $scope.createSpeechBubbleBasedOnAnnotationLength(x, y, PinId); | ||
| 924 | + | ||
| 925 | + $('#speechBubble').draggable( | ||
| 926 | + { | ||
| 927 | + drag: function (evt) { | ||
| 928 | + $("#dot").css("visibility", "hidden"); | ||
| 929 | + var verticalScrollPosition = canvasDiv.scrollTop; | ||
| 930 | + var horizontlScrollPosition = canvasDiv.scrollLeft; | ||
| 931 | + $scope.angle(x * $scope.sliderPercentValue, y * $scope.sliderPercentValue, evt.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left, evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top, true); | ||
| 932 | + }, | ||
| 933 | + }); | ||
| 934 | + | ||
| 935 | + } | ||
| 936 | + $scope.sliderVal = 100; | ||
| 937 | + $scope.createSpeechBubbleBasedOnAnnotationLength = function (x, y, PinId) { | ||
| 938 | + | ||
| 939 | + x = x * $scope.sliderPercentValue; | ||
| 940 | + y = y * $scope.sliderPercentValue; | ||
| 941 | + | ||
| 942 | + 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>' | ||
| 943 | + + '<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;">' | ||
| 944 | + + '<span style="position:absolute;right:-3px;top:-4px;color:#ffffff;cursor:pointer;">' | ||
| 945 | + + '<img id="closeBtn' + PinId + ' " class="crossDiv_temp" style="width:18px" src=' + $rootScope.closeBtnImgPath + '></span></div>' | ||
| 946 | + | ||
| 947 | + + '<div style="position:absolute;border:1px solid #000;display:none;z-index:12000;" id="speechBubbleDraggedLine' + PinId + '">' | ||
| 948 | + + '</div>'; | ||
| 949 | + | ||
| 950 | + //Issue #7286 :Undefined annotation should not appear | ||
| 951 | + for (var i = 0; i <= $scope.MultiLanguageAnnationArray.length - 1; i++) { | ||
| 952 | + var MultipleLanguage = $scope.MultiLanguageAnnationArray[i]; | ||
| 953 | + } | ||
| 954 | + | ||
| 955 | + if (MultipleLanguage == undefined) { | ||
| 956 | + console.log("No text is found"); | ||
| 957 | + } else { | ||
| 958 | + $('#canvasDiv').append(speechBubbleHTML); | ||
| 959 | + | ||
| 960 | + if ($scope.MultiLanguageAnnationArray.length > 0) { | ||
| 961 | + for (var i = 0; i <= $scope.MultiLanguageAnnationArray.length - 1; i++) { | ||
| 962 | + var MultipleLanguage = $scope.MultiLanguageAnnationArray[i]; | ||
| 963 | + $rootScope.clickedPinAnnotation = $scope.MultiLanguageAnnationArray[0]; | ||
| 964 | + $("#speechBubble" + PinId).append("<p style='margin-bottom:2px;'>" + MultipleLanguage + "</p>"); | ||
| 965 | + } | ||
| 966 | + } | ||
| 967 | + else { | ||
| 968 | + console.log('MultiLanguageAnnationArray.length is :' + $scope.MultiLanguageAnnationArray.length) | ||
| 969 | + } | ||
| 970 | + | ||
| 971 | + | ||
| 972 | + | ||
| 973 | + | ||
| 974 | + | ||
| 975 | + if ($scope.longestAnnotation != null || $scope.longestAnnotation != undefined) { | ||
| 976 | + if ($scope.longestAnnotation.length <= 10) { | ||
| 977 | + | ||
| 978 | + | ||
| 979 | + $("#speechBubble").css("width", "100px"); | ||
| 980 | + | ||
| 981 | + } | ||
| 982 | + | ||
| 983 | + else if ($scope.longestAnnotation.length > 10 && $scope.longestAnnotation.length <= 17) { | ||
| 984 | + | ||
| 985 | + | ||
| 986 | + | ||
| 987 | + $("#speechBubble").css("width", "140px"); | ||
| 988 | + | ||
| 989 | + } | ||
| 990 | + else if ($scope.longestAnnotation.length > 17 && $scope.longestAnnotation.length <= 26) { | ||
| 991 | + | ||
| 992 | + | ||
| 993 | + $("#speechBubble").css("width", "195px"); | ||
| 994 | + | ||
| 995 | + } | ||
| 996 | + else if ($scope.longestAnnotation.length > 26 && $scope.longestAnnotation.length <= 34) { | ||
| 997 | + | ||
| 998 | + $("#speechBubble").css("width", "248px"); | ||
| 999 | + | ||
| 1000 | + } | ||
| 1001 | + else if ($scope.longestAnnotation.length > 34 && $scope.longestAnnotation.length <= 44) { | ||
| 1002 | + | ||
| 1003 | + | ||
| 1004 | + $("#speechBubble").css("width", "300px"); | ||
| 1005 | + } | ||
| 1006 | + | ||
| 1007 | + else if ($scope.longestAnnotation.length > 44 && $scope.longestAnnotation.length <= 54) { | ||
| 1008 | + | ||
| 1009 | + $("#speechBubble").css("width", "370px"); | ||
| 1010 | + } | ||
| 1011 | + | ||
| 1012 | + else if ($scope.longestAnnotation.length > 54 && $scope.longestAnnotation.length <= 69) { | ||
| 1013 | + $("#speechBubble").css("width", "450px"); | ||
| 1014 | + } | ||
| 1015 | + else if ($scope.longestAnnotation.length > 69 && $scope.longestAnnotation.length <= 75) { | ||
| 1016 | + $("#speechBubble").css("width", "510px"); | ||
| 1017 | + } | ||
| 1018 | + else { | ||
| 1019 | + $("#speechBubble").css("width", ($scope.longestAnnotation.length) + "%"); | ||
| 1020 | + } | ||
| 1021 | + } | ||
| 1022 | + } | ||
| 1023 | + var speechBubbleDims = []; | ||
| 1024 | + | ||
| 1025 | + $rootScope.speechBubbleDimaensions.push({ "currentX": x, "currentY": y, "id": PinId }); | ||
| 1026 | + speechBubbleDims.push({ currentX: x, currentY: y }); | ||
| 1027 | + document.getElementById('speechBubbleLine' + PinId + '').style.display = 'block'; | ||
| 1028 | + document.getElementById('speechBubbleLine' + PinId + '').style.left = ((speechBubbleDims[0].currentX - 12)) + 'px'; | ||
| 1029 | + if ($scope.sliderVal == 25) { | ||
| 1030 | + document.getElementById('speechBubbleLine' + PinId + '').style.top = ((speechBubbleDims[0].currentY + 5)) + 'px'; | ||
| 1031 | + } | ||
| 1032 | + else { | ||
| 1033 | + document.getElementById('speechBubbleLine' + PinId + '').style.top = ((speechBubbleDims[0].currentY)) + 'px'; | ||
| 1034 | + } | ||
| 1035 | + document.getElementById('speechBubble' + PinId + '').style.display = 'block'; | ||
| 1036 | + document.getElementById('speechBubble' + PinId + '').style.left = (speechBubbleDims[0].currentX - 4) + 'px'; | ||
| 1037 | + document.getElementById('speechBubble' + PinId + '').style.top = (speechBubbleDims[0].currentY) + 'px'; | ||
| 1038 | + $('.common-drag').draggable( | ||
| 1039 | + { | ||
| 1040 | + | ||
| 1041 | + drag: function (evt) { | ||
| 1042 | + | ||
| 1043 | + var verticalScrollPosition = document.getElementById('canvasDiv').scrollTop; | ||
| 1044 | + var horizontlScrollPosition = document.getElementById('canvasDiv').scrollLeft; | ||
| 1045 | + var clickedSpeechBubbleId = $(this).attr("id"); | ||
| 1046 | + | ||
| 1047 | + var clickedPinId = clickedSpeechBubbleId.substring(12, clickedSpeechBubbleId.length); | ||
| 1048 | + | ||
| 1049 | + $("#speechBubbleLine" + clickedPinId).css("visibility", "hidden"); | ||
| 1050 | + $("#speechBubbleLine" + clickedPinId).css("display", "none"); | ||
| 1051 | + | ||
| 1052 | + for (var i = 0; i <= $rootScope.speechBubbleDimaensions.length - 1; i++) { | ||
| 1053 | + if ($rootScope.speechBubbleDimaensions[i].id == clickedPinId) { | ||
| 1054 | + $scope.angle(clickedPinId, $rootScope.speechBubbleDimaensions[i].currentX, $rootScope.speechBubbleDimaensions[i].currentY, evt.pageX + horizontlScrollPosition - $('#canvasDiv').offset().left, evt.pageY + verticalScrollPosition - $('#canvasDiv').offset().top, true); | ||
| 1055 | + } | ||
| 1056 | + } | ||
| 1057 | + | ||
| 1058 | + }, | ||
| 1059 | + }); | ||
| 1060 | + $('.crossDiv_temp').on('click', function (evt) { | ||
| 1061 | + | ||
| 1062 | + var imgId = $(this).attr("id"); | ||
| 1063 | + var pinId = imgId.substring(8, imgId.length); | ||
| 1064 | + $('#speechBubble' + pinId).remove(); | ||
| 1065 | + $("#speechBubbleDraggedLine" + pinId).remove(); | ||
| 1066 | + $("#speechBubbleLine" + pinId).remove(); | ||
| 1067 | + | ||
| 1068 | + //make all pin heads grey | ||
| 1069 | + var pinHeadName = 'PinArc_' + pinId; | ||
| 1070 | + var radial = $('#aaDetailViewCanvas').createGradient({ | ||
| 1071 | + x1: 50, y1: 50, | ||
| 1072 | + x2: 50, y2: 50, | ||
| 1073 | + r1: 10, r2: 30, | ||
| 1074 | + c1: 'rgba(100, 50, 0,0)', | ||
| 1075 | + c2: 'rgb(216, 216, 216)' | ||
| 1076 | + }); | ||
| 1077 | + | ||
| 1078 | + | ||
| 1079 | + $('#aaDetailViewCanvas').setLayer(pinHeadName, { | ||
| 1080 | + fillStyle: radial, | ||
| 1081 | + }).drawLayers(); | ||
| 1082 | + }); | ||
| 1083 | + | ||
| 1084 | + //make the head green | ||
| 1085 | + var radialAfterClick = $('#aaDetailViewCanvas').createGradient({ | ||
| 1086 | + x1: 50, y1: 50, | ||
| 1087 | + x2: 50, y2: 50, | ||
| 1088 | + r1: 10, r2: 30, | ||
| 1089 | + c1: 'rgba(100, 50, 0,0)', | ||
| 1090 | + c2: 'rgb(126, 187, 83)' | ||
| 1091 | + }); | ||
| 1092 | + var pinHeadName = 'PinArc_' + PinId; | ||
| 1093 | + var pin = $('#aaDetailViewCanvas').getLayer(pinHeadName); | ||
| 1094 | + // pin.fillStyle = radialAfterClick; | ||
| 1095 | + | ||
| 1096 | + $('#aaDetailViewCanvas').setLayer(pinHeadName, { | ||
| 1097 | + fillStyle: radialAfterClick, | ||
| 1098 | + }).drawLayers(); | ||
| 1099 | + } | ||
| 1100 | + | ||
| 1101 | + | ||
| 1102 | + $scope.angle = function (id, cx, cy, ex, ey, BoolValues) { | ||
| 1103 | + | ||
| 1104 | + var dy = ey - cy; | ||
| 1105 | + var dx = ex - cx; | ||
| 1106 | + var theta = 0; | ||
| 1107 | + if (dx < 0) { | ||
| 1108 | + theta = Math.atan(dy / dx) * (180 / Math.PI); | ||
| 1109 | + theta = theta + 180; | ||
| 1110 | + | ||
| 1111 | + } | ||
| 1112 | + else if (dy < 0) { | ||
| 1113 | + theta = Math.atan(dy / dx) * (180 / Math.PI); | ||
| 1114 | + theta = theta + 360; | ||
| 1115 | + | ||
| 1116 | + } | ||
| 1117 | + else { | ||
| 1118 | + theta = Math.atan(dy / dx) * (180 / Math.PI); | ||
| 1119 | + } | ||
| 1120 | + | ||
| 1121 | + var d = Math.sqrt((cx - ex) * (cx - ex) + (cy - ey) * (cy - ey)); | ||
| 1122 | + var e = cy; | ||
| 1123 | + var f = cx; | ||
| 1124 | + | ||
| 1125 | + if (BoolValues == true) { | ||
| 1126 | + if ($scope.sliderVal == 40) { | ||
| 1127 | + $("#speechBubbleDraggedLine" + id).css({ 'display': 'block', 'width': d + 'px', 'top': (e - 5) + 'px', 'left': (f - 5) + 'px', 'transform': 'rotate(' + theta + 'deg)', '-moz-transform': 'rotate(' + theta + 'deg)', '-webkit-transform': 'rotate(' + theta + 'deg)', 'transform-origin': '0% 0%' }); | ||
| 1128 | + } | ||
| 1129 | + else if ($scope.sliderVal == 25) { | ||
| 1130 | + $("#speechBubbleDraggedLine" + id).css({ 'display': 'block', 'width': d + 'px', 'top': (e - 2) + 'px', 'left': (f - 2) + 'px', 'transform': 'rotate(' + theta + 'deg)', '-moz-transform': 'rotate(' + theta + 'deg)', '-webkit-transform': 'rotate(' + theta + 'deg)', 'transform-origin': '0% 0%' }); | ||
| 1131 | + } | ||
| 1132 | + else { | ||
| 1133 | + $("#speechBubbleDraggedLine" + id).css({ 'display': 'block', 'width': d + 'px', 'top': (e - 10) + 'px', 'left': (f - 5) + 'px', 'transform': 'rotate(' + theta + 'deg)', '-moz-transform': 'rotate(' + theta + 'deg)', '-webkit-transform': 'rotate(' + theta + 'deg)', 'transform-origin': '0% 0%' }); | ||
| 1134 | + } | ||
| 1135 | + | ||
| 1136 | + } | ||
| 1137 | + else { | ||
| 1138 | + $("#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%' }); | ||
| 1139 | + } | ||
| 1140 | + | ||
| 1141 | + | ||
| 1142 | + | ||
| 1143 | + } | ||
| 1144 | + | ||
| 1145 | + | ||
| 1146 | + $scope.drawStaticPinsOnImage = function (canvasId, PinId, offsetX1, offsetY1, x, y) { | ||
| 1147 | + $scope.clickedPins = []; | ||
| 1148 | + // if ($scope.isSliderChange == true) { | ||
| 1149 | + console.log('isSliderrChange') | ||
| 1150 | + var radial = $('#' + canvasId).createGradient({ | ||
| 1151 | + x1: 50, y1: 50, | ||
| 1152 | + x2: 50, y2: 50, | ||
| 1153 | + r1: 10, r2: 30, | ||
| 1154 | + c1: 'rgba(100, 50, 0,0)', | ||
| 1155 | + c2: 'rgb(216, 216, 216)' | ||
| 1156 | + }); | ||
| 1157 | + $('#' + canvasId).drawLine({ | ||
| 1158 | + layer: true, | ||
| 1159 | + name: "Pin_" + PinId, | ||
| 1160 | + groups: ["Pin_" + PinId], | ||
| 1161 | + strokeStyle: '#565656', | ||
| 1162 | + strokeWidth: 2, | ||
| 1163 | + visible: true, | ||
| 1164 | + x1: offsetX1 * $scope.sliderPercentValue, y1: offsetY1 * $scope.sliderPercentValue, | ||
| 1165 | + x2: x * $scope.sliderPercentValue, y2: y * $scope.sliderPercentValue, | ||
| 1166 | + | ||
| 1167 | + | ||
| 1168 | + }).drawArc({ | ||
| 1169 | + name: "PinArc_" + PinId, | ||
| 1170 | + layer: true, | ||
| 1171 | + groups: ["Pin_" + PinId], | ||
| 1172 | + strokeStyle: 'grey', | ||
| 1173 | + strokeWidth: 2, | ||
| 1174 | + visible: true, | ||
| 1175 | + fillStyle: radial, | ||
| 1176 | + x: x * $scope.sliderPercentValue, y: y * $scope.sliderPercentValue, | ||
| 1177 | + radius: 5 * $scope.sliderPercentValue, | ||
| 1178 | + | ||
| 1179 | + click: function (clickedPin) { | ||
| 1180 | + if (clickedPin.event.ctrlKey == false) { | ||
| 1181 | + $scope.clickedPins = []; | ||
| 1182 | + } | ||
| 1183 | + var pinID = (clickedPin.name).substring(7, (clickedPin.name).length); | ||
| 1184 | + var pinData = new jinqJs() | ||
| 1185 | + .from($scope.aaPinData) | ||
| 1186 | + .where("_PinId == " + pinID) | ||
| 1187 | + .select(); | ||
| 1188 | + | ||
| 1189 | + | ||
| 1190 | + var pinTermNumber = pinData[0]._TermId; | ||
| 1191 | + | ||
| 1192 | + var pinWithSameTerm = new jinqJs() | ||
| 1193 | + | ||
| 1194 | + .from($scope.aaPinData) | ||
| 1195 | + .where("_TermId == " + pinTermNumber) | ||
| 1196 | + .select(); | ||
| 1197 | + | ||
| 1198 | + | ||
| 1199 | + if (pinWithSameTerm != undefined && pinWithSameTerm != null && pinWithSameTerm.length > 0) { | ||
| 1200 | + | ||
| 1201 | + for (var i = 0; i < pinWithSameTerm.length; i++) { | ||
| 1202 | + | ||
| 1203 | + $scope.clickedPins.push({ 'id': pinWithSameTerm[i]._PinId }) | ||
| 1204 | + } | ||
| 1205 | + | ||
| 1206 | + } | ||
| 1207 | + $scope.isSelectedPinBtnClickedAftrSliderCange = false; | ||
| 1208 | + var selectedPinData = new jinqJs() | ||
| 1209 | + .from($scope.aaPinData) | ||
| 1210 | + .where("_PinId == " + pinID) | ||
| 1211 | + .select(); | ||
| 1212 | + if (clickedPin.event.ctrlKey == true) { | ||
| 1213 | + | ||
| 1214 | + $scope.activePinArray.push(clickedPin.name); | ||
| 1215 | + var radialAfterClick = $('#aaDetailViewCanvas').createGradient({ | ||
| 1216 | + x1: 50, y1: 50, | ||
| 1217 | + x2: 50, y2: 50, | ||
| 1218 | + r1: 10, r2: 30, | ||
| 1219 | + c1: 'rgba(100, 50, 0,0)', | ||
| 1220 | + c2: 'rgb(126, 187, 83)' | ||
| 1221 | + }); | ||
| 1222 | + clickedPin.fillStyle = radialAfterClick; | ||
| 1223 | + $scope.showAnnotation(selectedPinData, true, true, false); | ||
| 1224 | + } | ||
| 1225 | + else { | ||
| 1226 | + $scope.activePinArray = []; | ||
| 1227 | + $scope.activePinArray.push(clickedPin.name); | ||
| 1228 | + var radial = $('#aaDetailViewCanvas').createGradient({ | ||
| 1229 | + x1: 50, y1: 50, | ||
| 1230 | + x2: 50, y2: 50, | ||
| 1231 | + r1: 10, r2: 30, | ||
| 1232 | + c1: 'rgba(100, 50, 0,0)', | ||
| 1233 | + c2: 'rgb(216, 216, 216)' | ||
| 1234 | + }); | ||
| 1235 | + | ||
| 1236 | + | ||
| 1237 | + $('#aaDetailViewCanvas').setLayers({ | ||
| 1238 | + fillStyle: radial, | ||
| 1239 | + }).drawLayers(); | ||
| 1240 | + | ||
| 1241 | + //change the head color to green | ||
| 1242 | + var radialAfterClick = $('#aaDetailViewCanvas').createGradient({ | ||
| 1243 | + x1: 50, y1: 50, | ||
| 1244 | + x2: 50, y2: 50, | ||
| 1245 | + r1: 10, r2: 30, | ||
| 1246 | + c1: 'rgba(100, 50, 0,0)', | ||
| 1247 | + c2: 'rgb(126, 187, 83)' | ||
| 1248 | + }); | ||
| 1249 | + | ||
| 1250 | + clickedPin.fillStyle = radialAfterClick; | ||
| 1251 | + $scope.showAnnotation(selectedPinData, false, true, false); | ||
| 1252 | + | ||
| 1253 | + } | ||
| 1254 | + | ||
| 1255 | + } | ||
| 1256 | + | ||
| 1257 | + }).drawLayers(); | ||
| 1258 | + } | ||
| 1259 | + | ||
| 1260 | + | ||
| 1261 | + $scope.getMousePos = function (evt) { | ||
| 1262 | + | ||
| 1263 | + return { | ||
| 1264 | + x: Math.round(evt.pageX - $('#canvasDiv').offset().left), | ||
| 1265 | + y: Math.round(evt.pageY - $('#canvasDiv').offset().top) | ||
| 1266 | + } | ||
| 1267 | + } | ||
| 1268 | + | ||
| 1269 | + $scope.removePin = function (canvasId, pinId) { | ||
| 1270 | + | ||
| 1271 | + var pinName = 'Pin_' + pinId; | ||
| 1272 | + var pinArcName = 'PinArc_' + pinId; | ||
| 1273 | + $('#' + canvasId).removeLayer(pinName).drawLayers(); | ||
| 1274 | + $('#' + canvasId).removeLayer(pinArcName).drawLayers(); | ||
| 1275 | + | ||
| 1276 | + $scope.removeSpeechBubble(); | ||
| 1277 | + | ||
| 1278 | + //$rootScope.isSliderChanged = true; | ||
| 1279 | + //$('#aaDetailViewCanvas').removeLayers(); | ||
| 1280 | + } | ||
| 1281 | + | ||
| 1282 | + $rootScope.$on('annotationToolEvent', function (event, data) { | ||
| 1283 | + $('#editstylebackgroundcolor .minicolors >.minicolors-swatch > .minicolors-swatch-color').css("background-color", "rgb(255,255,255)") | ||
| 1284 | + $('#editstylebackgroundcolor .minicolors >.minicolors-panel > .minicolors-grid >.minicolors-picker').css({ "top": "145px", "left": "4px" }); | ||
| 1285 | + $('#outlineColor .minicolors >.minicolors-swatch > .minicolors-swatch-color').css("background-color", "rgb(0,0,0)") | ||
| 1286 | + $('#outlineColor .minicolors >.minicolors-panel > .minicolors-grid >.minicolors-picker').css({ "top": "145px", "left": "4px" }); | ||
| 1287 | + | ||
| 1288 | + $("#canvas").css("display", "block"); | ||
| 1289 | + $("#canvasPaint").css("display", "block"); | ||
| 1290 | + $rootScope.onDrawingCanvasClick(); | ||
| 1291 | + $rootScope.FreeStylePaint(); | ||
| 1292 | + }); | ||
| 1293 | + | ||
| 1294 | + $rootScope.loadSearchData = function () { | ||
| 1295 | + | ||
| 1296 | + //$("#termList").find("option").css({ "background-color": "#ffffff", "color": "#000000" }); | ||
| 1297 | + var imageId = $rootScope.imageId; | ||
| 1298 | + var promise = ModuleService.getTermTextDataForAAImage(imageId) | ||
| 1299 | + .then( | ||
| 1300 | + function (response) { | ||
| 1301 | + | ||
| 1302 | + $scope.AAPinTermData = response.data.PinTermData.TermData; | ||
| 1303 | + | ||
| 1304 | + $rootScope.isLoading = false; | ||
| 1305 | + $('#setting-spinner').css('visibility', 'hidden'); | ||
| 1306 | + | ||
| 1307 | + $scope.pinTermData = []; | ||
| 1308 | + var primaryLexicon = $rootScope.lexiconLanguageArray[0].id; | ||
| 1309 | + $scope.matchedLanguageTermData = new jinqJs() | ||
| 1310 | + .from($scope.AAPinTermData) | ||
| 1311 | + .where('_LanguageId == ' + primaryLexicon) | ||
| 1312 | + .select(); | ||
| 1313 | + var sortedTermTextArray = []; | ||
| 1314 | + for (var i = 0; i < $scope.matchedLanguageTermData.length; i++) { | ||
| 1315 | + sortedTermTextArray.push($scope.matchedLanguageTermData[i]._TermText); | ||
| 1316 | + sortedTermTextArray.sort(); | ||
| 1317 | + } | ||
| 1318 | + | ||
| 1319 | + for (var i = 0; i <= sortedTermTextArray.length - 1; i++) { | ||
| 1320 | + for (var j = 0; j <= $scope.matchedLanguageTermData.length - 1; j++) { | ||
| 1321 | + if ($scope.matchedLanguageTermData[j]._TermText == sortedTermTextArray[i]) { | ||
| 1322 | + $scope.pinTermData.push({ "LanguageId": $scope.matchedLanguageTermData[j]._LanguageId, "TermNumber": $scope.matchedLanguageTermData[j]._TermNumber, "TermTxt": $scope.matchedLanguageTermData[j]._TermText }); | ||
| 1323 | + break; | ||
| 1324 | + } | ||
| 1325 | + } | ||
| 1326 | + } | ||
| 1327 | + | ||
| 1328 | + | ||
| 1329 | + $scope.$watch('$scope.pinTermData', function (newValue, oldValue, scope) { | ||
| 1330 | + | ||
| 1331 | + if (($('#termlistfilter').html() != "")) | ||
| 1332 | + | ||
| 1333 | + $('#termlistfilter').empty(); | ||
| 1334 | + if ($scope.pinTermData.length > 0) { | ||
| 1335 | + $timeout(function () { | ||
| 1336 | + console.log('pinTermData= ' + $scope.pinTermData.length); | ||
| 1337 | + $('#termList').empty(); | ||
| 1338 | + $('#termlistfilter').empty(); | ||
| 1339 | + for (var j = 0; j < $scope.pinTermData.length; j++) { | ||
| 1340 | + var $el = $('<li><a id= "' + $scope.pinTermData[j].TermNumber + '" href="" onclick="onSearchItemSelection(this.id)" >' + $scope.pinTermData[j].TermTxt + '</a></li>').appendTo('#termlistfilter') | ||
| 1341 | + //var $el = $('<li><a id= "' + $scope.pinTermData[j].TermNumber + '" href="" >' + $scope.pinTermData[j].TermTxt + '</a></li>').appendTo('#termlistfilter') | ||
| 1342 | + $compile($el)($scope); | ||
| 1343 | + var $selectedOptions = $('<option title= "' + $scope.pinTermData[j].TermTxt + '" id= "' + $scope.pinTermData[j].TermNumber + '" >' + $scope.pinTermData[j].TermTxt + '</option>').appendTo("#termList") | ||
| 1344 | + | ||
| 1345 | + $compile($selectedOptions)($scope); | ||
| 1346 | + | ||
| 1347 | + $("#AABodySystems").empty(); | ||
| 1348 | + $("#bodySystems").css("display", "none"); | ||
| 1349 | + $("#AABodySystems").css("display", "block"); | ||
| 1350 | + $("#bodySystemList li a").each(function (key, value) { | ||
| 1351 | + var $systemOptions = $('<option id=' + $(this).attr('id') + ' >' + $(this).text() + '</option>').appendTo("#AABodySystems") | ||
| 1352 | + $compile($systemOptions)($scope); | ||
| 1353 | + }); | ||
| 1354 | + } | ||
| 1355 | + }, 500); | ||
| 1356 | + } | ||
| 1357 | + }) | ||
| 1358 | + }, | ||
| 1359 | + function (error) { | ||
| 1360 | + // handle errors here | ||
| 1361 | + console.log(' error: ' + error.statusText); | ||
| 1362 | + } | ||
| 1363 | + ) | ||
| 1364 | + } | ||
| 1365 | + | ||
| 1366 | + | ||
| 1367 | + | ||
| 1368 | + | ||
| 1369 | + $scope.$on('listManagerEvent', function (event, data) { | ||
| 1370 | + | ||
| 1371 | + $("#viewName").empty(); | ||
| 1372 | + | ||
| 1373 | + var currentView = $rootScope.getLocalStorageValue("currentViewTitle"); | ||
| 1374 | + var viewNmeHtml = '<option>' + currentView + '</option>' | ||
| 1375 | + $('#viewName').append(viewNmeHtml); | ||
| 1376 | + //$("#viewName").append("<option>" + $rootScope.listArray[0].text + "</option>"); | ||
| 1377 | + $rootScope.isLoading = false; | ||
| 1378 | + $('#spinner').css('visibility', 'hidden'); | ||
| 1379 | + | ||
| 1380 | + if ($rootScope.bodySystemSeletedId == null) { | ||
| 1381 | + | ||
| 1382 | + $rootScope.loadSearchData(); | ||
| 1383 | + } | ||
| 1384 | + else { | ||
| 1385 | + | ||
| 1386 | + $rootScope.refreshTermListOnAASystemSelection($rootScope.bodySystemSeletedId); | ||
| 1387 | + } | ||
| 1388 | + $timeout(function () { | ||
| 1389 | + $("#totalTerms").empty(); | ||
| 1390 | + $("#totalTerms").html("<span class='pull-left marginTop5'>" + $("#termList option").length + " Structures</span>"); | ||
| 1391 | + }, 1000); | ||
| 1392 | + }); | ||
| 1393 | + | ||
| 1394 | + | ||
| 1395 | + | ||
| 1396 | + $rootScope.refreshTermListOnAASystemSelection = function (bodySystemId) { | ||
| 1397 | + $rootScope.bodySystemSeletedId = bodySystemId; | ||
| 1398 | + $('#termList').empty(); | ||
| 1399 | + var bodySystemName = $("#AABodySystems #" + bodySystemId).val(); | ||
| 1400 | + if (bodySystemName == "All") { | ||
| 1401 | + for (var j = 0; j <= $scope.pinTermData.length - 1; j++) { | ||
| 1402 | + var $selectedOptions = $('<option title= "' + $scope.pinTermData[j].TermTxt + '" id= "' + $scope.pinTermData[j].TermNumber + '">' + $scope.pinTermData[j].TermTxt + '</option>').appendTo("#termList") | ||
| 1403 | + | ||
| 1404 | + $compile($selectedOptions)($scope); | ||
| 1405 | + } | ||
| 1406 | + $("#totalTerms").empty(); | ||
| 1407 | + $("#totalTerms").html("<span class='pull-left marginTop5'>" + $("#termList option").length + " Structures</span>"); | ||
| 1408 | + } | ||
| 1409 | + else { | ||
| 1410 | + var imageId = $rootScope.imageId; | ||
| 1411 | + $scope.pinDataUrl = "aa_dat_pinterm_" + imageId; | ||
| 1412 | + $rootScope.bodySystemTermArray = []; | ||
| 1413 | + $rootScope.sortedListArray = []; | ||
| 1414 | + $rootScope.duplicateListArray = []; | ||
| 1415 | + $.ajax({ | ||
| 1416 | + url: '~/../content/data/json/aa/aa_pinterm/' + $scope.pinDataUrl + '.json', | ||
| 1417 | + type: 'GET', | ||
| 1418 | + dataType: "json", | ||
| 1419 | + async: false, | ||
| 1420 | + success: function (result) { | ||
| 1421 | + $(result.PinTermData.TermData).each(function (key, value) { | ||
| 1422 | + $rootScope.bodySystemTermArray.push({ "termNumbr": result.PinTermData.TermData[key]._TermNumber, "text": result.PinTermData.TermData[key]._TermText, "language": result.PinTermData.TermData[key]._LanguageId }); | ||
| 1423 | + }); | ||
| 1424 | + for (var i = 0; i <= $scope.aaPinData.length - 1; i++) { | ||
| 1425 | + if ($scope.aaPinData[i]._BodySystemName.toLowerCase() == bodySystemName.toLowerCase()) { | ||
| 1426 | + for (var j = 0 ; j <= $rootScope.bodySystemTermArray.length - 1; j++) { | ||
| 1427 | + if ($scope.aaPinData[i]._TermId == $rootScope.bodySystemTermArray[j].termNumbr) { | ||
| 1428 | + if ($rootScope.bodySystemTermArray[j].language == $rootScope.lexiconLanguageArray[0].id) { | ||
| 1429 | + console.log($rootScope.bodySystemTermArray[j].text); | ||
| 1430 | + $rootScope.duplicateListArray.push({ "title": $rootScope.bodySystemTermArray[j].text, "id": $rootScope.bodySystemTermArray[j].termNumbr }); | ||
| 1431 | + } | ||
| 1432 | + } | ||
| 1433 | + } | ||
| 1434 | + } | ||
| 1435 | + } | ||
| 1436 | + var temp = []; | ||
| 1437 | + for (var i = 0; i <= $rootScope.duplicateListArray.length - 1; i++) { | ||
| 1438 | + var termID = $rootScope.duplicateListArray[i].id; | ||
| 1439 | + if ($.inArray(termID, temp) == -1) { | ||
| 1440 | + temp.push(termID); | ||
| 1441 | + $rootScope.sortedListArray.push({ "title": $rootScope.duplicateListArray[i].title, "id": termID }); | ||
| 1442 | + } | ||
| 1443 | + } | ||
| 1444 | + | ||
| 1445 | + for (var i = 0; i <= $rootScope.sortedListArray.length - 1; i++) { | ||
| 1446 | + | ||
| 1447 | + for (j = i + 1; j <= $rootScope.sortedListArray.length - 1; j++) { | ||
| 1448 | + | ||
| 1449 | + if ($rootScope.sortedListArray[i].title.substr(0, 1) > $rootScope.sortedListArray[j].title.substr(0, 1)) { | ||
| 1450 | + | ||
| 1451 | + var termText = $rootScope.sortedListArray[i].title; | ||
| 1452 | + var termNumbr = $rootScope.sortedListArray[i].termNumbr; | ||
| 1453 | + var termLanguage = $rootScope.sortedListArray[i].language; | ||
| 1454 | + | ||
| 1455 | + $rootScope.sortedListArray[i].title = $rootScope.sortedListArray[j].title; | ||
| 1456 | + $rootScope.sortedListArray[i].termNumbr = $rootScope.sortedListArray[j].termNumbr; | ||
| 1457 | + $rootScope.sortedListArray[i].language = $rootScope.sortedListArray[j].language; | ||
| 1458 | + | ||
| 1459 | + $rootScope.sortedListArray[j].title = termText; | ||
| 1460 | + $rootScope.sortedListArray[j].termNumbr = termNumbr; | ||
| 1461 | + $rootScope.sortedListArray[j].language = termLanguage; | ||
| 1462 | + } | ||
| 1463 | + } | ||
| 1464 | + } | ||
| 1465 | + | ||
| 1466 | + for (var j = 0; j <= $rootScope.sortedListArray.length - 1; j++) { | ||
| 1467 | + var $selectedOptions = $('<option title= "' + $rootScope.sortedListArray[j].title + '" id= "' + $rootScope.sortedListArray[j].id + '" >' + $rootScope.sortedListArray[j].title + '</option>').appendTo("#termList") | ||
| 1468 | + $compile($selectedOptions)($scope); | ||
| 1469 | + } | ||
| 1470 | + } | ||
| 1471 | + }); | ||
| 1472 | + $("#totalTerms").empty(); | ||
| 1473 | + $("#totalTerms").html("<span class='pull-left marginTop5'>" + $("#termList option").length + " Structures</span>"); | ||
| 1474 | + } | ||
| 1475 | + } | ||
| 1476 | + $scope.GetAnnotationBasedOnActualTermNo = function (actualTermNo) { | ||
| 1477 | + | ||
| 1478 | + | ||
| 1479 | + var languageArray = $rootScope.lexiconLanguageArray; | ||
| 1480 | + | ||
| 1481 | + if ($scope.AAPinTermData != null || $scope.AAPinTermData != undefined) { | ||
| 1482 | + | ||
| 1483 | + $scope.matchedTermNoData = new jinqJs() | ||
| 1484 | + .from($scope.AAPinTermData) | ||
| 1485 | + .where('_TermNumber == ' + actualTermNo) | ||
| 1486 | + .select(); | ||
| 1487 | + | ||
| 1488 | + if ($scope.matchedTermNoData != null || $scope.matchedTermNoData != undefined) { | ||
| 1489 | + | ||
| 1490 | + for (var j = 0; j <= languageArray.length - 1; j++) { | ||
| 1491 | + | ||
| 1492 | + $scope.matchedLanguageTermNoData = new jinqJs() | ||
| 1493 | + .from($scope.matchedTermNoData) | ||
| 1494 | + .where('_LanguageId == ' + languageArray[j].id) | ||
| 1495 | + .select(); | ||
| 1496 | + var termText = $scope.matchedLanguageTermNoData[0]._TermText; | ||
| 1497 | + $scope.MultiLanguageAnnationArray.push(termText); | ||
| 1498 | + }; | ||
| 1499 | + } | ||
| 1500 | + } | ||
| 1501 | + } | ||
| 1502 | + | ||
| 1503 | + $rootScope.hidePins = function () { | ||
| 1504 | + $("#dropdownMenu221").addClass("aaSystemDisable"); | ||
| 1505 | + $rootScope.isLoading = true; | ||
| 1506 | + $('#spinner').css('visibility', 'visible'); | ||
| 1507 | + $scope.hideSpeechBubble(); | ||
| 1508 | + | ||
| 1509 | + $scope.isHidePinBtnClicked = true; | ||
| 1510 | + angular.forEach($scope.aaPinData, function (aaPinDataValue, aaPinDataKey) { | ||
| 1511 | + | ||
| 1512 | + var pinName = 'Pin_' + aaPinDataValue._PinId; | ||
| 1513 | + var pinArcName = 'PinArc_' + aaPinDataValue._PinId; | ||
| 1514 | + | ||
| 1515 | + $('#aaDetailViewCanvas').setLayer(pinName, { | ||
| 1516 | + visible: false // set to true instead to show the layer again | ||
| 1517 | + }).drawLayers(); | ||
| 1518 | + | ||
| 1519 | + $('#aaDetailViewCanvas').setLayer(pinArcName, { | ||
| 1520 | + visible: false // set to true instead to show the layer again | ||
| 1521 | + }).drawLayers(); | ||
| 1522 | + }) | ||
| 1523 | + | ||
| 1524 | + $rootScope.isLoading = false; | ||
| 1525 | + $('#spinner').css('visibility', 'hidden'); | ||
| 1526 | + $(".tooltip-custom").removeClass("btn-primary"); | ||
| 1527 | + $(".tooltip-custom").addClass("btn-black"); | ||
| 1528 | + $("#hidePinBtn").addClass("btn-primary"); | ||
| 1529 | + $("#hidePinBtn").removeClass("btn-black"); | ||
| 1530 | + } | ||
| 1531 | + | ||
| 1532 | + $scope.showAllPinsAfterHide = function (event) { | ||
| 1533 | + if ($("#dropdownMenu221").hasClass("aaSystemDisable")) { | ||
| 1534 | + $("#dropdownMenu221").removeClass("aaSystemDisable"); | ||
| 1535 | + } | ||
| 1536 | + $rootScope.isLoading = true; | ||
| 1537 | + $('#spinner').css('visibility', 'visible'); | ||
| 1538 | + $scope.isHidePinBtnClicked = false; | ||
| 1539 | + $rootScope.isshowAllPinsBtnAfterHideClicked = true; | ||
| 1540 | + if ($scope.selectedSystemName != null && $scope.selectedSystemName != undefined) { | ||
| 1541 | + | ||
| 1542 | + $scope.showSystemPins($scope.selectedSystemPinData, false); | ||
| 1543 | + | ||
| 1544 | + } else { | ||
| 1545 | + | ||
| 1546 | + $scope.showSystemPins($scope.aaPinData, false); | ||
| 1547 | + } | ||
| 1548 | + $scope.showSpeechBubble(); | ||
| 1549 | + $(".tooltip-custom").removeClass("btn-primary"); | ||
| 1550 | + $(".tooltip-custom").addClass("btn-black"); | ||
| 1551 | + $("#allPinBtn").addClass("btn-primary"); | ||
| 1552 | + $("#allPinBtn").removeClass("btn-black"); | ||
| 1553 | + if ($scope.isSliderChange == true) { | ||
| 1554 | + $scope.isSliderChange = false; | ||
| 1555 | + $scope.showAllPins(); | ||
| 1556 | + | ||
| 1557 | + } | ||
| 1558 | + }; | ||
| 1559 | + | ||
| 1560 | + | ||
| 1561 | + $scope.showSelectedPins = function () { | ||
| 1562 | + $("#dropdownMenu221").addClass("aaSystemDisable"); | ||
| 1563 | + $rootScope.isLoading = true; | ||
| 1564 | + $('#spinner').css('visibility', 'visible'); | ||
| 1565 | + | ||
| 1566 | + $scope.isHidePinBtnClicked = false; | ||
| 1567 | + | ||
| 1568 | + if ($scope.selectedSystemName != null && $scope.selectedSystemName != undefined) { | ||
| 1569 | + | ||
| 1570 | + $scope.showSystemPins($scope.selectedSystemPinData, true); | ||
| 1571 | + | ||
| 1572 | + } | ||
| 1573 | + else { | ||
| 1574 | + $scope.showSystemPins($scope.aaPinData, true); | ||
| 1575 | + | ||
| 1576 | + } | ||
| 1577 | + $scope.showSpeechBubble(); | ||
| 1578 | + $(".tooltip-custom").removeClass("btn-primary"); | ||
| 1579 | + $(".tooltip-custom").addClass("btn-black"); | ||
| 1580 | + $("#selectedPin").addClass("btn-primary"); | ||
| 1581 | + $("#selectedPin").removeClass("btn-black"); | ||
| 1582 | + | ||
| 1583 | + if ($scope.isSelectedPinBtnClickedAftrSliderCange == true) { | ||
| 1584 | + | ||
| 1585 | + for (var i = 0; i <= $scope.activePinArray.length - 1; i++) { | ||
| 1586 | + var pinName = $scope.activePinArray[i].split("_"); | ||
| 1587 | + var activePinName = 'Pin_' + pinName[1]; | ||
| 1588 | + var pinArcName = 'PinArc_' + pinName[1]; | ||
| 1589 | + $('#aaDetailViewCanvas').setLayer(activePinName, { | ||
| 1590 | + visible: true // set to true instead to show the layer again | ||
| 1591 | + }).drawLayers(); | ||
| 1592 | + $('#aaDetailViewCanvas').setLayer(pinArcName, { | ||
| 1593 | + visible: true // set to true instead to show the layer again | ||
| 1594 | + }).drawLayers(); | ||
| 1595 | + } | ||
| 1596 | + | ||
| 1597 | + } | ||
| 1598 | + | ||
| 1599 | + }; | ||
| 1600 | + | ||
| 1601 | + | ||
| 1602 | + $scope.showSystemPins = function (seletedSystemPinData, isShowSelectedPins) { | ||
| 1603 | + | ||
| 1604 | + if (isShowSelectedPins) { | ||
| 1605 | + | ||
| 1606 | + angular.forEach($scope.clickedPins, function (value, key) { | ||
| 1607 | + | ||
| 1608 | + seletedSystemPinData = new jinqJs() | ||
| 1609 | + .from(seletedSystemPinData) | ||
| 1610 | + .where('_PinId != ' + value.id) | ||
| 1611 | + .select(); | ||
| 1612 | + }) | ||
| 1613 | + angular.forEach($scope.clickedPins, function (value1, key1) { | ||
| 1614 | + | ||
| 1615 | + // if (aaPinDataValue._PinId != value.id) { | ||
| 1616 | + var pinName = 'Pin_' + value1.id; | ||
| 1617 | + var pinArcName = 'PinArc_' + value1.id; | ||
| 1618 | + | ||
| 1619 | + $('#aaDetailViewCanvas').setLayer(pinName, { | ||
| 1620 | + visible: true // set to true instead to show the layer again | ||
| 1621 | + }).drawLayers(); | ||
| 1622 | + | ||
| 1623 | + $('#aaDetailViewCanvas').setLayer(pinArcName, { | ||
| 1624 | + visible: true // set to true instead to show the layer again | ||
| 1625 | + }).drawLayers(); | ||
| 1626 | + // } | ||
| 1627 | + }) | ||
| 1628 | + | ||
| 1629 | + angular.forEach(seletedSystemPinData, function (aaPinDataValue, aaPinDataKey) { | ||
| 1630 | + | ||
| 1631 | + var pinName = 'Pin_' + aaPinDataValue._PinId; | ||
| 1632 | + var pinArcName = 'PinArc_' + aaPinDataValue._PinId; | ||
| 1633 | + | ||
| 1634 | + $('#aaDetailViewCanvas').setLayer(pinName, { | ||
| 1635 | + visible: false // set to true instead to show the layer again | ||
| 1636 | + }).drawLayers(); | ||
| 1637 | + | ||
| 1638 | + $('#aaDetailViewCanvas').setLayer(pinArcName, { | ||
| 1639 | + visible: false // set to true instead to show the layer again | ||
| 1640 | + }).drawLayers(); | ||
| 1641 | + }) | ||
| 1642 | + | ||
| 1643 | + } | ||
| 1644 | + | ||
| 1645 | + else { | ||
| 1646 | + angular.forEach(seletedSystemPinData, function (aaPinDataValue, aaPinDataKey) { | ||
| 1647 | + | ||
| 1648 | + var pinName = 'Pin_' + aaPinDataValue._PinId; | ||
| 1649 | + var pinArcName = 'PinArc_' + aaPinDataValue._PinId; | ||
| 1650 | + | ||
| 1651 | + $('#aaDetailViewCanvas').setLayer(pinName, { | ||
| 1652 | + visible: true // set to true instead to show the layer again | ||
| 1653 | + }).drawLayers(); | ||
| 1654 | + | ||
| 1655 | + $('#aaDetailViewCanvas').setLayer(pinArcName, { | ||
| 1656 | + visible: true // set to true instead to show the layer again | ||
| 1657 | + }).drawLayers(); | ||
| 1658 | + }) | ||
| 1659 | + } | ||
| 1660 | + | ||
| 1661 | + $rootScope.isLoading = false; | ||
| 1662 | + $('#spinner').css('visibility', 'hidden'); | ||
| 1663 | + | ||
| 1664 | + | ||
| 1665 | + } | ||
| 1666 | + $rootScope.isshowAllPinsBtnAfterHideClicked = true; | ||
| 1667 | + $scope.showItemsForSearch = function () { | ||
| 1668 | + if($rootScope.isshowAllPinsBtnAfterHideClicked == true){ | ||
| 1669 | + console.log('showItemsForSearch is called'); | ||
| 1670 | + //this check is for log only because we are writing length so need to check if its not null or undefined | ||
| 1671 | + | ||
| 1672 | + | ||
| 1673 | + $timeout(function () { | ||
| 1674 | + if (($scope.AAPinTermData != null || $scope.AAPinTermData != undefined) && ($scope.AAPinTermData.length > 0)) { | ||
| 1675 | + | ||
| 1676 | + $scope.IsSearchVisible = true; | ||
| 1677 | + document.getElementById("termlistfilter").style.display = "block"; | ||
| 1678 | + } | ||
| 1679 | + else { | ||
| 1680 | + $rootScope.loadSearchData(); | ||
| 1681 | + if ($scope.AAPinTermData.length > 0) { | ||
| 1682 | + $scope.showItemsForSearch(); | ||
| 1683 | + } | ||
| 1684 | + } | ||
| 1685 | + | ||
| 1686 | + if ($rootScope.isSearchInputClicked == true) { | ||
| 1687 | + $rootScope.isSearchInputClicked = false; | ||
| 1688 | + $rootScope.searchListArray = []; | ||
| 1689 | + $("#backdrop > #searchListDivAA > #termlistfilter > li").each(function (key, value) { | ||
| 1690 | + $rootScope.searchListArray.push({ "name": $(this).find("a").html(), "id": $(this).find("a").attr("id") }); | ||
| 1691 | + }); | ||
| 1692 | + | ||
| 1693 | + } | ||
| 1694 | + | ||
| 1695 | + }, 500); | ||
| 1696 | + } | ||
| 1697 | + } | ||
| 1698 | + | ||
| 1699 | + | ||
| 1700 | + $scope.HideSearchList = function () { | ||
| 1701 | + | ||
| 1702 | + $timeout(function () { | ||
| 1703 | + | ||
| 1704 | + $("#termlistfilter").css("display", "none"); | ||
| 1705 | + | ||
| 1706 | + | ||
| 1707 | + }, 1000); | ||
| 1708 | + | ||
| 1709 | + } | ||
| 1710 | + | ||
| 1711 | + $scope.highlightPinBasedOnSerachItem = function (id) { | ||
| 1712 | + $scope.searchItemId = id; | ||
| 1713 | + $scope.searchItemText = $("#" + id).text(); | ||
| 1714 | + $rootScope.searchSelectedText = $("#" + id).text(); | ||
| 1715 | + $('#termList option[selected="selected"]').prop("selected", false); | ||
| 1716 | + $('#termList option[value="' + $rootScope.searchSelectedText + '"]').prop("selected", true); | ||
| 1717 | + $("#termList").find("option").css({ "background-color": "#ffffff", "color": "#000000" }); | ||
| 1718 | + $('#termList option[value="' + $rootScope.searchSelectedText + '"]').css({ "background-color": "#3399FF", "color": "#ffffff" }); | ||
| 1719 | + | ||
| 1720 | + $("#termlistfilter li a").css({ "background-color": "#ffffff", "color": "#000000" }); | ||
| 1721 | + $("#termlistfilter li #" + $scope.searchItemId).css({ "background-color": "#3399FF", "color": "#ffffff" }); | ||
| 1722 | + $scope.searchFilter = $("#" + id).text(); | ||
| 1723 | + //selectedTermName.placeholder = $("#" + id).text(); | ||
| 1724 | + selectedTermName.value = $("#" + id).text(); | ||
| 1725 | + selectedTermName.placeholder = "search... "; | ||
| 1726 | + | ||
| 1727 | + //get data from pindata for this trem | ||
| 1728 | + | ||
| 1729 | + var pinDataForTerm = new jinqJs() | ||
| 1730 | + .from($scope.aaPinData) | ||
| 1731 | + .where("_TermId == " + $scope.searchItemId) | ||
| 1732 | + .select(); | ||
| 1733 | + | ||
| 1734 | + $scope.showAnnotation(pinDataForTerm, false, false, true); | ||
| 1735 | + // maintaing scroll position on selection of options in list manager. | ||
| 1736 | + var annotationTopPos = $(".common-drag").css("top").split("p"); | ||
| 1737 | + $("#canvasDiv").scrollTop(annotationTopPos[0]); | ||
| 1738 | + | ||
| 1739 | + $scope.IsSearchVisible = false; | ||
| 1740 | + } | ||
| 1741 | + | ||
| 1742 | + $rootScope.isShowHideButtonClicked = true; | ||
| 1743 | + $scope.ShowHideAnnotation = function () { | ||
| 1744 | + if ($rootScope.isShowHideButtonClicked == true) { | ||
| 1745 | + $rootScope.annotationArray = []; | ||
| 1746 | + $("#canvasDiv").find(".common-drag").each(function () { | ||
| 1747 | + var speechBubbleID = $(this).attr("id"); | ||
| 1748 | + var sppechBubbleId = $(this).attr("id").substring(12); | ||
| 1749 | + var b = $("#speechBubbleDraggedLine" + sppechBubbleId).css("display"); | ||
| 1750 | + var speechBubbleLineDispProp = $("#speechBubbleLine" + sppechBubbleId).css("display"); | ||
| 1751 | + var speechBubbleLineID = "speechBubbleLine" + sppechBubbleId; | ||
| 1752 | + var speechBubbleDraggedLineID = "speechBubbleDraggedLine" + sppechBubbleId; | ||
| 1753 | + $("#comment-box").addClass("btn-primary"); | ||
| 1754 | + $("#comment-box").removeClass("btn-black"); | ||
| 1755 | + | ||
| 1756 | + if (speechBubbleLineDispProp == "block") { | ||
| 1757 | + $rootScope.annotationArray.push({ "speechBuubleId": speechBubbleID, "speechBubbleLineId": speechBubbleLineID }); | ||
| 1758 | + } | ||
| 1759 | + else { | ||
| 1760 | + $rootScope.annotationArray.push({ "speechBuubleId": speechBubbleID, "speechBubbleLineId": speechBubbleDraggedLineID }); | ||
| 1761 | + } | ||
| 1762 | + }); | ||
| 1763 | + $rootScope.isShowHideButtonClicked = false; | ||
| 1764 | + for (var i = 0; i <= $rootScope.annotationArray.length - 1; i++) { | ||
| 1765 | + $("#" + $rootScope.annotationArray[i].speechBuubleId).css("display", "none"); | ||
| 1766 | + $("#" + $rootScope.annotationArray[i].speechBubbleLineId).css("display", "none"); | ||
| 1767 | + } | ||
| 1768 | + } | ||
| 1769 | + else { | ||
| 1770 | + $rootScope.isShowHideButtonClicked = true; | ||
| 1771 | + for (var i = 0; i <= $rootScope.annotationArray.length - 1; i++) { | ||
| 1772 | + $("#" + $rootScope.annotationArray[i].speechBuubleId).css("display", "block"); | ||
| 1773 | + $("#" + $rootScope.annotationArray[i].speechBubbleLineId).css("display", "block"); | ||
| 1774 | + } | ||
| 1775 | + | ||
| 1776 | + $("#comment-box").removeClass("btn-primary"); | ||
| 1777 | + $("#comment-box").addClass("btn-black"); | ||
| 1778 | + | ||
| 1779 | + } | ||
| 1780 | + } | ||
| 1781 | + $scope.activePinOnLayerChange = function () { | ||
| 1782 | + for (var i = 0; i <= $scope.activePinArray.length - 1; i++) { | ||
| 1783 | + var radialAfterClick = $('#aaDetailViewCanvas').createGradient({ | ||
| 1784 | + x1: 50, y1: 50, | ||
| 1785 | + x2: 50, y2: 50, | ||
| 1786 | + r1: 10, r2: 30, | ||
| 1787 | + c1: 'rgba(100, 50, 0,0)', | ||
| 1788 | + c2: 'rgb(126, 187, 83)' | ||
| 1789 | + }); | ||
| 1790 | + var clickedPin = $scope.activePinArray[i]; | ||
| 1791 | + $('#aaDetailViewCanvas').setLayer(clickedPin, { | ||
| 1792 | + fillStyle: radialAfterClick | ||
| 1793 | + }).drawLayers(); | ||
| 1794 | + | ||
| 1795 | + } | ||
| 1796 | + } | ||
| 1797 | + | ||
| 1798 | + $scope.activePinOnSliderChange = function () { | ||
| 1799 | + if ($scope.activePinArray.length == 1) { | ||
| 1800 | + for (var i = 0; i <= $scope.allPinDataArray.length - 1; i++) { | ||
| 1801 | + var activeArc = $scope.activePinArray[0].split("_"); | ||
| 1802 | + if ($scope.allPinDataArray[i] == activeArc[1]) { | ||
| 1803 | + var pinName = 'Pin_' + $scope.allPinDataArray[i]; | ||
| 1804 | + var pinArcName = 'PinArc_' + $scope.allPinDataArray[i]; | ||
| 1805 | + $('#aaDetailViewCanvas').setLayer(pinName, { | ||
| 1806 | + visible: true // set to true instead to show the layer again | ||
| 1807 | + }).drawLayers(); | ||
| 1808 | + $('#aaDetailViewCanvas').setLayer(pinArcName, { | ||
| 1809 | + visible: true // set to true instead to show the layer again | ||
| 1810 | + }).drawLayers(); | ||
| 1811 | + } | ||
| 1812 | + else { | ||
| 1813 | + var pinName = 'Pin_' + $scope.allPinDataArray[i]; | ||
| 1814 | + var pinArcName = 'PinArc_' + $scope.allPinDataArray[i]; | ||
| 1815 | + $('#aaDetailViewCanvas').setLayer(pinName, { | ||
| 1816 | + visible: false // set to true instead to show the layer again | ||
| 1817 | + }).drawLayers(); | ||
| 1818 | + $('#aaDetailViewCanvas').setLayer(pinArcName, { | ||
| 1819 | + visible: false // set to true instead to show the layer again | ||
| 1820 | + }).drawLayers(); | ||
| 1821 | + } | ||
| 1822 | + } | ||
| 1823 | + } | ||
| 1824 | + else { | ||
| 1825 | + var seletedSystemPinData; | ||
| 1826 | + angular.forEach($scope.activePinArray, function (value, key) { | ||
| 1827 | + var pinID = value.split("_"); | ||
| 1828 | + seletedSystemPinData = new jinqJs() | ||
| 1829 | + .from($scope.allPinDataArray) | ||
| 1830 | + .where('_PinId != ' + pinID[1]) | ||
| 1831 | + .select(); | ||
| 1832 | + }) | ||
| 1833 | + | ||
| 1834 | + angular.forEach(seletedSystemPinData, function (aaPinDataValue, aaPinDataKey) { | ||
| 1835 | + | ||
| 1836 | + var pinName = 'Pin_' + aaPinDataValue; | ||
| 1837 | + var pinArcName = 'PinArc_' + aaPinDataValue; | ||
| 1838 | + | ||
| 1839 | + $('#aaDetailViewCanvas').setLayer(pinName, { | ||
| 1840 | + visible: false // set to true instead to show the layer again | ||
| 1841 | + }).drawLayers(); | ||
| 1842 | + | ||
| 1843 | + $('#aaDetailViewCanvas').setLayer(pinArcName, { | ||
| 1844 | + visible: false // set to true instead to show the layer again | ||
| 1845 | + }).drawLayers(); | ||
| 1846 | + | ||
| 1847 | + }) | ||
| 1848 | + for (var i = 0; i <= $scope.activePinArray.length - 1; i++) { | ||
| 1849 | + var pinName = $scope.activePinArray[i].split("_"); | ||
| 1850 | + var activePinName = 'Pin_' + pinName[1]; | ||
| 1851 | + var pinArcName = 'PinArc_' + pinName[1]; | ||
| 1852 | + $('#aaDetailViewCanvas').setLayer(activePinName, { | ||
| 1853 | + visible: true // set to true instead to show the layer again | ||
| 1854 | + }).drawLayers(); | ||
| 1855 | + $('#aaDetailViewCanvas').setLayer(pinArcName, { | ||
| 1856 | + visible: true // set to true instead to show the layer again | ||
| 1857 | + }).drawLayers(); | ||
| 1858 | + } | ||
| 1859 | + } | ||
| 1860 | + } | ||
| 1861 | + $(document).ready(function () { | ||
| 1862 | + var $ua = navigator.userAgent; | ||
| 1863 | + if (($ua.match(/(iPod|iPhone|iPad|android)/i))) { | ||
| 1864 | + | ||
| 1865 | + var jspanelContainerWidth = $(".jsPanel-content").css("width"); | ||
| 1866 | + $(".jsPanel-content").css({ "width": "100%", "min-width": jspanelContainerWidth }); | ||
| 1867 | + $("#ImagePanel").css("width", "100%"); | ||
| 1868 | + | ||
| 1869 | + //hide pin button clicked | ||
| 1870 | + $("#hidePinBtn").removeAttr("onclick"); | ||
| 1871 | + $("#hidePinBtn").on("touchstart", function () { | ||
| 1872 | + var rootScope = angular.element(document.getElementById("aaDetailPageDiv")).scope(); | ||
| 1873 | + rootScope.$apply(function () { | ||
| 1874 | + rootScope.hidePins(event); | ||
| 1875 | + }); | ||
| 1876 | + }); | ||
| 1877 | + //selected pin button clicked | ||
| 1878 | + $("#selectedPin").removeAttr("onclick"); | ||
| 1879 | + $("#selectedPin").on("touchstart", function () { | ||
| 1880 | + console.log('showSelectedPins is called') | ||
| 1881 | + var scope = angular.element(document.getElementById("aaDetailPageDiv")).scope(); | ||
| 1882 | + scope.$apply(function () { | ||
| 1883 | + scope.showSelectedPins(event); | ||
| 1884 | + }); | ||
| 1885 | + }); | ||
| 1886 | + //all pin button clicked | ||
| 1887 | + $("#allPinBtn").removeAttr("onclick"); | ||
| 1888 | + $("#allPinBtn").on("touchstart", function () { | ||
| 1889 | + var scope = angular.element(document.getElementById("aaDetailPageDiv")).scope(); | ||
| 1890 | + scope.$apply(function () { | ||
| 1891 | + scope.showAllPinsAfterHide(event); | ||
| 1892 | + }); | ||
| 1893 | + }); | ||
| 1894 | + //comment-box button clicked | ||
| 1895 | + $("#comment-box").removeAttr("onclick"); | ||
| 1896 | + $("#comment-box").on("touchstart", function () { | ||
| 1897 | + var scope = angular.element(document.getElementById("aaDetailPageDiv")).scope(); | ||
| 1898 | + scope.$apply(function () { | ||
| 1899 | + scope.ShowHideAnnotation(event); | ||
| 1900 | + }); | ||
| 1901 | + }); | ||
| 1902 | + | ||
| 1903 | + } | ||
| 1904 | + | ||
| 1905 | + }); | ||
| 1906 | +}]); | ||
| 1907 | + | ||
| 1908 | + | ||
| 1909 | +function refreshTermListOnSystemSel(bodySystemId) { | ||
| 1910 | + var rootScope = angular.element(document.getElementById("aaDetailPageDiv")).scope(); | ||
| 1911 | + rootScope.$apply(function () { | ||
| 1912 | + rootScope.refreshTermListOnAASystemSelection(bodySystemId); | ||
| 1913 | + }); | ||
| 1914 | +} | ||
| 1915 | + | ||
| 1916 | + | ||
| 1917 | +function showSelectedSystemPins(event) { | ||
| 1918 | + console.log('OnBodySystem chnaged is called outside '); | ||
| 1919 | + var scope = angular.element(document.getElementById("aaDetailPageDiv")).scope(); | ||
| 1920 | + scope.$apply(function () { | ||
| 1921 | + scope.showSelectedSystemPins(event); | ||
| 1922 | + }); | ||
| 1923 | +} | ||
| 1924 | + | ||
| 1925 | +function hidePins(event) { | ||
| 1926 | + | ||
| 1927 | + var rootScope = angular.element(document.getElementById("aaDetailPageDiv")).scope(); | ||
| 1928 | + rootScope.$apply(function () { | ||
| 1929 | + rootScope.hidePins(event); | ||
| 1930 | + }); | ||
| 1931 | +} | ||
| 1932 | + | ||
| 1933 | +function showAllPins(event) { | ||
| 1934 | + | ||
| 1935 | + var scope = angular.element(document.getElementById("aaDetailPageDiv")).scope(); | ||
| 1936 | + scope.$apply(function () { | ||
| 1937 | + scope.showAllPinsAfterHide(event); | ||
| 1938 | + }); | ||
| 1939 | +} | ||
| 1940 | + | ||
| 1941 | +function onSearchAA(event) { | ||
| 1942 | + console.log('AA search is called') | ||
| 1943 | + var scope = angular.element(document.getElementById("aaDetailPageDiv")).scope(); | ||
| 1944 | + scope.$apply(function () { | ||
| 1945 | + scope.showItemsForSearch(); | ||
| 1946 | + }); | ||
| 1947 | +} | ||
| 1948 | + | ||
| 1949 | +function hideSearchList(event) { | ||
| 1950 | + console.log('AA hide search is called') | ||
| 1951 | + var scope = angular.element(document.getElementById("aaDetailPageDiv")).scope(); | ||
| 1952 | + scope.$apply(function () { | ||
| 1953 | + scope.HideSearchList(); | ||
| 1954 | + }); | ||
| 1955 | +} | ||
| 1956 | + | ||
| 1957 | +function onSearchItemSelection(id) { | ||
| 1958 | + | ||
| 1959 | + console.log('AA hide search is called'); | ||
| 1960 | + var scope = angular.element(document.getElementById("aaDetailPageDiv")).scope(); | ||
| 1961 | + scope.$apply(function () { | ||
| 1962 | + scope.highlightPinBasedOnSerachItem(id); | ||
| 1963 | + }); | ||
| 1964 | +} | ||
| 1965 | + | ||
| 1966 | +//function onListManagerTermSelection(event) { | ||
| 1967 | +// var scope = angular.element(document.getElementById("aaDetailPageDiv")).scope(); | ||
| 1968 | +// scope.isTermListOptionClicked = true; | ||
| 1969 | +// scope.$apply(function () { | ||
| 1970 | +// scope.highlightPinBasedOnSerachItem1(event); | ||
| 1971 | +// }); | ||
| 1972 | + | ||
| 1973 | +//} | ||
| 1974 | + | ||
| 1975 | + | ||
| 1976 | +function showHideAnnotation(event) { | ||
| 1977 | + | ||
| 1978 | + var scope = angular.element(document.getElementById("aaDetailPageDiv")).scope(); | ||
| 1979 | + scope.$apply(function () { | ||
| 1980 | + scope.ShowHideAnnotation(event); | ||
| 1981 | + }); | ||
| 1982 | +} | ||
| 1983 | + | ||
| 1984 | +function showSelectedPins(event) { | ||
| 1985 | + | ||
| 1986 | + console.log('showSelectedPins is called') | ||
| 1987 | + var scope = angular.element(document.getElementById("aaDetailPageDiv")).scope(); | ||
| 1988 | + scope.$apply(function () { | ||
| 1989 | + scope.showSelectedPins(event); | ||
| 1990 | + }); | ||
| 1991 | +} | ||
| 1992 | + | ||
| 1993 | + | ||
| 1994 | +function openModuleItemView(event) { | ||
| 1995 | + var scope = angular.element(document.getElementById("list-view")).scope(); | ||
| 1996 | + scope.isListViewButtonClicked = true; | ||
| 1997 | + scope.$apply(function () { | ||
| 1998 | + scope.openModuleItemView(event); | ||
| 1999 | + }); | ||
| 2000 | +} | ||
| 2001 | + | ||
| 2002 | +function openListViewModuleItem(event) { | ||
| 2003 | + | ||
| 2004 | + var scope = angular.element(document.getElementById("list-view")).scope(); | ||
| 2005 | + scope.isListViewButtonClicked = true; | ||
| 2006 | + scope.$apply(function () { | ||
| 2007 | + scope.openListViewModuleItem(event); | ||
| 2008 | + }); | ||
| 2009 | +} | ||
| 2010 | + | ||
| 2011 | +function openCurrentView(event) { | ||
| 2012 | + var scope = angular.element(document.getElementById("list-view")).scope(); | ||
| 2013 | + scope.isListViewButtonClicked = true; | ||
| 2014 | + scope.isOpenBtnClicked = true; | ||
| 2015 | + scope.$apply(function () { | ||
| 2016 | + scope.openModuleItemView(event); | ||
| 2017 | + }); | ||
| 2018 | + | ||
| 2019 | +} | ||
| 2020 | + | ||
| 2021 | +function onZoom(scope) { | ||
| 2022 | + | ||
| 2023 | + //$(".common-drag").remove(); | ||
| 2024 | + //$(".commonDot").remove(); | ||
| 2025 | + //$(".commonDraggedLine").remove(); | ||
| 2026 | + //var radial = $('#aaDetailViewCanvas').createGradient({ | ||
| 2027 | + // x1: 50, y1: 50, | ||
| 2028 | + // x2: 50, y2: 50, | ||
| 2029 | + // r1: 10, r2: 30, | ||
| 2030 | + // c1: 'rgba(100, 50, 0,0)', | ||
| 2031 | + // c2: 'rgb(216, 216, 216)' | ||
| 2032 | + //}); | ||
| 2033 | + //$('#aaDetailViewCanvas').setLayers({ | ||
| 2034 | + // fillStyle: radial, | ||
| 2035 | + //}).drawLayers(); | ||
| 2036 | + // scope.removePin(); | ||
| 2037 | + // scope.showAllPins(); | ||
| 2038 | + | ||
| 2039 | + | ||
| 2040 | + //6. Show all pins on AA opened item | ||
| 2041 | +} | ||
| 2042 | + |
400-SOURCECODE/AIAHTML5.Web/app/views/da/da-view.html
| 1 | -<!--<style> | ||
| 2 | - .slider label { | ||
| 3 | - position: absolute; | ||
| 4 | - width: 20px; | ||
| 5 | - margin-left: -10px; | ||
| 6 | - text-align: center; | ||
| 7 | - margin-top: 20px; | ||
| 8 | - } | ||
| 9 | - | ||
| 10 | - /* below is not necessary, just for style */ | ||
| 11 | - .slider { | ||
| 12 | - width: 50%; | ||
| 13 | - margin: 2em auto; | ||
| 14 | - } | ||
| 15 | -</style>--> | ||
| 16 | -<style> | ||
| 17 | - /*Dated:22-07-2016 Issue#4958:In Open body view, the side buttons are getting disturbed on layer change. */ | ||
| 18 | - .btn-resize { | ||
| 19 | - padding: 6px 11px; | ||
| 20 | - border: 0px solid #000; | ||
| 21 | - border-radius: 1px; | ||
| 22 | - } | ||
| 23 | -</style> | ||
| 24 | -<style> | ||
| 25 | - /*Dated:22-07-2016 Issue#4958:In Open body view, the side buttons are getting disturbed on layer change. */ | ||
| 26 | - .btn-resize { | ||
| 27 | - padding: 6px 11px; | ||
| 28 | - border: 0px solid #000; | ||
| 29 | - border-radius: 1px; | ||
| 30 | - } | ||
| 31 | -</style> | ||
| 32 | - | ||
| 33 | -<style> | ||
| 34 | - #draggable { | ||
| 35 | - opacity: 0.2; | ||
| 36 | - border: solid; | ||
| 37 | - position: absolute; | ||
| 38 | - /*Bug #24255: Mac > DA > Body Navigator is not appear properly.*/ | ||
| 39 | - height:14px !important; | ||
| 40 | - } | ||
| 41 | - | ||
| 42 | - #wrapper { | ||
| 43 | - position: relative; | ||
| 44 | - width: 100%; | ||
| 45 | - height: 100%; | ||
| 46 | - margin: 20px auto; | ||
| 47 | - } | ||
| 48 | - | ||
| 49 | - .tooltip-custom + .tooltip > .tooltip-inner { | ||
| 50 | - background-color: #fff; | ||
| 51 | - border: 1px solid #000; | ||
| 52 | - color: #000; | ||
| 53 | - border-radius: 0; | ||
| 54 | - } | ||
| 55 | - | ||
| 56 | - .tooltip-custom + .tooltip > .tooltip-arrow { | ||
| 57 | - display: none; | ||
| 58 | - } | ||
| 59 | - | ||
| 60 | - | ||
| 61 | - .custom-tooltip { | ||
| 62 | - background-color: #333; | ||
| 63 | - border: 0 none; | ||
| 64 | - color: #fff !important; | ||
| 65 | - left: -52px; | ||
| 66 | - /*opacity: 0.9;*/ | ||
| 67 | - padding: 7px; | ||
| 68 | - position: absolute; | ||
| 69 | - text-align: center; | ||
| 70 | - top: 45px; | ||
| 71 | - width: 120px; | ||
| 72 | - display: none; | ||
| 73 | - z-index: 10000; | ||
| 74 | - border: 1px solid #000; | ||
| 75 | - color: #000; | ||
| 76 | - border-radius: 0; | ||
| 77 | - } | ||
| 78 | - | ||
| 79 | - .custom-tooltip1 { | ||
| 80 | - background-color: #333; | ||
| 81 | - border: 0 none; | ||
| 82 | - color: #fff !important; | ||
| 83 | - left: 52px; | ||
| 84 | - /*opacity: 0.9;*/ | ||
| 85 | - padding: 7px; | ||
| 86 | - position: absolute; | ||
| 87 | - text-align: center; | ||
| 88 | - top: 45px; | ||
| 89 | - width: 70px; | ||
| 90 | - display: none; | ||
| 91 | - z-index: 10000; | ||
| 92 | - border: 1px solid #000; | ||
| 93 | - color: #000; | ||
| 94 | - border-radius: 0; | ||
| 95 | - } | ||
| 96 | - | ||
| 97 | - .custom-tooltip2 { | ||
| 98 | - background-color: #333; | ||
| 99 | - border: 0 none; | ||
| 100 | - color: #fff !important; | ||
| 101 | - right: 10px; | ||
| 102 | - /*opacity: 0.9;*/ | ||
| 103 | - padding: 7px; | ||
| 104 | - position: absolute; | ||
| 105 | - text-align: center; | ||
| 106 | - top: 45px; | ||
| 107 | - width: 60px; | ||
| 108 | - display: none; | ||
| 109 | - z-index: 10000; | ||
| 110 | - border: 1px solid #000; | ||
| 111 | - color: #000; | ||
| 112 | - border-radius: 0; | ||
| 113 | - } | ||
| 114 | - .pad0{padding:0;} | ||
| 115 | -</style> | ||
| 116 | -<!--Annotation Toolbar: Jcanvas--> | ||
| 117 | -<style> | ||
| 118 | - .canvas-annotationStyle { | ||
| 119 | - display: none; | ||
| 120 | - background-color: transparent; | ||
| 121 | - z-index: 12000; | ||
| 122 | - position: absolute; | ||
| 123 | - left: 0; | ||
| 124 | - right: 0; | ||
| 125 | - } | ||
| 126 | - | ||
| 127 | - .canvas-annotationStyle1 { | ||
| 128 | - display: none; | ||
| 129 | - background-color: transparent; | ||
| 130 | - z-index: 12000; | ||
| 131 | - position: absolute; | ||
| 132 | - left: 0; | ||
| 133 | - right: 0; | ||
| 134 | - } | ||
| 135 | - | ||
| 136 | -</style> | ||
| 137 | -<div class=" " id="daView" ng-controller="DAController"> | ||
| 138 | - <div class="pos-relative leftToolBar tools pull-left"> | ||
| 139 | - <div class="toggle-icon toggleBar toggleHeadingButton" title="Show/Hide Sidebar" style="top:20px;"></div> | ||
| 140 | - <div class="" style="top:20px"> | ||
| 141 | - <div class="col-xs-6"> | ||
| 142 | - <button id="btnIdentify" onclick="OnIdentifyClick()" class="btn btn-primary btn-sm tooltip-custom" data-toggle="tooltip" data-placement="bottom" title="Identify"> <img src="content/images/icon-identity.png" alt=""></button> | ||
| 143 | - </div> | ||
| 144 | - <div class="col-xs-6 pull-right"> | ||
| 145 | - <button class="btn btn-black btn-sm pull-right tooltip-custom" onclick="OnZoom()" id="btnZoom" data-toggle="tooltip" data-placement="bottom" title="Zoom-in/Zoom-out"> | ||
| 146 | - <img src="content/images/icon-zoom.png" alt=""> | ||
| 147 | - </button> | ||
| 148 | - | ||
| 149 | - </div> | ||
| 150 | - <div class="col-xs-12"> | ||
| 151 | - <button id="btnTranparency" class="btn btn-black btn-sm btn-block marginTop5 tooltip-custom" onclick="onTboxCreation()" data-toggle="tooltip" data-placement="bottom" title="Transparency Box"><img src="content/images/icon-transparency.png" alt=""></button> | ||
| 152 | - </div> | ||
| 153 | - | ||
| 154 | - <div class="col-xs-12 pad0"> | ||
| 155 | - <div class="col-xs-6"> | ||
| 156 | - <button id="btnNormalMode" class="btn btn-primary btn-sm marginTop5 tooltip-custom" onclick="OnEnableNormalMode()" data-toggle="tooltip" data-placement="bottom" title="Normal"> <img src="content/images/bulb.png" alt=""></button> | ||
| 157 | - </div> | ||
| 158 | - <div class="col-xs-6"> | ||
| 159 | - <button id="btnExtract" class="btn btn-black btn-sm pull-right marginTop5 tooltip-custom" onclick="OnEnableExtract()" data-toggle="tooltip" data-placement="bottom" title="Extract"><img src="content/images/bulb1.png" alt=""></button> | ||
| 160 | - </div> | ||
| 161 | - </div> | ||
| 162 | - <div class="col-xs-12 pad0"> | ||
| 163 | - <div class="col-xs-6"> | ||
| 164 | - <button id="btnHighLight" class="btn btn-black btn-sm marginTop5 tooltip-custom btn-resize" onclick="OnEnableHighlight()" data-toggle="tooltip" data-placement="bottom" title="Highlight"> <img src="content/images/Highlight-bulb.png" alt=""></button> | ||
| 165 | - </div> | ||
| 166 | - | ||
| 167 | - <div class="col-xs-6 dropdown hover-tool"> | ||
| 168 | - <div class="custom-tooltip">Highlight Options</div> | ||
| 169 | - <button class="btn btn-black btn-sm pull-right marginTop5 dropdown-toggle" type="button" id="dropdownMenu2" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true" ng-click="LoadBodySystemData()"><img src="content/images/icon-highlight.png" alt="" title=""></button> | ||
| 170 | - <ul class="dropdown-menu" aria-labelledby="dropdownMenu2"> | ||
| 171 | - <li ng-class="CurrentStructure" ><a href="#" title="Current Structure" | ||
| 172 | - ng-click="removeBodySyetemSelectionClass('CurrentStructure')">Current Structure</a></li> | ||
| 173 | - | ||
| 174 | - | ||
| 175 | - <li role="separator" class="divider"></li> | ||
| 176 | - <!--<li ng-class="Cardiovascular"><a href="#" title="Cardiovascular" id="1" ng-click="HighlightBodyByBodySystem($event)">Cardiovascular</a></li> | ||
| 177 | - <li ng-class="Digestive"><a href="#" title="Digestive" id="2" ng-click="HighlightBodyByBodySystem($event)">Digestive</a></li> | ||
| 178 | - <li ng-class="Endocrine"><a href="#" title="Endocrine" id="3" ng-click="HighlightBodyByBodySystem($event)">Endocrine</a></li> | ||
| 179 | - <li ng-class="Immune"><a href="#" title="Immune" id="4" ng-click="HighlightBodyByBodySystem($event)">Immune</a></li> | ||
| 180 | - <li ng-class="Integumentary"><a href="#" title="Integumentary" id="5" ng-click="HighlightBodyByBodySystem($event)">Integumentary</a></li> | ||
| 181 | - <li ng-class="Lymphatic"><a href="#" title="Lymphatic" id="6" ng-click="HighlightBodyByBodySystem($event)">Lymphatic</a></li> | ||
| 182 | - <li ng-class="Muscular"><a href="#" title="Muscular" id="7" ng-click="HighlightBodyByBodySystem($event)">Muscular</a></li> | ||
| 183 | - <li ng-class="Nervous"><a href="#" title="Nervous" id="8" ng-click="HighlightBodyByBodySystem($event)">Nervous</a></li> | ||
| 184 | - <li ng-class="Reproductive"><a href="#" title="Reproductive" id="9" ng-click="HighlightBodyByBodySystem($event)">Reproductive</a></li> | ||
| 185 | - <li ng-class="Respiratory"><a href="#" title="Respiratory" id="10" ng-click="HighlightBodyByBodySystem($event)">Respiratory</a></li> | ||
| 186 | - <li ng-class="Skeletal"><a href="#" title="Skeletal" id="11" ng-click="HighlightBodyByBodySystem($event)">Skeletal</a></li> | ||
| 187 | - <li ng-class="Urinary"><a href="#" title="Urinary" id="12" ng-click="HighlightBodyByBodySystem($event)">Urinary</a></li>--> | ||
| 188 | - | ||
| 189 | - <li ng-class="Cardiovascular"><a href="#" title="Cardiovascular" id="1" onclick="OnBodySystemSelection(event)">Cardiovascular</a></li> | ||
| 190 | - <li ng-class="Digestive"><a href="#" title="Digestive" id="2" onclick="OnBodySystemSelection(event)">Digestive</a></li> | ||
| 191 | - <li ng-class="Endocrine"><a href="#" title="Endocrine" id="3" onclick="OnBodySystemSelection(event)">Endocrine</a></li> | ||
| 192 | - <li ng-class="Immune"><a href="#" title="Immune" id="4" onclick="OnBodySystemSelection(event)">Immune</a></li> | ||
| 193 | - <li ng-class="Integumentary"><a href="#" title="Integumentary" id="5" onclick="OnBodySystemSelection(event)">Integumentary</a></li> | ||
| 194 | - <li ng-class="Lymphatic"><a href="#" title="Lymphatic" id="6" onclick="OnBodySystemSelection(event)">Lymphatic</a></li> | ||
| 195 | - <li ng-class="Muscular"><a href="#" title="Muscular" id="7" onclick="OnBodySystemSelection(event)">Muscular</a></li> | ||
| 196 | - <li ng-class="Nervous"><a href="#" title="Nervous" id="8" onclick="OnBodySystemSelection(event)">Nervous</a></li> | ||
| 197 | - <li ng-class="Reproductive"><a href="#" title="Reproductive" id="9" onclick="OnBodySystemSelection(event)">Reproductive</a></li> | ||
| 198 | - <li ng-class="Respiratory"><a href="#" title="Respiratory" id="10" onclick="OnBodySystemSelection(event)">Respiratory</a></li> | ||
| 199 | - <li ng-class="Skeletal"><a href="#" title="Skeletal" id="11" onclick="OnBodySystemSelection(event)">Skeletal</a></li> | ||
| 200 | - <li ng-class="Urinary"><a href="#" title="Urinary" id="12" onclick="OnBodySystemSelection(event)">Urinary</a></li> | ||
| 201 | - </ul> | ||
| 202 | - </div> | ||
| 203 | - </div> | ||
| 204 | - | ||
| 205 | - <div class="col-xs-12 pad0"> | ||
| 206 | - <div class="col-xs-6 hover-gender-tool" ng-init="switchGender()"> | ||
| 207 | - <div class=" custom-tooltip1">Gender</div> | ||
| 208 | - <button class="btn btn-black btn-sm marginTop5 dropdown-toggle" type="button" id="dropdownMenu4" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true"> <i class=" fa fa-intersex font16"></i></button> | ||
| 209 | - <ul class="dropdown-menu" aria-labelledby="dropdownMenu3"> | ||
| 210 | - <li ng-class="male"> | ||
| 211 | - <!--<button type="button" id="btnMale" onclick="OnGenderChange('Male')" class="btn btn-link" >Male</button>--> | ||
| 212 | - <a href="#" title="Male" onclick="OnGenderChange(event)">Male</a> | ||
| 213 | - </li> | ||
| 214 | - <li ng-class="female"> | ||
| 215 | - | ||
| 216 | - <!--<button type="button" id="btnFemale" onclick="OnGenderChange('Female')" class="btn btn-link">Female</button>--> | ||
| 217 | - <a href="#" title="Female" onclick="OnGenderChange(event)">Female</a> | ||
| 218 | - | ||
| 219 | - <!--<a href="javascript:void(0)" title="Male" ng-click="OnGenderChange($event)">Male</a></li> | ||
| 220 | - <li ng-class="female"><a href="javascript:void(0)" title="Female" ng-click="OnGenderChange($event)">Female</a></li>--> | ||
| 221 | - </li> | ||
| 222 | - </ul> | ||
| 223 | - </div> | ||
| 224 | - | ||
| 225 | - <div class="col-xs-6 tooltip-View-custom"> | ||
| 226 | - <div class="custom-tooltip2">View</div> | ||
| 227 | - <button class="btn btn-black btn-sm pull-right marginTop5 dropdown-toggle" type="button" id="dropdownMenu3" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true"><img src="content/images/view.png" alt="" title=""></button> | ||
| 228 | - <ul class="dropdown-menu" aria-labelledby="dropdownMenu3"> | ||
| 229 | - <!--<li ng-class="AnteriorView"><a href="#" title="Anterior" ng-click="OnViewChange($event)">Anterior</a></li> | ||
| 230 | - <li ng-class="LateralView"><a href="#" title="Lateral" ng-click="OnViewChange($event)">Lateral</a></li> | ||
| 231 | - <li ng-class="MedialView"><a href="#" title="Medial" ng-click="OnViewChange($event)">Medial</a></li> | ||
| 232 | - <li ng-class="PosteriorView"><a href="#" title="Posterior" ng-click="OnViewChange($event)">Posterior</a></li> | ||
| 233 | - <li ng-class="LateralArmView"><a href="#" title="Lateral Arm" ng-click="OnViewChange($event)">Lateral Arm</a></li> | ||
| 234 | - <li ng-class="MedialArmView"><a href="#" title="Medial Arm" ng-click="OnViewChange($event)">Medial Arm</a></li>--> | ||
| 235 | - | ||
| 236 | - <li ng-class="AnteriorView"><a href="#" title="Anterior" onclick="OnViewChange(event)">Anterior</a></li> | ||
| 237 | - <li ng-class="LateralView"><a href="#" title="Lateral" onclick="OnViewChange(event)">Lateral</a></li> | ||
| 238 | - <li ng-class="MedialView"><a href="#" title="Medial" onclick="OnViewChange(event)">Medial</a></li> | ||
| 239 | - <li ng-class="PosteriorView"><a href="#" title="Posterior" onclick="OnViewChange(event)">Posterior</a></li> | ||
| 240 | - <li ng-class="LateralArmView"><a href="#" title="Lateral Arm" onclick="OnViewChange(event)">Lateral Arm</a></li> | ||
| 241 | - <li ng-class="MedialArmView"><a href="#" title="Medial Arm" onclick="OnViewChange(event)">Medial Arm</a></li> | ||
| 242 | - </ul> | ||
| 243 | - </div> | ||
| 244 | - </div> | ||
| 245 | - | ||
| 246 | - <div class="col-xs-12"> | ||
| 247 | - <button id="btnStrutureBox" onclick="enableShowHideStructureBox()" class="btn btn-primary btn-sm marginTop5 btn-block tooltip-custom" data-toggle="tooltip" data-placement="bottom" name="showAnnotationStructure" title="Show/Hide Structure Name Boxes"> <img src="content/images/comment-box.png" alt=""></button> | ||
| 248 | - </div> | ||
| 249 | - | ||
| 250 | - </div> | ||
| 251 | - <div class=""> | ||
| 252 | - | ||
| 253 | - | ||
| 254 | - <!--'x' button is displaying inside the input box in IE browser.--> | ||
| 255 | - <div style="width:80px;margin:10px 0 0 15px;display:inline-block;"> | ||
| 256 | - | ||
| 257 | - <input type="text" class="form-control item" id="txtlayerNumber" value="0" ng-model="layerNumber" ng-keyup="LayerValueChangeBasedOnKeyUp($event)" ng-keydown="LayerChangeBasedOnKeyPressed($event)" style="height:32px;border-radius:0;text-align:center;"> | ||
| 258 | - | ||
| 259 | - | ||
| 260 | - | ||
| 261 | - </div> | ||
| 262 | - | ||
| 263 | - | ||
| 264 | - <!--<p> | ||
| 265 | - <input class="item" type="number" id="txtlayerNumber" value="0" step="1" min="0" style="width:80px; margin:10px 0 0 15px;" ng-model="layerNumber" ng-keydown="LayerChangeBasedOnKeyPressed($event)" ng-click="LayerChangeOnMouseUpDown($event)" /> | ||
| 266 | - </p>--> | ||
| 267 | - <div id="layerChangeSlider" style="height:140px;" class="vert_slider " ng-model="layerNumber"></div> | ||
| 268 | - </div> | ||
| 269 | - </div> | ||
| 270 | - | ||
| 271 | - <div class="main2"> | ||
| 272 | - <div class="col-sm-12 stickey-area"> | ||
| 273 | - <div class="breadcrumb "> | ||
| 274 | - <div class=""> | ||
| 275 | - <div class="input-group col-sm-8 col-xs-7 col-md-10 pull-left"> | ||
| 276 | - | ||
| 277 | - <input type="text" class="form-control input-sm pull-left" id="typedTermName" onclick="OnSearch()" ondblclick="OnSearch()" ng-model="searchFilter" ng-change="resetSearchListView()" ng-blur="HideSearch()" placeholder=" search..."> | ||
| 278 | - | ||
| 279 | - <div id="backdrop" ng-show="IsSearchVisible"> | ||
| 280 | - <div id="searchListDiv" class="col-sm-12 col-xs-12 col-md-12 col-lg-12 pull-left"> | ||
| 281 | - | ||
| 282 | - </div> | ||
| 283 | - </div> | ||
| 284 | - | ||
| 285 | - </div> | ||
| 286 | - <div class="btn-group" style="vertical-align:top;"> | ||
| 287 | - | ||
| 288 | - <button type="button" id="btnDATermSearch" style="padding: 5px 10px 4px 10px !important;border: none;" class="btn btn-success btn-sm" onclick="OnSearch()" ng-blur="HideSearch()"> | ||
| 289 | - <!--<img src="~/../content/images/DA/go-to.png" style="height: 30px;width:50px">--> | ||
| 290 | - <i class="fa fa-caret-down" style="font-size:20px;"></i> | ||
| 291 | - </button> | ||
| 292 | - </div> | ||
| 293 | - <div class="btn-group open" id="da-body-nav"> | ||
| 294 | - <button type="button" style="padding:0px 0px 10px 1px !important;background-color:rgba(255,255,255,0.0); border:none;" class="btn btn-primary dropdown-toggle btn-sm" id="navigatorBtn"> | ||
| 295 | - <img src="~/../content/images/DA/navigator-view.png" style="height:30px; width:50px" /> | ||
| 296 | - </button> | ||
| 297 | - | ||
| 298 | - <div class="dropdown-menu" id="navigatorDiv" style="min-height: initial; min-width: initial; "> | ||
| 299 | - <div id="containment-wrapper" align="center" style="min-width: initial; height: 119px; "> | ||
| 300 | - <img id="navimg" alt="" /> | ||
| 301 | - <div id="draggable" class="draggable ui-widget-content dragdivposition" ng-mouseup="ScrollCanvasDiv()"> | ||
| 302 | - </div> | ||
| 303 | - </div> | ||
| 304 | - | ||
| 305 | - </div> | ||
| 306 | - </div> | ||
| 307 | - </div> | ||
| 308 | - </div> | ||
| 309 | - </div> | ||
| 310 | - <div class=" canavsParent col-sm-12 " id="cp"> | ||
| 311 | - <div class="container-fluid"> | ||
| 312 | - <div class="row"> | ||
| 313 | - <div id="canvasDiv" class="col-sm-12 img-thumbnail" align="center"> | ||
| 314 | - <canvas id="canvasPaint" ng-click="FreeStylePaint($event)" width="2277" height="3248" class="canvas-annotationStyle1"></canvas> | ||
| 315 | - <canvas id="canvas" ng-click="onDrawingCanvasClick($event)" width="2277" height="3248" class="canvas-annotationStyle"></canvas> | ||
| 316 | - </div> | ||
| 317 | - <!--<div id="canvasDiv" style=" width: 95% !important;top:0px;overflow:scroll;background-color:white;">--> | ||
| 318 | - <!--<div id="daLoaderLabel">Loading....</div>--> | ||
| 319 | - | ||
| 320 | - </div> | ||
| 321 | - <div class="clearfix"></div> | ||
| 322 | - </div> | ||
| 323 | - </div> | ||
| 324 | - </div> | ||
| 325 | - <div class="clearfix"></div> | ||
| 326 | - <!--to prevent transparency scale from closing on click anywhere outside set data-backdrop="static" data-keyboard="false" --> | ||
| 327 | - <!--<div class="modal fade bs-example-modal-sm" tabindex="-1" aria-labelledby="mySmallModalLabel" id="transparencyScale" data-backdrop="static" data-keyboard="false"> | ||
| 328 | - <div class="modal-dialog modal-sm"> | ||
| 329 | - <div class="modal-content"> | ||
| 330 | - <div class="modal-header annotation-modal-header"> | ||
| 331 | - <button type="button" class="close" data-dismiss="modal" aria-label="Close" ng-click="CloseTransparencyBox()"><span aria-hidden="true">×</span></button> | ||
| 332 | - <h4 class="modal-title">Transparency</h4> | ||
| 333 | - </div> | ||
| 334 | - <div class="modal-body"> | ||
| 335 | - <div class="row"> | ||
| 336 | - <div class="col-sm-12"> | ||
| 337 | - <div class="padded25"> | ||
| 338 | - <div class="slider"></div> | ||
| 339 | - </div> | ||
| 340 | - </div> | ||
| 341 | - </div> | ||
| 342 | - </div> | ||
| 343 | - </div> | ||
| 344 | - </div> | ||
| 345 | - </div>--> | ||
| 346 | - <!--<div class="ui-widget-content" id="transparencyScale" style="width: 350px; height: 130px;visibility:hidden;display:block;float:left"> | ||
| 347 | - <div class="modal-dialog modal-sm"> | ||
| 348 | - <div class="modal-content"> | ||
| 349 | - <div class="modal-header annotation-modal-header"> | ||
| 350 | - <button type="button" class="close" data-dismiss="modal" aria-label="Close" ng-click="CloseTransparencyBox()"><span aria-hidden="true">×</span></button> | ||
| 351 | - <h4>Transparency</h4> | ||
| 352 | - </div> | ||
| 353 | - <div> | ||
| 354 | - <div class="row"> | ||
| 355 | - <div class="col-sm-12"> | ||
| 356 | - <div class="padded25"> | ||
| 357 | - <div class="slider"></div> | ||
| 358 | - </div> | ||
| 359 | - </div> | ||
| 360 | - </div> | ||
| 361 | - </div> | ||
| 362 | - </div> | ||
| 363 | - </div> | ||
| 364 | - </div>--> | ||
| 365 | - <div class="ui-widget-content" id="transparencyScale" style="width: 350px; height: 150px;visibility:hidden;display:block;float:left"> | ||
| 366 | - <div> | ||
| 367 | - <div> | ||
| 368 | - <div class="modal-header annotation-modal-header"> | ||
| 369 | - <button id="btnTBoxClose" type="button" onclick="onTboxClose()" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button> | ||
| 370 | - <h4>Transparency</h4> | ||
| 371 | - </div> | ||
| 372 | - <div> | ||
| 373 | - <div class="row"> | ||
| 374 | - <div class="col-sm-12"> | ||
| 375 | - <div class="padded25"> | ||
| 376 | - <!--<div class="slider" id="sliderScale"></div>--> | ||
| 377 | - <div class="slider" id="tbSlider"></div> | ||
| 378 | - </div> | ||
| 379 | - </div> | ||
| 380 | - </div> | ||
| 381 | - </div> | ||
| 382 | - </div> | ||
| 383 | - </div> | ||
| 384 | - </div> | ||
| 385 | - <div class="modal fade" id="daMessageModal" role="dialog" style="top:20%;"> | ||
| 386 | - | ||
| 387 | - <div class="modal-dialog modal-sm"> | ||
| 388 | - | ||
| 389 | - | ||
| 390 | - | ||
| 391 | - <div class="modal-content"> | ||
| 392 | - | ||
| 393 | - | ||
| 394 | - <div class="modal-header"> | ||
| 395 | - | ||
| 396 | - <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button> | ||
| 397 | - | ||
| 398 | - </div> | ||
| 399 | - | ||
| 400 | - <div class="modal-title"></div> | ||
| 401 | - | ||
| 402 | - <!--<div class="modal-body">"No body system"</div>--> | ||
| 403 | - | ||
| 404 | - <div class="modal-header"><p data-ng-bind ="message" style="font-size:15px;"></p></div> | ||
| 405 | - | ||
| 406 | - | ||
| 407 | - | ||
| 408 | - <div class="modal-footer"> <button type="button" class="btn btn-primary btn-sm" data-dismiss="modal">OK</button></div> | ||
| 409 | - | ||
| 410 | - | ||
| 411 | - </div> | ||
| 412 | - | ||
| 413 | - | ||
| 414 | - </div> | ||
| 415 | - | ||
| 416 | - </div> | ||
| 417 | - | ||
| 418 | - | ||
| 419 | - <div class="modal fade" id="daMessageModal" role="dialog"> | ||
| 420 | - <div class="modal-dialog"> | ||
| 421 | - | ||
| 422 | - <div class="modal-content"> | ||
| 423 | - <!--<div class="modal-header"> | ||
| 424 | - <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button> | ||
| 425 | - </div> | ||
| 426 | - <div class="modal-title"></div>--> | ||
| 427 | - <!--<div class="modal-body">"No body system"</div>--> | ||
| 428 | - <div class="modal-body" data-ng-bind="message"></div> | ||
| 429 | - | ||
| 430 | - <div class="modal-footer"> <button type="button" class="btn btn-primary" data-dismiss="modal">OK</button></div> | ||
| 431 | - </div> | ||
| 432 | - </div> | ||
| 433 | - </div> | ||
| 434 | -</div> | ||
| 435 | -<!--<script src="../../../libs/jquery/1.11.4/jquery-ui.js"></script>--> | ||
| 436 | -<script src="libs/jquery/jquery_plugin/slider-pips/jquery-ui-slider-pips.js"></script> | ||
| 437 | -<script> | ||
| 438 | - $(document).ready(function () { | ||
| 439 | - $("#navigatorBtn").on('click', function () { | ||
| 440 | - $("#navigatorDiv").toggle(); | ||
| 441 | - }); | ||
| 442 | - }); | ||
| 443 | -</script> | ||
| 444 | -<script> | ||
| 445 | - $(window).load(function () { | ||
| 446 | - $(".stickey-area").sticky(); | ||
| 447 | - | ||
| 448 | - | ||
| 449 | - });</script> | ||
| 450 | -<script> | ||
| 451 | - $(function () { | ||
| 452 | - | ||
| 453 | - var regExp = /[0-9\.\,]/; | ||
| 454 | - $('#txtlayerNumber').on('keydown keyup', function (e) { | ||
| 455 | - var value = String.fromCharCode(e.which) || e.key; | ||
| 456 | - // Only numbers, dots and commas | ||
| 457 | - if (!regExp.test(value) | ||
| 458 | - && e.which != 188 // , | ||
| 459 | - && e.which != 190 // . | ||
| 460 | - && e.which != 8 // backspace | ||
| 461 | - && e.which != 46 // delete | ||
| 462 | - && (e.which < 37 // arrow keys | ||
| 463 | - || e.which > 40) | ||
| 464 | - && (e.keyCode < 96 // Dissectible Anatomy > Num Lock is not working for enter the layer. | ||
| 465 | - || e.keyCode > 105)) | ||
| 466 | - | ||
| 467 | - { | ||
| 468 | - e.preventDefault(); | ||
| 469 | - return false; | ||
| 470 | - } | ||
| 471 | - }); | ||
| 472 | - | ||
| 473 | - }); | ||
| 474 | - | ||
| 475 | -</script> | ||
| 476 | -<!--<script> | ||
| 477 | - $(function () { | ||
| 478 | - $('#layerChangeSlider').slider().on('slideStop', function () { | ||
| 479 | - alert('fjkjksdbgjkgjkfgk') | ||
| 480 | - }) | ||
| 481 | -</script> | ||
| 482 | - });--> | ||
| 483 | - | ||
| 484 | -<script src="libs/jquery/jquery_plugin/slider-pips/jquery-ui-slider-pips.js"></script> | ||
| 485 | -<script> | ||
| 486 | - $(function () { | ||
| 487 | - | ||
| 488 | - | ||
| 489 | - // issue in navigator image in internet explorer | ||
| 490 | - if ($.browser.msie == true) { | ||
| 491 | - $("#navigatorDiv").css({"min-width":"auto", "min-height":"auto"}); | ||
| 492 | - $("#containment-wrapper").css("min-width", "auto"); | ||
| 493 | - } | ||
| 494 | - $("#transparencyScale").draggable(); | ||
| 495 | - $("#draggable").draggable({ containment: "#containment-wrapper", scroll: false }); | ||
| 496 | - }); | ||
| 497 | -</script> | ||
| 498 | -<script> | ||
| 499 | - $(function () { | ||
| 500 | - | ||
| 501 | - $("#dropdownMenu2").mouseover(function () { | ||
| 502 | - $(".custom-tooltip").css("display", "block"); | ||
| 503 | - }); | ||
| 504 | - $("#dropdownMenu2").mouseout(function () { | ||
| 505 | - $(".custom-tooltip").css("display", "none"); | ||
| 506 | - }); | ||
| 507 | - | ||
| 508 | - $("#dropdownMenu4").mouseover(function () { | ||
| 509 | - $(".custom-tooltip1").css("display", "block"); | ||
| 510 | - }); | ||
| 511 | - $("#dropdownMenu4").mouseout(function () { | ||
| 512 | - $(".custom-tooltip1").css("display", "none"); | ||
| 513 | - }); | ||
| 514 | - | ||
| 515 | - $("#dropdownMenu3").mouseover(function () { | ||
| 516 | - $(".custom-tooltip2").css("display", "block"); | ||
| 517 | - }); | ||
| 518 | - $("#dropdownMenu3").mouseout(function () { | ||
| 519 | - $(".custom-tooltip2").css("display", "none"); | ||
| 520 | - }); | ||
| 521 | - | ||
| 522 | - | ||
| 523 | - }); | ||
| 524 | -</script> | ||
| 525 | -<script> | ||
| 526 | - $(".slider") | ||
| 527 | - .slider({ | ||
| 528 | - min: 0, | ||
| 529 | - max: 100, | ||
| 530 | - value: 50, | ||
| 531 | - range: "min", | ||
| 532 | - orientation: "horizontal", | ||
| 533 | - stop: function (event, ui) { | ||
| 534 | - //alert('trans changed') | ||
| 535 | - var scope = angular.element(document.getElementById("daView")).scope(); | ||
| 536 | - scope.$apply(function () { | ||
| 537 | - scope.onTransparencyChange(event, ui); | ||
| 538 | - }); | ||
| 539 | - } | ||
| 540 | - }) | ||
| 541 | - .slider("pips", { | ||
| 542 | - rest: "label", | ||
| 543 | - step: "10" | ||
| 544 | - }); | ||
| 545 | - | ||
| 546 | -</script> | ||
| 547 | -<script> | ||
| 548 | - $(".tooltip-custom").tooltip({ | ||
| 549 | - tooltipClass: 'customTooltip' | ||
| 550 | - }); | ||
| 551 | -</script> | ||
| 552 | -<script> | ||
| 553 | - $(function () { | ||
| 554 | - $(".modal").draggable(); | ||
| 555 | - }); | ||
| 556 | -</script> | ||
| 557 | -<script> | ||
| 558 | - $(function () { | ||
| 559 | - "use strict"; | ||
| 560 | - /*** Sidebar Toggle ***/ | ||
| 561 | - var barPos = 0; | ||
| 562 | - var bar = $('.tools'); | ||
| 563 | - var main = $('.main2'); | ||
| 564 | - $('.toggleBar').click(function () { | ||
| 565 | - | ||
| 566 | - bar.toggleClass('active'); | ||
| 567 | - main.toggleClass('active'); | ||
| 568 | - }); | ||
| 569 | - }); | ||
| 570 | -</script> | ||
| 571 | - | ||
| 572 | - | 1 | +<!--<style> |
| 2 | + .slider label { | ||
| 3 | + position: absolute; | ||
| 4 | + width: 20px; | ||
| 5 | + margin-left: -10px; | ||
| 6 | + text-align: center; | ||
| 7 | + margin-top: 20px; | ||
| 8 | + } | ||
| 9 | + | ||
| 10 | + /* below is not necessary, just for style */ | ||
| 11 | + .slider { | ||
| 12 | + width: 50%; | ||
| 13 | + margin: 2em auto; | ||
| 14 | + } | ||
| 15 | +</style>--> | ||
| 16 | +<style> | ||
| 17 | + /*Dated:22-07-2016 Issue#4958:In Open body view, the side buttons are getting disturbed on layer change. */ | ||
| 18 | + .btn-resize { | ||
| 19 | + padding: 6px 11px; | ||
| 20 | + border: 0px solid #000; | ||
| 21 | + border-radius: 1px; | ||
| 22 | + } | ||
| 23 | +</style> | ||
| 24 | +<style> | ||
| 25 | + /*Dated:22-07-2016 Issue#4958:In Open body view, the side buttons are getting disturbed on layer change. */ | ||
| 26 | + .btn-resize { | ||
| 27 | + padding: 6px 11px; | ||
| 28 | + border: 0px solid #000; | ||
| 29 | + border-radius: 1px; | ||
| 30 | + } | ||
| 31 | +</style> | ||
| 32 | + | ||
| 33 | +<style> | ||
| 34 | + #draggable { | ||
| 35 | + opacity: 0.2; | ||
| 36 | + border: solid; | ||
| 37 | + position: absolute; | ||
| 38 | + /*Bug #24255: Mac > DA > Body Navigator is not appear properly.*/ | ||
| 39 | + height:14px !important; | ||
| 40 | + } | ||
| 41 | + | ||
| 42 | + #wrapper { | ||
| 43 | + position: relative; | ||
| 44 | + width: 100%; | ||
| 45 | + height: 100%; | ||
| 46 | + margin: 20px auto; | ||
| 47 | + } | ||
| 48 | + | ||
| 49 | + .tooltip-custom + .tooltip > .tooltip-inner { | ||
| 50 | + background-color: #fff; | ||
| 51 | + border: 1px solid #000; | ||
| 52 | + color: #000; | ||
| 53 | + border-radius: 0; | ||
| 54 | + } | ||
| 55 | + | ||
| 56 | + .tooltip-custom + .tooltip > .tooltip-arrow { | ||
| 57 | + display: none; | ||
| 58 | + } | ||
| 59 | + | ||
| 60 | + | ||
| 61 | + .custom-tooltip { | ||
| 62 | + background-color: #333; | ||
| 63 | + border: 0 none; | ||
| 64 | + color: #fff !important; | ||
| 65 | + left: -52px; | ||
| 66 | + /*opacity: 0.9;*/ | ||
| 67 | + padding: 7px; | ||
| 68 | + position: absolute; | ||
| 69 | + text-align: center; | ||
| 70 | + top: 45px; | ||
| 71 | + width: 120px; | ||
| 72 | + display: none; | ||
| 73 | + z-index: 10000; | ||
| 74 | + border: 1px solid #000; | ||
| 75 | + color: #000; | ||
| 76 | + border-radius: 0; | ||
| 77 | + } | ||
| 78 | + | ||
| 79 | + .custom-tooltip1 { | ||
| 80 | + background-color: #333; | ||
| 81 | + border: 0 none; | ||
| 82 | + color: #fff !important; | ||
| 83 | + left: 52px; | ||
| 84 | + /*opacity: 0.9;*/ | ||
| 85 | + padding: 7px; | ||
| 86 | + position: absolute; | ||
| 87 | + text-align: center; | ||
| 88 | + top: 45px; | ||
| 89 | + width: 70px; | ||
| 90 | + display: none; | ||
| 91 | + z-index: 10000; | ||
| 92 | + border: 1px solid #000; | ||
| 93 | + color: #000; | ||
| 94 | + border-radius: 0; | ||
| 95 | + } | ||
| 96 | + | ||
| 97 | + .custom-tooltip2 { | ||
| 98 | + background-color: #333; | ||
| 99 | + border: 0 none; | ||
| 100 | + color: #fff !important; | ||
| 101 | + right: 10px; | ||
| 102 | + /*opacity: 0.9;*/ | ||
| 103 | + padding: 7px; | ||
| 104 | + position: absolute; | ||
| 105 | + text-align: center; | ||
| 106 | + top: 45px; | ||
| 107 | + width: 60px; | ||
| 108 | + display: none; | ||
| 109 | + z-index: 10000; | ||
| 110 | + border: 1px solid #000; | ||
| 111 | + color: #000; | ||
| 112 | + border-radius: 0; | ||
| 113 | + } | ||
| 114 | + .pad0{padding:0;} | ||
| 115 | +</style> | ||
| 116 | +<!--Annotation Toolbar: Jcanvas--> | ||
| 117 | +<style> | ||
| 118 | + .canvas-annotationStyle { | ||
| 119 | + display: none; | ||
| 120 | + background-color: transparent; | ||
| 121 | + z-index: 12000; | ||
| 122 | + position: absolute; | ||
| 123 | + left: 0; | ||
| 124 | + right: 0; | ||
| 125 | + } | ||
| 126 | + | ||
| 127 | + .canvas-annotationStyle1 { | ||
| 128 | + display: none; | ||
| 129 | + background-color: transparent; | ||
| 130 | + z-index: 12000; | ||
| 131 | + position: absolute; | ||
| 132 | + left: 0; | ||
| 133 | + right: 0; | ||
| 134 | + } | ||
| 135 | + | ||
| 136 | +</style> | ||
| 137 | +<div class=" " id="daView" ng-controller="DAController"> | ||
| 138 | + <div class="pos-relative leftToolBar tools pull-left"> | ||
| 139 | + <div class="toggle-icon toggleBar toggleHeadingButton" title="Show/Hide Sidebar" style="top:20px;"></div> | ||
| 140 | + <div class="" style="top:20px"> | ||
| 141 | + <div class="col-xs-6"> | ||
| 142 | + <button id="btnIdentify" onclick="OnIdentifyClick()" class="btn btn-primary btn-sm tooltip-custom" data-toggle="tooltip" data-placement="bottom" title="Identify"> <img src="content/images/icon-identity.png" alt=""></button> | ||
| 143 | + </div> | ||
| 144 | + <div class="col-xs-6 pull-right"> | ||
| 145 | + <button class="btn btn-black btn-sm pull-right tooltip-custom" onclick="OnZoom()" id="btnZoom" data-toggle="tooltip" data-placement="bottom" title="Zoom-in/Zoom-out"> | ||
| 146 | + <img src="content/images/icon-zoom.png" alt=""> | ||
| 147 | + </button> | ||
| 148 | + | ||
| 149 | + </div> | ||
| 150 | + <div class="col-xs-12"> | ||
| 151 | + <button id="btnTranparency" class="btn btn-black btn-sm btn-block marginTop5 tooltip-custom" onclick="onTboxCreation()" data-toggle="tooltip" data-placement="bottom" title="Transparency Box"><img src="content/images/icon-transparency.png" alt=""></button> | ||
| 152 | + </div> | ||
| 153 | + | ||
| 154 | + <div class="col-xs-12 pad0"> | ||
| 155 | + <div class="col-xs-6"> | ||
| 156 | + <button id="btnNormalMode" class="btn btn-primary btn-sm marginTop5 tooltip-custom" onclick="OnEnableNormalMode()" data-toggle="tooltip" data-placement="bottom" title="Normal"> <img src="content/images/bulb.png" alt=""></button> | ||
| 157 | + </div> | ||
| 158 | + <div class="col-xs-6"> | ||
| 159 | + <button id="btnExtract" class="btn btn-black btn-sm pull-right marginTop5 tooltip-custom" onclick="OnEnableExtract()" data-toggle="tooltip" data-placement="bottom" title="Extract"><img src="content/images/bulb1.png" alt=""></button> | ||
| 160 | + </div> | ||
| 161 | + </div> | ||
| 162 | + <div class="col-xs-12 pad0"> | ||
| 163 | + <div class="col-xs-6"> | ||
| 164 | + <button id="btnHighLight" class="btn btn-black btn-sm marginTop5 tooltip-custom btn-resize" onclick="OnEnableHighlight()" data-toggle="tooltip" data-placement="bottom" title="Highlight"> <img src="content/images/Highlight-bulb.png" alt=""></button> | ||
| 165 | + </div> | ||
| 166 | + | ||
| 167 | + <div class="col-xs-6 dropdown hover-tool"> | ||
| 168 | + <div class="custom-tooltip">Highlight Options</div> | ||
| 169 | + <button class="btn btn-black btn-sm pull-right marginTop5 dropdown-toggle" type="button" id="dropdownMenu2" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true" ng-click="LoadBodySystemData()"><img src="content/images/icon-highlight.png" alt="" title=""></button> | ||
| 170 | + <ul class="dropdown-menu" aria-labelledby="dropdownMenu2"> | ||
| 171 | + <li ng-class="CurrentStructure" ><a href="#" title="Current Structure" | ||
| 172 | + ng-click="removeBodySyetemSelectionClass('CurrentStructure')">Current Structure</a></li> | ||
| 173 | + | ||
| 174 | + | ||
| 175 | + <li role="separator" class="divider"></li> | ||
| 176 | + <!--<li ng-class="Cardiovascular"><a href="#" title="Cardiovascular" id="1" ng-click="HighlightBodyByBodySystem($event)">Cardiovascular</a></li> | ||
| 177 | + <li ng-class="Digestive"><a href="#" title="Digestive" id="2" ng-click="HighlightBodyByBodySystem($event)">Digestive</a></li> | ||
| 178 | + <li ng-class="Endocrine"><a href="#" title="Endocrine" id="3" ng-click="HighlightBodyByBodySystem($event)">Endocrine</a></li> | ||
| 179 | + <li ng-class="Immune"><a href="#" title="Immune" id="4" ng-click="HighlightBodyByBodySystem($event)">Immune</a></li> | ||
| 180 | + <li ng-class="Integumentary"><a href="#" title="Integumentary" id="5" ng-click="HighlightBodyByBodySystem($event)">Integumentary</a></li> | ||
| 181 | + <li ng-class="Lymphatic"><a href="#" title="Lymphatic" id="6" ng-click="HighlightBodyByBodySystem($event)">Lymphatic</a></li> | ||
| 182 | + <li ng-class="Muscular"><a href="#" title="Muscular" id="7" ng-click="HighlightBodyByBodySystem($event)">Muscular</a></li> | ||
| 183 | + <li ng-class="Nervous"><a href="#" title="Nervous" id="8" ng-click="HighlightBodyByBodySystem($event)">Nervous</a></li> | ||
| 184 | + <li ng-class="Reproductive"><a href="#" title="Reproductive" id="9" ng-click="HighlightBodyByBodySystem($event)">Reproductive</a></li> | ||
| 185 | + <li ng-class="Respiratory"><a href="#" title="Respiratory" id="10" ng-click="HighlightBodyByBodySystem($event)">Respiratory</a></li> | ||
| 186 | + <li ng-class="Skeletal"><a href="#" title="Skeletal" id="11" ng-click="HighlightBodyByBodySystem($event)">Skeletal</a></li> | ||
| 187 | + <li ng-class="Urinary"><a href="#" title="Urinary" id="12" ng-click="HighlightBodyByBodySystem($event)">Urinary</a></li>--> | ||
| 188 | + | ||
| 189 | + <li ng-class="Cardiovascular"><a href="#" title="Cardiovascular" id="1" onclick="OnBodySystemSelection(event)">Cardiovascular</a></li> | ||
| 190 | + <li ng-class="Digestive"><a href="#" title="Digestive" id="2" onclick="OnBodySystemSelection(event)">Digestive</a></li> | ||
| 191 | + <li ng-class="Endocrine"><a href="#" title="Endocrine" id="3" onclick="OnBodySystemSelection(event)">Endocrine</a></li> | ||
| 192 | + <li ng-class="Immune"><a href="#" title="Immune" id="4" onclick="OnBodySystemSelection(event)">Immune</a></li> | ||
| 193 | + <li ng-class="Integumentary"><a href="#" title="Integumentary" id="5" onclick="OnBodySystemSelection(event)">Integumentary</a></li> | ||
| 194 | + <li ng-class="Lymphatic"><a href="#" title="Lymphatic" id="6" onclick="OnBodySystemSelection(event)">Lymphatic</a></li> | ||
| 195 | + <li ng-class="Muscular"><a href="#" title="Muscular" id="7" onclick="OnBodySystemSelection(event)">Muscular</a></li> | ||
| 196 | + <li ng-class="Nervous"><a href="#" title="Nervous" id="8" onclick="OnBodySystemSelection(event)">Nervous</a></li> | ||
| 197 | + <li ng-class="Reproductive"><a href="#" title="Reproductive" id="9" onclick="OnBodySystemSelection(event)">Reproductive</a></li> | ||
| 198 | + <li ng-class="Respiratory"><a href="#" title="Respiratory" id="10" onclick="OnBodySystemSelection(event)">Respiratory</a></li> | ||
| 199 | + <li ng-class="Skeletal"><a href="#" title="Skeletal" id="11" onclick="OnBodySystemSelection(event)">Skeletal</a></li> | ||
| 200 | + <li ng-class="Urinary"><a href="#" title="Urinary" id="12" onclick="OnBodySystemSelection(event)">Urinary</a></li> | ||
| 201 | + </ul> | ||
| 202 | + </div> | ||
| 203 | + </div> | ||
| 204 | + | ||
| 205 | + <div class="col-xs-12 pad0"> | ||
| 206 | + <div class="col-xs-6 hover-gender-tool" ng-init="switchGender()"> | ||
| 207 | + <div class=" custom-tooltip1">Gender</div> | ||
| 208 | + <button class="btn btn-black btn-sm marginTop5 dropdown-toggle" type="button" id="dropdownMenu4" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true"> <i class=" fa fa-intersex font16"></i></button> | ||
| 209 | + <ul class="dropdown-menu" aria-labelledby="dropdownMenu3"> | ||
| 210 | + <li ng-class="male"> | ||
| 211 | + <!--<button type="button" id="btnMale" onclick="OnGenderChange('Male')" class="btn btn-link" >Male</button>--> | ||
| 212 | + <a href="#" title="Male" onclick="OnGenderChange(event)">Male</a> | ||
| 213 | + </li> | ||
| 214 | + <li ng-class="female"> | ||
| 215 | + | ||
| 216 | + <!--<button type="button" id="btnFemale" onclick="OnGenderChange('Female')" class="btn btn-link">Female</button>--> | ||
| 217 | + <a href="#" title="Female" onclick="OnGenderChange(event)">Female</a> | ||
| 218 | + | ||
| 219 | + <!--<a href="javascript:void(0)" title="Male" ng-click="OnGenderChange($event)">Male</a></li> | ||
| 220 | + <li ng-class="female"><a href="javascript:void(0)" title="Female" ng-click="OnGenderChange($event)">Female</a></li>--> | ||
| 221 | + </li> | ||
| 222 | + </ul> | ||
| 223 | + </div> | ||
| 224 | + | ||
| 225 | + <div class="col-xs-6 tooltip-View-custom"> | ||
| 226 | + <div class="custom-tooltip2">View</div> | ||
| 227 | + <button class="btn btn-black btn-sm pull-right marginTop5 dropdown-toggle" type="button" id="dropdownMenu3" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true"><img src="content/images/view.png" alt="" title=""></button> | ||
| 228 | + <ul class="dropdown-menu" aria-labelledby="dropdownMenu3"> | ||
| 229 | + <!--<li ng-class="AnteriorView"><a href="#" title="Anterior" ng-click="OnViewChange($event)">Anterior</a></li> | ||
| 230 | + <li ng-class="LateralView"><a href="#" title="Lateral" ng-click="OnViewChange($event)">Lateral</a></li> | ||
| 231 | + <li ng-class="MedialView"><a href="#" title="Medial" ng-click="OnViewChange($event)">Medial</a></li> | ||
| 232 | + <li ng-class="PosteriorView"><a href="#" title="Posterior" ng-click="OnViewChange($event)">Posterior</a></li> | ||
| 233 | + <li ng-class="LateralArmView"><a href="#" title="Lateral Arm" ng-click="OnViewChange($event)">Lateral Arm</a></li> | ||
| 234 | + <li ng-class="MedialArmView"><a href="#" title="Medial Arm" ng-click="OnViewChange($event)">Medial Arm</a></li>--> | ||
| 235 | + | ||
| 236 | + <li ng-class="AnteriorView"><a href="#" title="Anterior" onclick="OnViewChange(event)">Anterior</a></li> | ||
| 237 | + <li ng-class="LateralView"><a href="#" title="Lateral" onclick="OnViewChange(event)">Lateral</a></li> | ||
| 238 | + <li ng-class="MedialView"><a href="#" title="Medial" onclick="OnViewChange(event)">Medial</a></li> | ||
| 239 | + <li ng-class="PosteriorView"><a href="#" title="Posterior" onclick="OnViewChange(event)">Posterior</a></li> | ||
| 240 | + <li ng-class="LateralArmView"><a href="#" title="Lateral Arm" onclick="OnViewChange(event)">Lateral Arm</a></li> | ||
| 241 | + <li ng-class="MedialArmView"><a href="#" title="Medial Arm" onclick="OnViewChange(event)">Medial Arm</a></li> | ||
| 242 | + </ul> | ||
| 243 | + </div> | ||
| 244 | + </div> | ||
| 245 | + | ||
| 246 | + <div class="col-xs-12"> | ||
| 247 | + <button id="btnStrutureBox" onclick="enableShowHideStructureBox()" class="btn btn-primary btn-sm marginTop5 btn-block tooltip-custom" data-toggle="tooltip" data-placement="bottom" name="showAnnotationStructure" title="Show/Hide Structure Name Boxes"> <img src="content/images/comment-box.png" alt=""></button> | ||
| 248 | + </div> | ||
| 249 | + | ||
| 250 | + </div> | ||
| 251 | + <div class=""> | ||
| 252 | + | ||
| 253 | + | ||
| 254 | + <!--'x' button is displaying inside the input box in IE browser.--> | ||
| 255 | + <div style="width:80px;margin:10px 0 0 15px;display:inline-block;"> | ||
| 256 | + | ||
| 257 | + <input type="text" class="form-control item" id="txtlayerNumber" value="0" ng-model="layerNumber" ng-keyup="LayerValueChangeBasedOnKeyUp($event)" ng-keydown="LayerChangeBasedOnKeyPressed($event)" style="height:32px;border-radius:0;text-align:center;"> | ||
| 258 | + | ||
| 259 | + | ||
| 260 | + | ||
| 261 | + </div> | ||
| 262 | + | ||
| 263 | + | ||
| 264 | + <!--<p> | ||
| 265 | + <input class="item" type="number" id="txtlayerNumber" value="0" step="1" min="0" style="width:80px; margin:10px 0 0 15px;" ng-model="layerNumber" ng-keydown="LayerChangeBasedOnKeyPressed($event)" ng-click="LayerChangeOnMouseUpDown($event)" /> | ||
| 266 | + </p>--> | ||
| 267 | + <div id="layerChangeSlider" style="height:140px;" class="vert_slider " ng-model="layerNumber"></div> | ||
| 268 | + </div> | ||
| 269 | + </div> | ||
| 270 | + | ||
| 271 | + <div class="main2"> | ||
| 272 | + <div class="col-sm-12 stickey-area"> | ||
| 273 | + <div class="breadcrumb "> | ||
| 274 | + <div class=""> | ||
| 275 | + <div class="input-group col-sm-8 col-xs-7 col-md-10 pull-left"> | ||
| 276 | + | ||
| 277 | + <input type="text" class="form-control input-sm pull-left" id="typedTermName" onclick="OnSearch()" ondblclick="OnSearch()" ng-model="searchFilter" ng-change="resetSearchListView()" ng-blur="HideSearch()" placeholder=" search..."> | ||
| 278 | + | ||
| 279 | + <div id="backdrop" ng-show="IsSearchVisible"> | ||
| 280 | + <div id="searchListDiv" class="col-sm-12 col-xs-12 col-md-12 col-lg-12 pull-left"> | ||
| 281 | + | ||
| 282 | + </div> | ||
| 283 | + </div> | ||
| 284 | + | ||
| 285 | + </div> | ||
| 286 | + <div class="btn-group" style="vertical-align:top;"> | ||
| 287 | + | ||
| 288 | + <button type="button" id="btnDATermSearch" style="padding: 5px 10px 4px 10px !important;border: none;" class="btn btn-success btn-sm" onclick="OnSearch()" ng-blur="HideSearch()"> | ||
| 289 | + <!--<img src="~/../content/images/DA/go-to.png" style="height: 30px;width:50px">--> | ||
| 290 | + <i class="fa fa-caret-down" style="font-size:20px;"></i> | ||
| 291 | + </button> | ||
| 292 | + </div> | ||
| 293 | + <div class="btn-group open" id="da-body-nav"> | ||
| 294 | + <button type="button" style="padding:0px 0px 10px 1px !important;background-color:rgba(255,255,255,0.0); border:none;" class="btn btn-primary dropdown-toggle btn-sm" id="navigatorBtn"> | ||
| 295 | + <img src="~/../content/images/DA/navigator-view.png" style="height:30px; width:50px" /> | ||
| 296 | + </button> | ||
| 297 | + | ||
| 298 | + <div class="dropdown-menu" id="navigatorDiv" style="min-height: initial; min-width: initial; "> | ||
| 299 | + <div id="containment-wrapper" align="center" style="min-width: initial; height: 119px; "> | ||
| 300 | + <img id="navimg" alt="" /> | ||
| 301 | + <div id="draggable" class="draggable ui-widget-content dragdivposition" ng-mouseup="ScrollCanvasDiv()"> | ||
| 302 | + </div> | ||
| 303 | + </div> | ||
| 304 | + | ||
| 305 | + </div> | ||
| 306 | + </div> | ||
| 307 | + </div> | ||
| 308 | + </div> | ||
| 309 | + </div> | ||
| 310 | + <div class=" canavsParent col-sm-12 " id="cp"> | ||
| 311 | + <div class="container-fluid"> | ||
| 312 | + <div class="row"> | ||
| 313 | + <div id="canvasDiv" class="col-sm-12 img-thumbnail" align="center"> | ||
| 314 | + <canvas id="canvasPaint" ng-click="FreeStylePaint($event)" width="2277" height="3248" class="canvas-annotationStyle1"></canvas> | ||
| 315 | + <canvas id="canvas" ng-click="onDrawingCanvasClick($event)" width="2277" height="3248" class="canvas-annotationStyle"></canvas> | ||
| 316 | + </div> | ||
| 317 | + <!--<div id="canvasDiv" style=" width: 95% !important;top:0px;overflow:scroll;background-color:white;">--> | ||
| 318 | + <!--<div id="daLoaderLabel">Loading....</div>--> | ||
| 319 | + | ||
| 320 | + </div> | ||
| 321 | + <div class="clearfix"></div> | ||
| 322 | + </div> | ||
| 323 | + </div> | ||
| 324 | + </div> | ||
| 325 | + <div class="clearfix"></div> | ||
| 326 | + <!--to prevent transparency scale from closing on click anywhere outside set data-backdrop="static" data-keyboard="false" --> | ||
| 327 | + <!--<div class="modal fade bs-example-modal-sm" tabindex="-1" aria-labelledby="mySmallModalLabel" id="transparencyScale" data-backdrop="static" data-keyboard="false"> | ||
| 328 | + <div class="modal-dialog modal-sm"> | ||
| 329 | + <div class="modal-content"> | ||
| 330 | + <div class="modal-header annotation-modal-header"> | ||
| 331 | + <button type="button" class="close" data-dismiss="modal" aria-label="Close" ng-click="CloseTransparencyBox()"><span aria-hidden="true">×</span></button> | ||
| 332 | + <h4 class="modal-title">Transparency</h4> | ||
| 333 | + </div> | ||
| 334 | + <div class="modal-body"> | ||
| 335 | + <div class="row"> | ||
| 336 | + <div class="col-sm-12"> | ||
| 337 | + <div class="padded25"> | ||
| 338 | + <div class="slider"></div> | ||
| 339 | + </div> | ||
| 340 | + </div> | ||
| 341 | + </div> | ||
| 342 | + </div> | ||
| 343 | + </div> | ||
| 344 | + </div> | ||
| 345 | + </div>--> | ||
| 346 | + <!--<div class="ui-widget-content" id="transparencyScale" style="width: 350px; height: 130px;visibility:hidden;display:block;float:left"> | ||
| 347 | + <div class="modal-dialog modal-sm"> | ||
| 348 | + <div class="modal-content"> | ||
| 349 | + <div class="modal-header annotation-modal-header"> | ||
| 350 | + <button type="button" class="close" data-dismiss="modal" aria-label="Close" ng-click="CloseTransparencyBox()"><span aria-hidden="true">×</span></button> | ||
| 351 | + <h4>Transparency</h4> | ||
| 352 | + </div> | ||
| 353 | + <div> | ||
| 354 | + <div class="row"> | ||
| 355 | + <div class="col-sm-12"> | ||
| 356 | + <div class="padded25"> | ||
| 357 | + <div class="slider"></div> | ||
| 358 | + </div> | ||
| 359 | + </div> | ||
| 360 | + </div> | ||
| 361 | + </div> | ||
| 362 | + </div> | ||
| 363 | + </div> | ||
| 364 | + </div>--> | ||
| 365 | + <div class="ui-widget-content" id="transparencyScale" style="width: 350px; height: 150px;visibility:hidden;display:block;float:left"> | ||
| 366 | + <div> | ||
| 367 | + <div> | ||
| 368 | + <div class="modal-header annotation-modal-header"> | ||
| 369 | + <button id="btnTBoxClose" type="button" onclick="onTboxClose()" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button> | ||
| 370 | + <h4>Transparency</h4> | ||
| 371 | + </div> | ||
| 372 | + <div> | ||
| 373 | + <div class="row"> | ||
| 374 | + <div class="col-sm-12"> | ||
| 375 | + <div class="padded25"> | ||
| 376 | + <!--<div class="slider" id="sliderScale"></div>--> | ||
| 377 | + <div class="slider" id="tbSlider"></div> | ||
| 378 | + </div> | ||
| 379 | + </div> | ||
| 380 | + </div> | ||
| 381 | + </div> | ||
| 382 | + </div> | ||
| 383 | + </div> | ||
| 384 | + </div> | ||
| 385 | + <div class="modal fade" id="daMessageModal" role="dialog" style="top:20%;"> | ||
| 386 | + | ||
| 387 | + <div class="modal-dialog modal-sm"> | ||
| 388 | + | ||
| 389 | + | ||
| 390 | + | ||
| 391 | + <div class="modal-content"> | ||
| 392 | + | ||
| 393 | + | ||
| 394 | + <div class="modal-header"> | ||
| 395 | + | ||
| 396 | + <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button> | ||
| 397 | + | ||
| 398 | + </div> | ||
| 399 | + | ||
| 400 | + <div class="modal-title"></div> | ||
| 401 | + | ||
| 402 | + <!--<div class="modal-body">"No body system"</div>--> | ||
| 403 | + | ||
| 404 | + <div class="modal-header"><p data-ng-bind ="message" style="font-size:15px;"></p></div> | ||
| 405 | + | ||
| 406 | + | ||
| 407 | + | ||
| 408 | + <div class="modal-footer"> <button type="button" class="btn btn-primary btn-sm" data-dismiss="modal">OK</button></div> | ||
| 409 | + | ||
| 410 | + | ||
| 411 | + </div> | ||
| 412 | + | ||
| 413 | + | ||
| 414 | + </div> | ||
| 415 | + | ||
| 416 | + </div> | ||
| 417 | + | ||
| 418 | + | ||
| 419 | + <div class="modal fade" id="daMessageModal" role="dialog"> | ||
| 420 | + <div class="modal-dialog"> | ||
| 421 | + | ||
| 422 | + <div class="modal-content"> | ||
| 423 | + <!--<div class="modal-header"> | ||
| 424 | + <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button> | ||
| 425 | + </div> | ||
| 426 | + <div class="modal-title"></div>--> | ||
| 427 | + <!--<div class="modal-body">"No body system"</div>--> | ||
| 428 | + <div class="modal-body" data-ng-bind="message"></div> | ||
| 429 | + | ||
| 430 | + <div class="modal-footer"> <button type="button" class="btn btn-primary" data-dismiss="modal">OK</button></div> | ||
| 431 | + </div> | ||
| 432 | + </div> | ||
| 433 | + </div> | ||
| 434 | +</div> | ||
| 435 | +<!--<script src="../../../libs/jquery/1.11.4/jquery-ui.js"></script>--> | ||
| 436 | +<script src="libs/jquery/jquery_plugin/slider-pips/jquery-ui-slider-pips.js"></script> | ||
| 437 | +<script> | ||
| 438 | + $(document).ready(function () { | ||
| 439 | + $("#navigatorBtn").on('click', function () { | ||
| 440 | + $("#navigatorDiv").toggle(); | ||
| 441 | + }); | ||
| 442 | + }); | ||
| 443 | +</script> | ||
| 444 | +<script> | ||
| 445 | + $(window).load(function () { | ||
| 446 | + $(".stickey-area").sticky(); | ||
| 447 | + | ||
| 448 | + | ||
| 449 | + });</script> | ||
| 450 | +<script> | ||
| 451 | + $(function () { | ||
| 452 | + | ||
| 453 | + var regExp = /[0-9\.\,]/; | ||
| 454 | + $('#txtlayerNumber').on('keydown keyup', function (e) { | ||
| 455 | + var value = String.fromCharCode(e.which) || e.key; | ||
| 456 | + // Only numbers, dots and commas | ||
| 457 | + if (!regExp.test(value) | ||
| 458 | + && e.which != 188 // , | ||
| 459 | + && e.which != 190 // . | ||
| 460 | + && e.which != 8 // backspace | ||
| 461 | + && e.which != 46 // delete | ||
| 462 | + && (e.which < 37 // arrow keys | ||
| 463 | + || e.which > 40) | ||
| 464 | + && (e.keyCode < 96 // Dissectible Anatomy > Num Lock is not working for enter the layer. | ||
| 465 | + || e.keyCode > 105)) | ||
| 466 | + | ||
| 467 | + { | ||
| 468 | + e.preventDefault(); | ||
| 469 | + return false; | ||
| 470 | + } | ||
| 471 | + }); | ||
| 472 | + | ||
| 473 | + }); | ||
| 474 | + | ||
| 475 | +</script> | ||
| 476 | +<!--<script> | ||
| 477 | + $(function () { | ||
| 478 | + $('#layerChangeSlider').slider().on('slideStop', function () { | ||
| 479 | + alert('fjkjksdbgjkgjkfgk') | ||
| 480 | + }) | ||
| 481 | +</script> | ||
| 482 | + });--> | ||
| 483 | + | ||
| 484 | +<script src="libs/jquery/jquery_plugin/slider-pips/jquery-ui-slider-pips.js"></script> | ||
| 485 | +<script> | ||
| 486 | + $(function () { | ||
| 487 | + | ||
| 488 | + | ||
| 489 | + // issue in navigator image in internet explorer | ||
| 490 | + if ($.browser.msie == true) { | ||
| 491 | + $("#navigatorDiv").css({"min-width":"auto", "min-height":"auto"}); | ||
| 492 | + $("#containment-wrapper").css("min-width", "auto"); | ||
| 493 | + } | ||
| 494 | + $("#transparencyScale").draggable(); | ||
| 495 | + $("#draggable").draggable({ containment: "#containment-wrapper", scroll: false }); | ||
| 496 | + }); | ||
| 497 | +</script> | ||
| 498 | +<script> | ||
| 499 | + $(function () { | ||
| 500 | + | ||
| 501 | + $("#dropdownMenu2").mouseover(function () { | ||
| 502 | + $(".custom-tooltip").css("display", "block"); | ||
| 503 | + }); | ||
| 504 | + $("#dropdownMenu2").mouseout(function () { | ||
| 505 | + $(".custom-tooltip").css("display", "none"); | ||
| 506 | + }); | ||
| 507 | + | ||
| 508 | + $("#dropdownMenu4").mouseover(function () { | ||
| 509 | + $(".custom-tooltip1").css("display", "block"); | ||
| 510 | + }); | ||
| 511 | + $("#dropdownMenu4").mouseout(function () { | ||
| 512 | + $(".custom-tooltip1").css("display", "none"); | ||
| 513 | + }); | ||
| 514 | + | ||
| 515 | + $("#dropdownMenu3").mouseover(function () { | ||
| 516 | + $(".custom-tooltip2").css("display", "block"); | ||
| 517 | + }); | ||
| 518 | + $("#dropdownMenu3").mouseout(function () { | ||
| 519 | + $(".custom-tooltip2").css("display", "none"); | ||
| 520 | + }); | ||
| 521 | + | ||
| 522 | + | ||
| 523 | + }); | ||
| 524 | +</script> | ||
| 525 | +<script> | ||
| 526 | + $(".slider") | ||
| 527 | + .slider({ | ||
| 528 | + min: 0, | ||
| 529 | + max: 100, | ||
| 530 | + value: 50, | ||
| 531 | + range: "min", | ||
| 532 | + orientation: "horizontal", | ||
| 533 | + stop: function (event, ui) { | ||
| 534 | + //alert('trans changed') | ||
| 535 | + var scope = angular.element(document.getElementById("daView")).scope(); | ||
| 536 | + scope.$apply(function () { | ||
| 537 | + scope.onTransparencyChange(event, ui); | ||
| 538 | + }); | ||
| 539 | + } | ||
| 540 | + }) | ||
| 541 | + .slider("pips", { | ||
| 542 | + rest: "label", | ||
| 543 | + step: "10" | ||
| 544 | + }); | ||
| 545 | + | ||
| 546 | +</script> | ||
| 547 | +<script> | ||
| 548 | + $(".tooltip-custom").tooltip({ | ||
| 549 | + tooltipClass: 'customTooltip' | ||
| 550 | + }); | ||
| 551 | +</script> | ||
| 552 | +<script> | ||
| 553 | + $(function () { | ||
| 554 | + $(".modal").draggable(); | ||
| 555 | + }); | ||
| 556 | +</script> | ||
| 557 | +<script> | ||
| 558 | + $(function () { | ||
| 559 | + "use strict"; | ||
| 560 | + /*** Sidebar Toggle ***/ | ||
| 561 | + var barPos = 0; | ||
| 562 | + var bar = $('.tools'); | ||
| 563 | + var main = $('.main2'); | ||
| 564 | + $('.toggleBar').click(function () { | ||
| 565 | + | ||
| 566 | + bar.toggleClass('active'); | ||
| 567 | + main.toggleClass('active'); | ||
| 568 | + }); | ||
| 569 | + }); | ||
| 570 | +</script> | ||
| 571 | + |