Javascript-форум - Игра найди пару на JQuery

Есть игра "Найди пару" (искать одинаковые картинки)
Помогите написать функцию которая определит окончание игры и выведет ("You win!!")
Я так понимаю окончание игры должно быть когда найдены все пары...как можно это реализовать?

JS

var cards = document.querySelectorAll('.card');

let FlippCard = false;
let lockBoard = false;
let firstCard, secondCard;

//переворот карт 
function flipCard() {
  if (lockBoard) return;
  if (this === firstCard) return;

  this.classList.add('flip');

  if (!FlippCard) {
    FlippCard = true;
    firstCard = this;
    return;
  }

  secondCard = this;
  check();
}

//проверка совпадения двух карт 
function check() {
  let isMatch = firstCard.dataset.framework === secondCard.dataset.framework;

  isMatch ? disableCards() : unflip();
}

//при совпадении оставлять карты 
function disableCards() {
  firstCard.removeEventListener('click', flipCard);
  secondCard.removeEventListener('click', flipCard);

  reset();
}

//обратный переворот карт 
function unflip() {
  lockBoard = true;

  setTimeout(() => {
    firstCard.classList.remove('flip');
    secondCard.classList.remove('flip');

    reset();
  }, 1250);
}

//обновление карт после выбора
function reset() {
  [FlippCard, lockBoard] = [false, false];
  [firstCard, secondCard] = [null, null];
}

//Перемешивание карт 
(function mixing() {
  cards.forEach(card => {
    let randomPos = Math.floor(Math.random() * 8);
    card.style.order = randomPos;
  });
})();

cards.forEach(card => card.addEventListener('click', flipCard));

HTML

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Memory</title>
  <link rel="stylesheet" href="css/style.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
</head>
<body>
  <h5>Game: "Memory"</h5>
  <button class="button">Start</button>
  <section class="contGame">

    <div class="card" data-framework="1">
      <img class="front" src="img/1.png" alt="1" />

      <img class="back" src="img/background.jpg" alt="background" />
    </div>

    <div class="card" data-framework="1">
      <img class="front" src="img/1.png" alt="1" />

      <img class="back" src="img/background.jpg" alt="background" />
    </div>

    <div class="card" data-framework="2">
      <img class="front" src="img/2.png" alt="2" />

      <img class="back" src="img/background.jpg" alt="background" />
    </div>

     <div class="card" data-framework="2">
      <img class="front" src="img/2.png" alt="2" />

      <img class="back" src="img/background.jpg" alt="background" />
    </div>

    <div class="card" data-framework="3">
      <img class="front" src="img/3.png" alt="3" />

      <img class="back" src="img/background.jpg" alt="background" />
    </div>

     <div class="card" data-framework="3">
      <img class="front" src="img/3.png" alt="3" />

      <img class="back" src="img/background.jpg" alt="background" />
    </div>

    <div class="card" data-framework="4">
      <img class="front" src="img/4.png" alt="4" />

      <img class="back" src="img/background.jpg" alt="background" />
    </div>

    <div class="card" data-framework="4">
      <img class="front" src="img/4.png" alt="4" />

      <img class="back" src="img/background.jpg" alt="background" />
    </div>

  </section>

  <script src="js/script.js"></script>
</body>
</html>