From 451a3400b76511393c62a444f588a4ed15f4a549 Mon Sep 17 00:00:00 2001 From: Michael Lando Date: Sun, 19 Feb 2017 10:28:42 +0200 Subject: Initial OpenECOMP SDC commit Change-Id: I0924d5a6ae9cdc161ae17c68d3689a30d10f407b Signed-off-by: Michael Lando --- .../sdc-single-tab/sdc-single-tab-directive.ts | 67 +++++++++++++++++++++ .../sdc-tabs/sdc-single-tab/sdc-single-tab.less | 1 + .../sdc-tabs/sdc-tabs-directive-view.html | 17 ++++++ .../directives/sdc-tabs/sdc-tabs-directive.ts | 69 ++++++++++++++++++++++ .../app/scripts/directives/sdc-tabs/sdc-tabs.less | 68 +++++++++++++++++++++ 5 files changed, 222 insertions(+) create mode 100644 catalog-ui/app/scripts/directives/sdc-tabs/sdc-single-tab/sdc-single-tab-directive.ts create mode 100644 catalog-ui/app/scripts/directives/sdc-tabs/sdc-single-tab/sdc-single-tab.less create mode 100644 catalog-ui/app/scripts/directives/sdc-tabs/sdc-tabs-directive-view.html create mode 100644 catalog-ui/app/scripts/directives/sdc-tabs/sdc-tabs-directive.ts create mode 100644 catalog-ui/app/scripts/directives/sdc-tabs/sdc-tabs.less (limited to 'catalog-ui/app/scripts/directives/sdc-tabs') diff --git a/catalog-ui/app/scripts/directives/sdc-tabs/sdc-single-tab/sdc-single-tab-directive.ts b/catalog-ui/app/scripts/directives/sdc-tabs/sdc-single-tab/sdc-single-tab-directive.ts new file mode 100644 index 0000000000..26390a7501 --- /dev/null +++ b/catalog-ui/app/scripts/directives/sdc-tabs/sdc-single-tab/sdc-single-tab-directive.ts @@ -0,0 +1,67 @@ +/*- + * ============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========================================================= + */ +/// +module Sdc.Directives { + 'use strict'; + + export class SdcSingleTabDirective implements ng.IDirective { + + constructor(private $compile:ng.ICompileService, private $parse:ng.IParseService) { + } + restrict = 'E'; + + link = (scope, elem:any, attrs:any, ctrl:any) => { + if(!elem.attr('inner-sdc-single-tab')) { + let name = this.$parse(elem.attr('ctrl'))(scope); + elem = elem.removeAttr('ctrl'); + elem.attr('inner-sdc-single-tab', name); + this.$compile(elem)(scope); + } + }; + + public static factory = ($compile:ng.ICompileService, $parse:ng.IParseService)=> { + return new SdcSingleTabDirective($compile, $parse); + }; + } + + export class InnerSdcSingleTabDirective implements ng.IDirective { + + constructor(private $templateCache:ng.ITemplateCacheService) { + } + + scope = { + singleTab: "=", + isViewOnly: "=" + }; + + replace = true; + restrict = 'A'; + controller = '@'; + template = '
'; + + public static factory = ($templateCache:ng.ITemplateCacheService)=> { + return new InnerSdcSingleTabDirective($templateCache); + }; + } + + SdcSingleTabDirective.factory.$inject = ['$compile', '$parse']; + InnerSdcSingleTabDirective.factory.$inject = ['$templateCache']; + +} diff --git a/catalog-ui/app/scripts/directives/sdc-tabs/sdc-single-tab/sdc-single-tab.less b/catalog-ui/app/scripts/directives/sdc-tabs/sdc-single-tab/sdc-single-tab.less new file mode 100644 index 0000000000..8b13789179 --- /dev/null +++ b/catalog-ui/app/scripts/directives/sdc-tabs/sdc-single-tab/sdc-single-tab.less @@ -0,0 +1 @@ + diff --git a/catalog-ui/app/scripts/directives/sdc-tabs/sdc-tabs-directive-view.html b/catalog-ui/app/scripts/directives/sdc-tabs/sdc-tabs-directive-view.html new file mode 100644 index 0000000000..d51d221922 --- /dev/null +++ b/catalog-ui/app/scripts/directives/sdc-tabs/sdc-tabs-directive-view.html @@ -0,0 +1,17 @@ +
+
+
+ +
+
+
+
+
+
+
+
+ +
+
diff --git a/catalog-ui/app/scripts/directives/sdc-tabs/sdc-tabs-directive.ts b/catalog-ui/app/scripts/directives/sdc-tabs/sdc-tabs-directive.ts new file mode 100644 index 0000000000..91d1744ae5 --- /dev/null +++ b/catalog-ui/app/scripts/directives/sdc-tabs/sdc-tabs-directive.ts @@ -0,0 +1,69 @@ +/*- + * ============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========================================================= + */ +/** + * Created by obarda on 7/28/2016. + */ +/// +module Sdc.Directives { + 'use strict'; + + export interface ISdcTabsDirectiveScope extends ng.IScope { + tabs:Array; + selectedTab: Models.Tab; + isActive: boolean; + onTabSelected(selectedTab: Models.Tab); + } + + export class SdcTabsDirective implements ng.IDirective { + + constructor(private $templateCache:ng.ITemplateCacheService) { + } + + scope = { + tabs: "=", + selectedTab: "=?", + isViewOnly: "=" + }; + + replace = true; + restrict = 'E'; + template = ():string => { + return this.$templateCache.get('/app/scripts/directives/sdc-tabs/sdc-tabs-directive-view.html'); + }; + + link = (scope:ISdcTabsDirectiveScope) => { + scope.isActive = true; + + if(!scope.selectedTab){ + scope.selectedTab = scope.tabs[0]; + } + + scope.onTabSelected = (selectedTab: Models.Tab) => { + scope.selectedTab = selectedTab; + } + }; + + public static factory = ($templateCache:ng.ITemplateCacheService)=> { + return new SdcTabsDirective($templateCache); + }; + } + + SdcTabsDirective.factory.$inject = ['$templateCache']; +} diff --git a/catalog-ui/app/scripts/directives/sdc-tabs/sdc-tabs.less b/catalog-ui/app/scripts/directives/sdc-tabs/sdc-tabs.less new file mode 100644 index 0000000000..ad390010ed --- /dev/null +++ b/catalog-ui/app/scripts/directives/sdc-tabs/sdc-tabs.less @@ -0,0 +1,68 @@ +.sdc-tabs-body { + height: 100%; + width: 330px; + position: absolute; + .sdc-tabs { + display: inline-block; + width: 40px; + vertical-align: top; + position: relative; + z-index: 99; + right: 332px; + .sdc-tab-arrow { + cursor: pointer; + width: 40px; + height: 20px; + background-color: @tlv_color_u; + box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.17); + text-align: center; + padding: 1px 4px 0px 0px; + + &:hover { + background-color: @main_color_o; + } + + } + .sdc-tab { + cursor: pointer; + width: 40px; + height: 43px; + background-color: @tlv_color_u; + box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.17); + text-align: center; + + .sdc-tab-icon { + margin-top: 12px; + } + } + .selected { + background-color: @tlv_color_t; + } + + .last-tab { + border-bottom-left-radius: 12px; + } + } + + .not-active { + // position: absolute; + right: 41px; + } + + .sdc-single-tab-content { + padding: 15px 0px 0px 0px; + width: 290px; + background-color: @tlv_color_t; + height: 100%; + display: inline-block; + bottom: 0; + top: 0; + position: absolute; + box-shadow: 0.3px 1px 3px rgba(24, 24, 25, 0.42); + right: 331px; + .sdc-single-tab-content-body { + height: 100%; + display: flex; + } + } +} -- cgit 1.2.3-korg