Source: pages/landing/skipLandingModal.js

/**
 * Template how to implement a Modal
 * @extends Modal
 */
class SkipLandingModal extends Modal{
    constructor()
    {
        let idLangMap = new Map([
            ["skipLandingModal-title", () => languageManager.currentLang.landingPage.modalTitle],
            ["skipLandingModal-body", () => languageManager.currentLang.landingPage.modalBody],
            ["skipLandingModal-okBtn", () => languageManager.currentLang.landingPage.modalOk],
            ["skipLandingModal-closeBtn", () => languageManager.currentLang.landingPage.modalAbort],
            ["skipLandingModal-remindBtn", () => languageManager.currentLang.landingPage.modalRemindMeLater],
        ])
        super(idLangMap, "skipLandingModal");
    }

    get html()
    {
        return `
        <div id="skipLandingModal" class="modal modal-sm fade" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
          <div class="modal-dialog" role="document">
            <div class="modal-content">
              <div class="modal-header">
                <h5 id="${this.mainID}-title" class="modal-title">Modal title</h5>
              </div>
              <div id="${this.mainID}-body" class="modal-body">
                <p>${languageManager.currentLang.landingPage.modalBody}</p>
              </div>
              <div class="modal-footer">
                <button id="${this.mainID}-okBtn" type="button" class="btn btn-primary" data-bs-dismiss="modal">Ok</button>
                <button id="${this.mainID}-closeBtn" type="button" class="btn btn-secondary" data-bs-dismiss="modal" data-dismiss="modal">Abort</button>
                <button id="${this.mainID}-remindBtn" type="button" class="btn btn-secondary" data-bs-dismiss="modal" data-dismiss="modal">Remind me again</button>
              </div>
            </div>
          </div>
        </div>
        `;
    }

    setup()
    {
        let template = document.createElement("template");
        template.innerHTML = this.html.trim();

        document.body.appendChild(template.content.firstElementChild)
        // a fragment can be added via document.appendChild() without error and does not add anything to the dom to keep
        // the implementation of setup consistent
        return new DocumentFragment()
    }

    addEventListeners()
    {
        document.getElementById(this.mainID + "-okBtn").addEventListener("click", () => {
            pageManager.pages.newSettingsPage.content.setLandingPage.setSelectPage()
        })
        document.getElementById(this.mainID + "-remindBtn").addEventListener("click", () => {
            storageManager.landingPageVisits.save(-3, true)
        })

    }
}