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 <style type="text/css">
22 .att-popover .pop-over-caret.pop-over-caret--below{
26 .att-popover .pop-over-caret.pop-over-caret-border--below{
30 .popover-demo.att-popover{
35 outline:none !important;
37 #reg-header-snippet .reg-profileDetails {
41 #reg-header-snippet .reg-profileDetails .reg-userEmail-label .reg-userEmail-label-spn {
42 color: #0574ac; font-size: 13px; font-weight: bold;
44 #reg-header-snippet .reg-profileDetails .reg-userRole-label .reg-userRole-label-spn {
45 color: #0574ac;font-size: 13px; font-weight: bold;
49 <div class="header-section">
50 <div class="headerContainer" id="headerContainer">
51 <div id="megaMenuContainer" class="megaMenuContainer">
54 <!-- Mega Menu parent-tab directive with three models menu-items, active-sub-menu, active-menu -->
55 <div id="topMenu" class="top-megamenu" ng-mouseleave="activeClickSubMenu.x.active=false; activeClickMenu.x.active=false">
56 <div class="megaMenuDataObject" parent-tab menu-items="megaMenuDataObject"
57 active-sub-menu='activeClickSubMenu.x' active-menu='activeClickMenu.x'>
58 <div parentmenu-tabs mega-menu="true" menu-items="megaMenuDataObject" class="parentmenu-tabs">
59 <div class="menu-section">
61 <li class="megamenu__item" style="line-height:55px;" onclick="window.location = 'applicationsHome'">
62 <span id="logo-image" class="logo-image"></span>
63 <span id="portal-title" class="portal-title" >OpenECOMP Portal</span>
65 <!-- MENUS --> <!-- MENUS -->
66 <div id="menu-tabs-mega-menu"
67 menu-tabs mega-menu="true"
70 ng-mousedown="loadFavorites()"
71 active-menu="activeClickMenu.x"
72 ng-repeat="item in megaMenuDataObject" style="font-size: 18px;">
73 <div id="parentmenu-tabs" parentmenu-tabs sub-menu="true"
74 ng-show="activeClickMenu.x.active && item.active"
75 menu-items="activeClickMenu.x.children">
77 <!-- Second level menu --> <!-- Second level menu -->
78 <div id="second-level-menus" menu-tabs sub-menu="true"
79 menu-item="subItem" tab-name="subItem.text" tab-url="subItem.url"
80 ng-repeat="subItem in activeClickMenu.x.children | orderBy : 'column'"
81 active-menu="activeClickSubMenu.x"
82 sub-item-active="{{subItem.active}}" style="float:left;"
83 aria-label="{{subItem.text}} | orderBy : 'column'"
84 ng-mousemove="submenuLevelAction(subItem.text,subItem.column)"
85 ng-if="item.text!='Help' && item.text!='Support'"
87 <i ng-if="subItem.text=='Favorites'" id="favorite-star" data-size="large"
88 class="ion-star favorites-icon-active">
91 <div id="second-level-menus-help" menu-tabs sub-menu="true"
93 ng-repeat="subItem in activeClickMenu.x.children | orderBy : 'column'"
94 ng-if="item.text=='Help' || item.text=='Support'"
96 <span ng-click="goToUrl(subItem)">{{subItem.text}}</span>
100 <div class="sub__menu" >
101 <ul ng-show="activeClickSubMenu.x.active" role="menubar" class="header-columns">
102 <!-- Third level menu --> <!-- Third level menu -->
103 <div id="third-level-menus" class="header-columns-div"
104 ng-hide='favoritesWindow || hideMenus'
105 menu-tabs menu-item="subItem"
106 ng-repeat="subItem in activeClickSubMenu.x.children | orderBy : 'column'"
107 ng-show="activeClickSubMenu.x.active" >
108 <i id="level3-star-inactive-{{subItem.menuId}}" ng-cloak
109 class="ion-star level3-favorites-icon-inactive" data-size="large"
110 data-ng-click="setAsFavoriteItem($event, subItem.menuId)"
111 ng-if="subItem.url.length > 1 && isUrlFavorite(subItem.menuId)==false">
113 <i id="level3-star-active-{{subItem.menuId}}" ng-cloak
114 ng-if="subItem.url.length > 1 && isUrlFavorite(subItem.menuId)"
115 class="ion-star favorites-icon-active ng-cloak" data-size="large"
116 data-ng-click="removeAsFavoriteItem($event, subItem.menuId)"
120 aria-label="{{subItem.text | elipsis: 50}}"
121 ng-click="goToUrl(subItem)">{{subItem.text}}</span>
122 <!-- Fourth level menus - <!-- Fourth level menus -->
123 <div class ="header-level4-div" att-links-list="" ng-repeat="tabValue in subItem.children" >
124 <i id="level4-star-inactive-{{tabValue.menuId}}" ng-cloak
125 class="ion-star level4-favorites-icon-inactive"
126 data-ng-click="setAsFavoriteItem($event, tabValue.menuId)"
127 ng-if="tabValue.url.length > 1 && isUrlFavorite(tabValue.menuId)==false">
129 <i id="level4-star-active-{{tabValue.menuId}}" ng-cloak
130 class="ion-star favorites-icon-active"
131 data-ng-click="removeAsFavoriteItem($event, tabValue.menuId)"
132 ng-if="tabValue.url.length > 1 && isUrlFavorite(tabValue.menuId)">
136 <span ng-click="goToUrl(tabValue)"
137 role="menuitem" att-links-list-item=""
138 style="display: inline; padding-left: 8px"
139 att-accessibility-click="13,32"
140 title="{{tabValue.text}}"
141 ng-class="{'disabled': tabValue.disabled}">{{tabValue.text | elipsis: 50}}</span>
143 <div att-divider-lines ng-show="!$last"></div>
146 <!-- Favorites level menu --> <!-- Favorites level menu -->
147 <div class="header-columns-div" ng-show='favoritesWindow' ng-mouseleave="hideFavoritesWindow()">
148 <div id="favorites-menu-items" att-links-list=""
149 ng-show="showFavorites"
151 ng-repeat="subItem in favoritesMenuItems"
154 <div class="fav-links">
155 <i id="favorite-selector-favorites-list"
156 class="ion-star favorites-icon-active"
157 style="font-size:18px"
158 data-ng-click="removeAsFavoriteItem($event, subItem.menuId)"
159 ng-mousedown="removeAsFavoriteItem($event, subItem.menuId)">
161 <a id="favorites-list" aria-label="{{subItem.text}}" style="color: #000"
162 ng-click="goToUrl(subItem)">{{subItem.text}}
166 <!-- Favorites when empty -->
167 <div id="favorites-empty"
168 ng-show="emptyFavorites"
169 class="favorites-window-empty" >
171 <span id="fav-icon" class="ion-ios-star" ></span>
172 <p id="p-no-favs" class="largeText">No Favorites</p>
173 <p id="p-no-favs-desc" class="normal">Add your favorite items for quick access.</p>
183 <div class="login-section">
184 <li id="bcLoginSnippet" class="megamenu__item" style="width: 140px;" >
185 <div popover="loginSnippet.html" aria-label="Login Snippet" referby="loginSnippet" att-accessibility-click="13,32" popover-style="" popover-trigger="click" popover-placement="below" style="width: 150px; height: 55px; display: inline-flex">
186 <div id="icon-user-small" class="ion-android-person login-snippet-icon"></div>
187 <div id="login-snippet-text" class="login-snippet-text">{{header.firstName}}</div>
193 <div style="clear: both"></div>
199 <script type="text/ng-template" id="loginSnippet.html">
200 <div ng-controller="loginSnippetCtrl" >
201 <div id="reg-header-snippet">
202 <div tabindex="0" class="reg-profileDetails" id="reg-profiledetails-id">
203 <ul class="reg-Details-table" style="list-style: none; border-bottom: 1px solid #bbb; padding-bottom: 20px;" >
205 <div class="reg-userName-table">
206 <div id="reg-userName-table-row">
207 <div id="reg-userName-table-cell">
208 <h3 class="att-global-fonts" style="font-size:18px; line-height:1.6 !important;" id="reg-userName" >
209 {{firstName}} {{lastName}} </h3>
215 <li><div class="reg-userEmail-label"><span class="reg-userEmail-label-spn">Email<span class="visuallyhidden">:
216 </span></span></div></li>
217 <li><div class="reg-userEmail-value"><span class="reg-userEmail-value-spn">
218 {{loginSnippetEmail}}</span></div></li>
220 <li><div class="reg-userRole-label"><span class="reg-userRole-label-spn">
221 User ID<span class="visuallyhidden">:</span></span></div></li>
222 <li><div class="reg-userRole-value"><span class="reg-userRole-value-spn">
223 {{loginSnippetUserId}}<span class="visuallyhidden"></span></span></div></li>
226 <div id="reg-logout-div" style="padding-top: 8px;">
227 <p>Last login: <span ng-bind="lastLogin"></span></p>
228 <div style="margin-top: 10px">
229 <a href="javascript:void(0)" id="allLogout" ng-click="openEditUserModal()" style="" class="new-button">
232 <a href="javascript:void(0)" id="allLogout" ng-click="allAppsLogout()" class="new-button">
242 <script type="text/ng-template" id="notificationCtrl.html">
243 <div style="line-height: normal; right: 167px; min-height: 122px; height: auto; width: auto; " ng-controller="notificationCtrl" >
244 <div class="ng-scope">
245 <div id="notification" class="notificationBox ">
246 <div class="notification-header">
247 <div style="float:left;">
248 <p class="notification-heading">Notifications</p>
250 <!-- <div class="notification-close ng-isolate-scope" tabindex="0" ddh-accessibility-click="13,32" b2b-close-flyout="">
251 <span class="icon-circle-action-close" aria-label="close button"></span>
253 <div style="clear:both;"></div>
255 <div class="notification-main">
256 <div style="height:113px;">
257 <div align="center" class="icon-information notification-info-icon"></div>
260 <p class="notification-text">No New Notifications.</p>
263 <div class="notification-main ng-hide" ng-show="showList">
264 <!-- ngRepeat: notification in notifications track by $index -->
266 <div class="notification-footer">
267 <div class="notification-links">
268 <div style="clear:both;"></div>