import {Component, OnInit, ViewChild} from '@angular/core';
import {RemoveContentProvidersComponent} from './remove-content-providers.component';
import {Title} from '@angular/platform-browser';
import {
  FullScreenModalComponent
} from "../../openaireLibrary/utils/modal/full-screen-modal/full-screen-modal.component";
import {StringUtils} from "../../openaireLibrary/utils/string-utils.class";
import {EnvProperties} from "../../openaireLibrary/utils/properties/env-properties";
import {properties} from "../../../environments/environment";
import {Subscriber} from "rxjs";
import {CommunityInfo} from "../../openaireLibrary/connect/community/communityInfo";
import {CommunityService} from "../../openaireLibrary/connect/community/community.service";
import {ContentProvider} from "../../openaireLibrary/utils/entities/contentProvider";
import {OpenaireEntities} from "../../openaireLibrary/utils/properties/searchFields";
import {CriteriaComponent} from "./criteria/criteria.component";

@Component({
  selector: 'manage-content-providers',
  template: `
    <remove-content-providers #removeContentProviders (addContentProviders)="openAddContentProviders()"
                              [communityContentProviders]="communityContentProviders"
                              [loading]="showLoadingInRemove" [community]="community" [disableAdd]="addContentProviders.loading"
                              (editCriteria)="openCriteria($event)"
                              (communityContentProvidersChanged)="communityContentProvidersChanged($event)">
    </remove-content-providers>
    <fs-modal #addContentProvidersModal>
      <add-content-providers #addContentProviders [communityContentProviders]="communityContentProviders" [community]="community"
                             (communityContentProvidersChanged)="communityContentProvidersChanged($event)"></add-content-providers>
    </fs-modal>
    <fs-modal #filtersModal (okEmitter)="saveCriteria()" (cancelEmitter)="criteria.reset()" [okButtonDisabled]="criteria && criteria.disabled">
      <div class="uk-container">
        <criteria #criteria *ngIf="contentProvider" [dataProvider]="contentProvider"></criteria>
      </div>
    </fs-modal>
  `
})

export class ManageContentProvidersComponent implements OnInit {
  communityContentProviders: ContentProvider[] = [];
  @ViewChild(RemoveContentProvidersComponent) removeContentProvidersComponent: RemoveContentProvidersComponent;
  @ViewChild('criteria') criteria: CriteriaComponent;
  @ViewChild('addContentProvidersModal', { static: true }) addContentProvidersModal: FullScreenModalComponent;
  @ViewChild('filtersModal', { static: true }) filtersModal: FullScreenModalComponent;
  private subscriptions: any[] = [];
  public showLoadingInRemove: boolean = true;
  public body: string = "Send from page";
  public properties: EnvProperties = properties;
  public community: CommunityInfo;
  public contentProvider: ContentProvider;

  constructor(private title: Title,
              private communityService: CommunityService) {
  }

  ngOnInit() {
    this.subscriptions.push(this.communityService.getCommunityAsObservable().subscribe(community => {
      this.community = community;
      if (this.community) {
        this.title.setTitle(this.community.shortTitle.toUpperCase() + ' | ' + OpenaireEntities.DATASOURCES);
        this.body = "[Please write your message here]";
        this.body = StringUtils.URIEncode(this.body);
      }
    }));
  }

  public ngOnDestroy() {
    this.subscriptions.forEach(sub => {
      if (sub instanceof Subscriber) {
        sub.unsubscribe();
      }
    });
  }
  
  public openAddContentProviders() {
    this.addContentProvidersModal.title = "Search and Add " + OpenaireEntities.DATASOURCES;
    this.addContentProvidersModal.okButtonText = "Done";
    this.addContentProvidersModal.back = true;
    this.addContentProvidersModal.okButton = true;
    this.addContentProvidersModal.open();
  }
  
  public openCriteria(contentProvider: ContentProvider) {
    this.contentProvider = contentProvider;
    this.filtersModal.title = 'Filters';
    this.filtersModal.okButtonText = "Save";
    this.filtersModal.back = true;
    this.filtersModal.okButton = true;
    this.filtersModal.open();
  }
  
  public saveCriteria() {
    let callback: Function = () => {
      this.removeContentProvidersComponent.getCommunityContentProviders();
    }
    this.removeContentProvidersComponent.loading = true;
    this.criteria.save(callback);
  }

  public communityContentProvidersChanged($event) {
    this.communityContentProviders = $event.value;
    this.showLoadingInRemove = false;
    if (this.addContentProvidersModal.isOpen) {
      this.removeContentProvidersComponent.applyFilters();
    }
  }
}