diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts
index bf5f12c..3e4eabc 100644
--- a/src/app/app-routing.module.ts
+++ b/src/app/app-routing.module.ts
@@ -2,6 +2,7 @@ import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { DashboardComponent } from './components/dashboard/dashboard.component';
+import { SettingsComponent } from './components/settings/settings.component';
import { SplashComponent } from './components/splash/splash.component';
import { WorkerGroupComponent } from './components/worker-group/worker-group.component';
import { WorkerComponent } from './components/worker/worker.component';
@@ -19,6 +20,10 @@ const routes: Routes = [
{
path: ':address',
children: [
+ {
+ path: 'settings',
+ component: SettingsComponent
+ },
{
path: '',
component: DashboardComponent,
@@ -26,6 +31,7 @@ const routes: Routes = [
{
path: ':workerName',
children: [
+
{
path: '',
component: WorkerGroupComponent
@@ -35,7 +41,8 @@ const routes: Routes = [
component: WorkerComponent
}
]
- }
+ },
+
]
}
diff --git a/src/app/app.component.html b/src/app/app.component.html
index 6074af9..e7c1f29 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -1,2 +1,2 @@
-
+
\ No newline at end of file
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index e79f631..104b3b3 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -1,4 +1,7 @@
import { Component } from '@angular/core';
+import { Observable } from 'rxjs';
+
+import { LocalStorageService } from './services/local-storage.service';
@Component({
selector: 'app-root',
@@ -7,4 +10,9 @@ import { Component } from '@angular/core';
})
export class AppComponent {
title = 'public-pool-ui';
+
+ public particles$: Observable;
+ constructor(private localService: LocalStorageService) {
+ this.particles$ = this.localService.particles$;
+ }
}
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 61023b5..9d48d0c 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -18,6 +18,7 @@ import { AppLayoutModule } from './layout/app.layout.module';
import { DateAgoPipe } from './pipes/date-ago.pipe';
import { HashSuffixPipe } from './pipes/hash-suffix.pipe';
import { NumberSuffixPipe } from './pipes/number-suffix.pipe';
+import { SettingsComponent } from './components/settings/settings.component';
@@ -31,7 +32,8 @@ import { NumberSuffixPipe } from './pipes/number-suffix.pipe';
DateAgoPipe,
WorkerGroupComponent,
BackgroundParticlesComponent,
- HashSuffixPipe
+ HashSuffixPipe,
+ SettingsComponent
],
imports: [
CommonModule,
diff --git a/src/app/components/background-particles/background-particles.component.ts b/src/app/components/background-particles/background-particles.component.ts
index 69c9645..5565a20 100644
--- a/src/app/components/background-particles/background-particles.component.ts
+++ b/src/app/components/background-particles/background-particles.component.ts
@@ -32,7 +32,7 @@ export class BackgroundParticlesComponent implements OnInit {
const lineColor: string = '#afccfa';
this.particleOptions = {
- fpsLimit: this.deviceService.isDesktop() ? 30 : 1,
+ fpsLimit: 30,
detectRetina: true,
background: {
position: "50% 50%",
@@ -75,11 +75,11 @@ export class BackgroundParticlesComponent implements OnInit {
}
particlesLoaded(container: Container): void {
- console.log(container);
+
}
async particlesInit(engine: Engine): Promise {
- console.log(engine);
+
// Starting from 1.19.0 you can add custom presets or shape here, using the current tsParticles instance (main)
// this loads the tsparticles package bundle, it's the easiest method for getting everything ready
diff --git a/src/app/components/settings/settings.component.html b/src/app/components/settings/settings.component.html
new file mode 100644
index 0000000..58fa911
--- /dev/null
+++ b/src/app/components/settings/settings.component.html
@@ -0,0 +1,4 @@
+
\ No newline at end of file
diff --git a/src/app/components/settings/settings.component.scss b/src/app/components/settings/settings.component.scss
new file mode 100644
index 0000000..e69de29
diff --git a/src/app/components/settings/settings.component.spec.ts b/src/app/components/settings/settings.component.spec.ts
new file mode 100644
index 0000000..c2333ad
--- /dev/null
+++ b/src/app/components/settings/settings.component.spec.ts
@@ -0,0 +1,21 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { SettingsComponent } from './settings.component';
+
+describe('SettingsComponent', () => {
+ let component: SettingsComponent;
+ let fixture: ComponentFixture;
+
+ beforeEach(() => {
+ TestBed.configureTestingModule({
+ declarations: [SettingsComponent]
+ });
+ fixture = TestBed.createComponent(SettingsComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/components/settings/settings.component.ts b/src/app/components/settings/settings.component.ts
new file mode 100644
index 0000000..8519d8e
--- /dev/null
+++ b/src/app/components/settings/settings.component.ts
@@ -0,0 +1,24 @@
+import { Component } from '@angular/core';
+
+import { LocalStorageService } from '../../services/local-storage.service';
+
+@Component({
+ selector: 'app-settings',
+ templateUrl: './settings.component.html',
+ styleUrls: ['./settings.component.scss']
+})
+export class SettingsComponent {
+
+ public stateOptions: any[] = [{ label: 'On', value: true }, { label: 'Off', value: false },];
+
+ public value: boolean = true;
+
+ constructor(private localStorageService: LocalStorageService) {
+ this.value = this.localStorageService.getParticles();
+ }
+
+ public particlesChanged(newVal: boolean) {
+ this.localStorageService.setParticles(newVal);
+ this.value = newVal;
+ }
+}
diff --git a/src/app/layout/app.menu.component.ts b/src/app/layout/app.menu.component.ts
index 95a5cfe..63dec8f 100644
--- a/src/app/layout/app.menu.component.ts
+++ b/src/app/layout/app.menu.component.ts
@@ -39,11 +39,12 @@ export class AppMenuComponent implements OnInit {
return [
{
- label: 'Home',
+ label: 'Dashboard',
items: [
- { label: 'Dashboard', icon: 'pi pi-fw pi-home', routerLink: [params.address] }
+ { label: 'Dashboard', icon: 'pi pi-fw pi-home', routerLink: [params.address] },
+ { label: 'Settings', icon: 'pi pi-fw pi-cog', routerLink: [params.address, 'settings'] }
]
- },
+ }
];
diff --git a/src/app/services/local-storage.service.spec.ts b/src/app/services/local-storage.service.spec.ts
new file mode 100644
index 0000000..ba1dbd4
--- /dev/null
+++ b/src/app/services/local-storage.service.spec.ts
@@ -0,0 +1,16 @@
+import { TestBed } from '@angular/core/testing';
+
+import { LocalStorageService } from './local-storage.service';
+
+describe('LocalStorageService', () => {
+ let service: LocalStorageService;
+
+ beforeEach(() => {
+ TestBed.configureTestingModule({});
+ service = TestBed.inject(LocalStorageService);
+ });
+
+ it('should be created', () => {
+ expect(service).toBeTruthy();
+ });
+});
diff --git a/src/app/services/local-storage.service.ts b/src/app/services/local-storage.service.ts
new file mode 100644
index 0000000..deff011
--- /dev/null
+++ b/src/app/services/local-storage.service.ts
@@ -0,0 +1,44 @@
+import { Injectable } from '@angular/core';
+import { BehaviorSubject, Observable, shareReplay } from 'rxjs';
+
+@Injectable({
+ providedIn: 'root'
+})
+export class LocalStorageService {
+
+ private PARTICLES = 'PARTICLES';
+
+ private _particles$: BehaviorSubject;
+ public particles$: Observable;
+
+ constructor() {
+ this._particles$ = new BehaviorSubject(this.getParticles());
+ this.particles$ = this._particles$.asObservable().pipe(shareReplay({ refCount: true, bufferSize: 1 }));
+ }
+
+ private get(key: string): string | null {
+ return localStorage.getItem(key);
+ }
+
+ private set(key: string, value: string) {
+ localStorage.setItem(key, value);
+ }
+
+ private remove(key: string): void {
+ localStorage.removeItem(key);
+ }
+
+
+ public getParticles(): boolean {
+ const result = this.get(this.PARTICLES);
+ return result == null || JSON.parse(result)?.particles === true;
+ }
+
+ public setParticles(particles: boolean) {
+ this.set(this.PARTICLES, JSON.stringify({ particles }));
+ this._particles$.next(particles);
+
+ }
+
+
+}
diff --git a/src/prime-ng.module.ts b/src/prime-ng.module.ts
index de16ee6..2a4460b 100644
--- a/src/prime-ng.module.ts
+++ b/src/prime-ng.module.ts
@@ -19,6 +19,7 @@ import { MenuModule } from 'primeng/menu';
import { OverlayPanelModule } from 'primeng/overlaypanel';
import { PanelModule } from 'primeng/panel';
import { ProgressSpinnerModule } from 'primeng/progressspinner';
+import { SelectButtonModule } from 'primeng/selectbutton';
import { StepsModule } from 'primeng/steps';
import { StyleClassModule } from 'primeng/styleclass';
import { TableModule } from 'primeng/table';
@@ -28,6 +29,7 @@ import { ToastModule } from 'primeng/toast';
+
export const primeNgServices = [
MessageService,
ConfirmationService
@@ -58,7 +60,8 @@ const primeNgModules = [
ChartModule,
TagModule,
StyleClassModule,
- PanelModule
+ PanelModule,
+ SelectButtonModule
];