diff options
Diffstat (limited to 'catalog-ui/app/scripts/directives/layout')
6 files changed, 0 insertions, 564 deletions
diff --git a/catalog-ui/app/scripts/directives/layout/top-nav/top-nav.html b/catalog-ui/app/scripts/directives/layout/top-nav/top-nav.html deleted file mode 100644 index 40b1e86d90..0000000000 --- a/catalog-ui/app/scripts/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">SDC</a> <!-- data-ui-sref="dashboard" --> - <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/app/scripts/directives/layout/top-nav/top-nav.less b/catalog-ui/app/scripts/directives/layout/top-nav/top-nav.less deleted file mode 100644 index 65021bdc4d..0000000000 --- a/catalog-ui/app/scripts/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-omnes-medium; - color: @main_color_m; - font-size: 18px; - 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/app/scripts/directives/layout/top-nav/top-nav.ts b/catalog-ui/app/scripts/directives/layout/top-nav/top-nav.ts deleted file mode 100644 index 356e43b7f7..0000000000 --- a/catalog-ui/app/scripts/directives/layout/top-nav/top-nav.ts +++ /dev/null @@ -1,155 +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 interface ITopNavScope extends ng.IScope { - topLvlSelectedIndex: number; - hideSearch: boolean; - searchBind: any; - menuModel: Array<Utils.MenuItemGroup>; - - topLvlMenu: Utils.MenuItemGroup; - goToState(state:string, params:Array<any>):ng.IPromise<boolean>; - menuItemClick: Function; - user: Models.IUserProperties; - version:string; - } - - - export class TopNavDirective implements ng.IDirective { - - constructor(private $templateCache:ng.ITemplateCacheService, - private $filter:ng.IFilterService, - private $state:ng.ui.IStateService, - private $q: ng.IQService, - private userResourceService: Sdc.Services.IUserResourceClass - ) { - } - - public replace = true; - public restrict = 'E'; - public transclude = false; - - - scope = { - topLvlSelectedIndex: '@?', - hideSearch: '=', - searchBind: '=', - version: '@', - notificationIconCallback: '=', - menuModel: '=?', - }; - - template = ():string => { - return this.$templateCache.get('/app/scripts/directives/layout/top-nav/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:Utils.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:Utils.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<Utils.MenuItem> = [ - new Utils.MenuItem(this.$filter('translate')("TOP_MENU_HOME_BUTTON"), null, "dashboard", "goToState", null, null), - new Utils.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 Utils.MenuItem(this.$filter('translate')("TOP_MENU_ON_BOARD_BUTTON"), null, "onboardVendor", "goToState", null, null)); - } - - scope.topLvlMenu = new Utils.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:Utils.MenuItemGroup, item:Utils.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 = ($templateCache:ng.ITemplateCacheService, $filter:ng.IFilterService, $state:ng.ui.IStateService, $q: ng.IQService, userResourceService: Sdc.Services.IUserResourceClass)=> { - return new TopNavDirective($templateCache, $filter, $state,$q, userResourceService); - }; - - } - - TopNavDirective.factory.$inject = ['$templateCache', '$filter', '$state','$q', 'Sdc.Services.UserResourceService']; -} diff --git a/catalog-ui/app/scripts/directives/layout/top-progress/top-progress.html b/catalog-ui/app/scripts/directives/layout/top-progress/top-progress.html deleted file mode 100644 index ab2c8e364e..0000000000 --- a/catalog-ui/app/scripts/directives/layout/top-progress/top-progress.html +++ /dev/null @@ -1,22 +0,0 @@ -<div class="top-progress"> - - <!--======================= Top progress var =======================--> - <div data-ng-if="progressValue>0 && progressValue<100"> - <span class="sdc-progress-title">{{progressMessage}}<span class="progress-percentage">{{progressValue}} %</span></span> - <div class="sdc-progress"> - <div class="progress-bar progress-bar-striped active" role="progressbar" aria-valuenow="{{progressValue}}" aria-valuemin="0" aria-valuemax="100" data-ng-style="{width: progressValue+'%'}"></div> - </div> - </div> - - <div class="sdc-progress-success-wrapper" data-ng-if="progressValue===100"> - <span class="sdc-progress-success"></span> - <span class="sdc-progress-success-title">{{progressMessage}}</span> - </div> - - <div class="sdc-progress-error-wrapper" data-ng-if="progressValue===-1"> - <span class="sdc-progress-error"></span> - <span class="sdc-progress-error-title">{{progressMessage}}</span> - </div> - <!--======================= Top progress var =======================--> - -</div> diff --git a/catalog-ui/app/scripts/directives/layout/top-progress/top-progress.less b/catalog-ui/app/scripts/directives/layout/top-progress/top-progress.less deleted file mode 100644 index acce826f80..0000000000 --- a/catalog-ui/app/scripts/directives/layout/top-progress/top-progress.less +++ /dev/null @@ -1,58 +0,0 @@ -.top-progress { - text-align: left; - - .sdc-progress-title { - .n_12_r; - - .progress-percentage { - float: right; - } - } - - .sdc-progress { - position: relative; - display: block; - height: 6px; - background-color: @main_color_o; - border-radius: 3px; - box-shadow: inset 0 1px 2px rgba(0,0,0,.1); - - .progress-bar { - border-radius: 3px; - background-color: @main_color_a; - } - - } - - .sdc-progress-success-wrapper { - display: flex; - align-items: flex-end; - - .sdc-progress-success-title { - .d_12_r; - margin-left: 10px; - } - - .sdc-progress-success { - .sprite-new; - .success-circle; - } - } - - .sdc-progress-error-wrapper { - display: flex; - align-items: flex-end; - - .sdc-progress-error-title { - .q_12_r; - margin-left: 10px; - } - - .sdc-progress-error { - .sprite-new; - .error-icon; - } - - } - -} diff --git a/catalog-ui/app/scripts/directives/layout/top-progress/top-progress.ts b/catalog-ui/app/scripts/directives/layout/top-progress/top-progress.ts deleted file mode 100644 index 8e8a289281..0000000000 --- a/catalog-ui/app/scripts/directives/layout/top-progress/top-progress.ts +++ /dev/null @@ -1,57 +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 interface ITopProgressScope extends ng.IScope { - progressValue:number; - progressMessage:string; - } - - export class TopProgressDirective implements ng.IDirective { - - constructor(private $templateCache:ng.ITemplateCacheService) {} - - public replace = true; - public restrict = 'E'; - public transclude = false; - - scope = { - progressValue: '=', - progressMessage: '=' - }; - - template = ():string => { - return this.$templateCache.get('/app/scripts/directives/layout/top-progress/top-progress.html'); - }; - - public link = (scope:ITopProgressScope, $elem:ng.IAugmentedJQuery, $attrs:angular.IAttributes) => { - - }; - - public static factory = ($templateCache:ng.ITemplateCacheService)=> { - return new TopProgressDirective($templateCache); - }; - - } - - TopProgressDirective.factory.$inject = ['$templateCache']; -} |