/**
 * Responsive videos
 *
 * Make iframe videos responsive on post/page content.
 */
class PolyFill {

	/**
	 * The constructor function.
	 *
	 * @since 1.3.5
	 */
	constructor() {

		this.objectFit();
		this.closest();
	}

	/**
	 * Object Fit polyfill.
	 * 
	 * @since 1.3.5
	 */
	objectFit() {

		let selectors = [
			'.entry-thumbnail',
			'.dp-thumbnail',
			'.gallery-icon a',
			'.header-image',
			'.has-featured-img .thumb-wrapper'
		];

		if (false === 'objectFit' in document.documentElement.style) {
			container = document.querySelectorAll(selectors.join(','));
			for (i = 0; i < container.length; i++) {
				imageSource = container[i].querySelector('img').src;
				container[i].querySelector('img').style.visibility = 'hidden';
				container[i].style.backgroundSize = 'cover';
				container[i].style.backgroundImage = 'url(' + imageSource + ')';
				container[i].style.backgroundPosition = 'center center';
			}
		}
	}

	/**
	 * closest polyfill.
	 * 
	 * @since 1.3.5
	 */
	closest() {
		if (!Element.prototype.matches) {
			Element.prototype.matches = Element.prototype.msMatchesSelector || 
										Element.prototype.webkitMatchesSelector;
		}
		
		if (!Element.prototype.closest) {
			Element.prototype.closest = function(s) {
				var el = this;
		  
				do {
					if (el.matches(s)) return el;
					el = el.parentElement || el.parentNode;
				} while (el !== null && el.nodeType === 1);
				return null;
			};
		}
	}
}

export default PolyFill;