# j-PictureUpload

> j-PictureUpload: easy usage; works with Bootstrap Grid System

Framework: jcomponent20
Product: jComponent 20 (jcomponent@20)
Language: en
Content-SHA256: 7a2ce19cb695f85a25d64478807ff96d7188962716da27cee0a2103e572dcabc
Snapshot: c0700e321579725c5cf4f5ace1ad7d2866d1b4f93c24a63c0b41b6b7998e976c
Sources: components@910ed1a86f6e72b4f031d3ad0dc7844f9fc5cb8e
Review: not-recorded

- works with Bootstrap Grid System
- drag and drop support
- uploads a raw file (without resizing)

__Configuration__:

- `width` {Number} a picture width (required)
- `height` {Number} a picture height (required)
- `icon` {String} (optional) the label icon without `ti`, (default: `null`)
- `url` {String}" (optional) upload URL (default: current URL)
- `background` {String} (optional) a background color (default: white)
- `src` {String} an image path (default: `null`), e.g. `/img/{0}.jpg`
- `extension` {Boolean} response without file extension (default: `false`)
- `singlefile` {Boolean} response will be string instead of array (default: `true`)
- __new__ `type` {String} preview: output type (default: `png`)
- __new__ `quality` {Number} preview: output quality

Use it with `<ui-component name="pictureupload">`. 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.

```html example.html
<div style="padding:50px;max-width:300px">
	<ui-component name="pictureupload" path="picture" config="width:300;height:200;url:/upload/;icon:folder">Picture</ui-component>
</div>

<script>
	var picture = '';
</script>
```
