fix widget
This commit is contained in:
peter
@@ -1,15 +0,0 @@
|
|||||||
import { Component, OnInit } from '@angular/core';
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'settings',
|
|
||||||
template: `
|
|
||||||
<span style="color: red">!!!</span>
|
|
||||||
`
|
|
||||||
})
|
|
||||||
export class ANestedComponent implements OnInit {
|
|
||||||
|
|
||||||
constructor() { }
|
|
||||||
|
|
||||||
ngOnInit() { }
|
|
||||||
|
|
||||||
}
|
|
||||||
@@ -1,89 +0,0 @@
|
|||||||
import { Component, OnInit } from '@angular/core';
|
|
||||||
|
|
||||||
|
|
||||||
declare const fb
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'consumptions',
|
|
||||||
template: `
|
|
||||||
<div class="card">
|
|
||||||
<div class="card-header">
|
|
||||||
Consumptions
|
|
||||||
</div>
|
|
||||||
<clr-alert *ngFor="let entry of alerts" [clrAlertType]="entry.severity">
|
|
||||||
<clr-alert-item>
|
|
||||||
<span class="alert-text">
|
|
||||||
{{entry.message}}
|
|
||||||
</span>
|
|
||||||
</clr-alert-item>
|
|
||||||
</clr-alert>
|
|
||||||
|
|
||||||
<div *ngIf="loading" class="card-block">
|
|
||||||
<span class="spinner spinner-inline"></span>
|
|
||||||
</div>
|
|
||||||
<div *ngIf="entries.length !== 0 && !loading" class="card-block">
|
|
||||||
<div class="card-text">
|
|
||||||
<table class="table table-noborder">
|
|
||||||
<thead>
|
|
||||||
<tr>
|
|
||||||
<th class="left">UUID</th>
|
|
||||||
<th>Expiry</th>
|
|
||||||
<th>Creation</th>
|
|
||||||
<th class="left"></th>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tbody>
|
|
||||||
<tr *ngFor="let line of entries" >
|
|
||||||
<td class="left">{{line.uid}}</td>
|
|
||||||
<td>{{line.expiry}}</td>
|
|
||||||
<td>{{line.created}}</td>
|
|
||||||
<td class="left"><button class="btn btn-link btn-sm" (click)="quit(line.uid)">Quit</button></td>
|
|
||||||
</tr>
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="card-footer">
|
|
||||||
<button *ngIf="!loading" class="btn btn-sm btn-link" (click)="load()">{{actionName}}</button>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
`
|
|
||||||
})
|
|
||||||
export class ApiclientConsumptionComponent implements OnInit {
|
|
||||||
loading:boolean = false
|
|
||||||
actionName:string = "load"
|
|
||||||
entries:any[] = [{
|
|
||||||
uid: "1231",
|
|
||||||
message: "",
|
|
||||||
result: "Success"
|
|
||||||
}]
|
|
||||||
alerts: {
|
|
||||||
severity: "danger" | "warning" | "success"
|
|
||||||
message: string
|
|
||||||
}[] = []
|
|
||||||
|
|
||||||
constructor() { }
|
|
||||||
|
|
||||||
ngOnInit() { }
|
|
||||||
|
|
||||||
async load(){
|
|
||||||
this.loading = true
|
|
||||||
this.entries = await fb.ApiClient.getConsumptions()
|
|
||||||
if(this.entries.length === 0){
|
|
||||||
this.alerts.push({ severity: "warning", message: "0 results were returned"})
|
|
||||||
}
|
|
||||||
this.loading = false
|
|
||||||
this.actionName = "refresh"
|
|
||||||
}
|
|
||||||
|
|
||||||
async quit(uid:string){
|
|
||||||
const r = await fb.ApiClient.quit(uid)
|
|
||||||
if(r.uid != null){
|
|
||||||
this.alerts.push({ severity: "success", message: "Quit consuming "+uid})
|
|
||||||
this.load()
|
|
||||||
}else{
|
|
||||||
this.alerts.push({ severity: "danger", message: "Error "+r.message})
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -1,129 +0,0 @@
|
|||||||
import { Component, OnInit } from '@angular/core';
|
|
||||||
|
|
||||||
declare const fb
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'settings',
|
|
||||||
template: `
|
|
||||||
<div class="card">
|
|
||||||
<div class="card-header">
|
|
||||||
Settings
|
|
||||||
</div>
|
|
||||||
<div class="card-block">
|
|
||||||
<div class="card-text">
|
|
||||||
<form clrForm clrLayout="vertical">
|
|
||||||
<clr-input-container>
|
|
||||||
<label>testnet</label>
|
|
||||||
<clr-control-error>We need your first name for legal compliance</clr-control-error>
|
|
||||||
</clr-input-container>
|
|
||||||
<input type="checkbox" [(ngModel)]="testnet" (change)="updateTestnet($event)" name="testnetToggle" clrToggle />
|
|
||||||
|
|
||||||
<clr-input-container *ngIf="!testnet">
|
|
||||||
<label>API key</label>
|
|
||||||
<input clrInput type="text" name="apiKey" required />
|
|
||||||
<clr-control-error>We need your first name for legal compliance</clr-control-error>
|
|
||||||
</clr-input-container>
|
|
||||||
|
|
||||||
<clr-input-container *ngIf="advanced">
|
|
||||||
<label>API address</label>
|
|
||||||
<input type="text" [(ngModel)]="data.apiHost" (change)="updatePort($event)" clrInput name="apiHost" required />
|
|
||||||
<clr-control-error>This field is required!</clr-control-error>
|
|
||||||
</clr-input-container>
|
|
||||||
|
|
||||||
<clr-checkbox-wrapper *ngIf="advanced" >
|
|
||||||
<input [(ngModel)]="data.tls" type="checkbox" clrCheckbox value="tls" name="options" />
|
|
||||||
<label>Use TLS</label>
|
|
||||||
</clr-checkbox-wrapper>
|
|
||||||
|
|
||||||
<clr-input-container *ngIf="advanced">
|
|
||||||
<label>Port</label>
|
|
||||||
<input [(ngModel)]="data.apiPort" clrInput type="number" name="lastName" required />
|
|
||||||
<clr-control-error>Valid range 1024 - 65536
|
|
||||||
</clr-control-error>
|
|
||||||
</clr-input-container>
|
|
||||||
|
|
||||||
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="card-footer">
|
|
||||||
<button *ngIf="!saving" class="btn btn-success" (click)="save()">
|
|
||||||
<span>Save</span>
|
|
||||||
</button>
|
|
||||||
|
|
||||||
<button *ngIf="saving" class="btn btn-disabled" (click)="save()" disabled>
|
|
||||||
<span class="spinner spinner-inline"></span>
|
|
||||||
</button>
|
|
||||||
<button *ngIf="!advanced" class="btn btn-sm btn-link" (click)="setAdvanced()">Advanced</button>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
`
|
|
||||||
})
|
|
||||||
export class ApiclientFormComponent implements OnInit {
|
|
||||||
testnet:boolean = true
|
|
||||||
saving:boolean = false
|
|
||||||
advanced:boolean = false
|
|
||||||
data = {
|
|
||||||
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
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -1,86 +0,0 @@
|
|||||||
import { Component, OnInit } from '@angular/core';
|
|
||||||
|
|
||||||
declare const fb
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'subscriptions',
|
|
||||||
template: `
|
|
||||||
<div class="card">
|
|
||||||
<div class="card-header">
|
|
||||||
Subscriptions
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<clr-alert *ngFor="let entry of alerts" [clrAlertType]="entry.severity">
|
|
||||||
<clr-alert-item>
|
|
||||||
<span class="alert-text">
|
|
||||||
{{entry.message}}
|
|
||||||
</span>
|
|
||||||
</clr-alert-item>
|
|
||||||
</clr-alert>
|
|
||||||
|
|
||||||
<div *ngIf="loading" class="card-block">
|
|
||||||
<span class="spinner spinner-inline"></span>
|
|
||||||
</div>
|
|
||||||
<div *ngIf="entries.length !== 0 && !loading" class="card-block">
|
|
||||||
<div class="card-text">
|
|
||||||
<table class="table table-noborder">
|
|
||||||
<thead>
|
|
||||||
<tr>
|
|
||||||
<th class="left">UUID</th>
|
|
||||||
<th>Expiry</th>
|
|
||||||
<th>Creation</th>
|
|
||||||
<th class="left"></th>
|
|
||||||
</tr>
|
|
||||||
</thead>
|
|
||||||
<tbody>
|
|
||||||
<tr *ngFor="let line of entries" >
|
|
||||||
<td class="left">{{line.uid}}</td>
|
|
||||||
<td>{{line.expiry}}</td>
|
|
||||||
<td>{{line.created}}</td>
|
|
||||||
<td class="left"><button class="btn btn-link btn-sm" (click)="quit(line.uid)">Quit</button></td>
|
|
||||||
</tr>
|
|
||||||
</tbody>
|
|
||||||
</table>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="card-footer">
|
|
||||||
<button *ngIf="!loading" class="btn btn-sm btn-link" (click)="load()">{{actionName}}</button>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
`
|
|
||||||
})
|
|
||||||
export class ApiclientSubscriptionComponent implements OnInit {
|
|
||||||
loading:boolean = false
|
|
||||||
actionName:string = "load"
|
|
||||||
entries:any[] = []
|
|
||||||
alerts: {
|
|
||||||
severity: "danger" | "warning" | "success"
|
|
||||||
message: string
|
|
||||||
}[] = []
|
|
||||||
|
|
||||||
constructor() { }
|
|
||||||
|
|
||||||
ngOnInit() { }
|
|
||||||
|
|
||||||
async load(){
|
|
||||||
this.loading = true
|
|
||||||
this.entries = await fb.ApiClient.getSubscriptions()
|
|
||||||
if(this.entries.length === 0){
|
|
||||||
this.alerts.push({ severity: "warning", message: "0 results were returned"})
|
|
||||||
}
|
|
||||||
this.loading = false
|
|
||||||
this.actionName = "refresh"
|
|
||||||
}
|
|
||||||
|
|
||||||
async quit(uid:string){
|
|
||||||
const r = await fb.ApiClient.unsubscribe(uid)
|
|
||||||
if(r.uid != null){
|
|
||||||
this.alerts.push({ severity: "success", message: "Stopped subscription "+uid})
|
|
||||||
this.load()
|
|
||||||
}else{
|
|
||||||
this.alerts.push({ severity: "danger", message: "Error "+r.message})
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
@@ -1,20 +1,31 @@
|
|||||||
import { Component, OnInit } from '@angular/core';
|
import { Component, OnInit } from '@angular/core';
|
||||||
|
import { SidebarEntry } from 'frontblock-generic/Plugin';
|
||||||
|
declare const fb
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'apiclient', //!!!!
|
selector: 'pluginmanager', //!!!!
|
||||||
template: `
|
template: `
|
||||||
<div class="clr-row">
|
|
||||||
<div class="clr-col-lg-auto">
|
|
||||||
<settings></settings>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="clr-row">
|
<div class="clr-row">
|
||||||
<div class="clr-col">
|
<div class="clr-col">
|
||||||
<consumptions></consumptions>
|
<div class="card">
|
||||||
</div>
|
<div class="card-header">
|
||||||
</div>
|
DEBUG
|
||||||
<div class="clr-row">
|
</div>
|
||||||
<div class="clr-col">
|
<div class="card-block">
|
||||||
<subscriptions></subscriptions>
|
<div class="card-title">
|
||||||
|
SETUP
|
||||||
|
</div>
|
||||||
|
<div class="card-text">
|
||||||
|
<p>
|
||||||
|
Press this button to install all plugins.
|
||||||
|
<br>
|
||||||
|
Once the installation is done the page will refresh automatically
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="card-footer">
|
||||||
|
<button class="btn btn-warning" onclick="setup()">SETUP</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
`
|
`
|
||||||
@@ -26,3 +37,11 @@ export class PluginComponent implements OnInit {
|
|||||||
ngOnInit() { }
|
ngOnInit() { }
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export const sidebarEntry: SidebarEntry = {
|
||||||
|
icon: "wrench",
|
||||||
|
route: "dev/pluginmanager",
|
||||||
|
text: "DEV Plugin manager",
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@@ -2,24 +2,19 @@ import { NgModule } from '@angular/core';
|
|||||||
import { CommonModule } from '@angular/common';
|
import { CommonModule } from '@angular/common';
|
||||||
import { PluginComponent } from './component';
|
import { PluginComponent } from './component';
|
||||||
import { RouterModule } from '@angular/router';
|
import { RouterModule } from '@angular/router';
|
||||||
import { ApiclientFormComponent } from './apiclient-settings-form.component';
|
import { FrontendPlugin, SidebarEntry, SidebarEntries } from 'frontblock-generic/Plugin';
|
||||||
import { ApiclientConsumptionComponent } from './apiclient-consumptions.component';
|
|
||||||
import { ApiclientSubscriptionComponent } from './apiclient-subscriptions.component';
|
|
||||||
import { FrontendPlugin, SidebarEntry } from 'frontblock-generic/Plugin';
|
|
||||||
import { ANestedComponent } from './a-nested.component';
|
|
||||||
|
|
||||||
@NgModule({
|
@NgModule({
|
||||||
imports: [
|
imports: [
|
||||||
CommonModule,
|
CommonModule,
|
||||||
RouterModule.forChild([{path: "pluginmanager", component: PluginComponent}]),
|
RouterModule.forChild([
|
||||||
|
{path: "debug", component: PluginComponent}
|
||||||
|
]),
|
||||||
],
|
],
|
||||||
exports: [RouterModule],
|
exports: [RouterModule],
|
||||||
declarations: [
|
declarations: [
|
||||||
PluginComponent,
|
PluginComponent,
|
||||||
// ANestedComponent,
|
// ANestedComponent,
|
||||||
ApiclientFormComponent,
|
|
||||||
ApiclientConsumptionComponent,
|
|
||||||
ApiclientSubscriptionComponent
|
|
||||||
],
|
],
|
||||||
entryComponents: [PluginComponent],
|
entryComponents: [PluginComponent],
|
||||||
providers: [{
|
providers: [{
|
||||||
@@ -28,11 +23,15 @@ import { ANestedComponent } from './a-nested.component';
|
|||||||
}]
|
}]
|
||||||
})
|
})
|
||||||
export class PluginModule implements FrontendPlugin{
|
export class PluginModule implements FrontendPlugin{
|
||||||
getSidebarEntry(): SidebarEntry {
|
getSidebarEntry(): SidebarEntries {
|
||||||
return {
|
return {
|
||||||
icon: "wrench",
|
icon: "wrench",
|
||||||
route: "pluginmanager",
|
parentRoute: "pluginmanager",
|
||||||
text: "Plugin manager",
|
text: "Plugin manager",
|
||||||
|
links: [{
|
||||||
|
route: "debug",
|
||||||
|
text: "DEBUG"
|
||||||
|
}]
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user