aristath/kirki

View on GitHub
packages/kirki-framework/field-typography/src/control.js

Summary

Maintainability
C
1 day
Test Coverage
import "./control.scss";

/* global kirkiTypographyControls, kirkiGoogleFonts, kirkiFontVariants */
function kirkiTypographyCompositeControlFontProperties(id, value) {
  const control = wp.customize.control(id);

  if ("undefined" === typeof control) {
    return;
  }

  value = value || control.setting.get();

  const isGoogle =
    value["font-family"] && kirkiGoogleFonts.items[value["font-family"]];
  const variantValue = value["variant"]
    ? value["variant"].toString()
    : "regular";
  const variantControl = wp.customize.control(id + "[variant]");

  const sortVariants = function (a, b) {
    if (a < b) return -1;
    if (a > b) return 1;
    return 0;
  };

  let variants = [];

  if (isGoogle) {
    let gFontVariants = kirkiGoogleFonts.items[value["font-family"]].variants;
    gFontVariants.sort(sortVariants);

    kirkiFontVariants.complete.forEach(function (variant) {
      if (-1 !== gFontVariants.indexOf(variant.value)) {
        variants.push({
          value: variant.value,
          label: variant.label,
        });
      }
    });
  } else {
        let stdFontVariants;

        if (kirkiFontVariants[value["font-family"]]) {
      stdFontVariants = kirkiFontVariants[value["font-family"]];

            kirkiFontVariants.complete.forEach(function (variant) {
                if (-1 !== stdFontVariants.indexOf(variant.value)) {
          variants.push({
            value: variant.value,
            label: variant.label,
          });
        }
      });
    } else {
      stdFontVariants = kirkiFontVariants.standard;

            stdFontVariants.forEach(function (variant) {
                variants.push({
                    value: variant.value,
                    label: variant.label,
                });
            });
    }

  }

  // Set the font-style value.
  if (-1 !== variantValue.indexOf("i")) {
    value["font-style"] = "italic";
  } else {
    value["font-style"] = "normal";
  }

  // Set the font-weight value.
  value["font-weight"] =
    "regular" === variantValue || "italic" === variantValue
      ? 400
      : parseInt(variantValue, 10);

  if (variantControl) {
    // Hide/show variant options depending on which are available for this font-family.
    if (1 < variants.length && control.active()) {
      variantControl.activate();
    } else {
      // If there's only 1 variant to choose from, we can hide the control.
      variantControl.deactivate();
    }

    variantControl.params.choices = variants;
    variantControl.formattedOptions = [];
    variantControl.destroy();

    if (!variants.includes(variantValue)) {
      // If the selected font-family doesn't support the currently selected variant, switch to "regular".
      variantControl.doSelectAction("selectOption", "regular");
    } else {
      variantControl.doSelectAction("selectOption", variantValue);
    }
  }

  wp.hooks.addAction(
    "kirki.dynamicControl.initKirkiControl",
    "kirki",
    function (controlInit) {
      if (variantControl && id + "[variant]" === controlInit.id) {
      }
    }
  );
}

jQuery(document).ready(function () {
  _.each(kirkiTypographyControls, function (id) {
    kirkiTypographyCompositeControlFontProperties(id);

    wp.customize(id, function (value) {
      value.bind(function (newval) {
        kirkiTypographyCompositeControlFontProperties(id, newval);
      });
    });
  });
});