2 ================================================================================
4 ================================================================================
5 Copyright (C) 2017 AT&T Intellectual Property
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
11 http://www.apache.org/licenses/LICENSE-2.0
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 ================================================================================
20 <div style="position: relative; z-index: 999;">
21 <div class="headerContainer" id="headerContainer" ng-show="{{showHeader}}">
22 <div style="position: relative; z-index: 999;">
23 <div class="headerContainer" id="headerContainer">
24 <div id="megaMenuContainer" class="megaMenuContainer" style="margin-top: 0; overflow: visible;">
26 <!-- Mega Menu parent-tab directive with three models menu-items, active-sub-menu, active-menu -->
27 <div id="topMenu" class="top-megamenu" ng-mouseleave="activeClickSubMenu.x.active=false; activeClickMenu.x.active=false" >
28 <div style="float:left;width:100%;"parent-tab menu-items="megaMenuDataObject" active-sub-menu='activeClickSubMenu.x' active-menu='activeClickMenu.x'>
29 <div parentmenu-tabs mega-menu="true" menu-items="megaMenuDataObject" style="height:55px;">
30 <div style="float:left">
31 <li class="megamenu__item" style="line-height:55px;" ng-click="returnToPortal()">
33 <strong style="font-weight: 400 !important; font-family: Arial !important; font-size: 18px;" >ECOMP Portal</strong>
35 <div menu-tabs mega-menu="true" tab-name="item.text" menu-item="item"
36 active-menu="activeClickMenu.x"
37 ng-repeat="item in megaMenuDataObject"
38 style="font-size: 18px;"
39 ng-mousedown="loadFavorites()">
40 <div parentmenu-tabs sub-menu="true" ng-show="activeClickMenu.x.active && item.active"
41 menu-items="activeClickMenu.x.children">
43 <!-- Second level menu -->
44 <div menu-tabs sub-menu="true" tab-name="subItem.text"
45 tab-url="subItem.url" menu-item="subItem"
46 ng-repeat="subItem in activeClickMenu.x.children | orderBy : 'column'" active-menu="activeClickSubMenu.x"
47 sub-item-active="{{subItem.active}}" style="float:left;" aria-label="{{subItem.text}}"
48 ng-mouseenter="submenuLevelAction(subItem.text,subItem.column)"
49 ng-mouseleave="submenuLevelAction(subItem.text,subItem.column)"
50 ng-click="submenuLevelAction(subItem.text,subItem.column)" >
51 <i ng-if="subItem.text=='Favorites'" id="favorite-star"
52 class="icon-star favorites-icon-active">
55 <div class="sub__menu" ng-mouseleave="activeClickSubMenu.x.active=false" >
56 <ul ng-show="activeClickSubMenu.x.active" role="menubar" class="columns">
57 <!-- Third level menu -->
61 ng-repeat="subItem in activeClickSubMenu.x.children | orderBy : 'column'"
62 ng-show="activeClickSubMenu.x.active">
64 <i id="favorite-selector-third-level"
65 ng-show="isUrlFavorite(subItem.menuId)==false"
66 class="icon-star favorites-icon-inactive"
67 ng-if="subItem.url.length > 1">
69 <i id="favorite-selector-third-level"
70 ng-show="isUrlFavorite(subItem.menuId)"
71 class="icon-star favorites-icon-active"
72 ng-if="subItem.url.length > 1">
74 <span class="title" aria-label="{{subItem.text}}"
75 ng-click="goToUrl(subItem)">{{subItem.text}}</span>
76 <!-- Fourth level menus -->
77 <div att-links-list="">
78 <i id="favorite-selector-fourth-level"
79 class="icon-star favorites-icon-inactive"
80 ng-show="isUrlFavorite(tabValue.menuId)==false"
81 ng-if="tabValue.url.length > 1">
84 <i id="favorite-selector-fourth-level"
85 class="icon-star favorites-icon-active"
86 ng-show="isUrlFavorite(tabValue.menuId)"
87 ng-if="tabValue.url.length > 1">
90 <span role="menuitem" att-links-list-item=""
91 ng-repeat="tabValue in subItem.children"
92 ng-click="goToUrl(tabValue)"
93 att-accessibility-click="13,32"
94 ng-class="{'disabled': tabValue.disabled}">{{tabValue.text}}</span>
96 <hr ng-show="!$last"/>
99 <!-- Favorites level menu -->
100 <div class="favorites-window" ng-show='favoritesWindow' ng-mouseleave="hideFavoritesWindow()">
101 <div id="favorites-menu-items" ng-show="showFavorites">
102 <div ng-repeat="subItem in favoritesMenuItems"
104 style='display: inline'>
105 <i id="favorite-selector-favorites-list"
106 class="icon-star favorites-icon-active"
109 <a id="favorites-list" aria-label="{{subItem.text}}"
110 ng-click="goToUrl(subItem)"
111 style="margin-left: 3px; margin-right: 20px; text-decoration: none; color: #666666;">
117 <p style='font-weight: 400; font-family: Arial !important;
118 font-size: 18px; text-align: center; background-color: lightgray;
119 width: 400px; margin-left: 25%; margin-right: 25%;'>
120 Manage favorites on ECOMP Portal.
124 <!-- Favorites when empty -->
125 <div id="favorites-empty" ng-show="emptyFavorites" class="favorites-window-empty">
127 <img src="app/fusion/external/ebz/images/no_favorites_star.png">
128 <p class='favoritesLargeText'>No Favorites</p>
129 <p class='favoritesNormalText'>Manage favorites on ECOMP Portal.</p>
137 <li class="megamenu__item" style="line-height:55px;" ng-if="loadMenufail">
138 <strong style="font-weight: 400 !important; font-family: Arial !important; font-size: 18px;" >Unable to load menus</strong>
140 <div style="float:right">
141 <li id="bcLoginSnippet" class="megamenu__item" style="width: 140px;" >
142 <div popover="loginSnippet.html" aria-label="Login Snippet"
143 referby="loginSnippet" att-accessibility-click="13,32" popover-style="\" popover-placement="below" style="width: 200px;">
144 <div class="ion-android-person login-snippet-icon" style="display:inline-block"></div>
145 <div class="login-snippet-text" style="display: inline-block; font-size:12px; margin-left:5px;overflow: hidden; max-height: 31px; overflow: hidden; max-height: 31px; max-width:120px; padding-top: 0px; margin-top: 0px; white-space: nowrap;">{{userFirstName}}</div>
148 <li class="megamenu__item" style="width:120px;"> </li>
155 <div style="clear: both"></div>
162 <script type="text/ng-template" id="loginSnippet.html">
163 <div style="line-height: normal; right: 167px; min-height: 200px; height: auto; width: auto; " ng-controller="loginSnippetCtrl" >
164 <div id="reg-header-snippet">
165 <div class="reg-profilePicture" style="min-height: 215px; width: auto; " id="reg-profile-links">
166 <div id="reg-profileImage">
167 <div style="clear: both; height: 80px; position: relative; width: 80px;">
168 <span style=" background-position: -1px -1px; height: 81px;left: 0;position: absolute;top: 0;width: 81px;"> </span>
171 <div id="reg-logout-div">
172 <a class="reg-logout-btn" href="logout.htm">Log Out</a>
175 <div tabindex="0" class="reg-profileDetails" id="reg-profiledetails-id">
176 <ul class="reg-Details-table" style="list-style: none;">
177 <li><div class="reg-userName-table"><div id="reg-userName-table-row"><div id="reg-userName-table-cell"><h3 class="att-global-fonts" style="font-size:18px !important;" id="reg-userName">{{userProfile.fullName}} </h3><span class="visuallyhidden">.</span></div></div></div></li>
178 <li><div class="reg-userEmail-label"><span class="reg-userEmail-label-spn">EMAIL<span class="visuallyhidden">:</span></span></div></li>
179 <li><div class="reg-userEmail-value"><span class="reg-userEmail-value-spn">{{userProfile.email}}<span class="visuallyhidden">.</span></span></div></li>
180 <li><div class="reg-userRole-label"><span class="reg-userRole-label-spn">User ID<span class="visuallyhidden">:</span></span></div></li>
181 <li><div class="reg-userRole-value"><span class="reg-userRole-value-spn">{{userProfile.orgUserId}}<span class="visuallyhidden"></span></span></div></li>