Propagate quality param

This commit is contained in:
Sergey 2016-01-15 13:39:59 +03:00
parent 20d288654c
commit 51b7b02f0a
2 changed files with 22 additions and 7 deletions

View File

@ -204,15 +204,17 @@ function dataURLToBlob(dataURL) {
* @param {string|undefined} type - the content type (optional, defaults to 'image/png')
* @param {string|undefined} crossOrigin - for CORS-enabled images, set this to
* 'Anonymous' to avoid "tainted canvas" errors
* @param {number|undefined} quality - a number between 0 and 1 indicating image quality
* if the requested type is 'image/jpeg' or 'image/webp'
* @returns {Promise} Promise that resolves with the data URL string
*/
function imgSrcToDataURL(src, type, crossOrigin) {
function imgSrcToDataURL(src, type, crossOrigin, quality) {
type = type || 'image/png';
return loadImage(src, crossOrigin).then(function (img) {
return imgToCanvas(img);
}).then(function (canvas) {
return canvas.toDataURL(type);
return canvas.toDataURL(type, quality);
});
}
@ -220,16 +222,18 @@ function imgSrcToDataURL(src, type, crossOrigin) {
* Convert a <code>canvas</code> to a <code>Blob</code>. Returns a Promise.
* @param {string} canvas
* @param {string|undefined} type - the content type (optional, defaults to 'image/png')
* @param {number|undefined} quality - a number between 0 and 1 indicating image quality
* if the requested type is 'image/jpeg' or 'image/webp'
* @returns {Promise} Promise that resolves with the <code>Blob</code>
*/
function canvasToBlob(canvas, type) {
function canvasToBlob(canvas, type, quality) {
return Promise.resolve().then(function () {
if (typeof canvas.toBlob === 'function') {
return new Promise(function (resolve) {
canvas.toBlob(resolve, type);
canvas.toBlob(resolve, type, quality);
});
}
return dataURLToBlob(canvas.toDataURL(type));
return dataURLToBlob(canvas.toDataURL(type, quality));
});
}
@ -244,15 +248,17 @@ function canvasToBlob(canvas, type) {
* @param {string|undefined} type - the content type (optional, defaults to 'image/png')
* @param {string|undefined} crossOrigin - for CORS-enabled images, set this to
* 'Anonymous' to avoid "tainted canvas" errors
* @param {number|undefined} quality - a number between 0 and 1 indicating image quality
* if the requested type is 'image/jpeg' or 'image/webp'
* @returns {Promise} Promise that resolves with the <code>Blob</code>
*/
function imgSrcToBlob(src, type, crossOrigin) {
function imgSrcToBlob(src, type, crossOrigin, quality) {
type = type || 'image/png';
return loadImage(src, crossOrigin).then(function (img) {
return imgToCanvas(img);
}).then(function (canvas) {
return canvasToBlob(canvas, type);
return canvasToBlob(canvas, type, quality);
});
}

View File

@ -154,5 +154,14 @@ function tests() {
});
});
});
it('convert with specific quality', function () {
var img = document.getElementById('kirby');
return blobUtil.imgSrcToBlob(img.src, 'image/jpeg', undefined, 1).then(function (blob) {
return blobUtil.imgSrcToBlob(img.src, 'image/jpeg', undefined, 0.5).then(function (lowQualityBlob) {
lowQualityBlob.size.should.be.lessThan(blob.size);
});
});
});
});
}