j-ImageUploader

jComponent 20 · jcomponent@20 component Example loaded with jComponent 20

A simple singleton component for uploading of resized images. The component uploads base64 according to the schema defined in options of caller.

Methods:

imageuploader/upload(opt) shows a file dialog
- opt.width {Number}
- opt.height {Number}
- opt.background {String} a default background color (NEW: supports the transparent value and output will be .png)
- opt.url {String} important URL where will be image uploaded
- opt.multiple {Boolean} supports multiple files (default: false)
- opt.schema {String} default { file: base64, name: filename }
- opt.quality {Number} default 90
- opt.callback(response, errors) a callback important
- opt.keeporiginal {Boolean} keeps the original image if the dimension is the same as the width/height defined in the configuration (default: false)
- NEW opt.files {FileList} optional (if you use e.g Drag & Drop)

Friendly components:

This component works with loading when the file is uploading.

Use it with <ui-component name="imageuploader">. When the component is not loaded yet, jComponent downloads it on first use from the address in DEF.fallback (the Componentator CDN by default). Author: Peter Širka. Source: the Componentator components repository, MIT license.

example.html

<ui-component name="imageuploader"></ui-component>
<div onclick="uploadphoto()">Click to upload</div>

<script>

	function uploadphoto() {
		var opt = {};
		opt.width = 200;
		opt.height = 200;
		opt.url = '/api/upload/base64/';
		opt.background = '#FFFFFF';
		opt.multiple = true;
		opt.callback = function(response, err) {
			console.log(response, err);
		};
		SETTER('imageuploader/upload', opt);
	}

</script>