From 51d50f0ef642e0f996a1c8b8d2ef4838bdfec892 Mon Sep 17 00:00:00 2001 From: Tal Gitelman Date: Sun, 10 Dec 2017 18:55:03 +0200 Subject: Final commit to master merge from Change-Id: Ib464f9a8828437c86fe6def8af238aaf83473507 Issue-ID: SDC-714 Signed-off-by: Tal Gitelman --- .../src/app/ng2/shared/tabs/tab/tab.component.ts | 38 ---------- .../src/app/ng2/shared/tabs/tabs.component.html | 9 --- .../src/app/ng2/shared/tabs/tabs.component.less | 84 ---------------------- .../src/app/ng2/shared/tabs/tabs.component.ts | 78 -------------------- catalog-ui/src/app/ng2/shared/tabs/tabs.module.ts | 55 -------------- 5 files changed, 264 deletions(-) delete mode 100644 catalog-ui/src/app/ng2/shared/tabs/tab/tab.component.ts delete mode 100644 catalog-ui/src/app/ng2/shared/tabs/tabs.component.html delete mode 100644 catalog-ui/src/app/ng2/shared/tabs/tabs.component.less delete mode 100644 catalog-ui/src/app/ng2/shared/tabs/tabs.component.ts delete mode 100644 catalog-ui/src/app/ng2/shared/tabs/tabs.module.ts (limited to 'catalog-ui/src/app/ng2/shared/tabs') diff --git a/catalog-ui/src/app/ng2/shared/tabs/tab/tab.component.ts b/catalog-ui/src/app/ng2/shared/tabs/tab/tab.component.ts deleted file mode 100644 index bad7b80a51..0000000000 --- a/catalog-ui/src/app/ng2/shared/tabs/tab/tab.component.ts +++ /dev/null @@ -1,38 +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========================================================= - */ - -import { Component, Input } from '@angular/core'; -import { ViewEncapsulation } from '@angular/core'; - -@Component({ - selector: 'tab', - template: ` -
- -
- `, - encapsulation: ViewEncapsulation.None -}) -export class Tab { - @Input('tabTitle') title: string; - @Input() active:boolean = false; - @Input() indication?: number; - -} diff --git a/catalog-ui/src/app/ng2/shared/tabs/tabs.component.html b/catalog-ui/src/app/ng2/shared/tabs/tabs.component.html deleted file mode 100644 index 3e263a3862..0000000000 --- a/catalog-ui/src/app/ng2/shared/tabs/tabs.component.html +++ /dev/null @@ -1,9 +0,0 @@ -
-
- {{tab.title}} -
{{tab.indication}}
-
-
-
- -
\ No newline at end of file diff --git a/catalog-ui/src/app/ng2/shared/tabs/tabs.component.less b/catalog-ui/src/app/ng2/shared/tabs/tabs.component.less deleted file mode 100644 index 6f9e57aaf2..0000000000 --- a/catalog-ui/src/app/ng2/shared/tabs/tabs.component.less +++ /dev/null @@ -1,84 +0,0 @@ -@import '../../../../assets/styles/variables'; - -tab { - height: 100%; -} - -.tabs { - display:flex; - flex: 0 0 auto; - flex-direction:row; -} - -.tab { - flex: 1 0 auto; - cursor: pointer; - padding: .5em; -} - -.tab-content-container { - flex: 1; - width:100%; - overflow-y:hidden; -} - -.tab-content { - height:100%; -} - -/*Tab styles*/ -.tabs{ - &.round-tabs .tab{ - background-color: #f8f8f8; - color: #959595; - border: solid 1px #d2d2d2; - border-bottom:none; - border-left:none; - position:relative; - - &:first-child { - border-left:solid 1px #d2d2d2; - } - - &.active { - background-color:#009fdb; - color:#e9e9e9; - border-color:#009fdb; - } - - .tab-indication { - position: absolute; - top: -10px; - background-color: #009fdb; - right: 10px; - padding: 2px 0; - border-radius: 15px; - border: solid 1px #d2d2d2; - color:white; - width: 25px; - height: 25px; - text-align: center; - - } - } - - &.simple-tabs .tab { - font-size: 12px; - color: @main_color_n; - - &:after { - display:block; - content: ''; - border-bottom: 2px solid @main_color_a; - transform: scaleX(0); - transition: transform 200ms ease-in-out; - } - - &.active { - color: @main_color_a; - &:after { - transform: scaleX(1.2); - } - } - } -} diff --git a/catalog-ui/src/app/ng2/shared/tabs/tabs.component.ts b/catalog-ui/src/app/ng2/shared/tabs/tabs.component.ts deleted file mode 100644 index 21d2bbad43..0000000000 --- a/catalog-ui/src/app/ng2/shared/tabs/tabs.component.ts +++ /dev/null @@ -1,78 +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========================================================= - */ - -import { Component, ContentChildren, QueryList, AfterContentInit, Input, Output, EventEmitter } from '@angular/core'; -import { Tab } from './tab/tab.component'; -import { ViewEncapsulation } from '@angular/core'; -import { trigger, state, style, transition, animate, keyframes } from '@angular/core'; - -@Component({ - selector: 'tabs', - templateUrl: './tabs.component.html', - styleUrls: ['./tabs.component.less'], - encapsulation: ViewEncapsulation.None, - animations: [ - trigger('indicatorAnimation', [ - transition(':enter', [style({ transform: 'translateY(-50%)', opacity: 0 }), animate('250ms', style({ transform: 'translateY(0)', opacity: 1 })) ]), - transition(':leave', [style({ opacity: 1 }), animate('500ms', style({ opacity: 0 })) ]) - ]) - ] -}) -export class Tabs implements AfterContentInit { - - @Input() tabStyle: string; - @Input() hideIndicationOnTabChange?: boolean = false; - @ContentChildren(Tab) tabs: QueryList; - @Output() tabChanged: EventEmitter = new EventEmitter(); - - - ngAfterContentInit() { - //after contentChildren are set, determine active tab. If no active tab set, activate the first one - let activeTabs = this.tabs.filter((tab) => tab.active); - - if (activeTabs.length === 0) { - this.selectTab(this.tabs.first); - } - } - - selectTab(tab: Tab) { - //activate the tab the user clicked. - this.tabs.toArray().forEach(tab => { - tab.active = false; - if (this.hideIndicationOnTabChange && tab.indication) { - tab.indication = null; - } - }); - tab.active = true; - this.tabChanged.emit(tab); - } - - triggerTabChange(tabTitle) { - this.tabs.toArray().forEach(tab => { - tab.active = (tab.title == tabTitle) ? true : false; - }); - } - - setTabIndication(tabTitle:string, indication?:number) { - let selectedTab: Tab = this.tabs.toArray().find(tab => tab.title == tabTitle); - selectedTab.indication = indication || null; - } - -} diff --git a/catalog-ui/src/app/ng2/shared/tabs/tabs.module.ts b/catalog-ui/src/app/ng2/shared/tabs/tabs.module.ts deleted file mode 100644 index 6bf19d4099..0000000000 --- a/catalog-ui/src/app/ng2/shared/tabs/tabs.module.ts +++ /dev/null @@ -1,55 +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========================================================= - */ - -import { Component, NgModule } from '@angular/core' -import { BrowserModule } from '@angular/platform-browser' - -import { Tabs } from './tabs.component'; -import { Tab } from './tab/tab.component'; - - -@NgModule({ - imports: [BrowserModule], - declarations: [Tabs, Tab], - bootstrap: [], - exports: [Tabs, Tab] -}) -export class TabModule { } - -/** README: **/ - -/** USAGE Example: - *In page.module.ts: import TabModule - *In HTML: - * - * Content of tab 1 - * Content of tab 2 - * ... - * - */ - -/**STYLING: (ViewEncapsulation is set to None to allow styles to be overridden or customized) - * Existing options: - * tabStyle="round-tabs" will provide generic rounded tab look - * - * To create or override styles: - * Parent div has class ".tabs". Each tab has class ".tab". Active tab has class ".active". - * Use /deep/ or >>> prefix to override styles via other components stylesheets - */ -- cgit 1.2.3-korg