import { AfterViewInit, Component, ElementRef, Input, OnInit, ViewChild } from '@angular/core';
import { Board } from '@creedinteractive/onguard-models';

@Component({
    selector: 'onguard-cabinet-board',
    templateUrl: './cabinet-board.component.html',
    styleUrls: ['./cabinet-board.component.scss'],
})
export class CabinetBoardComponent implements OnInit, AfterViewInit {
    @Input() board: Board = null;
    isHorizontal: boolean = true;
    // Used to assign a class to the icon container.
    iconType: string;
    iconSrc: string;

    boardKeys = {
        hardware: '',
        firmware: '',
        ports: '',
        portsUsed: '',
    };

    @ViewChild('container') boardContainer: ElementRef<HTMLDivElement>;
    @ViewChild('boardImage') boardImage: ElementRef<HTMLDivElement>;

    constructor() {}

    ngOnInit(): void {
        this.iconType = this.determineIcon();
        this.iconSrc = `./assets/images/assets-icons/${this.iconType}.svg`;
    }

    ngAfterViewInit() {
        setTimeout(() => {
            const height = this.boardContainer.nativeElement.offsetHeight;
            const width = this.boardContainer.nativeElement.offsetWidth;

            if (height > width) {
                this.isHorizontal = false;
                this.boardImage.nativeElement.setAttribute('style', `height: ${width}px;`);
            } else {
                this.boardImage.nativeElement.setAttribute('style', `width: ${height}px`);
            }

            // These change depending on orientation.
            this.boardKeys.hardware = this.isHorizontal ? 'HW' : 'VIN';
            this.boardKeys.firmware = this.isHorizontal ? 'FW' : 'F';
            this.boardKeys.ports = this.isHorizontal ? 'PTS' : 'P';
            this.boardKeys.portsUsed = this.isHorizontal ? 'USE' : 'U';

            this.boardContainer.nativeElement.setAttribute('style', `opacity: 1`);
        }, 40);
    }

    determineIcon(): string {
        if (!!this.board) {
            switch (this.board.type) {
                case 'ANA MM':
                    return 'analogline';
                case 'MG-ANNOUNCEMENT':
                    return 'announcement';
                case 'ICC MM':
                    return 'processor';
                case 'DS1 MM':
                    return 'ds1interface';
                case 'IP':
                    return 'ipserverinterface';
                case 'DCP MM':
                    return 'dcpmm';
                default:
                    console.error('Unknown Board Type: ', this.board.type);
                    return 'analogline';
            }
        }
    }
}