From 7363f3d875e08d5195cb5e8b7e4f9ac86ec99ef5 Mon Sep 17 00:00:00 2001 From: Idan Amit Date: Wed, 21 Mar 2018 12:04:57 +0200 Subject: Create Error page for offline plugin Created an error page to be displayed when a plugin is offline Change-Id: I7bff7d29896e5eae88eca79784854bcd1086ca50 Issue-ID: SDC-1082 Signed-off-by: Idan Amit --- catalog-ui/src/app/app.ts | 6 ++-- catalog-ui/src/app/modules/directive-module.ts | 11 +++++-- .../ui/plugin/plugin-frame.component.html | 3 +- .../components/ui/plugin/plugin-frame.component.ts | 6 ++++ .../components/ui/plugin/plugin-frame.module.ts | 2 ++ .../plugin-not-connected-module.ts | 18 ++++++++++ .../plugin-not-connected.component.html | 19 +++++++++++ .../plugin-not-connected.component.less | 38 ++++++++++++++++++++++ .../plugin-not-connected.component.ts | 15 +++++++++ .../app/view-models/plugins/plugins-tab-view.html | 3 +- .../src/app/view-models/plugins/plugins-tab.less | 8 ----- .../tabs/plugins/plugins-context-view.html | 3 +- .../workspace/tabs/plugins/plugins-context.less | 6 ---- catalog-ui/src/assets/languages/en_US.json | 8 +++-- 14 files changed, 119 insertions(+), 27 deletions(-) create mode 100644 catalog-ui/src/app/ng2/pages/plugin-not-connected/plugin-not-connected-module.ts create mode 100644 catalog-ui/src/app/ng2/pages/plugin-not-connected/plugin-not-connected.component.html create mode 100644 catalog-ui/src/app/ng2/pages/plugin-not-connected/plugin-not-connected.component.less create mode 100644 catalog-ui/src/app/ng2/pages/plugin-not-connected/plugin-not-connected.component.ts diff --git a/catalog-ui/src/app/app.ts b/catalog-ui/src/app/app.ts index 24665cccbc..48f15c057d 100644 --- a/catalog-ui/src/app/app.ts +++ b/catalog-ui/src/app/app.ts @@ -7,9 +7,9 @@ * 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. @@ -58,7 +58,6 @@ import {ComponentServiceNg2} from "./ng2/services/component-services/component.s import {ComponentMetadata} from "./models/component-metadata"; import {Categories} from "./models/categories"; import {IUserProperties} from "./models/user"; -import {PluginFrameComponent} from "./ng2/components/ui/plugin/plugin-frame.component"; let moduleName:string = 'sdcApp'; let viewModelsModuleName:string = 'Sdc.ViewModels'; @@ -145,7 +144,6 @@ _.each(hostedApplications, (hostedApp)=> { // ===================== Hosted applications section ==================== export const ng1appModule:ng.IModule = angular.module(moduleName, dependentModules); -angular.module('sdcApp').directive('pluginFrame', downgradeComponent( {component: PluginFrameComponent, inputs: ['plugin', 'queryParams'], outputs: ['onLoadingDone']} ) as angular.IDirectiveFactory); ng1appModule.config([ '$stateProvider', diff --git a/catalog-ui/src/app/modules/directive-module.ts b/catalog-ui/src/app/modules/directive-module.ts index 1babeefbdb..6285415056 100644 --- a/catalog-ui/src/app/modules/directive-module.ts +++ b/catalog-ui/src/app/modules/directive-module.ts @@ -7,9 +7,9 @@ * 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. @@ -183,6 +183,7 @@ import { SearchWithAutoCompleteComponent } from "../ng2/components/ui/search-wit import { PalettePopupPanelComponent } from "../ng2/components/ui/palette-popup-panel/palette-popup-panel.component"; import { ServicePathComponent } from '../ng2/components/logic/service-path/service-path.component'; import { ServicePathSelectorComponent } from '../ng2/components/logic/service-path-selector/service-path-selector.component'; +import {PluginFrameComponent} from "../ng2/components/ui/plugin/plugin-frame.component"; directiveModule.directive('menuListNg2', downgradeComponent({ component: MenuListNg2Component, @@ -240,3 +241,9 @@ directiveModule.directive('ng2ServicePathSelector', downgradeComponent({ inputs: ['drawPath', 'deletePaths', 'service', 'selectedPathId'], outputs: [] }) as angular.IDirectiveFactory); + +directiveModule.directive('pluginFrame', downgradeComponent( { + component: PluginFrameComponent, + inputs: ['plugin', 'queryParams'], + outputs: ['onLoadingDone'] +}) as angular.IDirectiveFactory); diff --git a/catalog-ui/src/app/ng2/components/ui/plugin/plugin-frame.component.html b/catalog-ui/src/app/ng2/components/ui/plugin/plugin-frame.component.html index fb90a1eb90..a72ed837a4 100644 --- a/catalog-ui/src/app/ng2/components/ui/plugin/plugin-frame.component.html +++ b/catalog-ui/src/app/ng2/components/ui/plugin/plugin-frame.component.html @@ -1,5 +1,6 @@
- + +
diff --git a/catalog-ui/src/app/ng2/components/ui/plugin/plugin-frame.component.ts b/catalog-ui/src/app/ng2/components/ui/plugin/plugin-frame.component.ts index fc0af53a44..2ba784727f 100644 --- a/catalog-ui/src/app/ng2/components/ui/plugin/plugin-frame.component.ts +++ b/catalog-ui/src/app/ng2/components/ui/plugin/plugin-frame.component.ts @@ -25,6 +25,12 @@ export class PluginFrameComponent implements OnInit { } ngOnInit(): void { + if (this.plugin.isOnline) { + this.initPlugin(); + } + } + + private initPlugin() { this.pluginUrl = this.plugin.pluginSourceUrl; this.isClosed = false; diff --git a/catalog-ui/src/app/ng2/components/ui/plugin/plugin-frame.module.ts b/catalog-ui/src/app/ng2/components/ui/plugin/plugin-frame.module.ts index 9eebd5c47f..fce9c76eb1 100644 --- a/catalog-ui/src/app/ng2/components/ui/plugin/plugin-frame.module.ts +++ b/catalog-ui/src/app/ng2/components/ui/plugin/plugin-frame.module.ts @@ -4,6 +4,7 @@ import {PluginFrameComponent} from "./plugin-frame.component"; import {LayoutModule} from "../../layout/layout.module"; import {GlobalPipesModule} from "../../../pipes/global-pipes.module"; import {UiElementsModule} from "../ui-elements.module"; +import {PluginNotConnectedModule} from "../../../pages/plugin-not-connected/plugin-not-connected-module"; @NgModule({ @@ -13,6 +14,7 @@ import {UiElementsModule} from "../ui-elements.module"; imports: [ CommonModule, LayoutModule, + PluginNotConnectedModule, GlobalPipesModule, UiElementsModule ], diff --git a/catalog-ui/src/app/ng2/pages/plugin-not-connected/plugin-not-connected-module.ts b/catalog-ui/src/app/ng2/pages/plugin-not-connected/plugin-not-connected-module.ts new file mode 100644 index 0000000000..5e92cd5e55 --- /dev/null +++ b/catalog-ui/src/app/ng2/pages/plugin-not-connected/plugin-not-connected-module.ts @@ -0,0 +1,18 @@ +import { NgModule } from "@angular/core"; +import {PluginNotConnectedComponent} from "./plugin-not-connected.component"; +import {TranslateModule} from "../../shared/translator/translate.module"; + +@NgModule({ + declarations: [ + PluginNotConnectedComponent + ], + imports: [TranslateModule], + exports: [PluginNotConnectedComponent], + entryComponents: [ + PluginNotConnectedComponent + ] +}) +export class PluginNotConnectedModule { + +} + diff --git a/catalog-ui/src/app/ng2/pages/plugin-not-connected/plugin-not-connected.component.html b/catalog-ui/src/app/ng2/pages/plugin-not-connected/plugin-not-connected.component.html new file mode 100644 index 0000000000..93fdcd57ac --- /dev/null +++ b/catalog-ui/src/app/ng2/pages/plugin-not-connected/plugin-not-connected.component.html @@ -0,0 +1,19 @@ +
+
+
+ + + + + + + + +
+
+ +
+ +
+
+
diff --git a/catalog-ui/src/app/ng2/pages/plugin-not-connected/plugin-not-connected.component.less b/catalog-ui/src/app/ng2/pages/plugin-not-connected/plugin-not-connected.component.less new file mode 100644 index 0000000000..2893d3f477 --- /dev/null +++ b/catalog-ui/src/app/ng2/pages/plugin-not-connected/plugin-not-connected.component.less @@ -0,0 +1,38 @@ +@import '../../../../assets/styles/mixins'; +@import '../../../../assets/styles/variables'; + +.plugin-not-connected { + + position: absolute; + top: 0; + left: 0; + height: 100%; + width: 100%; + display: flex; + justify-content: center; + align-items: center; + + .plugin-error-message { + line-height: 2em; + } + + .icon-wrapper { + text-align: center; + margin-right: 10px; + line-height: 3em; + } + + .plugin-message-text { + text-align: center; + color: #323943; + font-family: @font-opensans-medium; + } + + .plugin-message-main-text { + font-size: 22px; + } + + .plugin-message-sub-text { + font-size: 14px; + } +} diff --git a/catalog-ui/src/app/ng2/pages/plugin-not-connected/plugin-not-connected.component.ts b/catalog-ui/src/app/ng2/pages/plugin-not-connected/plugin-not-connected.component.ts new file mode 100644 index 0000000000..6cc2b39b89 --- /dev/null +++ b/catalog-ui/src/app/ng2/pages/plugin-not-connected/plugin-not-connected.component.ts @@ -0,0 +1,15 @@ +import {Component, Input} from "@angular/core"; + +@Component({ + selector: 'plugin-not-connected', + templateUrl: './plugin-not-connected.component.html', + styleUrls:['plugin-not-connected.component.less'] +}) +export class PluginNotConnectedComponent { + + @Input() pluginName: string; + + constructor() { + + } +} diff --git a/catalog-ui/src/app/view-models/plugins/plugins-tab-view.html b/catalog-ui/src/app/view-models/plugins/plugins-tab-view.html index 6ee4855a4c..843aaa14fa 100644 --- a/catalog-ui/src/app/view-models/plugins/plugins-tab-view.html +++ b/catalog-ui/src/app/view-models/plugins/plugins-tab-view.html @@ -1,6 +1,5 @@
- -
The plugin {{plugin.pluginId}} is offline. Please try again later
+
diff --git a/catalog-ui/src/app/view-models/plugins/plugins-tab.less b/catalog-ui/src/app/view-models/plugins/plugins-tab.less index f821041436..3cb5d1b421 100644 --- a/catalog-ui/src/app/view-models/plugins/plugins-tab.less +++ b/catalog-ui/src/app/view-models/plugins/plugins-tab.less @@ -1,10 +1,2 @@ .plugins-tab-container { - - text-align: center; - - .offline-plugin-message { - top: 50px; - position: relative; - display: inline-block; - } } diff --git a/catalog-ui/src/app/view-models/workspace/tabs/plugins/plugins-context-view.html b/catalog-ui/src/app/view-models/workspace/tabs/plugins/plugins-context-view.html index 6c34749a28..d70717a3ed 100644 --- a/catalog-ui/src/app/view-models/workspace/tabs/plugins/plugins-context-view.html +++ b/catalog-ui/src/app/view-models/workspace/tabs/plugins/plugins-context-view.html @@ -1,5 +1,4 @@
- -
The plugin {{plugin.pluginId}} is offline. Please try again later
+
diff --git a/catalog-ui/src/app/view-models/workspace/tabs/plugins/plugins-context.less b/catalog-ui/src/app/view-models/workspace/tabs/plugins/plugins-context.less index dd0b751423..c913af1931 100644 --- a/catalog-ui/src/app/view-models/workspace/tabs/plugins/plugins-context.less +++ b/catalog-ui/src/app/view-models/workspace/tabs/plugins/plugins-context.less @@ -1,8 +1,2 @@ .workspace-plugins { - - text-align: center; - - .offline-plugin-message { - display: inline-block; - } } diff --git a/catalog-ui/src/assets/languages/en_US.json b/catalog-ui/src/assets/languages/en_US.json index 70018afab6..042396798f 100644 --- a/catalog-ui/src/assets/languages/en_US.json +++ b/catalog-ui/src/assets/languages/en_US.json @@ -42,7 +42,6 @@ "GENERAL_LABEL_SYSTEM_NAME": "System Name:", "GENERAL_LABEL_SOURCE_SERVICE_NAME": "Source Service Name:", "GENERAL_LABEL_RESOURCE_CUSTOMIZATION_UUID": "Resource Customization UUID:", - "=========== GENERAL_TAB ===========": "", "GENERAL_TAB_LABEL_RESOURCE_MODEL_NUMBER":"Vendor Model Number", @@ -445,6 +444,11 @@ "=========== SERVICE PATH SELECTOR ===========": "", "SERVICE_PATH_SELECTOR_HIDE_ALL_VALUE" : "⚊ Hide all ⚊", - "SERVICE_PATH_SELECTOR_SHOW_ALL_VALUE" : "⚊ Show all ⚊" + "SERVICE_PATH_SELECTOR_SHOW_ALL_VALUE" : "⚊ Show all ⚊", + + "=========== PLUGIN NOT CONNECTED ===========": "", + "PLUGIN_NOT_CONNECTED_ERROR_MAIN": "The \"{{pluginName}}\" plugin is currently unavailable.", + "PLUGIN_NOT_CONNECTED_ERROR_SUB": "Please try again later." + } -- cgit 1.2.3-korg