From b706e36b49db20355296a20b04c15e9e11dcdebd Mon Sep 17 00:00:00 2001 From: peter Date: Wed, 14 Aug 2019 00:27:43 +0200 Subject: [PATCH] More useful prod & dev modes in dashboard --- .gitignore | 3 +- package-lock.json | 21 +++ package.json | 3 + src/frontend/dashboard/package.json | 2 +- .../apiclient-consumptions.component.ts | 36 ++++- .../apiclient-dev.component.ts | 7 +- .../apiclient-settings-form.component.ts | 19 ++- .../apiclient-subscriptions.component.ts | 34 ++++- .../dashboard/src/app/ApiClient/module.ts | 41 ++++++ .../debug.component.ts} | 4 +- .../dashboard/src/app/PluginManager/module.ts | 45 ++++++ .../app/PluginManager/plugins.component.ts | 116 +++++++++++++++ .../dashboard/src/app/app-routing.module.ts | 10 +- .../dashboard/src/app/app.component.html | 10 +- .../dashboard/src/app/app.component.ts | 24 +++- src/frontend/dashboard/src/app/app.module.ts | 54 ++++--- .../main.component.html | 0 .../main.component.scss | 0 .../main.component.spec.ts | 0 .../{main => content-area}/main.component.ts | 2 +- .../apiclient-dev/apiclient-dev.component.ts | 26 ---- .../apiclient-settings-form.component.ts | 135 ------------------ .../dynamic-loader.component.html | 3 +- .../dynamic-loader.component.ts | 59 ++++++-- .../app/header-bar/header-bar.component.html | 7 - .../pluginmanager-dev.component.html | 1 - .../src/app/sidebar-entry-service.service.ts | 20 +++ .../src/app/sidebar/sidebar.component.html | 5 +- .../src/app/sidebar/sidebar.component.ts | 19 +-- .../src/app/subnav/subnav.component.html | 7 + .../subnav.component.scss} | 0 .../subnav.component.spec.ts} | 12 +- .../src/app/subnav/subnav.component.ts | 15 ++ src/frontend/dashboard/tsconfig.app.json | 1 + src/frontend/widget/rollup.config.js | 3 - 35 files changed, 471 insertions(+), 273 deletions(-) rename src/frontend/dashboard/src/app/{apiclient-dev => ApiClient}/apiclient-consumptions.component.ts (73%) rename src/frontend/dashboard/src/app/{apiclient-dev => ApiClient}/apiclient-dev.component.ts (83%) rename src/frontend/dashboard/src/app/{apiclient-dev => ApiClient}/apiclient-settings-form.component.ts (93%) rename src/frontend/dashboard/src/app/{apiclient-dev => ApiClient}/apiclient-subscriptions.component.ts (73%) create mode 100644 src/frontend/dashboard/src/app/ApiClient/module.ts rename src/frontend/dashboard/src/app/{pluginmanager-dev/pluginmanager-dev.component.ts => PluginManager/debug.component.ts} (91%) create mode 100644 src/frontend/dashboard/src/app/PluginManager/module.ts create mode 100644 src/frontend/dashboard/src/app/PluginManager/plugins.component.ts rename src/frontend/dashboard/src/app/{main => content-area}/main.component.html (100%) rename src/frontend/dashboard/src/app/{main => content-area}/main.component.scss (100%) rename src/frontend/dashboard/src/app/{main => content-area}/main.component.spec.ts (100%) rename src/frontend/dashboard/src/app/{main => content-area}/main.component.ts (92%) delete mode 100644 src/frontend/dashboard/src/app/dynamic-loader/apiclient-dev/apiclient-dev.component.ts delete mode 100644 src/frontend/dashboard/src/app/dynamic-loader/apiclient-dev/apiclient-settings-form.component.ts delete mode 100644 src/frontend/dashboard/src/app/pluginmanager-dev/pluginmanager-dev.component.html create mode 100644 src/frontend/dashboard/src/app/sidebar-entry-service.service.ts create mode 100644 src/frontend/dashboard/src/app/subnav/subnav.component.html rename src/frontend/dashboard/src/app/{pluginmanager-dev/pluginmanager-dev.component.scss => subnav/subnav.component.scss} (100%) rename src/frontend/dashboard/src/app/{pluginmanager-dev/pluginmanager-dev.component.spec.ts => subnav/subnav.component.spec.ts} (51%) create mode 100644 src/frontend/dashboard/src/app/subnav/subnav.component.ts diff --git a/.gitignore b/.gitignore index 77a2d16..5bc53a1 100644 --- a/.gitignore +++ b/.gitignore @@ -12,4 +12,5 @@ conf *.js *.ts -!src/**/* \ No newline at end of file +!src/**/* +node_modules diff --git a/package-lock.json b/package-lock.json index 7c03032..2cacbba 100644 --- a/package-lock.json +++ b/package-lock.json @@ -12,6 +12,14 @@ "tslib": "^1.9.0" } }, + "@angular/compiler": { + "version": "8.2.1", + "resolved": "https://registry.npmjs.org/@angular/compiler/-/compiler-8.2.1.tgz", + "integrity": "sha512-kOGNh0K4k7vEIMLlEyG1A+UxPOIMp2b3IT0vBq5isRjXxGzEnahyBYtXwGI7G6ox+OoNKy1OZOPaK473fcO8zg==", + "requires": { + "tslib": "^1.9.0" + } + }, "@angular/core": { "version": "8.2.1", "resolved": "https://registry.npmjs.org/@angular/core/-/core-8.2.1.tgz", @@ -36,6 +44,14 @@ "tslib": "^1.9.0" } }, + "@angular/platform-browser-dynamic": { + "version": "8.2.1", + "resolved": "https://registry.npmjs.org/@angular/platform-browser-dynamic/-/platform-browser-dynamic-8.2.1.tgz", + "integrity": "sha512-9tdpvEXFCgbMUeyVvIklyDPyg39cRN6MOrQihObAoBKOkcko9MKJIxDPCv8o/5FBrlBcu0VhREPK56aVD0g6UQ==", + "requires": { + "tslib": "^1.9.0" + } + }, "@angular/router": { "version": "8.2.1", "resolved": "https://registry.npmjs.org/@angular/router/-/router-8.2.1.tgz", @@ -264,6 +280,11 @@ "tslib": "^1.9.0" } }, + "@clr/ui": { + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/@clr/ui/-/ui-2.1.1.tgz", + "integrity": "sha512-8R46KRxA6kPr6zEPJlsQIbo4m6gqg0GGxoxTNxCtkloOlMs5UetDYnx8/gGm3+e0vqNdUL7cbKlGDOZyy9uwmQ==" + }, "@cnakazawa/watch": { "version": "1.0.3", "resolved": "https://registry.npmjs.org/@cnakazawa/watch/-/watch-1.0.3.tgz", diff --git a/package.json b/package.json index 77ec884..47bfa35 100644 --- a/package.json +++ b/package.json @@ -21,11 +21,14 @@ "license": "ISC", "dependencies": { "@angular/common": "^8.2.1", + "@angular/compiler": "^8.2.1", "@angular/core": "^8.2.1", "@angular/forms": "^8.2.1", "@angular/platform-browser": "^8.2.1", + "@angular/platform-browser-dynamic": "^8.2.1", "@angular/router": "^8.2.1", "@clr/angular": "^2.1.1", + "@clr/ui": "^2.1.1", "@uirouter/angularjs": "^1.0.5", "adm-zip": "^0.4.13", "angular": "^1.7.8", diff --git a/src/frontend/dashboard/package.json b/src/frontend/dashboard/package.json index 9d0e6c5..d89051f 100644 --- a/src/frontend/dashboard/package.json +++ b/src/frontend/dashboard/package.json @@ -25,7 +25,7 @@ "@clr/ui": "^2.1.1", "@webcomponents/custom-elements": "^1.0.0", "frontblock": "latest", - "frontblock-generic": "latest", + "frontblock-generic": "^0.22.0", "key-file-storage": "^2.2.4", "rxjs": "~6.5.2", "systemjs": "^0.21.3", diff --git a/src/frontend/dashboard/src/app/apiclient-dev/apiclient-consumptions.component.ts b/src/frontend/dashboard/src/app/ApiClient/apiclient-consumptions.component.ts similarity index 73% rename from src/frontend/dashboard/src/app/apiclient-dev/apiclient-consumptions.component.ts rename to src/frontend/dashboard/src/app/ApiClient/apiclient-consumptions.component.ts index e9e3193..d37b31e 100644 --- a/src/frontend/dashboard/src/app/apiclient-dev/apiclient-consumptions.component.ts +++ b/src/frontend/dashboard/src/app/ApiClient/apiclient-consumptions.component.ts @@ -1,11 +1,41 @@ import { Component, OnInit } from '@angular/core'; -import { fbind } from 'q'; import { FrontblockApiConf } from 'frontblock'; import { SubscriptionResponse, parseResponse, SuccessResponse } from 'frontblock-generic/Types.js'; +import { environment } from "../../environments/environment" +let fb +if(environment.production){ + fb = window["fb"] +}else{ + fb = { + ApiClient : { + setConfig: async () => { + await new Promise((resolve, reject) => { + setTimeout(() => { + resolve('Promise A win!'); + }, 500) + }) + }, + getConsumptions: async () => { + return await new Promise((resolve, reject) => { + setTimeout(() => { + resolve([new SubscriptionResponse("654", "321"), new SubscriptionResponse("456", "123")]); + }, 500) + }) + }, + getSubscriptions: async () => { + return await new Promise((resolve, reject) => { + setTimeout(() => { + resolve([new SubscriptionResponse("321"), new SubscriptionResponse("123")]); + }, 500) + }) + }, + unsubscribe: (uid) => new SuccessResponse(), + quit: (uid) => new SuccessResponse() -declare const fb - + } + } +} @Component({ selector: 'consumptions', template: ` diff --git a/src/frontend/dashboard/src/app/apiclient-dev/apiclient-dev.component.ts b/src/frontend/dashboard/src/app/ApiClient/apiclient-dev.component.ts similarity index 83% rename from src/frontend/dashboard/src/app/apiclient-dev/apiclient-dev.component.ts rename to src/frontend/dashboard/src/app/ApiClient/apiclient-dev.component.ts index c02c347..96675ef 100644 --- a/src/frontend/dashboard/src/app/apiclient-dev/apiclient-dev.component.ts +++ b/src/frontend/dashboard/src/app/ApiClient/apiclient-dev.component.ts @@ -1,6 +1,7 @@ import { Component, OnInit } from '@angular/core'; import { SidebarEntry } from 'frontblock-generic/Plugin'; -declare const fb +import { environment } from "../../environments/environment" + @Component({ selector: 'apiclient', //!!!! template: ` @@ -8,9 +9,7 @@ declare const fb
- -
-
+
diff --git a/src/frontend/dashboard/src/app/apiclient-dev/apiclient-settings-form.component.ts b/src/frontend/dashboard/src/app/ApiClient/apiclient-settings-form.component.ts similarity index 93% rename from src/frontend/dashboard/src/app/apiclient-dev/apiclient-settings-form.component.ts rename to src/frontend/dashboard/src/app/ApiClient/apiclient-settings-form.component.ts index e955b2a..c9105e5 100644 --- a/src/frontend/dashboard/src/app/apiclient-dev/apiclient-settings-form.component.ts +++ b/src/frontend/dashboard/src/app/ApiClient/apiclient-settings-form.component.ts @@ -1,10 +1,23 @@ import { Component, OnInit } from '@angular/core'; import { fbind } from 'q'; import { FrontblockApiConf } from 'frontblock'; +import { environment } from "../../environments/environment" - -declare const fb - +let fb +if(environment.production){ + fb = window["fb"] +}else{ + fb = { + ApiClient : { + setConfig: async () => { + await new Promise((resolve, reject) => { + setTimeout(() => { + resolve('Promise A win!'); + }, 500) + })} + } + } +} @Component({ selector: 'settings', template: ` diff --git a/src/frontend/dashboard/src/app/apiclient-dev/apiclient-subscriptions.component.ts b/src/frontend/dashboard/src/app/ApiClient/apiclient-subscriptions.component.ts similarity index 73% rename from src/frontend/dashboard/src/app/apiclient-dev/apiclient-subscriptions.component.ts rename to src/frontend/dashboard/src/app/ApiClient/apiclient-subscriptions.component.ts index 13b6524..3d6fd25 100644 --- a/src/frontend/dashboard/src/app/apiclient-dev/apiclient-subscriptions.component.ts +++ b/src/frontend/dashboard/src/app/ApiClient/apiclient-subscriptions.component.ts @@ -2,9 +2,41 @@ import { Component, OnInit } from '@angular/core'; import { fbind } from 'q'; import { FrontblockApiConf } from 'frontblock'; import { SubscriptionResponse, SuccessResponse, ErrorResponse, parseResponse } from 'frontblock-generic/Types.js'; +import { environment } from "../../environments/environment" +let fb +if(environment.production){ + fb = window["fb"] +}else{ + fb = { + ApiClient : { + setConfig: async () => { + await new Promise((resolve, reject) => { + setTimeout(() => { + resolve('Promise A win!'); + }, 500) + }) + }, + getConsumptions: async () => { + return await new Promise((resolve, reject) => { + setTimeout(() => { + resolve([new SubscriptionResponse("654", "321"), new SubscriptionResponse("456", "123")]); + }, 500) + }) + }, + getSubscriptions: async () => { + return await new Promise((resolve, reject) => { + setTimeout(() => { + resolve([new SubscriptionResponse("321"), new SubscriptionResponse("123")]); + }, 500) + }) + }, + unsubscribe: (uid) => new SuccessResponse(), + quit: (uid) => new SuccessResponse() -declare const fb + } + } +} @Component({ selector: 'subscriptions', diff --git a/src/frontend/dashboard/src/app/ApiClient/module.ts b/src/frontend/dashboard/src/app/ApiClient/module.ts new file mode 100644 index 0000000..1d26dcc --- /dev/null +++ b/src/frontend/dashboard/src/app/ApiClient/module.ts @@ -0,0 +1,41 @@ +import { NgModule } from '@angular/core'; +import { CommonModule } from '@angular/common'; +import { RouterModule } from '@angular/router'; + +import { ApiclientDevComponent as ApiclientComponent } from './apiclient-dev.component'; +import { ApiclientFormComponent } from './apiclient-settings-form.component'; +import { ApiclientConsumptionComponent } from './apiclient-consumptions.component'; +import { ApiclientSubscriptionComponent } from './apiclient-subscriptions.component'; + +import { FrontendPlugin, SidebarEntry } from 'frontblock-generic/Plugin'; +import { ClarityModule } from '@clr/angular'; +import { FormsModule } from '@angular/forms'; + + +@NgModule({ + imports: [ + FormsModule, + ClarityModule, + + CommonModule, + RouterModule.forChild([ + {path: "apiclient", component: ApiclientComponent}, + ]), + ], + exports: [RouterModule], + declarations: [ + ApiclientComponent, + ApiclientFormComponent, + ApiclientConsumptionComponent, + ApiclientSubscriptionComponent + ] +}) +export class PluginModule implements FrontendPlugin{ + getSidebarEntry(): SidebarEntry { + return { + icon: "key", + route: "apiclient", + text: "Api client", + } + } +} diff --git a/src/frontend/dashboard/src/app/pluginmanager-dev/pluginmanager-dev.component.ts b/src/frontend/dashboard/src/app/PluginManager/debug.component.ts similarity index 91% rename from src/frontend/dashboard/src/app/pluginmanager-dev/pluginmanager-dev.component.ts rename to src/frontend/dashboard/src/app/PluginManager/debug.component.ts index d12e8e4..b57dc70 100644 --- a/src/frontend/dashboard/src/app/pluginmanager-dev/pluginmanager-dev.component.ts +++ b/src/frontend/dashboard/src/app/PluginManager/debug.component.ts @@ -2,7 +2,7 @@ import { Component, OnInit } from '@angular/core'; import { SidebarEntry } from 'frontblock-generic/Plugin'; declare const fb @Component({ - selector: 'pluginmanager', //!!!! + selector: 'debug', //!!!! template: `
@@ -30,7 +30,7 @@ declare const fb
` }) -export class PluginmanagerDevComponent implements OnInit { +export class PluginmanagerDEBUG implements OnInit { constructor() { } diff --git a/src/frontend/dashboard/src/app/PluginManager/module.ts b/src/frontend/dashboard/src/app/PluginManager/module.ts new file mode 100644 index 0000000..49dd6cb --- /dev/null +++ b/src/frontend/dashboard/src/app/PluginManager/module.ts @@ -0,0 +1,45 @@ +import { NgModule } from '@angular/core'; +import { CommonModule } from '@angular/common'; +import { RouterModule } from '@angular/router'; + +import { PluginmanagerDEBUG } from './debug.component'; +import { PluginsComponent } from './plugins.component'; + +import { FrontendPlugin, SidebarEntries } from 'frontblock-generic/Plugin'; +import { ClarityModule } from '@clr/angular'; +import { FormsModule } from '@angular/forms'; + + +@NgModule({ + imports: [ + FormsModule, + ClarityModule, + + CommonModule, + RouterModule.forChild([ + {path: "debug", component: PluginmanagerDEBUG}, + {path: "plugins", component: PluginsComponent} + ]), + ], + exports: [RouterModule], + declarations: [ + PluginmanagerDEBUG, + PluginsComponent + ] +}) +export class PluginModule implements FrontendPlugin{ + getSidebarEntry(): SidebarEntries { + return { + icon: "plugin", + text: "Plugin manager", + parentRoute: "pluginmanager", + links: [{ + route: "debug", + text: "DEBUG" + },{ + route: "plugins", + text: "Plugins" + }] + } + } +} diff --git a/src/frontend/dashboard/src/app/PluginManager/plugins.component.ts b/src/frontend/dashboard/src/app/PluginManager/plugins.component.ts new file mode 100644 index 0000000..9e08b15 --- /dev/null +++ b/src/frontend/dashboard/src/app/PluginManager/plugins.component.ts @@ -0,0 +1,116 @@ +import { Component, OnInit } from '@angular/core'; +import { SidebarEntry } from 'frontblock-generic/Plugin'; +declare const fb +@Component({ + selector: 'plugins', //!!!! + template: ` +
+ +
+ + +
+
+
+
+ Plugins +
+
+
+ + + {{entry.name}} + +
+ + + + + +
+ + + +
+
+
+ +
+
+
+
+ ` +}) +export class PluginsComponent implements OnInit { + plugins = [{ + name: "test", + available: "0.0.1", + installed: "0.0.1", + status: "Running" + },{ + name: "test II: Return of test", + available: "0.0.1", + installed: "0.0.1", + status: "Available" + },{ + name: "test 3", + available: "0.0.2", + installed: "0.0.1", + status: "Stopped" + },] + + updatepending = true + updateCandidate = "" + + constructor() { } + + start(name){ + this.plugins.find((el) => el.name === name).status = "Running" + } + + stop(name){ + this.plugins.find((el) => el.name === name).status = "Stopped" + } + + delete(name){ + this.plugins.find((el) => el.name === name).status = "Available" + } + + showConfirmation(name){ + this.updateCandidate = name + this.updatepending = !this.updatepending + } + + download(name){ + let plugin = this.plugins.find((el) => el.name === name) + plugin.status = "Stopped" + plugin.installed = plugin.available + this.updatepending = !this.updatepending + } + + cancelModal(){ + this.updateCandidate = "" + this.updatepending = !this.updatepending + } + + ngOnInit() { } + +} + diff --git a/src/frontend/dashboard/src/app/app-routing.module.ts b/src/frontend/dashboard/src/app/app-routing.module.ts index efabd45..1a1b3b6 100644 --- a/src/frontend/dashboard/src/app/app-routing.module.ts +++ b/src/frontend/dashboard/src/app/app-routing.module.ts @@ -2,17 +2,9 @@ import { NgModule } from '@angular/core'; import { Routes, RouterModule, Route } from '@angular/router'; import { HomeComponent } from './home/home.component'; import { ErrorDisplayComponent } from './error-display/error-display.component'; -import { PluginmanagerDevComponent } from './pluginmanager-dev/pluginmanager-dev.component'; -import { ApiclientDevComponent } from './apiclient-dev/apiclient-dev.component'; - +import { environment } from 'src/environments/environment'; const routes: Routes = [{ - path: "dev/pluginmanager", - component: PluginmanagerDevComponent -},{ - path: "dev/apiclient", - component: ApiclientDevComponent -},{ path: "", component: HomeComponent },{ diff --git a/src/frontend/dashboard/src/app/app.component.html b/src/frontend/dashboard/src/app/app.component.html index 505b10f..709f08f 100644 --- a/src/frontend/dashboard/src/app/app.component.html +++ b/src/frontend/dashboard/src/app/app.component.html @@ -1,4 +1,8 @@
- - -
+ + +
+ + +
+
\ No newline at end of file diff --git a/src/frontend/dashboard/src/app/app.component.ts b/src/frontend/dashboard/src/app/app.component.ts index 3bdc925..bd819cd 100644 --- a/src/frontend/dashboard/src/app/app.component.ts +++ b/src/frontend/dashboard/src/app/app.component.ts @@ -1,10 +1,30 @@ -import { Component } from '@angular/core'; +import { Component, ChangeDetectorRef, NgZone, ViewChild, OnInit, AfterContentInit } from '@angular/core'; +import { SidebarComponent } from './sidebar/sidebar.component'; +import { SidebarEntryService } from './sidebar-entry-service.service'; @Component({ selector: 'app-root', templateUrl: './app.component.html', styleUrls: ['./app.component.scss'] }) -export class AppComponent { +export class AppComponent implements AfterContentInit { title = 'dashboard'; + + @ViewChild(SidebarComponent, {static: false}) + sidebar: SidebarComponent + + constructor(private zone:NgZone, private sidebarService: SidebarEntryService){ + window["refresh"] = () => zone.run(()=>{ /*this triggers an angular reload*/}) + } + + ngAfterContentInit(){ + const _this = this; + (function awaitSidebar(){ + if(_this.sidebar != null){ + _this.sidebarService.setSidebar(_this.sidebar) + return + } + setTimeout(awaitSidebar,25) + })() + } } diff --git a/src/frontend/dashboard/src/app/app.module.ts b/src/frontend/dashboard/src/app/app.module.ts index c660b3f..ed68130 100644 --- a/src/frontend/dashboard/src/app/app.module.ts +++ b/src/frontend/dashboard/src/app/app.module.ts @@ -1,57 +1,51 @@ -import { BrowserModule } from '@angular/platform-browser'; -import { NgModule, ANALYZE_FOR_ENTRY_COMPONENTS, ModuleWithProviders } from '@angular/core'; -import { HttpClientModule } from '@angular/common/http'; -import { AppRoutingModule, getRoutes } from './app-routing.module'; +import { NgModule } from '@angular/core'; +import { AppRoutingModule } from './app-routing.module'; + import { ClarityModule } from '@clr/angular'; import { BrowserAnimationsModule } from "@angular/platform-browser/animations"; +import { BrowserModule } from '@angular/platform-browser'; +import { FormsModule } from '@angular/forms'; import { COMPILER_OPTIONS, CompilerFactory, Compiler } from '@angular/core'; import { JitCompilerFactory } from '@angular/platform-browser-dynamic'; -import { FormsModule } from '@angular/forms'; + import { AppComponent } from './app.component'; import { SidebarComponent } from './sidebar/sidebar.component'; -import { MainComponent } from './main/main.component'; +import { MainComponent } from './content-area/main.component'; import { DynamicLoaderComponent } from './dynamic-loader/dynamic-loader.component'; import { HomeComponent } from './home/home.component'; import { ErrorDisplayComponent } from './error-display/error-display.component'; -import { PluginmanagerDevComponent } from './pluginmanager-dev/pluginmanager-dev.component'; import { HeaderBarComponent } from './header-bar/header-bar.component'; -import { ApiclientDevComponent } from './apiclient-dev/apiclient-dev.component'; -import { ApiclientFormComponent } from './apiclient-dev/apiclient-settings-form.component'; -import { ApiclientConsumptionComponent } from './apiclient-dev/apiclient-consumptions.component'; -import { ApiclientSubscriptionComponent } from './apiclient-dev/apiclient-subscriptions.component'; +import { SubnavComponent } from './subnav/subnav.component'; + +import { environment } from 'src/environments/environment'; export function createCompiler(fn: CompilerFactory): Compiler { return fn.createCompiler(); } -const entryComps = [] +const declarations = [ + AppComponent, + + SidebarComponent, + MainComponent, + DynamicLoaderComponent, + HomeComponent, + HeaderBarComponent, + ErrorDisplayComponent, + SubnavComponent, +] @NgModule({ - declarations: [ - AppComponent, - SidebarComponent, - MainComponent, - DynamicLoaderComponent, - HomeComponent, - ErrorDisplayComponent, - PluginmanagerDevComponent, - HeaderBarComponent, - ApiclientDevComponent, - ApiclientFormComponent, - ApiclientConsumptionComponent, - ApiclientSubscriptionComponent - - ], + declarations: declarations, imports: [ FormsModule, BrowserModule, BrowserAnimationsModule, ClarityModule, - HttpClientModule, - AppRoutingModule + AppRoutingModule, ], - entryComponents: entryComps, + entryComponents: [], providers: [ { provide: COMPILER_OPTIONS, diff --git a/src/frontend/dashboard/src/app/main/main.component.html b/src/frontend/dashboard/src/app/content-area/main.component.html similarity index 100% rename from src/frontend/dashboard/src/app/main/main.component.html rename to src/frontend/dashboard/src/app/content-area/main.component.html diff --git a/src/frontend/dashboard/src/app/main/main.component.scss b/src/frontend/dashboard/src/app/content-area/main.component.scss similarity index 100% rename from src/frontend/dashboard/src/app/main/main.component.scss rename to src/frontend/dashboard/src/app/content-area/main.component.scss diff --git a/src/frontend/dashboard/src/app/main/main.component.spec.ts b/src/frontend/dashboard/src/app/content-area/main.component.spec.ts similarity index 100% rename from src/frontend/dashboard/src/app/main/main.component.spec.ts rename to src/frontend/dashboard/src/app/content-area/main.component.spec.ts diff --git a/src/frontend/dashboard/src/app/main/main.component.ts b/src/frontend/dashboard/src/app/content-area/main.component.ts similarity index 92% rename from src/frontend/dashboard/src/app/main/main.component.ts rename to src/frontend/dashboard/src/app/content-area/main.component.ts index cc59f55..cb8fe25 100644 --- a/src/frontend/dashboard/src/app/main/main.component.ts +++ b/src/frontend/dashboard/src/app/content-area/main.component.ts @@ -1,7 +1,7 @@ import { Component, OnInit, ViewContainerRef, ViewChild } from '@angular/core'; @Component({ - selector: 'app-main', + selector: 'content-area', templateUrl: './main.component.html', styleUrls: ['./main.component.scss'] }) diff --git a/src/frontend/dashboard/src/app/dynamic-loader/apiclient-dev/apiclient-dev.component.ts b/src/frontend/dashboard/src/app/dynamic-loader/apiclient-dev/apiclient-dev.component.ts deleted file mode 100644 index ca8b2de..0000000 --- a/src/frontend/dashboard/src/app/dynamic-loader/apiclient-dev/apiclient-dev.component.ts +++ /dev/null @@ -1,26 +0,0 @@ -import { Component, OnInit } from '@angular/core'; -import { SidebarEntry } from 'frontblock-generic/Plugin'; -declare const fb -@Component({ - selector: 'apiclient', //!!!! - template: ` -
-
- -
-
- ` -}) -export class ApiclientDevComponent implements OnInit { - - constructor() { } - - ngOnInit() { } - -} - -export const sidebarEntry:SidebarEntry = { - icon: "wrench", - route: "dev/apiclient", - text: "DEV ApiClient", -} diff --git a/src/frontend/dashboard/src/app/dynamic-loader/apiclient-dev/apiclient-settings-form.component.ts b/src/frontend/dashboard/src/app/dynamic-loader/apiclient-dev/apiclient-settings-form.component.ts deleted file mode 100644 index 25fd5af..0000000 --- a/src/frontend/dashboard/src/app/dynamic-loader/apiclient-dev/apiclient-settings-form.component.ts +++ /dev/null @@ -1,135 +0,0 @@ -import { Component, OnInit } from '@angular/core'; -import { fbind } from 'q'; -import { FrontblockApiConf } from 'frontblock'; - - -declare const fb - -@Component({ - selector: 'settings', - template: ` -
-
- Configuration -
-
-
- Settings -
-
-
- - - We need your first name for legal compliance - - - - - - - We need your first name for legal compliance - - - - - - This field is required! - - - - - - - - - - - Valid range 1024 - 65536 - - - - -
-
-
-
- - - - - -
-
- ` -}) -export class ApiclientFormComponent implements OnInit { - testnet:boolean = true - saving:boolean = false - advanced:boolean = false - data:FrontblockApiConf = { - apiHost: "api.testnet.frontblock.me", - apiPort: 10001, - tls: false, - apiKey: "" - } - - constructor() { } - - ngOnInit() { } - - setAdvanced(){ this.advanced = true } - - checkData():boolean{ - return ( - typeof this.data.apiPort === "number" && - typeof this.data.apiHost === "string" && - typeof this.data.tls === "boolean" && - typeof this.data.apiKey === "string" - ) - } - - updateTestnet(){ - if(this.testnet){ - this.data.apiHost = "api.testnet.frontblock.me" - this.data.apiPort = 10001 - }else{ - this.data.apiHost = "api.frontblock.me" - this.data.apiPort = 10000 - } - } - - updatePort(obj){ - switch (this.data.apiHost) { - case "api.testnet.frontblock.me": - this.data.apiPort = 10001 - break; - case "api.frontblock.me": - this.data.apiPort = 10000 - break; - - default: - console.warn("A non-standard api host was chosen: "+this.data.apiPort) - break; - } - console.log(this.data) - } - - async save(){ - this.saving = true; - if(typeof this.data.apiPort === "string") - this.data.apiPort = parseInt(this.data.apiPort) - - if(this.checkData()){ - const conf = await fb.ApiClient.setConfig(this.data) - console.log(conf) - }else{ - //show error in gui - console.error("bad data :(") - } - this.saving = false - } -} diff --git a/src/frontend/dashboard/src/app/dynamic-loader/dynamic-loader.component.html b/src/frontend/dashboard/src/app/dynamic-loader/dynamic-loader.component.html index 306971d..070e254 100644 --- a/src/frontend/dashboard/src/app/dynamic-loader/dynamic-loader.component.html +++ b/src/frontend/dashboard/src/app/dynamic-loader/dynamic-loader.component.html @@ -1,4 +1,3 @@
- - +
\ No newline at end of file diff --git a/src/frontend/dashboard/src/app/dynamic-loader/dynamic-loader.component.ts b/src/frontend/dashboard/src/app/dynamic-loader/dynamic-loader.component.ts index 964a24e..92f438b 100644 --- a/src/frontend/dashboard/src/app/dynamic-loader/dynamic-loader.component.ts +++ b/src/frontend/dashboard/src/app/dynamic-loader/dynamic-loader.component.ts @@ -5,7 +5,6 @@ */ import { System } from 'systemjs'; declare const SystemJS: System; -declare const fb import * as angularRouter from '@angular/router'; import * as angularCore from '@angular/core'; @@ -13,47 +12,76 @@ import * as angularCommon from '@angular/common'; import * as angularCommonHttp from '@angular/common/http'; import * as angularForms from '@angular/forms'; import * as angularAnimations from '@angular/animations'; +//import * as angularAnimationsBrowser from '@angular/animations/browser' import * as angularPlatformBrowser from '@angular/platform-browser'; import * as angularPlatformBrowserDynamic from '@angular/platform-browser-dynamic'; +import * as clarityModule from '@clr/angular'; +import * as frontblockGenericTypes from 'frontblock-generic/Types.js' +//import * as browserAnimationsModule from "@angular/platform-browser/animations"; +SystemJS.set('@clr/angular', SystemJS.newModule(clarityModule)); SystemJS.set('@angular/router', SystemJS.newModule(angularRouter)); SystemJS.set('@angular/core', SystemJS.newModule(angularCore)); SystemJS.set('@angular/common', SystemJS.newModule(angularCommon)); SystemJS.set('@angular/common/http', SystemJS.newModule(angularCommonHttp)); SystemJS.set('@angular/forms', SystemJS.newModule(angularForms)); SystemJS.set('@angular/animations', SystemJS.newModule(angularAnimations)); +//SystemJS.set('@angular/animations/browser', SystemJS.newModule(angularAnimationsBrowser)); SystemJS.set('@angular/platform-browser', SystemJS.newModule(angularPlatformBrowser)); +//SystemJS.set('@angular/platform-browser/animations', SystemJS.newModule(browserAnimationsModule)); SystemJS.set('@angular/platform-browser-dynamic', SystemJS.newModule(angularPlatformBrowserDynamic)); +SystemJS.set('frontblock-generic/Types', SystemJS.newModule(frontblockGenericTypes)); SystemJS.config({ meta: { '*': { authorization: true } } }); /** --------- */ -import { AfterViewInit, Component, ViewContainerRef, ViewChild } from '@angular/core'; +import { AfterViewInit, Component, Input, ViewChild } from '@angular/core'; import { SidebarComponent } from '../sidebar/sidebar.component'; -import { MainComponent } from '../main/main.component'; import { Router } from '@angular/router'; import { FrontendPlugin, SidebarEntries, SidebarEntry } from "frontblock-generic/Plugin" +import { SidebarEntryService } from '../sidebar-entry-service.service'; +import { environment } from "../../environments/environment" + + +let fb +if(environment.production){ + fb = window["fb"] +}else{ + + fb = { + PluginManager : { + getLoadedPluginNames: () => ["ApiClient", "PluginManager"] + } + } +} @Component({ - selector: 'app-dynamic-loader', + selector: 'dynamic-loader', templateUrl: './dynamic-loader.component.html', styleUrls: ['./dynamic-loader.component.scss'] }) export class DynamicLoaderComponent implements AfterViewInit { - - @ViewChild(SidebarComponent, {static: false}) - sidebar: SidebarComponent - @ViewChild(MainComponent, {read: ViewContainerRef, static: false}) - maincontent: ViewContainerRef + sidebar:SidebarComponent constructor( private router: Router, - ) { } + private sidebarService:SidebarEntryService + ) { + } ngAfterViewInit() { - this.loadWidgets() + const _this = this; + (function awaitSidebar(){ + const sb = _this.sidebarService.getSidebar() + if(sb != null){ + _this.sidebar = sb + _this.loadWidgets() + return + } + setTimeout(awaitSidebar,25) + })() } private async loadWidgets(){ @@ -65,7 +93,12 @@ export class DynamicLoaderComponent implements AfterViewInit { } private async installWidget(pluginName:string){ - const module: FrontendPlugin = await SystemJS.import("plugins/"+pluginName+".js"); + let module: FrontendPlugin + if(environment.production) + module = await SystemJS.import("plugins/"+pluginName+".js"); + else + module = await import("../"+pluginName+"/module") + const plugin = new module['PluginModule']() const entry:SidebarEntries | SidebarEntry = plugin.getSidebarEntry() const rc = this.router.config @@ -94,8 +127,6 @@ export class DynamicLoaderComponent implements AfterViewInit { path: m.parentRoute, loadChildren: async () => module['PluginModule'] }) - - console.log(this.sidebar.multientires) break; } this.router.resetConfig(rc) diff --git a/src/frontend/dashboard/src/app/header-bar/header-bar.component.html b/src/frontend/dashboard/src/app/header-bar/header-bar.component.html index 67c5368..382d068 100644 --- a/src/frontend/dashboard/src/app/header-bar/header-bar.component.html +++ b/src/frontend/dashboard/src/app/header-bar/header-bar.component.html @@ -10,10 +10,3 @@
- \ No newline at end of file diff --git a/src/frontend/dashboard/src/app/pluginmanager-dev/pluginmanager-dev.component.html b/src/frontend/dashboard/src/app/pluginmanager-dev/pluginmanager-dev.component.html deleted file mode 100644 index 1f5832b..0000000 --- a/src/frontend/dashboard/src/app/pluginmanager-dev/pluginmanager-dev.component.html +++ /dev/null @@ -1 +0,0 @@ -

pluginmanager-dev works!

diff --git a/src/frontend/dashboard/src/app/sidebar-entry-service.service.ts b/src/frontend/dashboard/src/app/sidebar-entry-service.service.ts new file mode 100644 index 0000000..6871e53 --- /dev/null +++ b/src/frontend/dashboard/src/app/sidebar-entry-service.service.ts @@ -0,0 +1,20 @@ +import { Injectable } from '@angular/core'; +import { SidebarComponent } from './sidebar/sidebar.component'; + +@Injectable({ + providedIn: 'root' +}) +export class SidebarEntryService { + + private sidebar:SidebarComponent + + constructor() { } + + setSidebar(sidebar){ + this.sidebar = sidebar + } + + getSidebar():SidebarComponent{ + return this.sidebar + } +} diff --git a/src/frontend/dashboard/src/app/sidebar/sidebar.component.html b/src/frontend/dashboard/src/app/sidebar/sidebar.component.html index 605e573..8caf06a 100644 --- a/src/frontend/dashboard/src/app/sidebar/sidebar.component.html +++ b/src/frontend/dashboard/src/app/sidebar/sidebar.component.html @@ -1,4 +1,4 @@ - + {{e.text}} @@ -17,7 +17,4 @@ {{entry.text}} - - - \ No newline at end of file diff --git a/src/frontend/dashboard/src/app/sidebar/sidebar.component.ts b/src/frontend/dashboard/src/app/sidebar/sidebar.component.ts index 52fd19e..715a058 100644 --- a/src/frontend/dashboard/src/app/sidebar/sidebar.component.ts +++ b/src/frontend/dashboard/src/app/sidebar/sidebar.component.ts @@ -1,30 +1,19 @@ import { Component, OnInit } from '@angular/core'; import { SidebarEntries, SidebarEntry } from 'frontblock-generic/Plugin'; -import { sidebarEntry as apiclient } from "../apiclient-dev/apiclient-dev.component" -import { sidebarEntry as pluginmanager } from "../pluginmanager-dev/pluginmanager-dev.component" - +import { environment } from 'src/environments/environment'; @Component({ - selector: 'app-sidebar', + selector: 'sidebar', templateUrl: './sidebar.component.html', styleUrls: ['./sidebar.component.scss'] }) export class SidebarComponent implements OnInit { entries:SidebarEntry[] = [ - pluginmanager, - apiclient ] - multientires:SidebarEntries[] = [{ - icon: "times", - text: "HELP", - parentRoute: "oops", - links: [{ - route: "xd", - text: "XD" - }] - }] + multientires:SidebarEntries[] = [ + ] constructor() { } diff --git a/src/frontend/dashboard/src/app/subnav/subnav.component.html b/src/frontend/dashboard/src/app/subnav/subnav.component.html new file mode 100644 index 0000000..ad03d84 --- /dev/null +++ b/src/frontend/dashboard/src/app/subnav/subnav.component.html @@ -0,0 +1,7 @@ + \ No newline at end of file diff --git a/src/frontend/dashboard/src/app/pluginmanager-dev/pluginmanager-dev.component.scss b/src/frontend/dashboard/src/app/subnav/subnav.component.scss similarity index 100% rename from src/frontend/dashboard/src/app/pluginmanager-dev/pluginmanager-dev.component.scss rename to src/frontend/dashboard/src/app/subnav/subnav.component.scss diff --git a/src/frontend/dashboard/src/app/pluginmanager-dev/pluginmanager-dev.component.spec.ts b/src/frontend/dashboard/src/app/subnav/subnav.component.spec.ts similarity index 51% rename from src/frontend/dashboard/src/app/pluginmanager-dev/pluginmanager-dev.component.spec.ts rename to src/frontend/dashboard/src/app/subnav/subnav.component.spec.ts index c8812b6..b0ddf54 100644 --- a/src/frontend/dashboard/src/app/pluginmanager-dev/pluginmanager-dev.component.spec.ts +++ b/src/frontend/dashboard/src/app/subnav/subnav.component.spec.ts @@ -1,20 +1,20 @@ import { async, ComponentFixture, TestBed } from '@angular/core/testing'; -import { PluginmanagerDevComponent } from './pluginmanager-dev.component'; +import { SubnavComponent } from './subnav.component'; -describe('PluginmanagerDevComponent', () => { - let component: PluginmanagerDevComponent; - let fixture: ComponentFixture; +describe('SubnavComponent', () => { + let component: SubnavComponent; + let fixture: ComponentFixture; beforeEach(async(() => { TestBed.configureTestingModule({ - declarations: [ PluginmanagerDevComponent ] + declarations: [ SubnavComponent ] }) .compileComponents(); })); beforeEach(() => { - fixture = TestBed.createComponent(PluginmanagerDevComponent); + fixture = TestBed.createComponent(SubnavComponent); component = fixture.componentInstance; fixture.detectChanges(); }); diff --git a/src/frontend/dashboard/src/app/subnav/subnav.component.ts b/src/frontend/dashboard/src/app/subnav/subnav.component.ts new file mode 100644 index 0000000..02b6a17 --- /dev/null +++ b/src/frontend/dashboard/src/app/subnav/subnav.component.ts @@ -0,0 +1,15 @@ +import { Component, OnInit } from '@angular/core'; + +@Component({ + selector: 'subnav', + templateUrl: './subnav.component.html', + styleUrls: ['./subnav.component.scss'] +}) +export class SubnavComponent implements OnInit { + + constructor() { } + + ngOnInit() { + } + +} diff --git a/src/frontend/dashboard/tsconfig.app.json b/src/frontend/dashboard/tsconfig.app.json index c85ee27..ae2012a 100644 --- a/src/frontend/dashboard/tsconfig.app.json +++ b/src/frontend/dashboard/tsconfig.app.json @@ -8,6 +8,7 @@ "src/**/*.ts" ], "exclude": [ + "node_modules", "src/test.ts", "src/**/*.spec.ts" ] diff --git a/src/frontend/widget/rollup.config.js b/src/frontend/widget/rollup.config.js index 2b21f16..aab22b6 100644 --- a/src/frontend/widget/rollup.config.js +++ b/src/frontend/widget/rollup.config.js @@ -1,6 +1,5 @@ import resolve from 'rollup-plugin-node-resolve'; import typescript from 'rollup-plugin-typescript2'; -import externals from 'rollup-plugin-node-externals' export default { input: 'src/frontend/widget/main.ts', @@ -21,8 +20,6 @@ export default { }) ], external: [ - "frontblock", - "frontblock-generic", 'plugins-core', '@angular/core', '@angular/common',