catalog-ui/src/app/directives/ecomp-header/ecomp-header.ts

   1 /*-
   2  * ============LICENSE_START=======================================================
   3  * SDC
   4  * ================================================================================
   5  * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved.
   6  * ================================================================================
   7  * Licensed under the Apache License, Version 2.0 (the "License");
   8  * you may not use this file except in compliance with the License.
   9  * You may obtain a copy of the License at
  10  *
  11  *      http://www.apache.org/licenses/LICENSE-2.0
  12  *
  13  * Unless required by applicable law or agreed to in writing, software
  14  * distributed under the License is distributed on an "AS IS" BASIS,
  15  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  16  * See the License for the specific language governing permissions and
  17  * limitations under the License.
  18  * ============LICENSE_END=========================================================
  19  */
  20
  21 'use strict';
  22 import * as _ from "lodash";
  23 import {IAppConfigurtaion, User, IUser} from "app/models";
  24 import {IUserProperties} from "../../models/user";
  25 import {UserService} from "../../ng2/services/user.service";
  26
  27 export class MenuItem {
  28     menuId:number;
  29     column:number;
  30     text:string;
  31     parentMenuId:number;
  32     url:string;
  33     children:Array<MenuItem>
  34 }
  35
  36 export interface IEcompHeaderDirectiveScope extends ng.IScope {
  37     menuData:Array<MenuItem>;
  38     version:string;
  39     clickableLogo:string;
  40     contactUsUrl:string;
  41     getAccessUrl:string;
  42     megaMenuDataObjectTemp:Array<any>;
  43     megaMenuDataObject:Array<any>;
  44
  45     selectedTopMenu:MenuItem;
  46     selectedSubMenu:MenuItem;
  47
  48     firstMenuLevelClick:Function;
  49     subMenuEnterAction:Function;
  50     subMenuLeaveAction:Function;
  51
  52     memuItemClick:Function;
  53     user:IUser;
  54 }
  55
  56 export class EcompHeaderDirective implements ng.IDirective {
  57
  58     constructor(private $http:ng.IHttpService,
  59                 private sdcConfig:IAppConfigurtaion,
  60                 private userService:UserService) {
  61
  62     }
  63
  64     scope = {
  65         menuData: '=',
  66         version: '@',
  67         clickableLogo: '@?'
  68     };
  69
  70     public replace = true;
  71     public restrict = 'E';
  72     public controller = EcompHeaderController;
  73
  74     template = ():string => {
  75         return 'src/app/directives/ecomp-header/ecomp-header.html';
  76     };
  77
  78     link = ($scope:IEcompHeaderDirectiveScope, $elem:JQuery, attr:any) => {
  79
  80         if (!$scope.clickableLogo) {
  81             $scope.clickableLogo = "true";
  82         }
  83
  84         let findMenuItemById = (menuId):MenuItem => {
  85             let selectedMenuItem:MenuItem = _.find($scope.menuData, (item:MenuItem)=> {
  86                 if (item.menuId === menuId) {
  87                     return item;
  88                 }
  89             });
  90             return selectedMenuItem;
  91         };
  92
  93         let initUser = ():void => {
  94             let defaultUserId:string;
  95             let userInfo:IUserProperties = this.userService.getLoggedinUser();
  96             if (!userInfo) {
  97                 defaultUserId = this.$http.defaults.headers.common[this.sdcConfig.cookie.userIdSuffix];
  98                 this.userService.getUser(defaultUserId).subscribe((defaultUserInfo):void => {
  99                     $scope.user = new User(defaultUserInfo);
 100                 });
 101             } else {
 102                 $scope.user = new User(userInfo);
 103             }
 104         };
 105
 106         $scope.firstMenuLevelClick = (menuId:number):void => {
 107             let selectedMenuItem:MenuItem = _.find($scope.megaMenuDataObjectTemp, (item:MenuItem)=> {
 108                 if (item.menuId === menuId) {
 109                     return item;
 110                 }
 111             });
 112             if (selectedMenuItem) {
 113                 $scope.selectedTopMenu = selectedMenuItem;
 114                 //console.log("Selected menu item: " + selectedMenuItem.text);
 115             }
 116         };
 117
 118         $scope.subMenuEnterAction = (menuId:number):void => {
 119             $scope.selectedSubMenu = findMenuItemById(menuId);
 120         };
 121
 122         $scope.subMenuLeaveAction = (menuId:number):void => {
 123             $scope.selectedTopMenu = undefined;
 124         };
 125
 126         $scope.memuItemClick = (menuItem:MenuItem):void => {
 127             if (menuItem.url) {
 128                 window.location.href = menuItem.url;
 129             } else {
 130                 console.log("Menu item: " + menuItem.text + " does not have defined URL!");
 131             }
 132         };
 133
 134         initUser();
 135
 136     };
 137
 138     public static factory = ($http:ng.IHttpService,
 139                              sdcConfig:IAppConfigurtaion,
 140                              userService:UserService)=> {
 141         return new EcompHeaderDirective($http, sdcConfig, userService);
 142     };
 143
 144 }
 145
 146 export class EcompHeaderController {
 147
 148     messages:any;
 149     getAttachId:Function;
 150     render:any;
 151     reRender:Function;
 152     register:Function;
 153     deregister:Function;
 154     head:any;
 155
 156     static '$inject' = [
 157         '$element',
 158         '$scope',
 159         '$attrs',
 160         '$animate'
 161     ];
 162
 163     constructor(private $element:JQuery,
 164                 private $scope:IEcompHeaderDirectiveScope,
 165                 private $attrs:ng.IAttributes,
 166                 private $animate:any) {
 167
 168         this.$scope = $scope;
 169
 170         this.$scope.$watch('menuData', (newVal, oldVal) => {
 171             if (newVal) {
 172                 this.init();
 173             }
 174         });
 175
 176     }
 177
 178     init = ():void => {
 179
 180         this.$scope.contactUsUrl = "https://wiki.web.att.com/display/EcompPortal/ECOMP+Portal+Home";
 181         this.$scope.getAccessUrl = "http://ecomp-tlv-dev2.uccentral.att.com:8080/ecompportal/get_access";
 182
 183         let unflatten = (array, parent?, tree?) => {
 184             tree = typeof tree !== 'undefined' ? tree : [];
 185             parent = typeof parent !== 'undefined' ? parent : {menuId: null};
 186             let children = _.filter(array, function (child) {
 187                 return child["parentMenuId"] == parent.menuId;
 188             });
 189             if (!_.isEmpty(children)) {
 190                 if (parent.menuId === null) {
 191                     tree = children;
 192                 } else {
 193                     parent['children'] = children
 194                 }
 195                 _.each(children, function (child) {
 196                     unflatten(array, child)
 197                 });
 198             }
 199             return tree;
 200         };
 201
 202         let menuStructureConvert = (menuItems) => {
 203             console.log(menuItems);
 204             this.$scope.megaMenuDataObjectTemp = [
 205                 {
 206                     menuId: 1001,
 207                     text: "ECOMP",
 208                     children: menuItems
 209                 },
 210                 {
 211                     menuId: 1002,
 212                     text: "Help",
 213                     children: [
 214                         {
 215                             text: "Contact Us",
 216                             url: this.$scope.contactUsUrl
 217                         }]
 218                 }
 219             ];
 220
 221             /*{
 222              text:"Get Access",
 223              url: this.$scope.getAccessUrl
 224              }*/
 225             return this.$scope.megaMenuDataObjectTemp;
 226         };
 227
 228         let a = unflatten(this.$scope.menuData);
 229         this.$scope.megaMenuDataObject = menuStructureConvert(a);
 230         //console.log(this.$scope.megaMenuDataObject);
 231     };
 232 }
 233
 234 EcompHeaderDirective.factory.$inject = ['$http', 'sdcConfig', 'UserServiceNg2'];
 235
 236
 237
 238
 239