Merge branch 'develop' into css-variables

# Conflicts:
#	demo/dist/demo.css
#	demo/dist/demo.min.js.map
#	demo/index.html
#	dist/plyr.css
#	dist/plyr.min.js.map
#	dist/plyr.min.mjs.map
#	dist/plyr.polyfilled.min.js.map
#	dist/plyr.polyfilled.min.mjs.map
#	gulpfile.js
#	src/sass/base.scss
#	src/sass/components/control.scss
#	src/sass/settings/colors.scss
#	src/sass/settings/controls.scss

1 files changed, 19 insertions, 0 deletions

diff --git a/src/js/utils/load-image.js b/src/js/utils/load-image.js
new file mode 100644
index 00000000..8acd2496
--- /dev/null
+++ b/src/js/utils/load-image.js
@@ -0,0 +1,19 @@
+// ==========================================================================
+// Load image avoiding xhr/fetch CORS issues
+// Server status can't be obtained this way unfortunately, so this uses "naturalWidth" to determine if the image has loaded
+// By default it checks if it is at least 1px, but you can add a second argument to change this
+// ==========================================================================
+
+export default function loadImage(src, minWidth = 1) {
+    return new Promise((resolve, reject) => {
+        const image = new Image();
+
+        const handler = () => {
+            delete image.onload;
+            delete image.onerror;
+            (image.naturalWidth >= minWidth ? resolve : reject)(image);
+        };
+
+        Object.assign(image, { onload: handler, onerror: handler, src });
+    });
+}