Image Editor: Handle when image fails to load

[gwwar]

If an image fails to load in the editor we should display an error notice that lets the user know what happened.

Common error cases would be:

1. Image never finishes loading
2. Image is supposed to have CORS headers but doesn't. Which taints the canvas.
3. Drawing the image to canvas fails

We can simulate the errors by throwing them locally in the image editor functions.

To enable the image editor:

1. Navigate to http://calypso.localhost:3000/post
2. Select a site
3. Add an image
4. Select the image
   
5. Click "Edit", then click on "Edit Image" in the top right corner of the detail view
   
6. The image editor should load.
   

[retrofox]

In some way we will avoid a bit more this situation once merged #7977. Let's implement it anyway.

[retrofox]

We have a z-index issue here when we wanna show a global error and the image editor modal at the same time. Pay attention to the red global error:

Beyond of the discussion if we should swap the level of both elements and how to do it (model and error global notice) in this case I suggest hide the modal and show the global error because doesn't make sense show the modal there since the user won't can edit the image in any way.

[gwwar]

I would suggest navigating back to the media detail view, which you should be able to get to by calling: this.props.onImageEditorCancel

[retrofox]

I was thinking to add an onLoadError to canvas component.

[gwwar]

Sorry @retrofox let's use an inline notice over a global one. We already do this in the media modal for other validation errors

[gwwar]

Closed by @retrofox in #8002