webtools/site/mental-arithmatic/scripts/welcome.js

import { Controller } from "https://unpkg.com/@hotwired/stimulus/dist/stimulus.js";

export class WelcomeController extends Controller {
    static targets = ["simpleHighScores"];

    connect() {
        this._buildHighScores();
    }

    startGame(ev) {
        ev.preventDefault();

        this.element.classList.add('hidden');
        window.dispatchEvent(new CustomEvent("startCountdown"));
    }

    gameEnded(ev) {
        this.element.classList.remove('hidden');
    }

    _buildHighScores() {
        let scores = {
            last: 12,
            high: 10,
            streak: 3
        };

        let newEls = [
            `<span>🏆 ${scores.last}</span>`,
            `<span>🔥 ${scores.streak}</span>`,
            `<span>↩️ ${scores.high}</span>`
        ];
        this.simpleHighScoresTarget.innerHTML = newEls.join('');
    }
}