import {Component, Input} from '@angular/core';
import {ActivatedRoute} from '@angular/router';

@Component({
    selector: 'showTitle',
    template: `
        <h2 *ngIf="title != undefined">
            <!--span [class]="'entityTitleIcon '+iconClass"></span-->
            <span   *ngIf="title['url'] != undefined && title['url'] != null && title['url'] != ''"
                    class="custom-external">
                    <!--span class=" custom-icon {{title['accessMode']}}"
                    uk-tooltip="pos:bottom-right"
                    [title]="title['accessMode']"-->
                <a *ngIf="title['name'] != undefined && title['name'] != ''"
                    href="{{title['url']}}" target="_blank"
                    [innerHTML]="title['name']">
                </a>
                <a *ngIf="title['name'] == undefined || title['name'] == ''"
                    href="{{title['url']}}" target="_blank">
                    [no title available]
                </a>
            <!--/span-->
            </span>
            <span *ngIf="(title['name'] != undefined && title['name'] != '') &&
                    (title['url'] == undefined || title['url'] == null || title['url'] == '')"
                    [innerHTML]="title['name']">
            </span>
            <span *ngIf="(title['name'] == undefined || title['name'] == '') &&
                    (title['url'] == undefined || title['url'] == null || title['url'] == '')"
                     >
                [no title available]
            </span>
        </h2>
        <!--[class]="title['accessMode']"
        uk-tooltip="pos:bottom-right"
        [title]="title['accessMode']"
        [innerHTML]="title['name']" -->
    `

    })

export class ShowTitleComponent {
  @Input() title: { [key: string]: string };
  @Input() iconClass:string;

  sub: any;

  constructor (private route: ActivatedRoute) {}

  ngOnInit() {
    this.sub = this.route.queryParams.subscribe(
      params => {
        console.info("onInit showTitle");

        if(this.title['accessMode'] == undefined) {
          this.title['accessMode'] = "";
        }
      }
    );
  }

  ngOnDestroy() {
    console.info("onDestroy showTitle");
    this.sub.unsubscribe();
  }
}