Upload single avatar

Using the default rendered previewContainer markup
we can show the uploaded file contents as soon
as it is entered, display the built-in progress bar, and a successful
`√` or `X` when there's an error.

Slightly Fancier Avatar Upload with Shubox

To achieve a slightly more fancy experience, we can turn off the
`previewsContainer` setting and insert the resulting image
ourselves with appropriate class names that will result in a
flip-in effect using the animate.css library. In addition the
progress of the upload can be customized based on the data
attribute applied to the base element. This allows for control more
finely tuned than an element that merrely changes the width
property.

The upload progress css, it should be noted, can be styled with a
sass for loop that will change the display based on the percentage
of completion.

Form Elements

Clicking into <input/>
will trigger the upload dialog, will upload
the file and replace the contents of the
element.

The <textarea/> will
behave as usual unless you drag and drop
images into the body of it. If you click the
adjacent <div/> it will
trigger the file dialog on behalf of the
textarea. Successfully uploaded files will be
appended to the end of the textarea as a markdown
image tag.

Note that if you are using Google Chrome you are able to paste
image data in your clipboard into the two form elements
directly. Shubox will create a new file for you with that
data and return
the resulting URL.