import {
  Component,
  OnInit,
  Inject,
  ElementRef,
  AfterViewInit
} from '@angular/core';
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { UCAP_NATIVE_SERVICE, NativeService } from '@ucap-webmessenger/native';

export interface MassDetailDialogData {
  title: string;
  contents: string;
}

// tslint:disable-next-line: no-empty-interface
export interface MassDetailDialogResult {}

@Component({
  selector: 'app-layout-messenger-mass-detail',
  templateUrl: './mass-detail.component.html',
  styleUrls: ['./mass-detail.component.scss']
})
export class MassDetailComponent implements OnInit, AfterViewInit {
  constructor(
    public dialogRef: MatDialogRef<
      MassDetailDialogData,
      MassDetailDialogResult
    >,
    @Inject(MAT_DIALOG_DATA) public data: MassDetailDialogData,
    private elementRef: ElementRef,
    @Inject(UCAP_NATIVE_SERVICE) private nativeService: NativeService
  ) {}

  ngOnInit() {}

  ngAfterViewInit(): void {
    if (
      !!this.elementRef.nativeElement &&
      !!this.elementRef.nativeElement.querySelector('a')
    ) {
      const elements = this.elementRef.nativeElement.querySelectorAll('a');
      elements.forEach(element => {
        element.addEventListener('click', this.onClickEvent.bind(this));
      });
    }
  }

  onClickEvent(event: MouseEvent) {
    this.nativeService.openDefaultBrowser(
      (event.target as HTMLAnchorElement).text
    );
  }

  onClickConfirm(): void {
    this.dialogRef.close();
  }
}