Added resize handling

omnedia · Aug 27, 2024 · 228a258 · 228a258
1 parent 496fbf7
commit 228a258
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 2 deletions.
diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@omnedia/ngx-starry-sky",
   "description": "A simple component library to create a container with an animated background.",
-  "version": "1.0.2",
+  "version": "1.0.3",
   "peerDependencies": {
     "@angular/common": "^18.2.0",
     "@angular/core": "^18.2.0"

diff --git a/src/lib/ngx-starry-sky.component.ts b/src/lib/ngx-starry-sky.component.ts
@@ -4,6 +4,7 @@ import {
   Component,
   ElementRef,
   Input,
+  OnDestroy,
   ViewChild,
 } from "@angular/core";
 import {
@@ -20,7 +21,7 @@ import {
   templateUrl: "./ngx-starry-sky.component.html",
   styleUrl: "./ngx-starry-sky.component.scss",
 })
-export class NgxStarrySkyComponent implements AfterViewInit {
+export class NgxStarrySkyComponent implements AfterViewInit, OnDestroy {
   @ViewChild("OmStarrySkyCanvas")
   canvasRef!: ElementRef<HTMLCanvasElement>;
 
@@ -81,7 +82,13 @@ export class NgxStarrySkyComponent implements AfterViewInit {
     this.initShootingStars();
   }
 
+  ngOnDestroy(): void {
+    window.removeEventListener("resize", () => this.setCanvasSize());
+  }
+
   private initStarSky(): void {
+    window.addEventListener("resize", () => this.setCanvasSize());
+
     this.setCanvasSize();
     this.updateStars();
     this.renderStarSky();