Magento 2: How to repurpose the admin product image uploader?

Question

Using 2.1.3, I'd like to add an image uploader to a custom admin module I'm building.

I've gotten as far as copying vendor/magento/module-catalog/view/adminhtml/web/catalog/base-image-uploader.js to my module, renamed it and included it in my requirejs-config.js file - but it looks like it needs a specific x/magento-template to generate the uploader. (Ultimately I'll rework the ajax call to target a controller in my module as well as make additions to the success methods)

Does anyone have any tips on how to go about adding Magento 2's base image uploader to a custom module?

Answer 1

After some trial and error, adding an image uploader in the admin is fairly straight forward; create a custom js file in your module, and include "jquery/ui" and "jquery/file-uploader" into your definition:

define([
    "jquery",
    ....
    "jquery/ui",
    "jquery/file-uploader"
], function ($) {
    'use strict';
    ...

And then you can reference .fileupload({}); and attach it to any DOM element you'd like:

$('#domElement').fileupload({
     ....
});

Documentation for the fileupload configuration can be found here https://github.com/blueimp/jQuery-File-Upload/wiki