import {Directive, EventEmitter, Input, OnDestroy, Output} from '@angular/core';
import {Plugin} from "../../../utils/entities/adminTool/plugin";
import {PluginTemplate} from "../../../utils/entities/adminTool/pluginTemplate";
import {EnvProperties} from "../../../utils/properties/env-properties";
import {properties} from 'src/environments/environment';
import {Subscriber} from "rxjs";

export class PluginEditEvent {
  field:string;
  type:"text" | "HTML" | "boolean" | 'parent';
  value?:any;
}

export class PluginBaseInfo {
  title: string = "Lorem ipsum";
  constructor() {
  }
}
export class PluginURL {
  url:string;
  linkText:string;
  target:string;
  constructor(url,linkText, target = "_blank") {
    this.url = url;
    this.linkText = linkText;
    this.target = target;
  }

}

export class PluginInfoCards{
  title:string;
  description:string;
  urls:PluginURL[];
  image?:string;
  show:boolean;
}
@Directive()
 export abstract class PluginBaseComponent<T extends PluginBaseInfo> implements  OnDestroy {
  public properties: EnvProperties = properties;
  @Input() editMode =false;
  @Input() plugin:Plugin;
  @Input() pluginTemplate:PluginTemplate;
  @Input() editTemplate:boolean = false;
  @Input() pluginObject:T;
  @Output() valuesChanged:EventEmitter<PluginEditEvent> = new EventEmitter<any>();
  subscriptions = [];
  pluginEditEvent:PluginEditEvent;
  /*default:T;*/
  constructor() {

  }
  ngOnInit(): void {
    // console.log(this.default)
    /*if (this.pluginTemplate && (!this.pluginDefaultObject || !this.pluginDefaultObject.title) && this.default) {
      this.pluginTemplate.object = Object.assign(this.default);
    }*/

  }

    ngOnDestroy() {
    this.subscriptions.forEach(subscription => {
      if (subscription instanceof Subscriber) {
        subscription.unsubscribe()
      } else if (subscription instanceof Function) {
        subscription();
      } else if (typeof IntersectionObserver !== 'undefined' && subscription instanceof IntersectionObserver) {
        subscription.disconnect();
      } else if (typeof ResizeObserver !== 'undefined' && subscription instanceof ResizeObserver) {
        subscription.disconnect();
      }
    });
  }
  valueChanged($event:PluginEditEvent){
    if(this.editTemplate){
      this.pluginTemplate.object[$event.field]=$event.value;
      this.pluginObject[$event.field]=$event.value;
    }else{
      this.plugin.object[$event.field]=$event.value;
    }
    this.valuesChanged.emit($event)
  }

  isVisible(field){
    return (this.plugin && this.plugin.object && this.plugin.object[field] == true) /*  plugin is on anyway */
      || (!this.plugin &&  this.pluginTemplate && this.pluginTemplate.object && this.pluginTemplate.object[field] == true)  /* template is on */
  }
  /*get pluginObject():T{
    return this.plugin?this.plugin.object:null;
  }
  get pluginDefaultObject():T{
    return this.pluginTemplate?this.pluginTemplate.object:null;
  }*/

}