diff options
Diffstat (limited to 'catalog-ui/app/scripts/directives/ecomp-header')
3 files changed, 0 insertions, 604 deletions
diff --git a/catalog-ui/app/scripts/directives/ecomp-header/ecomp-header.html b/catalog-ui/app/scripts/directives/ecomp-header/ecomp-header.html deleted file mode 100644 index e86f9df8b0..0000000000 --- a/catalog-ui/app/scripts/directives/ecomp-header/ecomp-header.html +++ /dev/null @@ -1,73 +0,0 @@ -<div class="sdc-ecomp-header-wrapper"> - - <div class="sdc-ecomp-header"> - - <div class="sdc-ecomp-logo-wrapper"> - <a class="sdc-ecomp-header-title" data-ng-if="clickableLogo==='true'" data-ui-sref="dashboard"><span class="sdc-ecomp-logo"></span>ASDC</a> - <a class="sdc-ecomp-header-title" data-ng-if="clickableLogo==='false'"><span class="sdc-ecomp-logo"></span>ASDC</a> - <div class="sdc-ecomp-header-version"> v.{{version}}</div> - </div> - - <div class="sdc-ecomp-menu"> - - <!-- Top level menu --> - <ul class="sdc-ecomp-menu-top-level"> - <li class="sdc-ecomp-menu-top-level-item" - ng-repeat="item in megaMenuDataObject" - data-ng-if="item.children && item.children.length>0" - > - <span class="selected" data-ng-if="item.menuId === selectedTopMenu.menuId"></span> - <a href data-ng-click="firstMenuLevelClick(item.menuId)">{{item.text}}</a> - - <!-- Second level menu --> - <div class="sdc-ecomp-menu-second-level" data-ng-if="item.menuId === selectedTopMenu.menuId" data-ng-mouseleave="subMenuLeaveAction(item.menuId)"> - <ul> - <li class="sdc-ecomp-menu-second-level-item" - ng-repeat="subItem in selectedTopMenu.children | orderBy : 'column'" - aria-label="{{subItem.text}}" - data-ng-class="{'sdc-ecomp-menu-item-hover': menuItemHover===true}" - ng-mouseover="subMenuEnterAction(subItem.menuId)" - ng-mouseenter="menuItemHover=true" - ng-mouseleave="menuItemHover=false"> - - <!--<i ng-if="subItem.text=='Favorites'" id="favorite-star" class="icon-star favorites-icon-active"></i>--> - - <a href title="{{subItem.text}}" data-ng-click="memuItemClick(subItem)">{{subItem.text}}</a> - - <!-- Third and Four menu panel --> - <ul class="sdc-ecomp-menu-third-level" data-ng-if="subItem.menuId === selectedSubMenu.menuId && (selectedSubMenu.children && selectedSubMenu.children.length>0)"> - <li class="sdc-ecomp-menu-third-level-item" - ng-repeat="thirdItem in selectedSubMenu.children | orderBy : 'column'" - aria-label="{{thirdItem.text}}"> - <a class="sdc-ecomp-menu-third-level-title" href title="{{thirdItem.text}}" data-ng-click="memuItemClick(thirdItem)">{{thirdItem.text}}</a> - <span class="sdc-ecomp-menu-four-level-seperator"></span> - <ul class="sdc-ecomp-menu-four-level"> - <li class="sdc-ecomp-menu-four-level-item" data-ng-repeat="fourItem in thirdItem.children | orderBy : 'column'"> - <a href title="{{fourItem.text}}" data-ng-click="memuItemClick(fourItem)">{{fourItem.text}}</a> - </li> - </ul> - </li> - </ul> - - </li> - </ul> - </div> - - </li> - - </ul> - - </div> - <div class="sdc-ecomp-user-wrapper"> - <span class="sdc-ecomp-user-icon"></span> - <div class="sdc-ecomp-user-details"> - <div class="sdc-ecomp-user-details-name-role"> - <div sdc-smart-tooltip class="sdc-ecomp-user-details-name" data-ng-bind="user.getName()"></div> - <div class="sdc-ecomp-user-details-role" data-ng-bind="user.getRoleToView()"></div> - </div> - <div class="sdc-ecomp-user-details-last-login" data-ng-show="user.getLastLogin()!==''">Last Login: {{user.getLastLogin() | date: 'MMM dd hh:mm a' : 'UTC'}} UTC</div> - </div> - </div> - </div> - -</div> diff --git a/catalog-ui/app/scripts/directives/ecomp-header/ecomp-header.less b/catalog-ui/app/scripts/directives/ecomp-header/ecomp-header.less deleted file mode 100644 index a6f7e9b5a2..0000000000 --- a/catalog-ui/app/scripts/directives/ecomp-header/ecomp-header.less +++ /dev/null @@ -1,296 +0,0 @@ -@first-level-color: #067ab4; -@second-level-color: #f8f8f8; - -@first-level-height: 60px; -@second-level-height: 60px; -@third-four-level-height: 370px; - -@max-item-width: 250px; - -.sdc-ecomp-header-wrapper { - - position: absolute; - top: 0; - right: 0; - left: 0; - z-index: 999; - - ul { - margin: 0; - padding: 0; - } - - .sdc-ecomp-header { - - background-color: @first-level-color; - height: @first-level-height; - line-height: @first-level-height; - vertical-align: middle; - display: flex; - flex-direction: row; - padding: 0 20px; - - .sdc-ecomp-menu { - flex-grow: 98; - } - - } - - /* LEVEL 1 */ - .sdc-ecomp-menu-top-level { - list-style: none; - - .sdc-ecomp-menu-top-level-item:first-child { - margin-left: 0; - } - - .sdc-ecomp-menu-top-level-item { - display: inline-block; - margin: 0 20px; - position: relative; - a { - .p_14_m; - text-decoration: none; - } - - span { - &.selected { - position: absolute; - bottom: 0; - width: 0; - height: 0; - border-left: 15px solid transparent; - border-right: 15px solid transparent; - border-bottom: 15px solid @second-level-color; - } - } - } - } - - /* LEVEL 2 */ - .sdc-ecomp-menu-second-level { - background-color: @second-level-color; - box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, 0.33); - height: @second-level-height; - list-style: none; - line-height: @second-level-height; - vertical-align: middle; - display: flex; - flex-direction: row; - padding: 0 20px; - position: fixed; - left: 0; - right: 0; - - .sdc-ecomp-menu-second-level-item:first-child { - margin-left: 0; - } - - .sdc-ecomp-menu-second-level-item { - display: inline-block; - height: @second-level-height; - line-height: @second-level-height; - - &.sdc-ecomp-menu-item-hover { - border-bottom: 4px solid #067ab4; - } - - a { - .m_14_r; - text-decoration: none; - text-align:center; - padding: 0 20px; - display: block; - - &:hover { - .s_14_r; - font-weight:bold; - } - - &:active { - font-weight: bold; - } - - /* fix jump when hovering text */ - &:after { - display:block; - content:attr(title); - font-weight:bold; - height:1px; - color:transparent; - overflow:hidden; - visibility:hidden; - } - } - - } - - } - - /* LEVEL 3 */ - ul.sdc-ecomp-menu-third-level { - background-color: #ffffff; - box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1); - min-height: @third-four-level-height; - list-style: none; - - display: flex; - flex-direction: row; - /*flex-wrap: wrap;*/ - position: fixed; - top: @first-level-height + @second-level-height; - left: 0; - right: 0; - padding: 0 40px; - - li.sdc-ecomp-menu-third-level-item { - height: 40px; - line-height: 40px; - position: relative; - /*width: @max-item-width;*/ - max-width: @max-item-width; - - .sdc-ecomp-menu-third-level-title { - .m_14_m; - text-decoration: none; - text-align: left; - display: block; - padding: 0 20px; - line-height: 20px; - margin-top: 20px; - font-weight: bold; - cursor: pointer; - } - - .sdc-ecomp-menu-four-level-seperator { - position: absolute; - border-right: solid 1px #e5e5e5; - height: @third-four-level-height - 20; - top: 10px; - } - } - - li.sdc-ecomp-menu-third-level-item:first-child { - .sdc-ecomp-menu-four-level-seperator { - border: none; - } - } - } - - /* LEVEL 4 */ - ul.sdc-ecomp-menu-four-level { - display: flex; - flex-direction: column; - margin-top: 10px; - - li.sdc-ecomp-menu-four-level-item { - display: block; - /*width: @max-item-width;*/ - max-width: @max-item-width; - line-height: 20px; - - a { - .m_14_r; - text-decoration: none; - text-align: left; - display: block; - - &:hover { - .s_14_r; - font-weight: bold; - } - } - } - } - -} - -.sdc-ecomp-logo-wrapper { - flex-grow: 1; - .p_18_m; - white-space: nowrap; - min-width: 210px; - text-align: left; - position: relative; - - .sdc-ecomp-logo { - background-image: url("images/att_logo_white.png"); - background-repeat: no-repeat; - display: inline-block; - vertical-align: middle; - width: 55px; - height: 55px; - } - - .sdc-ecomp-header-version { - .c_16; - .opacity(0.8); - position: absolute; - top: 34px; - line-height: 20px; - left: 56px; - } - - a.sdc-ecomp-header-title { - .p_24; - text-decoration: none; - } -} - - -.sdc-ecomp-user-wrapper { - - flex-grow: 1; - .p_14_m; - white-space: nowrap; - display: flex; - flex-direction: row; - align-items: center; - height: @first-level-height; - - .sdc-ecomp-user-icon { - margin-right: 20px; - .tlv-sprite; - .tlv-sprite.user; - } - - .sdc-ecomp-user-details { - display: flex; - flex-direction: column; - } - - .sdc-ecomp-user-details-name-role { - line-height: 20px; - - .sdc-ecomp-user-details-name { - max-width: 160px; - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - vertical-align: bottom; - - .bold; - display: inline-block; - } - - .sdc-ecomp-user-details-role { - .bold; - display: inline-block; - margin-left: 6px; - - &:before { - content: ''; - margin-right: 8px; - border-left: 1px solid @color_m; - } - } - } - - .sdc-ecomp-user-details-last-login { - .font-type._3; - display: block; - line-height: 20px; - height: 20px; - } - -} diff --git a/catalog-ui/app/scripts/directives/ecomp-header/ecomp-header.ts b/catalog-ui/app/scripts/directives/ecomp-header/ecomp-header.ts deleted file mode 100644 index 7102c810ba..0000000000 --- a/catalog-ui/app/scripts/directives/ecomp-header/ecomp-header.ts +++ /dev/null @@ -1,235 +0,0 @@ -/*- - * ============LICENSE_START======================================================= - * SDC - * ================================================================================ - * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved. - * ================================================================================ - * Licensed under the Apache License, Version 2.0 (the "License"); - * you may not use this file except in compliance with the License. - * You may obtain a copy of the License at - * - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Unless required by applicable law or agreed to in writing, software - * distributed under the License is distributed on an "AS IS" BASIS, - * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - * See the License for the specific language governing permissions and - * limitations under the License. - * ============LICENSE_END========================================================= - */ -/// <reference path="../../references"/> -module Sdc.Directives { - 'use strict'; - - export class MenuItem { - menuId:number; - column:number; - text:string; - parentMenuId:number; - url:string; - children:Array<MenuItem> - } - - export interface IEcompHeaderDirectiveScope extends ng.IScope { - menuData:Array<MenuItem>; - version:string; - clickableLogo:string; - contactUsUrl:string; - getAccessUrl:string; - megaMenuDataObjectTemp:Array<any>; - megaMenuDataObject:Array<any>; - - selectedTopMenu:MenuItem; - selectedSubMenu:MenuItem; - - firstMenuLevelClick:Function; - subMenuEnterAction:Function; - subMenuLeaveAction:Function; - - memuItemClick:Function; - user: Models.IUser; - } - - export class EcompHeaderDirective implements ng.IDirective { - - constructor(private $templateCache:ng.ITemplateCacheService, - private $http:ng.IHttpService, - private sdcConfig:Models.IAppConfigurtaion, - private UserResourceClass:Services.IUserResourceClass) { - - } - - scope = { - menuData: '=', - version: '@', - clickableLogo: '@?' - }; - - public replace = true; - public restrict = 'E'; - public controller = EcompHeaderController; - - template = ():string => { - return this.$templateCache.get('/app/scripts/directives/ecomp-header/ecomp-header.html'); - }; - - link = ($scope:IEcompHeaderDirectiveScope, $elem:JQuery, attr:any) => { - - if (!$scope.clickableLogo){ - $scope.clickableLogo="true"; - } - - let findMenuItemById = (menuId):MenuItem => { - let selectedMenuItem:MenuItem = _.find($scope.menuData, (item:MenuItem)=>{ - if (item.menuId === menuId){ - return item; - } - }); - return selectedMenuItem; - }; - - let initUser = ():void => { - let defaultUserId:string; - let user:Services.IUserResource = this.UserResourceClass.getLoggedinUser(); - if (!user) { - defaultUserId = this.$http.defaults.headers.common[this.sdcConfig.cookie.userIdSuffix]; - user = this.UserResourceClass.get({id: defaultUserId}, ():void => { - $scope.user = new Models.User(user); - }); - } else { - $scope.user = new Models.User(user); - } - }; - - $scope.firstMenuLevelClick = (menuId:number):void => { - let selectedMenuItem:MenuItem = _.find($scope.megaMenuDataObjectTemp, (item:MenuItem)=>{ - if (item.menuId === menuId){ - return item; - } - }); - if (selectedMenuItem) { - $scope.selectedTopMenu = selectedMenuItem; - //console.log("Selected menu item: " + selectedMenuItem.text); - } - }; - - $scope.subMenuEnterAction = (menuId:number):void => { - $scope.selectedSubMenu = findMenuItemById(menuId); - }; - - $scope.subMenuLeaveAction = (menuId:number):void => { - $scope.selectedTopMenu = undefined; - }; - - $scope.memuItemClick = (menuItem:MenuItem):void => { - if (menuItem.url){ - window.location.href=menuItem.url; - } else { - console.log("Menu item: " + menuItem.text + " does not have defined URL!"); - } - }; - - initUser(); - - }; - - public static factory = ($templateCache:ng.ITemplateCacheService, - $http:ng.IHttpService, - sdcConfig:Models.IAppConfigurtaion, - UserResourceClass:Services.IUserResourceClass)=> { - return new EcompHeaderDirective($templateCache, $http, sdcConfig, UserResourceClass); - }; - - } - - export class EcompHeaderController { - - messages:any; - getAttachId:Function; - render:any; - reRender:Function; - register:Function; - deregister:Function; - head:any; - - static '$inject' = [ - '$element', - '$scope', - '$attrs', - '$animate' - ]; - - constructor(private $element:JQuery, - private $scope:IEcompHeaderDirectiveScope, - private $attrs:ng.IAttributes, - private $animate:any) { - - this.$scope = $scope; - - this.$scope.$watch('menuData', (newVal, oldVal) => { - if (newVal){ - this.init(); - } - }); - - } - - init = ():void => { - - this.$scope.contactUsUrl = "https://wiki.web.att.com/display/EcompPortal/ECOMP+Portal+Home"; - this.$scope.getAccessUrl = "http://ecomp-tlv-dev2.uccentral.att.com:8080/ecompportal/get_access"; - - let unflatten = ( array, parent?, tree? ) => { - tree = typeof tree !== 'undefined' ? tree : []; - parent = typeof parent !== 'undefined' ? parent : { menuId: null }; - let children = _.filter( array, function(child){ return child["parentMenuId"] == parent.menuId; }); - if( !_.isEmpty( children ) ){ - if( parent.menuId === null ){ - tree = children; - }else{ - parent['children'] = children - } - _.each( children, function( child ){ unflatten( array, child ) } ); - } - return tree; - }; - - let menuStructureConvert = (menuItems) => { - console.log(menuItems); - this.$scope.megaMenuDataObjectTemp = [ - { - menuId: 1001, - text: "ECOMP", - children: menuItems - }, - { - menuId: 1002, - text: "Help", - children: [ - { - text:"Contact Us", - url: this.$scope.contactUsUrl - }] - } - ]; - - /*{ - text:"Get Access", - url: this.$scope.getAccessUrl - }*/ - return this.$scope.megaMenuDataObjectTemp; - }; - - let a = unflatten(this.$scope.menuData); - this.$scope.megaMenuDataObject = menuStructureConvert(a); - //console.log(this.$scope.megaMenuDataObject); - }; - } - - EcompHeaderDirective.factory.$inject = ['$templateCache', '$http', 'sdcConfig', 'Sdc.Services.UserResourceService']; - -} - - - - |