diff options
Diffstat (limited to 'frontend/src')
| -rw-r--r-- | frontend/src/app/_elements/reactive-background/reactive-background.component.ts | 15 | ||||
| -rw-r--r-- | frontend/src/app/app.component.html | 6 |
2 files changed, 14 insertions, 7 deletions
diff --git a/frontend/src/app/_elements/reactive-background/reactive-background.component.ts b/frontend/src/app/_elements/reactive-background/reactive-background.component.ts index 4cafbc6d..97387ac8 100644 --- a/frontend/src/app/_elements/reactive-background/reactive-background.component.ts +++ b/frontend/src/app/_elements/reactive-background/reactive-background.component.ts @@ -145,10 +145,10 @@ export class ReactiveBackgroundComponent implements AfterViewInit { } drawPoint(p: Point) { - this.ctx!.fillStyle = this.pointColor; - this.ctx!.beginPath(); - this.ctx!.arc(p.x * this.width, p.y * this.height, p.size * this.screenDepth(p.x), 0, 2 * Math.PI); - this.ctx!.fill(); + this.ctx.fillStyle = this.pointColor; + this.ctx.beginPath(); + this.ctx.arc(p.x * this.width, p.y * this.height, p.size * this.screenDepth(p.x), 0, 2 * Math.PI); + this.ctx.fill(); } resize() { @@ -161,6 +161,13 @@ export class ReactiveBackgroundComponent implements AfterViewInit { this.canvas.height = this.height; } + if (this.cookie.check('animateBackground')) { + this.animate = this.cookie.get('animateBackground') == 'true'; + } + if (this.cookie.check('backgroundFill')) { + this.fill = parseFloat(this.cookie.get('backgroundFill')); + } + this.drawBackground(); } diff --git a/frontend/src/app/app.component.html b/frontend/src/app/app.component.html index 984389c4..aae2f75d 100644 --- a/frontend/src/app/app.component.html +++ b/frontend/src/app/app.component.html @@ -1,9 +1,9 @@ <app-gradient-background colorHorizontal1="rgba(0, 8, 45, 0.5)" colorHorizontal2="rgba(0, 52, 89, 0.5)" colorVertical1="rgba(0, 52, 89, 0.5)" colorVertical2="rgba(0, 152, 189, 0.5)"></app-gradient-background> -<app-reactive-background [speed]="0.0005" [scrollSpeed]="0.25" [minDistance]="0.1" [maxSize]="4" [cursorDistance]="0.17" lineColor="#00a8e8" pointColor="rgba(0, 188, 252, 0.33)" cursorLineColor="#00a8e8" [numPoints]="200"> +<app-reactive-background [speed]="0.0005" [scrollSpeed]="0.25" [minDistance]="0.1" [maxSize]="4" [cursorDistance]="0.17" lineColor="#00a8e8" pointColor="rgba(0, 188, 252, 0.33)" cursorLineColor="#00a8e8" [numPoints]="300"> </app-reactive-background> -<app-reactive-background [speed]="0.0008" [scrollSpeed]="0.5" [minDistance]="0.12" [maxSize]="6" [cursorDistance]="0.19" lineColor="#00a8e8" pointColor="rgba(0, 188, 252, 0.66)" cursorLineColor="#00a8e8" [numPoints]="100"> +<app-reactive-background [speed]="0.0008" [scrollSpeed]="0.5" [minDistance]="0.12" [maxSize]="6" [cursorDistance]="0.19" lineColor="#00a8e8" pointColor="rgba(0, 188, 252, 0.66)" cursorLineColor="#00a8e8" [numPoints]="200"> </app-reactive-background> -<app-reactive-background [speed]="0.001" [scrollSpeed]="1" [minDistance]="0.14" [maxSize]="8" [cursorDistance]="0.22" lineColor="#00a8e8" pointColor="rgba(0, 188, 252, 1)" cursorLineColor="#00a8e8" [numPoints]="50"> +<app-reactive-background [speed]="0.001" [scrollSpeed]="1" [minDistance]="0.14" [maxSize]="8" [cursorDistance]="0.22" lineColor="#00a8e8" pointColor="rgba(0, 188, 252, 1)" cursorLineColor="#00a8e8" [numPoints]="100"> </app-reactive-background> <app-navbar></app-navbar> <a class="bg-controls" routerLink="playground">pozadina</a> |