chiiya/haven

View on GitHub
src/preferences/index.ts

Summary

Maintainability
A
1 hr
Test Coverage
import CookieManager from "../cookies/cookie-manager";
import store from "../store";
import DefaultPreferences from "./default-preferences";
import { getAllPurposes, trans } from "../utils";

export default class CookiePreferences {
  /** Cookie manager instance */
  protected cookieManager: CookieManager;
  /** Button for saving preferences */
  protected saveButton: HTMLButtonElement | null = null;

  /**
   * Fetch DOM elements.
   */
  constructor() {
    this.cookieManager = new CookieManager(
      store.prefix,
      store.type,
      store.cookieAttributes
    );
  }

  /**
   * Initialize cookie preferences initial states and event listeners.
   */
  public init(): void {
    const wrapper = document.getElementById("cookie-preferences");
    if (wrapper !== null) {
      DefaultPreferences.create(wrapper);
    }
    this.attachListeners();
  }

  /**
   * Attach event listeners to all checkboxes.
   */
  public attachListeners(): void {
    const purposes = getAllPurposes();
    const checkboxes: { [purpose: string]: HTMLInputElement } = {};
    const saveButton = <HTMLButtonElement | null>document.getElementById(
      "cookie-preferences__save"
    );

    for (const purpose of purposes) {
      const checkbox = <HTMLInputElement | null>(
        document.getElementById(`cookie-preferences--${purpose}`)
      );
      if (checkbox !== null) {
        checkboxes[purpose] = checkbox;
        checkbox.checked = this.cookieManager.hasCookiesEnabled(purpose);
        checkbox.addEventListener("change", () => {
          if (saveButton !== null) {
            saveButton.disabled = false;
            return;
          }
          this.cookieManager.enableFunctionalCookie();
          if (checkbox.checked) {
            this.cookieManager.enableCookies(purpose);
          } else {
            this.cookieManager.disableCookies(purpose);
          }
        });
      }
    }

    if (saveButton !== null) {
      saveButton.addEventListener("click", () => {
        this.cookieManager.enableFunctionalCookie();
        for (const purpose of purposes) {
          if (checkboxes[purpose].checked) {
            this.cookieManager.enableCookies(purpose);
          } else {
            this.cookieManager.disableCookies(purpose);
          }
        }
        const notification = document.getElementById("cookie-notification");
        if (notification !== null) {
          notification.style.display = "none";
        }
        saveButton.disabled = true;
      });
    }
  }
}