lifecyclemgr/src/main/webapp/lifecyclemgr/js/app.js

   1 var app = angular.module("lcApp", ["ui.router", "ngTable"])/*, 'ui.bootstrap', 'ui.bootstrap.modal'*/\r
   2 \r
   3     /*.run(function($rootScope, $location, $state, LoginService) {\r
   4         $rootScope.$on("$stateChangeStart", function(event, toState, toParams, fromState, fromParams){\r
   5             if (toState.authenticate && !LoginService.isAuthenticated()){\r
   6                 // User isn’t authenticated\r
   7                 $state.transitionTo("login");\r
   8                 event.preventDefault();\r
   9             }\r
  10         });\r
  11     })*/\r
  12 \r
  13     /*.provider('modalState', function($stateProvider) {\r
  14         var provider = this;\r
  15         this.$get = function() {\r
  16             return provider;\r
  17         }\r
  18         this.state = function(stateName, options) {\r
  19             var modalInstance;\r
  20             $stateProvider.state(stateName, {\r
  21                 url: options.url,\r
  22                 onEnter: function($modal, $state) {\r
  23                     modalInstance = $modal.open(options);\r
  24                     modalInstance.result['finally'](function() {\r
  25                         modalInstance = null;\r
  26                         if ($state.$current.name === stateName) {\r
  27                             $state.go('^');\r
  28                         }\r
  29                     });\r
  30                 },\r
  31                 onExit: function() {\r
  32                     if (modalInstance) {\r
  33                         modalInstance.close();\r
  34                     }\r
  35                 }\r
  36             });\r
  37         };\r
  38     })*/\r
  39 \r
  40 \r
  41     .config(function($stateProvider, $urlRouterProvider, $urlMatcherFactoryProvider){/*modalStateProvider*/\r
  42         //$routeProvider.caseInsensitiveMatch = true;\r
  43         $urlMatcherFactoryProvider.caseInsensitive(true);\r
  44         $urlRouterProvider.otherwise('/home');\r
  45         //$locationProvider.html5Mode(true).hashPrefix('!');\r
  46         $stateProvider\r
  47             .state("home", {\r
  48 \r
  49                 url: "/home",\r
  50 \r
  51                 templateUrl : "templates/home.html",\r
  52                 controller : "homeCtrl"\r
  53 \r
  54             })\r
  55             .state("home.lcTabs", {\r
  56                 url: "/lcTabs/:id",\r
  57                 templateUrl : "templates/lctabs.html",\r
  58                 controller : "lcTabsCtrl"\r
  59             })\r
  60             .state("home.lcTabs.detailInfo", {\r
  61                 url : "/detailInfo",\r
  62                 templateUrl : "templates/detailInfo.html",\r
  63                 controller : "detailInfoCtrl"\r
  64             })\r
  65             /*.state("home.lcTabs.detailInfo1", {\r
  66                 url : "/detailInfo",\r
  67                 templateUrl : "templates/detailInfo.html",\r
  68                 controller : "detailInfoCtrl"\r
  69             })*/\r
  70             .state("home.lcTabs.topo", {\r
  71                 url : "/topo",\r
  72                 templateUrl : "templates/topo.html"\r
  73             })\r
  74             .state("home.lcTabs.inputData", {\r
  75                 url : "/inputData",\r
  76                 templateUrl : "templates/inputData.html",\r
  77                 controller : "inputDataCtrl"\r
  78             })\r
  79             .state("home.lcTabs.detailInfo.overlayVPN", {\r
  80                 url: "/overlayVPN",\r
  81                 templateUrl : "templates/overlayVPN.html",\r
  82                 controller : "overlayVPNCtrl"\r
  83             })\r
  84             .state("home.lcTabs.detailInfo.underlayVPN", {\r
  85                 url: "/underlayVPN",\r
  86                 templateUrl : "templates/underlayVPN.html",\r
  87                 controller : "underlayVPNCtrl"\r
  88             })\r
  89         /*modalStateProvider.state("home.lcTabs1", {\r
  90             url: '/lcTabs',\r
  91             templateUrl: 'templates/lctabs.html'\r
  92         });*/\r
  93 \r
  94     })\r
  95 \r
  96     .controller('homeCtrl', function($scope, $compile, $state, $log, DataService, NgTableParams) {\r
  97         $scope.param="lctableData";\r
  98 \r
  99         $scope.init = function() {\r
 100             DataService.loadGetServiceData()\r
 101                 .then(function (data) {\r
 102                     if (data) {\r
 103                         $scope.tableData = data.lcData;\r
 104                         var tableData = data.lcData;\r
 105                         loadTableData();\r
 106                     }\r
 107                     else {\r
 108                         $scope.error = "Error!";\r
 109                     }\r
 110                 }, function (reason) {\r
 111                     $scope.error = "Error ! " + reason;\r
 112                 });\r
 113         };\r
 114 \r
 115         //loadTableData();\r
 116         $scope.callLcTab = function(id) {\r
 117             /*console.log("Call ME as hi" + id);\r
 118             $scope.param="lcTabData";\r
 119             DataService.getAllData($scope.param)\r
 120                 .then(function (data) {\r
 121                     if (data) {\r
 122                         $scope.lctabsData = data;\r
 123                         console.log("bye"+data.id);\r
 124                         loadTabData();\r
 125                     }\r
 126                     else {\r
 127                         $scope.error = "Incorrect username/password !";\r
 128                     }\r
 129                 }, function (reason) {\r
 130                     $scope.error = "Incorrect username/password !";\r
 131                 });\r
 132 \r
 133             $scope.row_id = id;*/\r
 134         }\r
 135         $scope.callModal = function(id) {\r
 136             console.log("Call ME as " + id);\r
 137             // $scope.row_id = id;\r
 138             //$state.go('home.lcTabs', {'id': id});\r
 139             //$("#popupModal").modal();\r
 140             /*$state.go('home.lcTabs.detailInfo', {'id': id});*/\r
 141         }\r
 142 \r
 143         function loadTabData() {\r
 144             console.log("hi tab");\r
 145             var tab_tpl = $(modelTemplate).filter('#tabs').html();\r
 146             var html = Mustache.to_html(tab_tpl, $scope.lctabsData.tabData);\r
 147             $('#lctabArea').html(html);\r
 148         }\r
 149 \r
 150         function loadTableData() {\r
 151             console.log("In loadData()");\r
 152 \r
 153             var def_button_tpl = $(modelTemplate).filter('#defaultButtons').html();\r
 154             var def_iconbutton_tpl = $(modelTemplate).filter('#defaultIconButtons').html();\r
 155             /*var add_data = {"title":"Add", "clickAction":"showAddModal()"};*/\r
 156             var add_data = {"title":"Create", "type":"btn btn-default", "gType": "glyphicon-plus", "iconPosition":"left", "clickAction":"showAddModal()"};\r
 157             var delete_data = {"title":"Delete Selected", "clickAction":"deleteData()"};\r
 158             var addhtml = Mustache.to_html(def_iconbutton_tpl, add_data);\r
 159             var deletehtml = Mustache.to_html(def_button_tpl, delete_data);\r
 160             $('#lcTableAction').html($compile(addhtml)($scope));\r
 161             $('#lcTableAction').append($compile(deletehtml)($scope));\r
 162 \r
 163             $scope.checkboxes = { 'checked': false, items: {} };\r
 164 \r
 165             $scope.tableParams = new NgTableParams({count: 5, sorting: {name: 'asc'}    //{page: 1,count: 10,filter: {name: 'M'},sorting: {name: 'desc'}\r
 166             }, { counts:[5, 10, 15], dataset: $scope.tableData});\r
 167 \r
 168             $scope.$watch('checkboxes.checked', function(value) {\r
 169                 angular.forEach($scope.tableData, function(item) {\r
 170                     if (angular.isDefined(item.id)) {\r
 171                         $scope.checkboxes.items[item.id] = value;\r
 172                     }\r
 173                 });\r
 174             });\r
 175 \r
 176             $scope.tableParams_tpDetails = new NgTableParams({count: 5, sorting: {tp_name: 'asc'}    //{page: 1,count: 10,filter: {name: 'M'},sorting: {name: 'desc'}\r
 177             }, { counts:[5, 10, 15], dataset: $scope.tableData});\r
 178 \r
 179 \r
 180             $scope.selectedRow = null;  // initialize our variable to null\r
 181             $scope.setClickedRow = function(index, id){  //function that sets the value of selectedRow to current index\r
 182                 $scope.selectedRow = index;\r
 183                 console.log("Selected Row : " +id+" is "+ $scope.selectedRow);\r
 184                 //$state.go('home.lcTabs', {'id': id});\r
 185                 $state.go('home.lcTabs.detailInfo', {'id': id});\r
 186             }\r
 187 \r
 188 \r
 189 \r
 190             var text = $(modelTemplate).filter('#textfield').html();\r
 191             var number = $(modelTemplate).filter('#numeric').html();\r
 192             var dropDown = $(modelTemplate).filter('#simpleDropdownTmpl').html();\r
 193 \r
 194             var dataText = {"ErrMsg" :     {"textboxErr" : "Service name is required.", "modalVar":"lifecycleData.name", "placeholder":"Service Name"}};\r
 195             $('#myModal .serviceName').html($compile(Mustache.to_html(text, dataText.ErrMsg))($scope));\r
 196 \r
 197             var TempNameText = {"ErrMsg" :     {"textboxErr" : "Template name is required.", "modalVar":"lifecycleData.template", "placeholder":"Template Name"}};\r
 198             $('#myModal .templateName').html($compile(Mustache.to_html(text, TempNameText.ErrMsg))($scope));\r
 199 \r
 200             //var creatorText = {"ErrMsg" :     {"textboxErr" : "Creator is required.", "modalVar":"lifecycleData.creator", "placeholder":"Creator"}};\r
 201             /*$scope.data = {\r
 202                 "dropSimple_data": {\r
 203                     "title": "--Select--",\r
 204                     "items": [\r
 205                         {"itemLabel": "1.1"}, {"itemLabel": "1.2"}\r
 206                     ]\r
 207                 }\r
 208             }\r
 209             $('#myModal #plainDropDown').html($compile(Mustache.to_html(dropDown, $scope.data.dropSimple_data))($scope));*/\r
 210 \r
 211             DataService.generateTemplatesComponent()\r
 212                 .then(function (tmplatesResponse) {\r
 213                     console.log("Data Template :: ");\r
 214                     $log.info(tmplatesResponse);\r
 215                    // var templatesInfo = translateToTemplatesInfo(tmplatesResponse);\r
 216                   //  document.getElementById("svcTempl").innerHTML = templatesInfo;\r
 217                     $scope.optionsValue = tmplatesResponse;\r
 218                     //$scope.someOptions = [{serviceTemplateId:"1",templateName:"1.1"}, {serviceTemplateId:"2",templateName:"1.2"}];\r
 219                     // $scope.someOptions = [{"serviceTemplateId": '1', "templateName": "1.1"},{"serviceTemplateId": '2', "templateName": "1.2"}]\r
 220                     // console.log(":: " + JSON.stringify($scope.optionsValue));\r
 221                 }, function (reason) {\r
 222                     $scope.error = "Error ! " + reason;\r
 223                 });\r
 224 \r
 225 \r
 226 \r
 227             //$('#myModal .creator').html($compile(Mustache.to_html(text, creatorText.ErrMsg))($scope));\r
 228 \r
 229             var modelSubmit_data = {"title":"Submit", "clickAction":"saveData(lifecycleData.id)"};\r
 230             var modelSubmit_html = Mustache.to_html(def_button_tpl, modelSubmit_data);\r
 231             $('#myModal #footerBtns').html($compile(modelSubmit_html)($scope));\r
 232 \r
 233             var modelDelete_data = {"title":"Close", "clickAction":"closeModal()"};\r
 234             var modelDelete_html = Mustache.to_html(def_button_tpl, modelDelete_data);\r
 235             $('#myModal #footerBtns').append($compile(modelDelete_html)($scope));\r
 236         }\r
 237 \r
 238 \r
 239         /**\r
 240          * generate templates html string\r
 241          * @param templates\r
 242          * @returns\r
 243          */\r
 244         function translateToTemplatesInfo(templates) {\r
 245             var options = '<option value="select">--select--</option>';\r
 246             var i;\r
 247             for (i = 0; i < templates.length; i += 1) {\r
 248                 var option = '<option value="' + templates[i].serviceTemplateId + '">' + templates[i].templateName\r
 249                     + '</option>';\r
 250                 options = options + option;\r
 251             }\r
 252 \r
 253             return options;\r
 254         }\r
 255 \r
 256         $scope.validatetextbox = function (value){\r
 257             if($scope.lifecycleData.service_name) {\r
 258                 $scope.textboxErr = false;\r
 259             }\r
 260             else\r
 261                 $scope.textboxErr = true;\r
 262         }\r
 263 \r
 264 \r
 265         $scope.checkAll = function() {\r
 266             console.log("Checked ..");\r
 267             angular.forEach($scope.tableData, function(data) {\r
 268                 //data.select = $scope.selectAll;\r
 269                 $scope.checkboxes.items[data.id]\r
 270             });\r
 271         };\r
 272         $scope.test = function(id) {\r
 273             $state.go('home.lcTabs.detailInfo', {'id': id});\r
 274 \r
 275         }\r
 276 \r
 277         $scope.templateParam = function() {\r
 278             //$scope.lifecycleData.optSelect = 1.2;\r
 279             //$log.info($scope.lifecycleData);\r
 280 \r
 281             DataService.fetchCreateParameters($scope.lifecycleData.optSelect)\r
 282                 .then(function (tmplatesParamResponse) {\r
 283                     console.log("Data Param Template :: ");\r
 284                     $log.info(tmplatesParamResponse);\r
 285                     $scope.paramJsonObj= tmplatesParamResponse.templateName;\r
 286 \r
 287                 }, function (reason) {\r
 288                     $scope.error = "Error ! " + reason;\r
 289                 });\r
 290 \r
 291         }\r
 292 \r
 293 \r
 294 \r
 295 \r
 296         $scope.showAddModal = function() {\r
 297             console.log("Showing Modal to Add data");\r
 298             $scope.lifecycleData = {};\r
 299             $scope.textboxErr = false;\r
 300 \r
 301             //$("#myModal").modal();\r
 302             $("#myModal").modal({}).draggable();\r
 303         }\r
 304         $scope.closeModal = function() {\r
 305             console.log("Closing Modal...");\r
 306             $('#myModal').modal('hide');\r
 307         }\r
 308 \r
 309         $scope.editData = function(id) {\r
 310             $scope.textboxErr = false;\r
 311             $scope.ipv4Err = false;\r
 312             $scope.numericErr = false;\r
 313             console.log("To be edited : " + id);\r
 314             var dataFound = false;\r
 315             angular.forEach($scope.tableData, function(data) {\r
 316                 if(!dataFound) {\r
 317                     if (data.id == id) {\r
 318                         console.log("Found : " + data.id);\r
 319                         $scope.lifecycleData = data;\r
 320                         /*$scope.province.province_name = data.province_name;\r
 321                          $scope.province.ip = data.ip;\r
 322                          $scope.province.port = data.port;*/\r
 323 \r
 324                         $("#myModal").modal();\r
 325                         dataFound = true;\r
 326                     }\r
 327                 }\r
 328             });\r
 329         }\r
 330 \r
 331         $scope.saveData = function() {\r
 332             //TODO\r
 333             var sengMsgObj = {};//collectCreateParamfromUI('', 'create', $scope.templateParameters.paramJsonObj);\r
 334             //createServiceInstance(sengMsgObj)\r
 335             DataService.createServiceInstance(lifecycleData, sengMsgObj)\r
 336                 .then(function (response) {\r
 337                     $log.info(response);\r
 338                     //TODO\r
 339                 }, function (reason) {\r
 340                     $scope.error = "Error ! " + reason;\r
 341                 });\r
 342         }\r
 343 \r
 344         /**\r
 345          * convert the template params obj to html UI string\r
 346          *\r
 347          * @param identify the object identify, it should be different every time\r
 348          * @return the html component string\r
 349          */\r
 350         function collectCreateParamfromUI(parentHost,identify, createParam) {\r
 351             // the create params used for create msg\r
 352             var paramSentObj = {\r
 353                 domainHost:'',\r
 354                 nodeTemplateName:'',\r
 355                 nodeType:'',\r
 356                 segments:[],\r
 357                 additionalParamForNs:{}\r
 358             };\r
 359             // get the domain value\r
 360             if (undefined !=  createParam.domainHost && 'enum' === createParam.domainHost.type) {\r
 361                 var domain = collectParamValue(identify, createParam.domainHost);\r
 362                 paramSentObj.domainHost = collectParamValue(identify, createParam.domainHost)\r
 363             }\r
 364             //if parent domainHost is not '' and local domain host is'', it should be setted as parent\r
 365             if('' != parentHost && '' == paramSentObj.domainHost){\r
 366                 paramSentObj.domainHost = parentHost;\r
 367             }\r
 368             paramSentObj.nodeTemplateName = createParam.nodeTemplateName;\r
 369             paramSentObj.nodeType = createParam.nodeType;\r
 370 \r
 371             // get own param value from UI\r
 372             createParam.additionalParamForNs.forEach(function(param) {\r
 373                 paramSentObj.additionalParamForNs[param.name] = collectParamValue(identify, param);\r
 374             });\r
 375             // get segments param value from UI\r
 376             createParam.segments.forEach(function(segment) {\r
 377                 // the identify for segment\r
 378                 var segmentIdentify = '' == identify ? segment.nodeTemplateName\r
 379                     : identify + '_' + segment.nodeTemplateName;\r
 380                 var segmentObj = collectCreateParamfromUI(paramSentObj.domainHost, segmentIdentify, segment);\r
 381                 paramSentObj.segments.push(segmentObj);\r
 382             });\r
 383             return paramSentObj;\r
 384         }\r
 385 \r
 386 \r
 387     })\r
 388 \r
 389     .controller('lcTabsCtrl', function($scope, $state, $stateParams) {\r
 390         //console.log("$stateParams.id:: " + $stateParams.id);\r
 391         //$state.transitionTo("home.lcTabs({id: "+$stateParams.id+"})");\r
 392 \r
 393 \r
 394         $state.go('home.lcTabs.detailInfo', {'id': $stateParams.id});\r
 395 \r
 396     })\r
 397 \r
 398     .controller('detailInfoCtrl', function($scope, $stateParams, $compile, DataService) {\r
 399         console.log("detailInfoCtrl --> $stateParams.id:: " + $stateParams.id);\r
 400         //$scope.currentId = $stateParams.id;\r
 401         $scope.rightPanelHeader = "SDNO-VPN Manager";\r
 402 \r
 403         var jsonData = DataService.loadServiceDetails($stateParams.id);\r
 404         $(".accordion").html("");\r
 405         for (var i = 0; i < jsonData.length; i++) {\r
 406             //console.log("jsonData Name: " + jsonData[i].name);\r
 407             if (jsonData[i].name == "sdno") {\r
 408                 //$("#sdnoLink").text(jsonData[i].name.toUpperCase());\r
 409                 //console.log("Adding Accordian to SDNO");\r
 410                 $(".accordion").append($compile(addAccordionData("sdno", jsonData[i].name.toUpperCase(), $stateParams.id))($scope));\r
 411             }\r
 412             else if (jsonData[i].name == "gso") {\r
 413                 //console.log("Adding Accordian to GSO");\r
 414                 $(".accordion").append($compile(addAccordionData("gso", jsonData[i].name.toUpperCase(), $stateParams.id))($scope));\r
 415             }\r
 416             else if (jsonData[i].name == "nfvo") {\r
 417                 //console.log("Adding Accordian to NFVO");\r
 418                 $(".accordion").append($compile(addAccordionData("nfvo", jsonData[i].name.toUpperCase(), $stateParams.id))($scope));\r
 419             }\r
 420             else {\r
 421 \r
 422             }\r
 423         }\r
 424 \r
 425         function addAccordionData(type, text, id) {\r
 426             console.log("id:"+id);\r
 427             var content = '';\r
 428             content += '<div class="panel panel-default"><div class="panel-heading">';\r
 429             content += '<h6 class="panel-title">';\r
 430             content += '<a style="text-decoration:none;" data-toggle="collapse" data-parent="#accordion" data-target="#collapseOne_'+type+'" onClick="fnLoadTblData(this, \''+type+'\');">';\r
 431             content += '<span id="sdnoLink">'+text+'</span></a>';\r
 432             content += '</h6></div>';\r
 433             if(type == "sdno") {\r
 434                 content += '<div id="collapseOne_' + type + '" class="panel-collapse collapse in">';\r
 435             } else {\r
 436                 content += '<div id="collapseOne_' + type + '" class="panel-collapse collapse">';\r
 437             }\r
 438             content += '<ul class="list-group nomargin">';\r
 439 \r
 440             if(type == "sdno") {\r
 441                 content += '<li id="overLink" class="list-group-item selected textAlign"><span class="glyphicon glyphicon-pencil text-primary pencilimg"></span><a ui-sref=".overlayVPN" ui-sref-active="link_active_DetailInfo" href="#/home/lcTabs/'+id+'/detailInfo/overlayVPN">Overlay VPN</a>';\r
 442                 content += '</li>';\r
 443                 content += '<li id="underLink" class="list-group-item textAlign"><span class="glyphicon glyphicon-pencil text-primary pencilimg"></span><a ui-sref=".underlayVPN" ui-sref-active="link_active_DetailInfo" href="#/home/lcTabs/'+id+'/detailInfo/underlayVPN">Underlay VPN</a>';\r
 444                 content += '</li>';\r
 445             }\r
 446             else if(type == "gso"){\r
 447                 content += '<li id="linkgso" class="list-group-item textAlign"><!--<span class="glyphicon glyphicon-pencil text-primary"></span>--><span class="glyphicon glyphicon-pencil text-primary pencilimg"></span><span>OPEN-O</span></li>';\r
 448             }\r
 449             else if(type == "nfvo"){\r
 450                 content += '<li id="linknfvo" class="list-group-item textAlign"><span class="glyphicon glyphicon-pencil text-primary pencilimg"></span><span>ZTE</span></li>';\r
 451             }\r
 452             content += '</ul></div></div>';\r
 453             return content;\r
 454         }\r
 455     })\r
 456 \r
 457     /*-------------------------------------------------------------------------------OverlayVPN---------------------------------------------------------------------*/\r
 458 \r
 459     .controller("overlayVPNCtrl", function($scope, $rootScope, $compile, DataService, NgTableParams){\r
 460         $scope.message = "Overlay VPN";\r
 461 \r
 462         $scope.init = function() {\r
 463             //console.log("Overlay VPN... ng-init + " +  $rootScope.modelTemplate);\r
 464             DataService.getOverlayData()\r
 465                 .then(function(data){\r
 466                     $scope.overlayData = data.overlayData;\r
 467                     console.log("Data: ");\r
 468                     loadButtons();\r
 469                 }, function(reason){\r
 470                     $scope.message = "Error is :" + JSON.stringify(reason);\r
 471                 });\r
 472         }\r
 473         function loadButtons() {\r
 474             //console.log("Got it : " + $scope.$parent.getTemplate("defaultButtons"));\r
 475             var def_button_tpl = $(modelTemplate).filter('#defaultButtons').html();\r
 476             console.log("template: " + def_button_tpl);\r
 477 \r
 478             var delete_data = {"title":"Delete Selected", "clickAction":"deleteData()"};\r
 479             var deletehtml = Mustache.to_html(def_button_tpl, delete_data);\r
 480             $('div.overlayAction').html($compile(deletehtml)($scope));\r
 481 \r
 482             $scope.tableParams = new NgTableParams({count: 5, sorting: {id: 'asc'}    //{page: 1,count: 10,filter: {name: 'M'},sorting: {name: 'desc'}\r
 483             }, { counts:[], dataset: $scope.overlayData});\r
 484 \r
 485             $scope.checkboxes = { 'checked': false, items: {} };\r
 486 \r
 487             $scope.$watch('checkboxes.checked', function(value) {\r
 488                 angular.forEach($scope.overlayData, function(item) {\r
 489                     if (angular.isDefined(item.id)) {\r
 490                         $scope.checkboxes.items[item.id] = value;\r
 491                     }\r
 492                 });\r
 493             });\r
 494         }\r
 495         $scope.checkAll = function() {\r
 496             console.log("Checked ..");\r
 497             angular.forEach($scope.overlayData, function(data) {\r
 498                 $scope.checkboxes.items[user.id]\r
 499             });\r
 500         };\r
 501     })\r
 502 \r
 503     /*-------------------------------------------------------------------------------UnderlayVPN---------------------------------------------------------------------*/\r
 504 \r
 505     .controller("underlayVPNCtrl", function($scope, $rootScope, $compile, DataService, NgTableParams){\r
 506         $scope.message = "Underlay VPN";\r
 507 \r
 508         $scope.init = function() {\r
 509             //console.log("Underlay VPN... ng-init + " +  $rootScope.modelTemplate);\r
 510             DataService.getUnderlayData()\r
 511                 .then(function(data){\r
 512                     $scope.underlayVPN = data.underlayVPN;\r
 513                     console.log("Data: ");\r
 514                     loadButtons();\r
 515                 }, function(reason){\r
 516                     $scope.message = "Error is :" + JSON.stringify(reason);\r
 517                 });\r
 518         }\r
 519         function loadButtons() {\r
 520             var def_button_tpl = $(modelTemplate).filter('#defaultButtons').html();\r
 521             //console.log("template: " + def_button_tpl);\r
 522 \r
 523             var delete_data = {"title":"Delete Selected", "clickAction":"deleteData()"};\r
 524             var deletehtml = Mustache.to_html(def_button_tpl, delete_data);\r
 525             $('div.underlayAction').html($compile(deletehtml)($scope));\r
 526 \r
 527             $scope.tableParams = new NgTableParams({count: 5, sorting: {id: 'asc'}    //{page: 1,count: 10,filter: {name: 'M'},sorting: {name: 'desc'}\r
 528             }, { counts:[5, 10], dataset: $scope.underlayVPN.underlayData});\r
 529 \r
 530             $scope.checkboxes = { 'checked': false, items: {} };\r
 531 \r
 532             $scope.$watch('checkboxes.checked', function(value) {\r
 533                 angular.forEach($scope.underlayVPN.underlayData, function(item) {\r
 534                     if (angular.isDefined(item.id)) {\r
 535                         $scope.checkboxes.items[item.id] = value;\r
 536                     }\r
 537                 });\r
 538             });\r
 539 \r
 540             $scope.tableParams_tpDetails = new NgTableParams({count: 5, sorting: {id: 'asc'}    //{page: 1,count: 10,filter: {name: 'M'},sorting: {name: 'desc'}\r
 541             }, { counts:[5, 10], dataset: $scope.underlayVPN.tp_details});\r
 542         }\r
 543         $scope.checkAll = function() {\r
 544             console.log("Checked ..");\r
 545             angular.forEach($scope.underlayVPN.underlayData, function(data) {\r
 546                 $scope.checkboxes.items[data.id]\r
 547             });\r
 548         };\r
 549     })\r
 550 \r
 551     .controller('inputDataCtrl', function($scope, $stateParams, $log, DataService) {\r
 552         console.log("inputDataCtrl --> $stateParams.id:: " + $stateParams.id);\r
 553         $scope.inputData = DataService.getSavedLCData($stateParams.id);\r
 554         $log.info($scope.inputData);\r
 555         /*for(var i = 0; i < $scope.inputData.length; i++) {\r
 556             //var def_button_tpl = $(modelTemplate).filter('#defaultButtons').html();\r
 557             $("#inputDataElements").appendChild("<span>Shahid</span>");\r
 558 \r
 559         }*/\r
 560 \r
 561         $("div.inputDataElements").html("");\r
 562         for (var prop in $scope.inputData) {\r
 563             //console.log('obj.' + prop, '=', $scope.inputData[prop]);\r
 564             //$("#inputDataElements").append("<div><span>"+prop+": </span><span>"+$scope.inputData[prop]+"</span></div>");\r
 565             $("div.inputDataElements").append('<div class="mT15 form-group row" style="margin-top:35px;"><div class="col-md-2 col-xs-2 col-lg-2 col-sm-2" align="left"><label class="control-label"><span style="font-size:16px;">'+ prop + ':</span></label></div><div class="col-md-3 col-xs-3 col-lg-3 col-sm-3"><input  type="text" name="" maxlength="256" data-toggle="tooltip" data-placement="top" title="'+ $scope.inputData[prop] + '" value="'+ $scope.inputData[prop] + '" readonly disabled/></div></div>');\r
 566         }\r
 567     })\r
 568 \r
 569 \r
 570 var modelTemplate;\r
 571 function loadTemplate() {\r
 572     $.get('template.html', function(template) {\r
 573         modelTemplate = template;\r
 574     });\r
 575 }\r
 576 \r