Object fit fix - waiting for DOM loaded (#39)

DekodeInteraktiv · Jan 8, 2019 · 158460c · 158460c
1 parent c58b450
commit 158460c
Show file tree

Hide file tree

Showing 6 changed files with 1,271 additions and 8 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,9 @@
 # Changelog
 
+## [2.4.1] - 2019-01-08
+* Added fix for object-fit polyfill
+* Updated object-fit polyfill file to v3.2.4 
+
 ## [2.4.0] - 2018-08-14
 * Added object-fit polyfill [#29](https://github.com/DekodeInteraktiv/hogan-banner/pull/29).
 

diff --git a/assets/js/hogan-banner.js b/assets/js/hogan-banner.js
diff --git a/assets/vendor/object-fit-images.js b/assets/vendor/object-fit-images.js
diff --git a/hogan-banner.php b/hogan-banner.php
@@ -4,7 +4,7 @@
  * Plugin URI: https://github.com/dekodeinteraktiv/hogan-banner
  * GitHub Plugin URI: https://github.com/dekodeinteraktiv/hogan-banner
  * Description: Banner Module for Hogan.
- * Version: 2.4.0
+ * Version: 2.4.1
  * Author: Dekode
  * Author URI: https://dekode.no
  * License: GPL-3.0-or-later
@@ -24,7 +24,7 @@
 	exit; // Exit if accessed directly.
 }
 
-define( 'HOGAN_BANNER_VERSION', '2.4.0' );
+define( 'HOGAN_BANNER_VERSION', '2.4.1' );
 
 add_action( 'plugins_loaded', __NAMESPACE__ . '\\hogan_load_textdomain' );
 add_action( 'hogan/include_modules', __NAMESPACE__ . '\\hogan_register_module' );

diff --git a/src/banner.js b/src/banner.js
@@ -1,4 +1,14 @@
-const { objectFitImages } = window;
+function apply_object_fit_fix() {
+	if ('objectFit' in document.documentElement.style === false) {
+		const { objectFitImages } = window;
 
-const images = document.querySelectorAll( '.hogan-banner-image img' );
-objectFitImages( images );
+		const images = document.querySelectorAll( '.hogan-banner-image img' );
+		objectFitImages( images );
+	}
+}
+
+if (document.readyState === "loading") {
+	document.addEventListener("DOMContentLoaded", apply_object_fit_fix);
+} else {
+	apply_object_fit_fix();
+}