Fineuploader drawThumbnail with Pica - fine-uploader

Question

I'm new to Fineuploader and using this great uploader together with Pica for image scaling. Pica works well for scaling and thumbnails.
scaling: {
sendOriginal: false,
hideScaled: false,
sizes: [
{name: "a", maxSize: 200},
{name: "b", maxSize: 600},
{name: "c", maxSize: 1000}
],
customResizer: !qq.ios() && function(resizeInfo) {
return new Promise(function(resolve, reject) {
pica.debug = console.log.bind(console),
pica.resizeCanvas(resizeInfo.sourceCanvas, resizeInfo.targetCanvas, {}, resolve)
})
}
}, thumbnails: {
customResizer: !qq.ios() && function(resizeInfo) {
return new Promise(function(resolve, reject) {
pica.resizeCanvas(resizeInfo.sourceCanvas, resizeInfo.targetCanvas, {}, resolve)
})
}
}
However, I need to drawThumbnail to other places. I've tried googling all around and going through the Fineuploader's documentation, but still no luck in making Pica run with drawThumbnails.
Fineuploader's documentation
drawThumbnail (id, targetContainer[, maxSize[, fromServer[, customResizer]]])
My current code
var canvas = document.createElement('canvas');
canvas.width = 300;
canvas.height = 200;
$(".frame").html(canvas);
uploader.drawThumbnail(id, canvas, 300, false);
It would be great if someone could guide me on modifying the current code to make drawThumbnail run with Pica, thanks.

Answer 1

As you pointed out in your question, the documentation shows how to use an alternate resizer function when using drawThumbnail:
drawThumbnail(id, targetContainer[, maxSize[, fromServer[, customResizer]]])
...so, your code would look like this:
var canvas = document.createElement('canvas')
var customResizer = function(resizeInfo) {
return new Promise(function(resolve, reject) {
pica.resizeCanvas(
resizeInfo.sourceCanvas,
resizeInfo.targetCanvas,
{},
resolve
)
})
}
canvas.width = 300;
canvas.height = 200;
$(".frame").html(canvas);
uploader.drawThumbnail(id, canvas, 300, false, !qq.ios() && customResizer);