Allow developer to select type and encoderOptions, based on HTMLCanvasElement.toDataURL() paramters

[skliffmueller]

This is somewhat relating to issues #34 and #42

Even though this does not solve the users issues with retaining EXIF data. This will give the users the ability to have the resulting image be in a jpeg format. Which then they can use additional libraries to extract EXIF data from the original image, and add to the resulting image. I feel the addition of an EXIF feature would require a lot more work, or a lot more additional third party libraries, resulting in bloat that would affect users not needing such functionality. I personally feel it should be the responsibility of the user to build these features outside of the already lean and clean watermarkjs library.

These additions also improves the capabilities of watermarkjs by selecting the image type, and compression/quality allowing for smaller image sizes on more details photographs. The original experience I was facing, was using a jpg image of 134kb, adding a watermark, having a result being 5-6mb png. This feature has reduced the image back down to around 140kb which helps a lot in my scenario, uploading from a client browser to an s3 bucket, after watermark generation.

I was having issues building the current code base as babel has updated into newer versions, which only support webpack 2.x. I have modified the webpack.config.js to use a specific version of babel-loader which has solved said issues. The compiled/minified code has changed just slightly, but is essentially the same as before, aside from my additions.

/lib/canvas/index.js has been updated to accept the parameters standard to the html canvas function

/lib/index.js has been updated with additional options parameters, and API documentation

/examples/docs.html has been updated to include usage of said parameters

package.json now includes [email protected] in devDependencies

I have tested this on a windows 10 system, and an OSX system from fresh installs, and I have not had any issues.

PS: In reference to the EXIF issue, there is a stack overflow topic related to the exact issue with example solutions https://stackoverflow.com/questions/18297120/html5-resize-image-and-keep-exif-in-resized-image

[ipluser]

@brianium Could you have the time to review the code?

[brianium]

I have reviewed and merged this, but this lib needs some love to bring it up to speed with newer versions of webpack 😱 - I think building in general should be easier in 2019

[skliffmueller]

@brianium I'm looking into updating webpack and babel. Also, don't forget to update github.io docs with this PR.