import isDesktop from "../utils/isDesktop";
import isMobile from "../utils/isMobile";

const createDeviceActions = (elements) => {
  const desktop = {
    initPosition: () => {
      elements.widget?.classList.add("firevert-widget--init-desktop-position");
      elements.powerWidget?.classList.add(
        "firevert-powerwidget--init-desktop-position"
      );
    },

    resetPosition: () => {
      elements.powerWidget?.classList.remove(
        "firevert-powerwidget--init-desktop-position"
      );
      elements.powerWidget?.classList.remove(
        "firevert-powerwidget--init-desktop-active-position"
      );
      elements.widget?.classList.remove(
        "firevert-widget--init-desktop-position"
      );
    },

    activate: () => {
      elements.bubble?.classList.add("firevert-bubble--hide-on-desktop");
      elements.accordion?.classList.add(
        "firevert-powerwidget__accordion--active"
      );
      elements.widget?.classList.add("firevert-widget--init-desktop-position");
      elements.powerWidget?.classList.add(
        "firevert-powerwidget--init-desktop-position"
      );
    },

    reset: () => {
      elements.bubble?.classList.remove("firevert-bubble--hide-on-desktop");
      elements.widget?.classList.remove(
        "firevert-widget--init-desktop-position"
      );
      elements.widget?.classList.remove(
        "firevert-widget--init-desktop-active-position"
      );
      elements.powerWidget?.classList.remove(
        "firevert-powerwidget--init-desktop-position"
      );
      elements.accordion?.classList.remove(
        "firevert-powerwidget__accordion--init-desktop-active-position"
      );
    },

    activateHover: () => {
      elements.accordion?.classList.add(
        "firevert-powerwidget__accordion--init-desktop-position"
      );
      elements.powerWidget?.classList.add(
        "firevert-powerwidget--init-desktop-active-position"
      );
    },
  };

  const mobile = {
    activate: () => {
      elements.accordion?.classList.add(
        "firevert-powerwidget__accordion--active"
      );
      elements.widget?.classList.add("firevert-widget--mobile-bottom-position");
      elements.powerWidget?.classList.add(
        "firevert-powerwidget--mobile-bottom-position"
      );
      elements.bubble?.classList.add("firevert-bubble--hide");
    },

    activateActive: () => {
      elements.powerWidget?.classList.add(
        "firevert-powerwidget--mobile-bottom-position-active"
      );
    },

    reset: () => {
      elements.widget?.classList.remove(
        "firevert-widget--mobile-bottom-position-active"
      );
      elements.powerWidget?.classList.remove(
        "firevert-powerwidget--mobile-bottom-position-active"
      );
      elements.bubble?.classList.remove("firevert-bubble--hide");
    },
  };

  const runForDevice = (desktopFn, mobileFn) => {
    if (isDesktop() && desktopFn) desktopFn();
    if (isMobile() && mobileFn) mobileFn();
  };

  return { desktop, mobile, runForDevice };
};

export default createDeviceActions;
