From 0acacbcbe10e5881afec827ec6191d24bffb75d4 Mon Sep 17 00:00:00 2001
From: Payton Swick <payton@foolord.com>
Date: Wed, 2 Dec 2015 13:57:08 -0500
Subject: [PATCH] Framework: ImagePreloader: Add onLoad prop for additional
 onload events

---
 client/components/image-preloader/README.md | 14 ++++++++++++++
 client/components/image-preloader/index.jsx | 18 +++++++++++++++---
 2 files changed, 29 insertions(+), 3 deletions(-)

diff --git a/client/components/image-preloader/README.md b/client/components/image-preloader/README.md
index 361a6866652ecc..38a342b60771fa 100644
--- a/client/components/image-preloader/README.md
+++ b/client/components/image-preloader/README.md
@@ -39,3 +39,17 @@ A React element to render while the image `src` is being loaded.
 - __Required:__ No
 
 If a child is passed, it will be used as substitute content in the case that the image fails to load.
+
+### `onLoad`
+
+- __Type:__ function
+- __Required:__ No
+
+A custom function to call when the image loading is complete.
+
+### `onError`
+
+- __Type:__ function
+- __Required:__ No
+
+A custom function to call if the image loading fails.
diff --git a/client/components/image-preloader/index.jsx b/client/components/image-preloader/index.jsx
index 177f2ec8083145..64534be7325e28 100644
--- a/client/components/image-preloader/index.jsx
+++ b/client/components/image-preloader/index.jsx
@@ -21,7 +21,9 @@ module.exports = React.createClass( {
 	propTypes: {
 		src: React.PropTypes.string.isRequired,
 		placeholder: React.PropTypes.element.isRequired,
-		children: React.PropTypes.node
+		children: React.PropTypes.node,
+		onLoad: React.PropTypes.func,
+		onError: React.PropTypes.func
 	},
 
 	getInitialState: function() {
@@ -72,8 +74,18 @@ module.exports = React.createClass( {
 	onLoadComplete: function( event ) {
 		this.destroyLoader();
 
-		this.setState( {
-			status: 'load' === event.type ? LoadStatus.LOADED : LoadStatus.FAILED
+		if ( event.type !== 'load' ) {
+			return this.setState( { status: LoadStatus.FAILED }, () => {
+				if ( this.props.onError ) {
+					this.props.onError( event );
+				}
+			} );
+		}
+
+		this.setState( { status: LoadStatus.LOADED }, () => {
+			if ( this.props.onLoad ) {
+				this.props.onLoad( event );
+			}
 		} );
 	},