import { AfterViewChecked, AfterViewInit, Component, Input, NgZone, OnChanges, OnInit, SimpleChanges } from '@angular/core'; import { Tile } from '../calculator/calculator.types'; import { LineService } from '../line/line.service'; @Component({ selector: 'app-field', templateUrl: './field.component.html', styleUrls: ['./field.component.scss'] }) export class FieldComponent implements OnInit, OnChanges { @Input() public matrix: Array<Tile> = []; // @TODO: change @Input() public doClears = false; constructor( private lineService: LineService ) { } ngOnInit() { } public drawLines() { if (this.doClears) { this.lineService.clearLines(); } this.matrix.forEach((tile) => { if (tile.targets) { this.lineService.createLine( 'tile' + tile.id, 'tile' + tile.targets.id, tile.lineColour ) } if (tile.summonTargets) { this.lineService.createLine( 'tile' + tile.id, 'tile' + tile.summonTargets.id, tile.summonLineColour, true ) } }); } public ngOnChanges(changes: SimpleChanges): void { try { this.drawLines(); } catch (error) { console.error(error) try { setTimeout(() => this.drawLines(), 100); } catch (error) { console.error('We tried :(', error) } } } }