{"version":3,"file":"omnedia-ngx-flickering-grid.mjs","sources":["../../../projects/ngx-flickering-grid/src/lib/ngx-flickering-grid.component.ts","../../../projects/ngx-flickering-grid/src/lib/ngx-flickering-grid.component.html","../../../projects/ngx-flickering-grid/src/public-api.ts","../../../projects/ngx-flickering-grid/src/omnedia-ngx-flickering-grid.ts"],"sourcesContent":["import {CommonModule, isPlatformBrowser} from \"@angular/common\";\r\nimport {\r\n AfterViewInit,\r\n ChangeDetectionStrategy,\r\n Component,\r\n ElementRef,\r\n Inject,\r\n Input,\r\n OnDestroy,\r\n PLATFORM_ID,\r\n ViewChild,\r\n} from \"@angular/core\";\r\n\r\n@Component({\r\n selector: \"om-flickering-grid\",\r\n standalone: true,\r\n imports: [CommonModule],\r\n templateUrl: \"./ngx-flickering-grid.component.html\",\r\n styleUrl: \"./ngx-flickering-grid.component.scss\",\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n})\r\nexport class NgxFlickeringGridComponent implements AfterViewInit, OnDestroy {\r\n @ViewChild(\"OmFlickeringGridBackground\")\r\n background!: ElementRef;\r\n\r\n @ViewChild(\"OmFlickeringGridCanvas\")\r\n canvas!: ElementRef;\r\n\r\n @Input(\"styleClass\")\r\n styleClass?: string;\r\n\r\n @Input(\"squareSize\")\r\n squareSize = 4;\r\n\r\n @Input(\"gridGap\")\r\n gridGap = 6;\r\n\r\n @Input(\"flickerChance\")\r\n flickerChance = 0.3;\r\n\r\n @Input(\"color\")\r\n color = \"#6B7280\";\r\n\r\n @Input(\"maxOpacity\")\r\n maxOpacity = 0.3;\r\n\r\n private intersectionObserver?: IntersectionObserver;\r\n\r\n private ctx!: CanvasRenderingContext2D;\r\n private cols: number = 0;\r\n private rows: number = 0;\r\n private squares?: Float32Array;\r\n private lastAnimationTime: number = 0;\r\n private animationFrameId?: number;\r\n private memoizedColor: string = \"rgba(0, 0, 0,\";\r\n\r\n private isInView = false;\r\n private animating = false;\r\n\r\n constructor(\r\n @Inject(PLATFORM_ID) private platformId: object\r\n ) {\r\n }\r\n\r\n ngAfterViewInit(): void {\r\n this.initCanvas();\r\n\r\n if (isPlatformBrowser(this.platformId)) {\r\n this.intersectionObserver = new IntersectionObserver(([entry]) => {\r\n this.renderContents(entry.isIntersecting);\r\n });\r\n this.intersectionObserver.observe(this.canvas.nativeElement);\r\n }\r\n }\r\n\r\n ngOnDestroy(): void {\r\n window.removeEventListener(\"resize\", () => this.setCanvasSize());\r\n\r\n if (this.intersectionObserver) {\r\n this.intersectionObserver.disconnect();\r\n }\r\n\r\n if (this.animationFrameId) {\r\n cancelAnimationFrame(this.animationFrameId);\r\n }\r\n }\r\n\r\n renderContents(isIntersecting: boolean) {\r\n if (isIntersecting && !this.isInView) {\r\n this.isInView = true;\r\n\r\n if (!this.animating) {\r\n this.animationFrameId = requestAnimationFrame((time) =>\r\n this.animateCanvas(time)\r\n );\r\n }\r\n } else if (!isIntersecting) {\r\n this.isInView = false;\r\n }\r\n }\r\n\r\n initCanvas(): void {\r\n this.setCanvasSize();\r\n this.setMemoizedColor();\r\n\r\n window.addEventListener(\"resize\", () => this.setCanvasSize());\r\n\r\n if (!this.animating) {\r\n this.animationFrameId = requestAnimationFrame((time) =>\r\n this.animateCanvas(time)\r\n );\r\n }\r\n }\r\n\r\n setMemoizedColor(): void {\r\n if (typeof window === \"undefined\") {\r\n this.memoizedColor = `rgba(0, 0, 0,`;\r\n return;\r\n }\r\n const canvas = document.createElement(\"canvas\");\r\n canvas.width = canvas.height = 1;\r\n const ctx = canvas.getContext(\"2d\", {\r\n willReadFrequently: true,\r\n });\r\n\r\n if (!ctx) {\r\n this.memoizedColor = `rgba(0, 0, 0,`;\r\n return;\r\n }\r\n\r\n ctx.fillStyle = this.color;\r\n ctx.fillRect(0, 0, 1, 1);\r\n const [r, g, b] = ctx.getImageData(0, 0, 1, 1).data;\r\n\r\n this.memoizedColor = `rgba(${r}, ${g}, ${b},`;\r\n return;\r\n }\r\n\r\n animateCanvas(time: number): void {\r\n if (!this.isInView) {\r\n this.animating = false;\r\n return;\r\n }\r\n\r\n this.animating = true;\r\n\r\n const deltaTime = (time - this.lastAnimationTime) / 1000;\r\n this.lastAnimationTime = time;\r\n\r\n this.updateSquares(deltaTime);\r\n this.drawGrid();\r\n this.animationFrameId = requestAnimationFrame((time) =>\r\n this.animateCanvas(time)\r\n );\r\n }\r\n\r\n setCanvasSize(): void {\r\n this.canvas.nativeElement.width =\r\n this.background.nativeElement.getBoundingClientRect().width;\r\n this.canvas.nativeElement.height =\r\n this.background.nativeElement.getBoundingClientRect().height;\r\n\r\n this.setupCanvas();\r\n\r\n this.ctx = this.canvas.nativeElement.getContext(\"2d\", {\r\n willReadFrequently: true,\r\n }) as CanvasRenderingContext2D;\r\n }\r\n\r\n setupCanvas(): void {\r\n this.cols = Math.ceil(\r\n this.canvas.nativeElement.width / (this.squareSize + this.gridGap)\r\n );\r\n this.rows = Math.ceil(\r\n this.canvas.nativeElement.height / (this.squareSize + this.gridGap)\r\n );\r\n\r\n this.squares = new Float32Array(this.cols * this.rows);\r\n for (let i = 0; i < this.squares.length; i++) {\r\n this.squares[i] = Math.random() * this.maxOpacity;\r\n }\r\n }\r\n\r\n updateSquares(deltaTime: number): void {\r\n if (!this.squares) {\r\n return;\r\n }\r\n\r\n for (let i = 0; i < this.squares.length; i++) {\r\n if (Math.random() < this.flickerChance * deltaTime) {\r\n this.squares[i] = Math.random() * this.maxOpacity;\r\n }\r\n }\r\n }\r\n\r\n drawGrid(): void {\r\n if (!this.squares) {\r\n return;\r\n }\r\n\r\n this.ctx.clearRect(\r\n 0,\r\n 0,\r\n this.canvas.nativeElement.width,\r\n this.canvas.nativeElement.height\r\n );\r\n this.ctx.fillStyle = \"transparent\";\r\n this.ctx.fillRect(\r\n 0,\r\n 0,\r\n this.canvas.nativeElement.width,\r\n this.canvas.nativeElement.height\r\n );\r\n\r\n for (let i = 0; i < this.cols; i++) {\r\n for (let j = 0; j < this.rows; j++) {\r\n const opacity = this.squares[i * this.rows + j];\r\n\r\n this.ctx.fillStyle = `${this.memoizedColor}${opacity})`;\r\n this.ctx.fillRect(\r\n i * (this.squareSize + this.gridGap),\r\n j * (this.squareSize + this.gridGap),\r\n this.squareSize,\r\n this.squareSize\r\n );\r\n }\r\n }\r\n }\r\n}\r\n","
\r\n
\r\n \r\n
\r\n
\r\n \r\n
\r\n
","/*\r\n * Public API Surface of ngx-flickering-grid\r\n */\r\n\r\nexport * from './lib/ngx-flickering-grid.component';\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}