import { pluck, mergeMap, tap } from "rxjs/operators";
import { Component } from "@angular/core";
import { WidgetConfig } from "../../widget.configuration";
import {
  WidgetComponent,
  WidgetId,
  WidgetConfiguration,
  WidgetConfigure,
  WidgetInput,
} from "../../widget.metadata";
import { Subject } from "rxjs";
import { WidgetframeService } from "../../widgetframe/widgetframe.service";

declare var contextPath: string;
declare var $;

@WidgetComponent("nm-workflow-viewer")
@Component({
  selector: "nm-workflow-viewer",
  templateUrl: "./workflow-viewer.component.html",
  styleUrls: ["./workflow-viewer.component.scss"],
  providers: [WidgetframeService],
})
export class WorkflowViewerComponent {
  public xml: string;
  public viewer: string;

  @WidgetInput("workflow-viewer")
  public workflowViewer = new Subject<any>();

  @WidgetInput("workflow-process")
  public workflowProcess = new Subject<any>();

  @WidgetConfiguration()
  public configuration: WidgetConfig;

  @WidgetId()
  public _id;

  private name: string;
  constructor(private widgetFrameService: WidgetframeService) {}

  @WidgetConfigure()
  protected configureWidget(configuration: WidgetConfig) {
    this.workflowViewer.subscribe((data) => {
      this.viewer = data;
    });
    this.workflowProcess
      .pipe(
        tap(
          (link) =>
            (this.name = link.substring(link.lastIndexOf("/") + 1, link.length))
        ),
        mergeMap((link) => this.widgetFrameService.getData(link)),
        pluck("data")
      )
      .subscribe((data: string) => {
        this.xml = data;
      });
  }

  download() {
    if (this.xml) {
      const a = document.createElement("a");
      document.body.appendChild(a);
      const blob = new Blob([this.xml], { type: "application/xml" });
      const url = window.URL.createObjectURL(blob);
      a.href = url;
      a.download = this.name + ".xml";
      a.click();
      window.URL.revokeObjectURL(url);
      document.body.removeChild(a);
    }
  }
}