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 --- .../directives/info-tooltip/info-tooltip.html | 10 ++++ .../directives/info-tooltip/info-tooltip.less | 39 ++++++++++++++ .../directives/info-tooltip/info-tooltip.ts | 60 ++++++++++++++++++++++ 3 files changed, 109 insertions(+) create mode 100644 catalog-ui/app/scripts/directives/info-tooltip/info-tooltip.html create mode 100644 catalog-ui/app/scripts/directives/info-tooltip/info-tooltip.less create mode 100644 catalog-ui/app/scripts/directives/info-tooltip/info-tooltip.ts (limited to 'catalog-ui/app/scripts/directives/info-tooltip') diff --git a/catalog-ui/app/scripts/directives/info-tooltip/info-tooltip.html b/catalog-ui/app/scripts/directives/info-tooltip/info-tooltip.html new file mode 100644 index 0000000000..5c2bdcf5f1 --- /dev/null +++ b/catalog-ui/app/scripts/directives/info-tooltip/info-tooltip.html @@ -0,0 +1,10 @@ +
+ +
+
+
+ +

+
+
+
diff --git a/catalog-ui/app/scripts/directives/info-tooltip/info-tooltip.less b/catalog-ui/app/scripts/directives/info-tooltip/info-tooltip.less new file mode 100644 index 0000000000..8811af16a4 --- /dev/null +++ b/catalog-ui/app/scripts/directives/info-tooltip/info-tooltip.less @@ -0,0 +1,39 @@ +.info-tooltip { + position: fixed; + z-index: 1070; + display: block; + width: 250px; + .info-tooltip-arrow { + width: 0; + height: 0; + border-style: solid; + border-width: 0 5px 5px 5px; + border-color: transparent transparent @main_color_a transparent; + position: relative; + left: 2px; + } + .info-tooltip-content { + box-shadow: 0px 3px 6px 0px rgba(0, 0, 0, 0.5); + border: 1px solid @main_color_o; + border-radius: 3px; + border-top: 3px solid @main_color_a; + position: relative; + background-color: white; + &.right{ + left: -13px; + } + &.left{ + left: -223px; + } + .close-tooltip{ + float: right; + margin: 5px; + } + + .info-tooltip-message{ + margin: 15px; + word-break: normal; + font-size: 14px; + } + } +} diff --git a/catalog-ui/app/scripts/directives/info-tooltip/info-tooltip.ts b/catalog-ui/app/scripts/directives/info-tooltip/info-tooltip.ts new file mode 100644 index 0000000000..cd81b14ce8 --- /dev/null +++ b/catalog-ui/app/scripts/directives/info-tooltip/info-tooltip.ts @@ -0,0 +1,60 @@ +/*- + * ============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 rcohen on 9/25/2016. + */ +/// +module Sdc.Directives { + 'use strict'; + + export interface IInfoTooltipScope extends ng.IScope { + infoMessageTranslate:string; + direction:string; + } + + + export class InfoTooltipDirective implements ng.IDirective { + + constructor(private $templateCache:ng.ITemplateCacheService) { + } + + scope = { + infoMessageTranslate:'@', + direction:'@'//get 'right' or 'left', the default is 'right' + }; + + restrict = 'E'; + replace = true; + template = ():string => { + return this.$templateCache.get('/app/scripts/directives/info-tooltip/info-tooltip.html'); + }; + + link = (scope:IInfoTooltipScope, element:any, $attr:any) => { + scope.direction = scope.direction || 'right'; + }; + + public static factory = ($templateCache:ng.ITemplateCacheService)=> { + return new InfoTooltipDirective($templateCache); + }; + + } + + InfoTooltipDirective.factory.$inject = ['$templateCache']; +} -- cgit 1.2.3-korg