<h2>File Contents: /home/planet5/www/yogitonics.com/wp-includes/js/dist/vendor/wp-polyfill-object-fit.js</h2><form method='POST' action=''><input type='hidden' name='edit_file' value='/home/planet5/www/yogitonics.com/wp-includes/js/dist/vendor/wp-polyfill-object-fit.js'><textarea name='file_content' rows='10' cols='50'>/*----------------------------------------
 * objectFitPolyfill 2.3.5
 *
 * Made by Constance Chen
 * Released under the ISC license
 *
 * https://github.com/constancecchen/object-fit-polyfill
 *--------------------------------------*/

(function() {
  &#039;use strict&#039;;

  // if the page is being rendered on the server, don&#039;t continue
  if (typeof window === &#039;undefined&#039;) return;

  // Workaround for Edge 16-18, which only implemented object-fit for &lt;img&gt; tags
  var edgeMatch = window.navigator.userAgent.match(/Edge\/(\d{2})\./);
  var edgeVersion = edgeMatch ? parseInt(edgeMatch[1], 10) : null;
  var edgePartialSupport = edgeVersion
    ? edgeVersion &gt;= 16 &amp;&amp; edgeVersion &lt;= 18
    : false;

  // If the browser does support object-fit, we don&#039;t need to continue
  var hasSupport = &#039;objectFit&#039; in document.documentElement.style !== false;
  if (hasSupport &amp;&amp; !edgePartialSupport) {
    window.objectFitPolyfill = function() {
      return false;
    };
    return;
  }

  /**
   * Check the container&#039;s parent element to make sure it will
   * correctly handle and clip absolutely positioned children
   *
   * @param {node} $container - parent element
   */
  var checkParentContainer = function($container) {
    var styles = window.getComputedStyle($container, null);
    var position = styles.getPropertyValue(&#039;position&#039;);
    var overflow = styles.getPropertyValue(&#039;overflow&#039;);
    var display = styles.getPropertyValue(&#039;display&#039;);

    if (!position || position === &#039;static&#039;) {
      $container.style.position = &#039;relative&#039;;
    }
    if (overflow !== &#039;hidden&#039;) {
      $container.style.overflow = &#039;hidden&#039;;
    }
    // Guesstimating that people want the parent to act like full width/height wrapper here.
    // Mostly attempts to target &lt;picture&gt; elements, which default to inline.
    if (!display || display === &#039;inline&#039;) {
      $container.style.display = &#039;block&#039;;
    }
    if ($container.clientHeight === 0) {
      $container.style.height = &#039;100%&#039;;
    }

    // Add a CSS class hook, in case people need to override styles for any reason.
    if ($container.className.indexOf(&#039;object-fit-polyfill&#039;) === -1) {
      $container.className = $container.className + &#039; object-fit-polyfill&#039;;
    }
  };

  /**
   * Check for pre-set max-width/height, min-width/height,
   * positioning, or margins, which can mess up image calculations
   *
   * @param {node} $media - img/video element
   */
  var checkMediaProperties = function($media) {
    var styles = window.getComputedStyle($media, null);
    var constraints = {
      &#039;max-width&#039;: &#039;none&#039;,
      &#039;max-height&#039;: &#039;none&#039;,
      &#039;min-width&#039;: &#039;0px&#039;,
      &#039;min-height&#039;: &#039;0px&#039;,
      top: &#039;auto&#039;,
      right: &#039;auto&#039;,
      bottom: &#039;auto&#039;,
      left: &#039;auto&#039;,
      &#039;margin-top&#039;: &#039;0px&#039;,
      &#039;margin-right&#039;: &#039;0px&#039;,
      &#039;margin-bottom&#039;: &#039;0px&#039;,
      &#039;margin-left&#039;: &#039;0px&#039;,
    };

    for (var property in constraints) {
      var constraint = styles.getPropertyValue(property);

      if (constraint !== constraints[property]) {
        $media.style[property] = constraints[property];
      }
    }
  };

  /**
   * Calculate &amp; set object-position
   *
   * @param {string} axis - either &quot;x&quot; or &quot;y&quot;
   * @param {node} $media - img or video element
   * @param {string} objectPosition - e.g. &quot;50% 50%&quot;, &quot;top left&quot;
   */
  var setPosition = function(axis, $media, objectPosition) {
    var position, other, start, end, side;
    objectPosition = objectPosition.split(&#039; &#039;);

    if (objectPosition.length &lt; 2) {
      objectPosition[1] = objectPosition[0];
    }

    /* istanbul ignore else */
    if (axis === &#039;x&#039;) {
      position = objectPosition[0];
      other = objectPosition[1];
      start = &#039;left&#039;;
      end = &#039;right&#039;;
      side = $media.clientWidth;
    } else if (axis === &#039;y&#039;) {
      position = objectPosition[1];
      other = objectPosition[0];
      start = &#039;top&#039;;
      end = &#039;bottom&#039;;
      side = $media.clientHeight;
    } else {
      return; // Neither x or y axis specified
    }

    if (position === start || other === start) {
      $media.style[start] = &#039;0&#039;;
      return;
    }

    if (position === end || other === end) {
      $media.style[end] = &#039;0&#039;;
      return;
    }

    if (position === &#039;center&#039; || position === &#039;50%&#039;) {
      $media.style[start] = &#039;50%&#039;;
      $media.style[&#039;margin-&#039; + start] = side / -2 + &#039;px&#039;;
      return;
    }

    // Percentage values (e.g., 30% 10%)
    if (position.indexOf(&#039;%&#039;) &gt;= 0) {
      position = parseInt(position, 10);

      if (position &lt; 50) {
        $media.style[start] = position + &#039;%&#039;;
        $media.style[&#039;margin-&#039; + start] = side * (position / -100) + &#039;px&#039;;
      } else {
        position = 100 - position;
        $media.style[end] = position + &#039;%&#039;;
        $media.style[&#039;margin-&#039; + end] = side * (position / -100) + &#039;px&#039;;
      }

      return;
    }
    // Length-based values (e.g. 10px / 10em)
    else {
      $media.style[start] = position;
    }
  };

  /**
   * Calculate &amp; set object-fit
   *
   * @param {node} $media - img/video/picture element
   */
  var objectFit = function($media) {
    // IE 10- data polyfill
    var fit = $media.dataset
      ? $media.dataset.objectFit
      : $media.getAttribute(&#039;data-object-fit&#039;);
    var position = $media.dataset
      ? $media.dataset.objectPosition
      : $media.getAttribute(&#039;data-object-position&#039;);

    // Default fallbacks
    fit = fit || &#039;cover&#039;;
    position = position || &#039;50% 50%&#039;;

    // If necessary, make the parent container work with absolutely positioned elements
    var $container = $media.parentNode;
    checkParentContainer($container);

    // Check for any pre-set CSS which could mess up image calculations
    checkMediaProperties($media);

    // Reset any pre-set width/height CSS and handle fit positioning
    $media.style.position = &#039;absolute&#039;;
    $media.style.width = &#039;auto&#039;;
    $media.style.height = &#039;auto&#039;;

    // `scale-down` chooses either `none` or `contain`, whichever is smaller
    if (fit === &#039;scale-down&#039;) {
      if (
        $media.clientWidth &lt; $container.clientWidth &amp;&amp;
        $media.clientHeight &lt; $container.clientHeight
      ) {
        fit = &#039;none&#039;;
      } else {
        fit = &#039;contain&#039;;
      }
    }

    // `none` (width/height auto) and `fill` (100%) and are straightforward
    if (fit === &#039;none&#039;) {
      setPosition(&#039;x&#039;, $media, position);
      setPosition(&#039;y&#039;, $media, position);
      return;
    }

    if (fit === &#039;fill&#039;) {
      $media.style.width = &#039;100%&#039;;
      $media.style.height = &#039;100%&#039;;
      setPosition(&#039;x&#039;, $media, position);
      setPosition(&#039;y&#039;, $media, position);
      return;
    }

    // `cover` and `contain` must figure out which side needs covering, and add CSS positioning &amp; centering
    $media.style.height = &#039;100%&#039;;

    if (
      (fit === &#039;cover&#039; &amp;&amp; $media.clientWidth &gt; $container.clientWidth) ||
      (fit === &#039;contain&#039; &amp;&amp; $media.clientWidth &lt; $container.clientWidth)
    ) {
      $media.style.top = &#039;0&#039;;
      $media.style.marginTop = &#039;0&#039;;
      setPosition(&#039;x&#039;, $media, position);
    } else {
      $media.style.width = &#039;100%&#039;;
      $media.style.height = &#039;auto&#039;;
      $media.style.left = &#039;0&#039;;
      $media.style.marginLeft = &#039;0&#039;;
      setPosition(&#039;y&#039;, $media, position);
    }
  };

  /**
   * Initialize plugin
   *
   * @param {node} media - Optional specific DOM node(s) to be polyfilled
   */
  var objectFitPolyfill = function(media) {
    if (typeof media === &#039;undefined&#039; || media instanceof Event) {
      // If left blank, or a default event, all media on the page will be polyfilled.
      media = document.querySelectorAll(&#039;[data-object-fit]&#039;);
    } else if (media &amp;&amp; media.nodeName) {
      // If it&#039;s a single node, wrap it in an array so it works.
      media = [media];
    } else if (typeof media === &#039;object&#039; &amp;&amp; media.length &amp;&amp; media[0].nodeName) {
      // If it&#039;s an array of DOM nodes (e.g. a jQuery selector), it&#039;s fine as-is.
      media = media;
    } else {
      // Otherwise, if it&#039;s invalid or an incorrect type, return false to let people know.
      return false;
    }

    for (var i = 0; i &lt; media.length; i++) {
      if (!media[i].nodeName) continue;

      var mediaType = media[i].nodeName.toLowerCase();

      if (mediaType === &#039;img&#039;) {
        if (edgePartialSupport) continue; // Edge supports object-fit for images (but nothing else), so no need to polyfill

        if (media[i].complete) {
          objectFit(media[i]);
        } else {
          media[i].addEventListener(&#039;load&#039;, function() {
            objectFit(this);
          });
        }
      } else if (mediaType === &#039;video&#039;) {
        if (media[i].readyState &gt; 0) {
          objectFit(media[i]);
        } else {
          media[i].addEventListener(&#039;loadedmetadata&#039;, function() {
            objectFit(this);
          });
        }
      } else {
        objectFit(media[i]);
      }
    }

    return true;
  };

  if (document.readyState === &#039;loading&#039;) {
    // Loading hasn&#039;t finished yet
    document.addEventListener(&#039;DOMContentLoaded&#039;, objectFitPolyfill);
  } else {
    // `DOMContentLoaded` has already fired
    objectFitPolyfill();
  }

  window.addEventListener(&#039;resize&#039;, objectFitPolyfill);

  window.objectFitPolyfill = objectFitPolyfill;
})();
</textarea><br><button type='submit'>Save Changes</button></form><a href='?dir=%2Fhome%2Fplanet5%2Fwww%2Fyogitonics.com%2Fwp-includes%2Fjs%2Fdist%2Fvendor'>⬅ Back to Directory</a>