import {Component, EventEmitter, Input, OnInit, Output} from '@angular/core';
import {Plugin} from "../../../utils/entities/adminTool/plugin";
import {PluginTemplate} from "../../../utils/entities/adminTool/pluginTemplate";
import {PluginEditEvent} from "../utils/base-plugin.component";

@Component({
  selector: 'plugin-wrapper',
  template: `
    <ng-container *ngIf="pluginTemplate">
      <div [class.pluginEditMode]="wrapperEditMode" >
        <ng-container *ngIf="pluginTemplate.code == 'results-numbers'">
          <plugin-results-numbers [plugin]="plugin" [pluginTemplate]="pluginTemplate" [editMode]="editMode" (valuesChanged)="changed.emit($event)" [editTemplate]="editTemplate"></plugin-results-numbers>
        </ng-container>
        <ng-container *ngIf="pluginTemplate.code == 'test'">
          <plugin-test [plugin]="plugin" [pluginTemplate]="pluginTemplate" [editMode]="editMode" (valuesChanged)="changed.emit($event)" [editTemplate]="editTemplate"></plugin-test>
        </ng-container>
        <ng-container *ngIf="pluginTemplate.code == 'openaire-products'">
          <plugin-openaire-products [plugin]="plugin" [pluginTemplate]="pluginTemplate" [editMode]="editMode" (valuesChanged)="changed.emit($event)" [editTemplate]="editTemplate"></plugin-openaire-products>
        </ng-container>
        <ng-container *ngIf="pluginTemplate.code == 'discover-by-subcommunity'">
          <plugin-discover-by-subcommunity [plugin]="plugin" [pluginTemplate]="pluginTemplate" [editMode]="editMode" (valuesChanged)="changed.emit($event)" [editTemplate]="editTemplate"></plugin-discover-by-subcommunity>
        </ng-container>
        <ng-container *ngIf="pluginTemplate.code == 'gateway-information'">
          <plugin-gateway-information [plugin]="plugin" [pluginTemplate]="pluginTemplate" [editMode]="editMode" (valuesChanged)="changed.emit($event)" [editTemplate]="editTemplate"></plugin-gateway-information>
        </ng-container>
        <ng-container *ngIf="pluginTemplate.code == 'search-deposit-link'">
          <plugin-search-deposit-link [plugin]="plugin" [pluginTemplate]="pluginTemplate" [editMode]="editMode" (valuesChanged)="changed.emit($event)" [editTemplate]="editTemplate"></plugin-search-deposit-link>
        </ng-container>
        <ng-container *ngIf="pluginTemplate.code == 'learn-and-connect'">
          <plugin-learn-and-connect [plugin]="plugin" [pluginTemplate]="pluginTemplate" [editMode]="editMode" (valuesChanged)="changed.emit($event)" [editTemplate]="editTemplate"></plugin-learn-and-connect>
        </ng-container>
        <ng-container *ngIf="pluginTemplate.code == 'how-to-use'">
          <plugin-how-to-use [plugin]="plugin" [pluginTemplate]="pluginTemplate" [editMode]="editMode" (valuesChanged)="changed.emit($event)" [editTemplate]="editTemplate"></plugin-how-to-use>
        </ng-container>
        <ng-container *ngIf="pluginTemplate.code == 'suggested-repositories'">
          <plugin-suggested-repositories [plugin]="plugin" [pluginTemplate]="pluginTemplate" [editMode]="editMode" (valuesChanged)="changed.emit($event)" [editTemplate]="editTemplate"></plugin-suggested-repositories>
        </ng-container>
        <ng-container *ngIf="pluginTemplate.code == 'featured-datasets'">
          <plugin-featured-datasets [plugin]="plugin" [pluginTemplate]="pluginTemplate" [editMode]="editMode" (valuesChanged)="changed.emit($event)" [editTemplate]="editTemplate"></plugin-featured-datasets>
        </ng-container>
      </div>
    </ng-container>
  `,
  styleUrls: ["edit-plugin.css"]
})
export class PluginWrapperComponent implements OnInit {

  @Input() editMode =false;
  @Input() wrapperEditMode =false;
  @Input() plugin:Plugin;
  @Input() pluginTemplate:PluginTemplate;
  @Input() editTemplate:boolean;
  // @Output() editWrapperClicked:EventEmitter<any> = new EventEmitter()
  @Output() changed:EventEmitter<PluginEditEvent> = new EventEmitter();


  ngOnInit(): void {

  }
}