summaryrefslogtreecommitdiffstats
path: root/catalog-ui/app/scripts/directives/ecomp-header
diff options
context:
space:
mode:
authorMichael Lando <ml636r@att.com>2017-06-09 03:19:04 +0300
committerMichael Lando <ml636r@att.com>2017-06-09 03:19:04 +0300
commited64b5edff15e702493df21aa3230b81593e6133 (patch)
treea4cb01fdaccc34930a8db403a3097c0d1e40914b /catalog-ui/app/scripts/directives/ecomp-header
parent280f8015d06af1f41a3ef12e8300801c7a5e0d54 (diff)
[SDC-29] catalog 1707 rebase commit.
Change-Id: I43c3dc5cf44abf5da817649bc738938a3e8388c1 Signed-off-by: Michael Lando <ml636r@att.com>
Diffstat (limited to 'catalog-ui/app/scripts/directives/ecomp-header')
-rw-r--r--catalog-ui/app/scripts/directives/ecomp-header/ecomp-header.html73
-rw-r--r--catalog-ui/app/scripts/directives/ecomp-header/ecomp-header.less296
-rw-r--r--catalog-ui/app/scripts/directives/ecomp-header/ecomp-header.ts235
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 &nbsp; hh:mm a' : 'UTC'}}&nbsp;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'];
-
-}
-
-
-
-