import { Component } from '@angular/core';
import {ActivatedRoute, Router} from "@angular/router";
import {Subscriber, Subscription} from "rxjs";
import {properties} from "../../../../environments/environment";
import {Meta, Title} from "@angular/platform-browser";
import {RouterHelper} from "../../utils/routerHelper.class";
import {UserManagementService} from "../../services/user-management.service";
import {HttpClient} from "@angular/common/http";

@Component({
  selector: 'deposit',
  template: `
    <div class="uk-section uk-container">
      <div *ngIf="depositMessage">{{depositMessage}}</div>
      <div *ngIf="message" [innerHTML]="message"></div>
      <div *ngIf="showLoading" class="uk-animation-fade uk-margin-top  uk-width-1-1" role="alert">
        <loading></loading>
      </div>
    </div>
  `
})

export class DepositComponent {
  public   subscriptions: Subscription[] = [];

  public showLoading: boolean = false;
  public message: string = "";
  public depositMessage: string = "";

  public source: string = "";
  public code: string = "";

  public gotToken: boolean = false;

  public routerHelper:RouterHelper = new RouterHelper();
  depositService =  "http://localhost:8182/";
  constructor(private route: ActivatedRoute,
              private _router: Router,
              private userManagementService: UserManagementService,
              private _meta: Meta, private _title: Title,  private _http: HttpClient) {}

  ngOnInit() {
    var description = "Openaire, Deposit, Zenodo";
    this.updateTitle("Connect with Zenodo");
    this.updateDescription(description);
    this.updateUrl( properties.domain + properties.baseLink + this.route.url);

    this.subscriptions.push(this.route.queryParams.subscribe(params => {
      this.gotToken = false;
      this.code = params['code'];
      if (this.code) {
          this.getToken();
      } else {
        this.message = "No code provided to authorize OpenAIRE to deposit in your Zenodo account. Please try again!"
      }
    }));
  }

  ngOnDestroy() {
    this.subscriptions.forEach(subscription => {
      if (subscription instanceof Subscriber) {
        subscription.unsubscribe();
      }
    });
  }
  public getToken() {
    this.showLoading = true;
    console.log(this.code)

    // this._http.get(properties.utilsService + "/deposit/getToken?code=" + this.code).subscribe(res => {
    this._http.get(this.depositService + "deposit/zenodo/getTokenByCode?code=" + this.code).subscribe(res => {
      console.log(res)
      res["code"] = this.code
      this.message = "<div>Thank you for authorizing OpenAIRE to use your Zenodo account for deposit!</div>" +
        "<div class='uk-margin-small-top'>This window will automatically close and you will be ready to deposit.</div>";
      if(window && window.opener) {
        window.opener.postMessage(res,"*");
        window.close();
      }
      setTimeout(() => {
        this.message += "<div class='uk-margin-top'>If this window does not close automatically, please close it and continue!</div>";
      }, 3000);
    })

  }


  private updateTitle(title: string) {
    this._title.setTitle(title);
    this._meta.updateTag({content: title}, "property='og:title'");
  }

  private updateDescription(description: string) {
    this._meta.updateTag({content: description}, "name='description'");
    this._meta.updateTag({content: description}, "property='og:description'");
  }

  private updateUrl(url: string) {
    this._meta.updateTag({content: url}, "property='og:url'");
  }
}