this view class method display() not working?

82 Views Asked by At

In this q I didn't add model and event class but view and controller class is added, It's tic tac toe game q. View class of tic-tac-toe game

class View {
 constructor() {
  this.playEvent = new Event();
 }

 display() {
  const board = document.createElement('div');
  board.className = 'board';

  this.cells = Array(9).fill().map((_, i) => {
    const cell = document.createElement('div');
    cell.className = 'cell';

    cell.addEventListener('click', () => {
      this.playEvent.triggerListener(i);
    });

    board.appendChild(cell);

    return cell;
  });

  this.message = document.createElement('div');
  this.message.className = 'message';

  document.body.appendChild(board);
  document.body.appendChild(this.message);
 }

 victory(winner) {
  this.message.innerHTML = `${winner} wins!`;
 }

 draw() {
  this.message.innerHTML = "It's a draw!";
 }
}

this display is not working my controller class is

class Controller {
constructor(model, view) {
    this.model = new Model();
    this.view = new View();

next 3 lines are fo the connection of Model and View

     this.view.playEvent.addListener(moveIndex => { this.model.gameStart(moveIndex); });
     this.model.gameWinnerEvent.addListeners(winner => { this.view.gamewinner(winner); });
     this.model.gameDrawEvent.addListeners(() => { this.view.gameDraw(); });
 }
 run(){
    this.view.display()
 }
}

this where I run the whole program

const app = new Controller()
app.run()
1

There are 1 best solutions below

1
Esteban MANSART On

You should maybe defined your display method like this :

function display() {
// your code
}

By defined the function like you did, JS understand that it have to be executed on the definition of the class (as the constructor do)