import LisioStyleSheetController from "../controllers/lisio-stylesheet-controller";
import LisioCSSProperties from "../enums/lisio-css-properties";
import LisioTextTreeWalker from "../walkers/lisio-text-tree-walker";
import LisioAdapter from "./lisio-adapter";

/**
 * Class representing a highlight links adapter extending an adapter.\
 * It aims to represents the font style functionality of Lisio.\
 * A highlight links adapter is basically a functionality of Lisio which will change the highlight links of texts in the main page.\
 */
class LisioHightlightLinksAdapter extends LisioAdapter<boolean> {
  /**
   * Public method implementing abstract method adapt of Adapter
   * @param {LisioTextTreeWalker} walker - A walker to explore the DOM
   * @param {string} value - Value of the functionality
   * @returns Returns nothing
   * @source
   */
  public adapt(_: LisioTextTreeWalker, value: boolean): void {
    const elements = document.body.querySelectorAll<HTMLElement>(
      'a,button,input[type="submit"],[role="button"]',
    );
    for (const element of elements) {
      this.adaptFunction(element, value);
    }
    LisioStyleSheetController.current.removeRule(".lisio-highlight");
    if (value) {
      const propertiesToAdd: Map<string, string> = new Map<string, string>([
        [LisioCSSProperties.BACKGROUND, "none"],
        [LisioCSSProperties.BACKGROUND_COLOR, "yellow"],
        [LisioCSSProperties.COLOR, "blue"],
        [LisioCSSProperties.BOX_SHADOW, "-5px 5px 2px #FFFF50"],
        [LisioCSSProperties.BORDER, "yellow 3px solid"],
        [LisioCSSProperties._WEBKIT_TEXT_FILL_COLOR, "initial"],
      ]);
      LisioStyleSheetController.current.insertRule(
        ".lisio-highlight",
        propertiesToAdd,
      ); //si non on la rajoute
    }
  }

  protected adaptFunction(element: HTMLElement, value: boolean): void {
    if (value) {
      //si activé
      if (
        element.firstElementChild != null &&
        element.firstElementChild.localName == "img"
      ) {
        element.firstElementChild.classList.add("lisio-highlight");
        LisioStyleSheetController.current.replaceImportantInStyleAttribute(
          [
            LisioCSSProperties.COLOR,
            LisioCSSProperties.BACKGROUND,
            LisioCSSProperties.BACKGROUND_COLOR,
            LisioCSSProperties.BOX_SHADOW,
            LisioCSSProperties.BORDER,
          ],
          element.firstElementChild as HTMLElement,
        );
      } else {
        element.classList.add("lisio-highlight");
        LisioStyleSheetController.current.replaceImportantInStyleAttribute(
          [
            LisioCSSProperties.COLOR,
            LisioCSSProperties.BACKGROUND,
            LisioCSSProperties.BACKGROUND_COLOR,
            LisioCSSProperties.BOX_SHADOW,
            LisioCSSProperties.BORDER,
          ],
          element as HTMLElement,
        );
      }
    } else {
      //sinon on supprime les classes
      if (
        element.firstElementChild != null &&
        element.firstElementChild.localName == "img"
      ) {
        element.firstElementChild.classList.remove("lisio-highlight");
      } else {
        element.classList.remove("lisio-highlight");
      }
    }
  }
}

export default LisioHightlightLinksAdapter;