/*
 * Copyright (C) 2023 Robert Bosch GmbH Copyright (C) 2023 Robert Bosch Manufacturing Solutions GmbH, Germany. All rights reserved.
 */

import { DOCUMENT } from '@angular/common';
import { Component, Inject, OnInit } from '@angular/core';
import { MatDialog } from '@angular/material/dialog';
import { ModalWindowService, NotificationService } from '@bci-web-core/core';
import { ScrollIntoViewService } from '../../shared/scroll-into-view.service';
import { CustomPicklistDialogComponent } from './custom-picklist-dialog/custom-picklist-dialog.component';
import { thingsArray } from '../picklist-demo/picklist-demo-model';
import { fruits, Fruit } from './bci-core-picklist-demo-model';

/**
 * This demo shows the basic use of the picklist and, in addition, other use cases such as filtering
 * or item templates.
 */
@Component({
  selector: 'bci-core-picklist-demo',
  templateUrl: './bci-core-picklist-demo.component.html',
  styleUrls: ['./bci-core-picklist-demo.component.scss'],
})
export class BciCorePicklistDemoComponent implements OnInit {

  /**List of numbers to demo virtual scrolling behvaiour */
  thingsList = [];

  /** Name list of all available fruits. */
  fruitNamesList = [];

  /** Number of currently available source items. */
  sourceItemCount: number;

  /** Number of currently available target items. */
  targetItemCount: number;

  returnData: Fruit[]

  constructor(private notificationService: NotificationService, public dialog: MatDialog,
    private _matDialog: MatDialog,
    @Inject(DOCUMENT) doc: any,
    private _modalWindowService: ModalWindowService,
    public scrollIntoViewService: ScrollIntoViewService) {}

  ngOnInit() {
    setTimeout(() => {
      this.fruitNamesList = fruits.map((fruit) => fruit.name);
      this.onSourceChanged(this.fruitNamesList);
      this.thingsList=thingsArray;
    }, 3000);
  }

  reloadSource() {
    this.fruitNamesList = fruits.map((fruit) => fruit.name);
    this.onSourceChanged(this.fruitNamesList);
  }

  /**
   * Called when the user adds/removes items to/from the source list.
   * @param fruitNames The source items contained after the change.
   */
  onSourceChanged(fruitNames: string[]): void {
    this.sourceItemCount = fruitNames ? fruitNames.length : 0;
  }

  /**
   * Called when the user adds/removes items to/from the target list.
   * @param fruitNames The target items contained after the change.
   */
  onTargetChanged(fruitNames: string[]): void {
    this.targetItemCount = fruitNames ? fruitNames.length : 0;
  }

  /**
   * Called when the user adds/removes items to/from the target list.
   * @param data { noOfitems, action}.
   */
  showNotification(item) {
    const text = item.length > 0 && item.length == 1 ? 'fruit is' : 'fruits are'
    this.notificationService.information(`${item.action == 'add'? `${item.length} ${text} added`: `${item.length} ${text} removed`}.`);
  }

  openPicklistInsideModal(picklistType): void {
    this._modalWindowService
      .openDialogWithComponent(CustomPicklistDialogComponent, {
        width: "816px",
        maxWidth: "90%",
        data: {type: picklistType}
      }, this._matDialog)
      .afterClosed()
      .subscribe((data) => {
       this.returnData = data;
      });
  }
}
