js__typescript__pluralsight1/app/game.ts

import {getValue} from "./utility";
import {Player} from "./player";
import {Result} from "./result";
import {Scoreboard as ResultPanel} from "./scoreboard";

export class Game {
  private scoreboard: ResultPanel = new ResultPanel();

  /**
   * Passing "public" parameters to constructor() automatically creates
   * properties of the same name and initializes them to the value of the passed
   * argument. Same with "protected", "private", and "readonly".
   *
   * The name for this is "parameter properties".
   *
   * @param player
   * @param problemCount
   * @param factor
   */
  constructor(
    public player: Player,
    public problemCount: number,
    public factor: number) {
  }

  displayGame(): void {
    // Create the HTML for the current game.
    let gameForm: string = '';

    for (let i = 1; i <= this.problemCount; i++) {
      gameForm += '<div class="form-group">';
      gameForm += '<label for="answer' + i + '" class="col-sm-2 control-label">';
      // Note use of the String constructor vs a type assertion: they do not
      // fulfill the same purpose.
      gameForm += String(this.factor) + ' x ' + i + ' = </label>';
      gameForm += '<div class="col-sm-1"><input type="text" class="form-control" id="answer' + i + '"></div>';
      gameForm += '</div>';
    }

    // Add the game to the page.
    let gameElement: HTMLElement = document.getElementById('game')!;
    gameElement.innerHTML = gameForm;

    // Enable the calculate score button.
    document.getElementById('calculate')!.removeAttribute('disabled');
  }

  calculateScore(): void {
    let score: number = 0;

    // Loop through the text boxes and calculate the number that are correct.
    for (let i = 1; i < this.problemCount; i++) {
      let answer: number = Number(getValue('answer' + i));
      if (i * this.factor === answer) {
        score++;
      }
    }

    // Create a new result object to pass to the scoreboard.
    let result: Result = {
      playerName: this.player.name,
      score,
      problemCount: this.problemCount,
      factor: this.factor,
    };

    this.scoreboard.addResult(result);
    this.scoreboard.updateScoreboard();

    // Disable the calculate score button.
    document.getElementById('calculate')!.setAttribute('disabled', 'true');

  }

}