import Component from '@glimmer/component';
import { action } from '@ember/object';
import { inject as service } from '@ember/service';

export default class BookComponent extends Component {
  @service('nav-state') navState;

  get bookTitle() {
    if (typeof this.args.book == 'undefined') {
      return '';
    }

    let string = this.args.book.name.toLowerCase();
    if (this.isNumber(string.charAt(0))) {
      return string.slice(0,1) + ' ' + string.charAt(2).toUpperCase() + string.slice(3);
    } else {
      return string.charAt(0).toUpperCase() + string.slice(1);
    }
  }

  @action
  selectBook() {
    this.args.showChapters(this.args.book);
    this.navState.setBook(this.args.book);
  }

  isNumber(char) {
    var number = /^[0-9]+$/;
    let string = char;

    if(string.match(number)) {
      return true;
    } else {
      return false;
    }
  }

  get
  selected() {
    if(this.navState.isCurrentBook(this.args.book)) {
      return "selected";
    } else {
      return "";
    }
  }
}