export function SearchListDirectiveFactory() {
  return new SearchListDirective();
}

class SearchListDirective implements angular.IDirective {
  restrict = 'E';
  template = require<string>('./SearchList.html');
  controllerAs = 'ctrl';
  controller = SearchListController;
  scope = {
    items: '=',
    onSelect: '&',
    descriptionProperty: '@',
    imageLinkProperty: '@',
    disabled: '=ngDisabled',
    placeholderText: '@',
    name: '@',
    ngModel: '='
  };
  bindToController = true;
}

export class SearchListController {
  searchText: string;
  menuVisible: boolean;
  items: any[];
  selectedItem: any;
  ngModel: any;
  onSelect: (item: any) => any;
  descriptionProperty: string;
  imageLinkProperty: string;

  static $inject = ['$scope'];

  constructor(private scope:angular.IScope) {
    this.searchText = '';
    this.menuVisible = false;
    let self:SearchListController = this;
    this.scope.$watch('ctrl.items', () => self.reset());
  }

  reset():void{
    this.ngModel = "";
    this.searchText = "";
  }

  selectItem(item: any): void {
    this.ngModel = item;
    this.updateSearchText();
    this.onSelect({ item: this.ngModel });
  }

  itemHasImage(item: any): boolean {
    return !!item[this.imageLinkProperty];
  }

  setMenuVisibility(newState: boolean): void {
    this.menuVisible = newState;
  }

  updateSearchText() {
    if (this.ngModel) {
      this.searchText = this.ngModel[this.descriptionProperty];
    }else{
      this.searchText = "";
    }
  }
}