D-Net

import {Component, ElementRef, OnInit, ViewChild} from '@angular/core';

import {FormArray, FormBuilder, FormControl} from '@angular/forms';

import {ActivatedRoute, Router} from '@angular/router';

import {HelpContentService} from '../../../services/help-content.service';

import {CommunityService} from '../../../openaireLibrary/connect/community/community.service';

import {SubjectsService} from '../subjects.service';

import {EnvProperties} from '../../../openaireLibrary/utils/properties/env-properties';

import {Session} from '../../../openaireLibrary/login/utils/helper.class';

import {LoginErrorCodes} from '../../../openaireLibrary/login/utils/guardHelper.class';

import {concat} from 'rxjs/observable/concat';

import {HelperFunctions} from '../../../openaireLibrary/utils/HelperFunctions.class';

import {Title} from '@angular/platform-browser';

import {properties} from '../../../../environments/environment';

import {AlertModal} from '../../../openaireLibrary/utils/modal/alert';

import {SearchInputComponent} from '../../../openaireLibrary/sharedComponents/search-input/search-input.component';

import {Subscription} from 'rxjs';

import {CommunityInfo} from '../../../openaireLibrary/connect/community/communityInfo';

declare var UIkit;

@Component({

  selector: 'subjects-edit-form',

  templateUrl: './subjects-edit-form.component.html',

})

export class SubjectsEditFormComponent implements OnInit {

  myForm = new FormArray([new FormControl({subject: ''})]);

  public showLoading = true;

  public res = [];

  params: any;

  public communityId: string = null;

  public community: CommunityInfo = null;

  public properties: EnvProperties = properties;

  public edit = null;

  public originalSubjects = [];

  @ViewChild('editModal') editModal: AlertModal;

  @ViewChild('deleteModal') deleteModal: AlertModal;

  page = 1;

  size = 10;

  selectedSubjects = [];

  isEditModal: boolean = false;

  public selectedKeyword: string;

  @ViewChild('searchInputComponent') searchInputComponent: SearchInputComponent;

  public filterForm: FormControl;

  private subscriptions: any[] = [];

  constructor(private element: ElementRef,

              private route: ActivatedRoute,

              private _router: Router,

              public _fb: FormBuilder,

              private title: Title,

              private _helpContentService: HelpContentService,

              private _communityService: CommunityService,

              private _subjectsService: SubjectsService,

  ) {

  }

  ngOnInit() {

    this.filterForm = this._fb.control('');

    this.subscriptions.push(this.filterForm.valueChanges.subscribe(value => {

      this.page = 1;

      this.community.subjects = this.originalSubjects.filter(subject => {

        return subject.toLowerCase().indexOf(value.toLowerCase()) != -1

      });

    }));

    this.subscriptions.push(this.route.params.subscribe(

      params => {

        this.communityId = params['community'];

        this.title.setTitle(this.communityId.toUpperCase() + ' | Subjects');

        this.showLoading = true;

        this.subscriptions.push(this._communityService.getCommunityAsObservable().subscribe(

          community => {

            this.community = community;

            this.params = {

              community: encodeURIComponent(

                '"' + community.queryId + '"')

            };

            this.originalSubjects = [];

            for (let i = 0; i < this.community.subjects.length; i++) {

              this.originalSubjects.push(this.community.subjects[i]);

            }

            if (this.community.subjects.length === 0) {

              this.community.subjects.push('');

            }

            this.showLoading = false;

          },

          error => this.handleUpdateError('System error retrieving community profile', error)

        ));

      }));

  }

  ngOnDestroy() {

    this.subscriptions.forEach(subscription => {

      if (subscription instanceof Subscription) {

        subscription.unsubscribe();

      }

    });

  }

  private removeModalOpen(subject: string, i: any) {

    if (!Session.isLoggedIn()) {

      this._router.navigate(['/user-info'], {

        queryParams: {

          "errorCode": LoginErrorCodes.NOT_VALID,

          "redirectUrl": this._router.url

        }

      });

    } else {

      this.selectedSubjects = [subject];

      this.reset(['']);

      this.deleteModal.cancelButton = true;

      this.deleteModal.okButton = true;

      this.deleteModal.alertTitle = 'Delete Confirmation';

      this.deleteModal.message = 'Are you sure you want to delete this subject?';

      this.deleteModal.okButtonText = 'Yes';

      this.deleteModal.cancelButtonText = 'No';

      this.deleteModal.open();

    }

  }

  public getSubjectsExistOnlyInFirst(firstArray: string[], secondArray: string[]): string[] {

    const difference = [];

    for (let i = 0; i < firstArray.length; i++) {

      if (secondArray.indexOf(firstArray[i]) === -1) {

        difference.push(firstArray[i]);

      }

    }

    return difference;

  }

  public saveSubjects() {

    if (!Session.isLoggedIn()) {

      this._router.navigate(['/user-info'],

        {queryParams: {'errorCode': LoginErrorCodes.NOT_VALID, 'redirectUrl': this._router.url}});

    } else {

      if (this.communityId != null && this.communityId !== '') {

        this.showLoading = true;

        const subjectsToDeleteAr = this.getSubjectsExistOnlyInFirst(this.selectedSubjects, this.myForm.getRawValue());

        const subjectsToAddAr = this.getSubjectsExistOnlyInFirst(this.myForm.getRawValue(), this.selectedSubjects);

        const subjectsToDelete = this.getNonEmptyItems(subjectsToDeleteAr);

        const subjectsToAdd = this.getNonEmptyItems(subjectsToAddAr);

        if (subjectsToAdd.length > 0 && subjectsToDelete.length > 0) {

          const obs = concat(this._subjectsService.addSubjects(

            this.properties.communityAPI + this.communityId + '/subjects', subjectsToAdd),

            this._subjectsService.removeSubjects(

              this.properties.communityAPI + this.communityId + '/subjects', subjectsToDelete));

          this.subscriptions.push(obs.subscribe(res => {

              if (res['method'] === 'delete') {

                this.afterUpdateActions(res, "updated");

              }

            },

            error => this.handleUpdateError('System error updating subjects', error)

          ));

        } else if (subjectsToAdd.length > 0) {

          this.subscriptions.push(this._subjectsService.addSubjects(

            this.properties.communityAPI + this.communityId + '/subjects', subjectsToAdd).subscribe(res => {

              this.afterUpdateActions(res, "added");

            },

            error => this.handleUpdateError('System error updating subjects', error)

          ));

        } else if (subjectsToDelete.length > 0) {

          this.subscriptions.push(this._subjectsService.removeSubjects(

            this.properties.communityAPI + this.communityId + '/subjects', subjectsToDelete).subscribe(res => {

              this.afterUpdateActions(res, "deleted");

            },

            error => this.handleUpdateError('System error updating subjects', error)

          ));

        }

      }

    }

  }

  handleUpdateError(message: string, error) {

    UIkit.notification(message, {

      status: 'danger',

      timeout: 6000,

      pos: 'bottom-right'

    });

    this.showLoading = false;

  }

  afterUpdateActions(res, message: string) {

    this._communityService.setCommunity(this._communityService.parseCommunity(res));

    this.community.subjects = res['subjects'];

    this.originalSubjects = [];

    for (let i = 0; i < this.community.subjects.length; i++) {

      this.originalSubjects.push(this.community.subjects[i]);

    }

    this.page = 1;

    this.community.subjects = this.originalSubjects.filter(subject => {

      return subject.toLowerCase().indexOf(this.filterForm.value.toLowerCase()) != -1

    });

    UIkit.notification('Subjects successfully ' + message + '!', {

      status: 'success',

      timeout: 6000,

      pos: 'bottom-right'

    });

    this.showLoading = false;

  }

  private getNonEmptyItems(data: string[]): string[] {

    const length = data.length;

    const arrayNonEmpty = new Array<string>();

    let j = 0;

    for (let i = 0; i < length; i++) {

      if (this.isEmpty(data[i])) {

      } else if (this.isNonEmpty(data[i])) {

        arrayNonEmpty[j] = data[i];

        j++;

      }

    }

    return arrayNonEmpty;

  }

  private isEmpty(data: string): boolean {

    if (data !== undefined && !data.replace(/\s/g, '').length) {

      return true;

    } else {

      return false;

    }

  }

  private isNonEmpty(data: string): boolean {

    if (data !== undefined && data != null) {

      return true;

    } else {

      return false;

    }

  }

  public addSubjectInForm() {

    this.myForm.push(new FormControl(''));

  }

  public removeSubjectInForm(i: number) {

    this.myForm.removeAt(i);

  }

  public reset(subjects: string[]) {

    this.myForm = new FormArray([]);

    for (let subject in subjects) {

      this.myForm.push(new FormControl(''));

    }

    this.myForm.patchValue(subjects);

  }

  newSubject() {

    this.isEditModal = false;

    this.selectedSubjects = [];

    this.reset([""]);

    this.formModalOpen('Add Subject', 'Save');

  }

  public editSubject(subject: string) {

    this.isEditModal = true;

    this.selectedSubjects = [subject];

    this.reset([subject]);

    this.formModalOpen('Edit Subject', 'Save');

  }

  private formModalOpen(title: string, yesBtn: string) {

    if (!Session.isLoggedIn()) {

      this._router.navigate(['/user-info'], {

        queryParams: {

          "errorCode": LoginErrorCodes.NOT_VALID,

          "redirectUrl": this._router.url

        }

      });

    } else {

      this.editModal.okButtonLeft = false;

      this.editModal.cancelButton = true;

      this.editModal.okButton = true;

      this.editModal.alertTitle = title;

      this.editModal.okButtonText = yesBtn;

      this.editModal.open();

    }

  }

  public onSearchClose() {

    this.selectedKeyword = this.filterForm.value;

  }

  public resetInput() {

    this.selectedKeyword = null;

    this.searchInputComponent.reset()

  }

}