summaryrefslogtreecommitdiffstats
path: root/catalog-ui/src/app/directives/layout/top-nav
diff options
context:
space:
mode:
authorTal Gitelman <tg851x@intl.att.com>2017-12-10 18:55:03 +0200
committerTal Gitelman <tg851x@intl.att.com>2017-12-10 19:33:38 +0200
commit51d50f0ef642e0f996a1c8b8d2ef4838bdfec892 (patch)
tree3ac236a864d74d19b0f5c9020891a7a7e5c31b44 /catalog-ui/src/app/directives/layout/top-nav
parentb5cc2e0695f195716d6ccdc65e73807a6632ec70 (diff)
Final commit to master merge from
Change-Id: Ib464f9a8828437c86fe6def8af238aaf83473507 Issue-ID: SDC-714 Signed-off-by: Tal Gitelman <tg851x@intl.att.com>
Diffstat (limited to 'catalog-ui/src/app/directives/layout/top-nav')
-rw-r--r--catalog-ui/src/app/directives/layout/top-nav/top-nav.html54
-rw-r--r--catalog-ui/src/app/directives/layout/top-nav/top-nav.less218
-rw-r--r--catalog-ui/src/app/directives/layout/top-nav/top-nav.ts161
3 files changed, 0 insertions, 433 deletions
diff --git a/catalog-ui/src/app/directives/layout/top-nav/top-nav.html b/catalog-ui/src/app/directives/layout/top-nav/top-nav.html
deleted file mode 100644
index 60d3d63855..0000000000
--- a/catalog-ui/src/app/directives/layout/top-nav/top-nav.html
+++ /dev/null
@@ -1,54 +0,0 @@
-<nav class="top-nav">
-
- <div class="asdc-app-title-wrapper">
- <a class="asdc-app-title" translate="PROJECT_TITLE"></a>
- <div class="asdc-version"> v.{{version}}</div>
- </div>
-
- <ul class="top-menu" data-ng-show="!menuModel">
- <!-- no hierarchy & dropdowns mode -->
- <li data-ng-repeat="item in topLvlMenu.menuItems"
- data-ng-class="{'selected': $index == topLvlMenu.selectedIndex}">
- <a data-ng-click="menuItemClick(topLvlMenu, item)"
- data-tests-id="main-menu-button-{{item.text | lowercase}}">{{item.text}}</a>
- </li>
- </ul>
-
- <ul class="top-menu" data-ng-show="menuModel">
- <!-- with hierarchy & dropdowns mode -->
- <li data-ng-repeat-start="groupItem in menuModel"
- data-ng-class="{'selected': $last }">
- <a data-ng-click="menuItemClick(groupItem, groupItem.menuItems[groupItem.selectedIndex])"
- data-tests-id="breadcrumbs-button-{{$index}}">
- {{groupItem.menuItems[groupItem.selectedIndex].text}}
- </a>
- </li>
- <li data-ng-repeat-end="" class="triangle-dropdown"
- data-ng-class="{'item-click': groupItem.itemClick}" data-ng-mouseover="groupItem.itemClick = true">
- <div class="triangle"><span class="sprite-new arrow-right"></span></div>
- <perfect-scrollbar scroll-y-margin-offset="15" include-padding="true">
- <ul>
- <li data-ng-repeat="ddItem in groupItem.menuItems"
- data-ng-click="menuItemClick(groupItem, ddItem)"
- data-ng-class="{'selected': $index == groupItem.selectedIndex, 'disabled': ddItem.isDisabled}"
- data-tests-id="sub-menu-button-{{ddItem.text | lowercase}}">
- <span sdc-smart-tooltip="">{{ddItem.text}}</span>
- </li>
- </ul>
- </perfect-scrollbar>
- </li>
- </ul>
-
- <div class="top-search" data-ng-hide="hideSearch === true">
- <input type="text"
- class="search-text"
- placeholder="Search"
- data-ng-model="searchBind"
- data-tests-id="main-menu-input-search"
- ng-model-options="{ debounce: 500 }" />
- <span class="w-sdc-search-icon magnification"></span>
- </div>
-
- <div class="notification-icon" data-ng-disabled= "progress > 0" data-ng-class="{'disabled' : progress > 0}" data-ng-if="user.role === 'DESIGNER' && notificationIconCallback" data-ng-click="notificationIconCallback()" tooltips tooltip-side="left" tooltip-content="Vendor Software Product Repository" data-tests-id="repository-icon"></div>
-
-</nav>
diff --git a/catalog-ui/src/app/directives/layout/top-nav/top-nav.less b/catalog-ui/src/app/directives/layout/top-nav/top-nav.less
deleted file mode 100644
index 13b4a525f4..0000000000
--- a/catalog-ui/src/app/directives/layout/top-nav/top-nav.less
+++ /dev/null
@@ -1,218 +0,0 @@
-.top-nav {
- position: fixed;
- top: @header_height;
- background-color: @main_color_p;
- .box-shadow(0px 1px 3px 0px rgba(0, 0, 0, 0.33));
- width: 100%;
- height: @top_nav_height;
- line-height: @top_nav_height;
- z-index: 10;
- display: flex;
- flex-direction: row;
- align-items: center;
-
- .asdc-app-title-wrapper {
- flex-grow: 1;
- line-height: 16px;
- margin: 0 20px;
-
- a.asdc-app-title {
- .m_18_r;
- text-decoration: none;
- }
-
- .asdc-version {
- .m_12_r;
- .opacity(0.8);
- line-height: 14px;
- flex-grow: 1;
- }
-
- }
-
- ul.top-menu {
- list-style-type: none;
- margin: 0 0 0 20px;
- padding: 0;
- flex-grow: 999;
-
- & > li {
- float: left;
- cursor: pointer;
- line-height: 50px;
- height: 50px;
- padding: 0 20px;
-
- &.selected {
- border-bottom: solid 4px @main_color_a;
-
- a {
- color: @func_color_s;
- }
- }
-
- /*&:hover {
- border-bottom: solid 4px @main_color_a;
- }*/
-
- a {
- font-family: @font-opensans-medium;
- color: @main_color_m;
- font-size: 16px;
- display: block;
- text-align: center;
- text-decoration: none;
- }
-
- &.triangle-dropdown {
- padding: 0;
- position: relative;
-
- div.triangle {
- margin-top: 15px;
- border-radius: 2px;
- width: 17px;
- height: 18px;
-
- //temp use - until new triangle gets in
- line-height: 18px;
- text-align: center;
- font-size: 10px;
-
- &:hover {
- background-color: rgba(156, 156, 156, 0.2);
-
- span {
- .arrow-right-hover;
- }
- }
- }
-
- + li a {
- font-size: 16px;
- }
-
- .ps-container {
- .perfect-scrollbar;
- position: absolute;
- left: 0;
- top: 40px;
- z-index: 1;
-
- overflow: hidden;
- max-height: 0;
- -webkit-transition: max-height 200ms ease-in;
- -moz-transition: max-height 200ms ease-in;
- -o-transition: max-height 200ms ease-in;
- transition: max-height 200ms ease-in;
-
- div ul {
-
- padding: 0;
- background-color: white;
-
- li {
-
- height: 35px;
- background-color: white;
- font-size: 13px;
- width: 150px;
- line-height: 35px;
- padding: 0 10px;
-
- &.disabled {
- opacity: 1;
- }
- &.selected {
- background-color: @tlv_color_v;
- font-weight: bold;
- }
- &:hover {
- color: @main_color_a;
- }
- span {
- height: 35px;
- width: 130px;
- display: inline-block;
- }
- }
- }
- }
- &.item-click:hover .ps-container,
- &.item-click:active .ps-container {
- max-height: 500px;
- border: 1px solid @func_color_b;
- border-radius: 2px;
- box-shadow: 0px 2px 2px 0px rgba(24, 24, 25, 0.1);
-
- div ul {
-
- }
- }
- }
- }
-
- }
-
- .top-search {
- position: relative;
- flex-grow: 1;
- padding: 0 20px;
-
- input.search-text {
- .border-radius(2px);
- width: 245px;
- height: 32px;
- line-height: 32px;
- border: 1px solid @main_color_o;
- outline: none;
- text-indent: 10px;
-
- &::-webkit-input-placeholder { font-style: italic; } /* Safari, Chrome and Opera */
- &:-moz-placeholder { font-style: italic; } /* Firefox 18- */
- &::-moz-placeholder { font-style: italic; } /* Firefox 19+ */
- &:-ms-input-placeholder { font-style: italic; } /* IE 10+ */
- &:-ms-input-placeholder { font-style: italic; } /* Edge */
- /* font-style: italic;
- }*/
- /* Firefox 18- */
- &::-moz-placeholder {
- font-style: italic;
- }
- /* Firefox 19+ */
- &:-ms-input-placeholder {
- font-style: italic;
- }
- /* IE 10+ */
- &:-ms-input-placeholder {
- font-style: italic;
- }
- /* Edge */
- }
-
- .magnification {
- position: absolute;
- top: 19px;
- right: 26px;
- }
-
- }
-
- .notification-icon {
- cursor: pointer;
- flex-grow: 1;
- margin: 0 10px 6px 0;
- .sprite-new;
- .vsp-list-icon;
-
- &:hover {
- .vsp-list-icon-hover;
- }
-
- &:active {
- .vsp-list-icon-active;
- }
-
- }
-
-}
diff --git a/catalog-ui/src/app/directives/layout/top-nav/top-nav.ts b/catalog-ui/src/app/directives/layout/top-nav/top-nav.ts
deleted file mode 100644
index 59e4d49647..0000000000
--- a/catalog-ui/src/app/directives/layout/top-nav/top-nav.ts
+++ /dev/null
@@ -1,161 +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=========================================================
- */
-
-'use strict';
-import {IAppConfigurtaion, IHostedApplication, IUserProperties} from "app/models";
-import {IUserResourceClass} from "app/services";
-import {MenuItemGroup, MenuItem} from "app/utils";
-
-export interface ITopNavScope extends ng.IScope {
- topLvlSelectedIndex:number;
- hideSearch:boolean;
- searchBind:any;
- menuModel:Array<MenuItemGroup>;
-
- topLvlMenu:MenuItemGroup;
- goToState(state:string, params:Array<any>):ng.IPromise<boolean>;
- menuItemClick:Function;
- user:IUserProperties;
- version:string;
-}
-
-
-export class TopNavDirective implements ng.IDirective {
-
- constructor(private $filter:ng.IFilterService,
- private $state:ng.ui.IStateService,
- private $q:ng.IQService,
- private userResourceService:IUserResourceClass,
- private sdcConfig:IAppConfigurtaion) {
- }
-
- public replace = true;
- public restrict = 'E';
- public transclude = false;
-
-
- scope = {
- topLvlSelectedIndex: '@?',
- hideSearch: '=',
- searchBind: '=',
- version: '@',
- notificationIconCallback: '=',
- menuModel: '=?',
- };
-
- template = ():string => {
- return require('./top-nav.html');
- };
-
- public link = (scope:ITopNavScope, $elem:ng.IAugmentedJQuery, $attrs:angular.IAttributes) => {
-
- let getTopLvlSelectedIndexByState = ():number => {
- if (!scope.topLvlMenu.menuItems) {
- return 0;
- }
-
- let result = -1;
-
- //set result to current state
- scope.topLvlMenu.menuItems.forEach((item:MenuItem, index:number)=> {
- if (item.state === this.$state.current.name) {
- result = index;
- }
- });
-
- //if it's a different state , checking previous state param
- if (result === -1) {
- scope.topLvlMenu.menuItems.forEach((item:MenuItem, index:number)=> {
- if (item.state === this.$state.params['previousState']) {
- result = index;
- }
- });
- }
-
- if (result === -1) {
- result = 0;
- }
-
- return result;
- };
-
- scope.user = this.userResourceService.getLoggedinUser();
-
- let tmpArray:Array<MenuItem> = [
- new MenuItem(this.$filter('translate')("TOP_MENU_HOME_BUTTON"), null, "dashboard", "goToState", null, null),
- new MenuItem(this.$filter('translate')("TOP_MENU_CATALOG_BUTTON"), null, "catalog", "goToState", null, null)
- ];
-
- // Only designer can perform onboarding
- if (scope.user && scope.user.role === 'DESIGNER') {
- tmpArray.push(new MenuItem(this.$filter('translate')("TOP_MENU_ON_BOARD_BUTTON"), null, "onboardVendor", "goToState", null, null));
- _.each(this.sdcConfig.hostedApplications, (hostedApp:IHostedApplication)=> {
- if (hostedApp.exists) {
- tmpArray.push(new MenuItem(hostedApp.navTitle, null, hostedApp.defaultState, "goToState", null, null));
- }
- });
- }
-
- scope.topLvlMenu = new MenuItemGroup(0, tmpArray, true);
- scope.topLvlMenu.selectedIndex = isNaN(scope.topLvlSelectedIndex) ? getTopLvlSelectedIndexByState() : scope.topLvlSelectedIndex;
-
- let generateMenu = () => {
- if (scope.menuModel && scope.menuModel[0] !== scope.topLvlMenu) {
- scope.menuModel.unshift(scope.topLvlMenu);
- }
- };
- scope.$watch('menuModel', generateMenu);
-
- generateMenu();
-
- /////scope functions////
-
- scope.goToState = (state:string, params:Array<any>):ng.IPromise<boolean> => {
- let deferred = this.$q.defer();
- this.$state.go(state, params && params.length > 0 ? [0] : undefined);
- deferred.resolve(true);
- return deferred.promise;
- };
-
- scope.menuItemClick = (itemGroup:MenuItemGroup, item:MenuItem) => {
-
- itemGroup.itemClick = false;
-
- let onSuccess = ():void => {
- itemGroup.selectedIndex = itemGroup.menuItems.indexOf(item);
- };
- let onFailed = ():void => {
- };
-
- if (item.callback) {
- (item.callback.apply(undefined, item.params)).then(onSuccess, onFailed);
- } else {
- scope[item.action](item.state, item.params).then(onSuccess, onFailed);
- }
- };
- };
-
- public static factory = ($filter:ng.IFilterService, $state:ng.ui.IStateService, $q:ng.IQService, userResourceService:IUserResourceClass, sdcConfig:IAppConfigurtaion)=> {
- return new TopNavDirective($filter, $state, $q, userResourceService, sdcConfig);
- };
-
-}
-
-TopNavDirective.factory.$inject = ['$filter', '$state', '$q', 'Sdc.Services.UserResourceService', 'sdcConfig'];