ADAM / AIAHTML5

Browse Code »

Commit a2aeb1dca2f2bd34a1f7df7e6b07053dd320baa4

Authored by Amrita Vishnoi 2018-01-23 17:39:44 +0530

1 parent 6fe695b8

taken these files from develop

Inline Side-by-side

Showing 2 changed files with 2613 additions and 2615 deletions

400-SOURCECODE/AIAHTML5.Web/app/controllers/TileViewListController.js

View file @a2aeb1d

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

View file @a2aeb1d

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	+
...	...