import {Component, Input, Output, EventEmitter} from '@angular/core';
import {Observable}       from 'rxjs/Observable';

import { Filter, Value} from './searchHelperClasses.class';
import {Open} from '../../utils/modal/open.component';

@Component({
    selector: 'search-filter',
    templateUrl: 'searchFilter.component.html'
})

export class SearchFilterComponent {

    @Input() filter:Filter;
    @Input() showResultCount:boolean = true;
    @Input() isDisabled:boolean = false;
    @Input() addShowMore:boolean = true;
    @Input() connectCommunityId:string
    public showAll:boolean = false;
    public _maxCharacters:number =28;

    @Output() toggleModal = new EventEmitter();

    @Output() modalChange = new EventEmitter();
    @Output() onFilterChange = new EventEmitter();
    keyword = "";
    sortBy = "num";


    public isOpen:boolean=false;

    // filterModalChange() {
    //   console.info("Modal Changed");
    //   this.modalChange.emit({
    //     value: true
    //   });
    //   //this.close();
    // }

    constructor () {
    }

    ngOnInit() {

    }
    public _formatTitle(title,length){
      return (((title+" ("+length+")").length >this._maxCharacters)?(title.substring(0,(this._maxCharacters - (" ("+length+")").length - ('...').length))+"..."):title+" ("+((length >= 99)?length+"+":length)+")")
    }
    private _formatName(value){
      return value.name;//(((value.name+" ("+value.number+")").length >this._maxCharacters)?(value.name.substring(0,(this._maxCharacters - (" ("+value.number+")").length - ('...').length))+"..."):value.name)
    }
    // toggleShowAll(){
    //     this.showAll = !this.showAll;
    //     if(this.showAll == false) {
    //         this.reorderFilterValues();
    //     }
    // }


    filterKeywords(value){
      if(this.keyword.length > 0){
        if(value.toLowerCase().indexOf(this.keyword.toLowerCase()) ==-1){
          return false;
        }
      }
      return true;
    }
    filterChange(selected:boolean){
      //console.info("filter change: "+selected);
        if(selected){
            this.filter.countSelectedValues++;
            // this.reorderFilterValues();
        }else{
            this.filter.countSelectedValues--;
            // this.reorderFilterValues();
        }
        this.onFilterChange.emit({
            value: this.filter
          });
    }
    getSelectedValues(filter, sortBy:string = "num"):any{
      var selected = [];
      if(filter.countSelectedValues >0){
        for (var i=0; i < filter.values.length; i++){
          if(filter.values[i].selected){
            selected.push(filter.values[i]);
          }
        }
      }
      if(sortBy == "name"){

        selected.sort((n1,n2)=> {
          if (n1.name > n2.name) {
              return 1;
          }

          if (n1.name < n2.name) {
              return -1;
          }

          return 0;
        });
      }
      return selected;

    }
    getNotSelectedValues(filter, sortBy:string = "num"):any{
      var notSselected = [];
      //if(filter.countSelectedValues >0){
        for (var i=0; i < filter.values.length; i++){
          if(!filter.values[i].selected){
            notSselected.push(filter.values[i]);
          }
        }
      //}else {
      //  notSselected = filter.values;
      //}

      if(sortBy == "name"){

        notSselected.sort((n1,n2)=> {
          if (n1.name > n2.name) {
              return 1;
          }

          if (n1.name < n2.name) {
              return -1;
          }

          return 0;
        });
      }
      return notSselected;
    }
    // reorderFilterValues() {
    //     for(let value of this.filter.values) {
    //         if(value.selected) {
    //             let index: number = this.filter.values.indexOf(value);
    //             let selectedValue:Value = this.filter.values[index];
    //
    //             this.filter.values.splice(index, 1);
    //             this.filter.values.splice(0, 0, selectedValue);
    //         }
    //     }
    // }
//     sliceSelected() {
//         let values: Value[] = [];
//
//         for(let value of this.filter.values) {
//             if(value.selected) {
//                 let index: number = this.filter.values.indexOf(value);
//                 let selectedValue:Value = this.filter.values[index];
//
//                 this.filter.values.splice(index, 1);
//                 this.filter.values.splice(0, 0, selectedValue);
//             }
//         }


  // toggle() {
  //   this.toggleModal.emit({
  //     value: this.filter
  //   });
  // }


  open() {
    this.isOpen = true;
  }

  close() {
    this.isOpen = false;
  }

  // filterChange2(selected:boolean){
  //
  //   console.info("filter change2");
  //     if(selected){
  //         this.filter.countSelectedValues++;
  //         // this.reorderFilterValues();
  //     }else{
  //         this.filter.countSelectedValues--;
  //         // this.reorderFilterValues();
  //     }
  //     this.close();
  // }

}