From d6c9b9d176908a068361b85a87b02eb77abff2d4 Mon Sep 17 00:00:00 2001 From: unknown Date: Wed, 12 Jul 2017 10:16:11 +0530 Subject: [PATCH] Implemented Title and List View Functionality in Atlas Anatomy --- 400-SOURCECODE/AIAHTML5.Web/app/controllers/TileViewListController.js | 135 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++---------------------- 400-SOURCECODE/AIAHTML5.Web/app/views/tile-view.html | 5 +++-- 2 files changed, 116 insertions(+), 24 deletions(-) diff --git a/400-SOURCECODE/AIAHTML5.Web/app/controllers/TileViewListController.js b/400-SOURCECODE/AIAHTML5.Web/app/controllers/TileViewListController.js index 6fb8118..def2c47 100644 --- a/400-SOURCECODE/AIAHTML5.Web/app/controllers/TileViewListController.js +++ b/400-SOURCECODE/AIAHTML5.Web/app/controllers/TileViewListController.js @@ -33,13 +33,57 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo selectedorientation: '', selectedimagetype: '', }; - $scope.loadForModuleById = function (moduleId) { + $scope.showTabButton = true; + $scope.isListViewDataLoaded = true; + $scope.setActiveTab = function (tabToSet) { + + $scope.activeTab = tabToSet; + localStorage.setItem("activeTab", $scope.activeTab); + if ($scope.activeTab == 1) { + $('#grid-view').css("display","block"); + $('#list-view').css("display", "none"); + $("#demoView").remove(); + } + else + { + $('#grid-view').css("display", "none"); + if ($scope.isListViewDataLoaded == true) { + var htm = ''; + htm += ""; + $.ajax({ + url: '~/../content/data/json/aa/aa_dat_contentlist.json', + dataType: "json", + success: function (result) { + $(result.root.Item).each(function (key, value) { + console.log(key + " " + value); + htm += "" + htm += ''; + htm += "" + }); + htm += "
Title Region SystemView Type
' + value._Title + '' + value._BodyRegion + '' + value._BodySystem + '' + value._ViewOrientation + '' + value._ImageType + '
"; + $("#list-view").append(htm); + $compile(htm)($scope); + } + }); + $('#list-view').css("display", "block"); + $scope.isListViewDataLoaded = false; + } + else + { + $('#list-view').css("display", "block"); + } + } + + }; + + $scope.loadForModuleById = function (moduleId) { + $scope.moduleId = moduleId; - + $scope.activeTab = 1; console.log('loadForModuleById is called') $rootScope.moduleName = Modules[moduleId].Name; - + $rootScope.currentActiveModuleTitle = $rootScope.moduleName; $scope.AllBodyRegion = BodyRegions; $scope.AllBodySystem = BodySystems; $scope.AllOrientation = ViewOrientations; @@ -57,17 +101,34 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo console.log(' error: ' + error.statusText); } ) + } + //$scope.$on('$viewContentLoaded', function (event) { + // $scope.loadForModuleById(); - - } - + //}); + $scope.isOpenBtnClicked = false; $scope.openModuleItemView = function (event) { - + //0. Get selected Image Id - var moduleItemDataToBeSaved = event.target.id; - + if ($scope.isListViewButtonClicked == true) { + if ($scope.isOpenBtnClicked == true) { + // alert($("#demoText").html()); + var moduleItemDataToBeSaved = $("#demoText").html(); + $scope.isOpenBtnClicked = false; + } + else { + var moduleItemDataToBeSavedID = event.currentTarget.id; + var moduleItemDataToBeSaved = $("#list-view table tbody #" + moduleItemDataToBeSavedID).find('td:eq(0)').text(); + } + } + else + { + var moduleItemDataToBeSaved = event.target.id; + $scope.isListViewButtonClicked = false; + } + //1.Filter selected module ietem data and get the pushed opened moduile array object $rootScope.OpenedTileData = ModuleService.GetOpenedTileData(moduleItemDataToBeSaved, $scope.moduleLandingData); @@ -86,6 +147,17 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo $location.url('/module-item-view'); } + + $scope.openListViewModuleItem = function (event) { + $("#demoView").remove(); + var moduleItemDataToBeSavedID = event.currentTarget.id; + var moduleItemDataToBeSaved = $("#list-view table tbody #" + moduleItemDataToBeSavedID).find('td:eq(0)').text(); + $rootScope.OpenedTileData = ModuleService.GetOpenedTileData(moduleItemDataToBeSaved, $scope.moduleLandingData); + $rootScope.OpenItemImagePath = "../../../content/images/aa/images/" + $rootScope.OpenedTileData[3]; + $("#viewList").append("
" + moduleItemDataToBeSaved + "
Open
"); + } + + $scope.openModuleItem = function () { var jsContentURL; var moduleItemViewDivId; @@ -158,8 +230,6 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo $scope.relativeDimesion = 0; $("#modItemImage").css("width", $rootScope.ViewImageWidth + "px"); - - //0.5 create canvas on the top of image so that I can draw a line over the canvas. var canvas = document.createElement('canvas'); canvas.id = 'aaDetailViewCanvas'; @@ -169,14 +239,8 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo canvas.style.left = '0px'; canvas.style.top = '0px'; canvas.style.position = "absolute"; - //canvas.addEventListener('click', function () { - // alert('canvas clicked'); - // var clickedPint = $scope.getMousePos(event); - // alert('x: ' + clickedPint.x + ', y:' + clickedPint.y); - //}) $("#canvasDiv").append(canvas); $scope.context = canvas.getContext("2d") - //6. Show all pins on AA opened item $scope.showAllPins(); //7. Highlight all system body list in left side @@ -380,12 +444,13 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo $scope.imagePath = "../content/images/aa/thumbnails/" + value._TileImageName; - var $el = $('
' - + '
' - + '' - + '

' + value._Title + '

').appendTo('#grid-view'); - + + var $el = $('
' + + '
' + + '' + + '

' + value._Title + '

').appendTo('#grid-view'); + $compile($el)($scope); $(".sidebar").mCustomScrollbar({ @@ -1463,6 +1528,32 @@ function showSelectedPins(event) { }); } + +function openModuleItemView(event) { + var scope = angular.element(document.getElementById("list-view")).scope(); + scope.isListViewButtonClicked = true; + scope.$apply(function () { + scope.openModuleItemView(event); + }); +} + +function openListViewModuleItem(event) { + var scope = angular.element(document.getElementById("list-view")).scope(); + scope.isListViewButtonClicked = true; + scope.$apply(function () { + scope.openListViewModuleItem(event); + }); +} + +function openCurrentView(event) { + var scope = angular.element(document.getElementById("list-view")).scope(); + scope.isOpenBtnClicked = true; + scope.$apply(function () { + scope.openModuleItemView(event); + }); + +} + function onZoom(scope) { //$(".common-drag").remove(); diff --git a/400-SOURCECODE/AIAHTML5.Web/app/views/tile-view.html b/400-SOURCECODE/AIAHTML5.Web/app/views/tile-view.html index 8f56970..cb230d1 100644 --- a/400-SOURCECODE/AIAHTML5.Web/app/views/tile-view.html +++ b/400-SOURCECODE/AIAHTML5.Web/app/views/tile-view.html @@ -82,7 +82,7 @@ --> -
+
@@ -96,7 +96,8 @@
-
+
+