# j-Preview

> Deze component resecteert de afbeelding automatisch volgens de instellingen en loopt het op naar de server in base64-formaat.

Framework: jcomponent20
Product: jComponent 20 (jcomponent@20)
Language: nl
Content-SHA256: 0f51506714b3e4f7e9295bfa76aea7995ca44138be854f02a281bb178908ca8c
Snapshot: c0700e321579725c5cf4f5ace1ad7d2866d1b4f93c24a63c0b41b6b7998e976c
Sources: components@910ed1a86f6e72b4f031d3ad0dc7844f9fc5cb8e
Review: not-recorded

Deze component resecteert de afbeelding automatisch volgens de instellingen en loopt deze op naar de server in het `base64`-formaat.

- Reactie van de server moet URL's op het beeld bevatten
- Werk met Bootstrap Grid System
- Draag en drop ondersteuning
- Ondersteunt EXIF Oriëntie

__De weg__:

De waarde/respons (van de upload) wordt gebruikt als een URL voor het voorbeeld.

__Configuratie__:

- `url {String}` (__IMPORTANT__) URL uploaden, kan ook een methode bevatten (verplicht)
- `width {Number}` een beeldbreedte (verplicht)
- `height {Number}` een beeldhoogte (verplicht)
- `percentage {Number}` resecteert een afbeelding volgens het percentage (dan is `width` en `height` niet vereist)
- `icon {String}` (optional) het label icon zonder `ti`, (default: `null`)
- `background {String}` (optional) een achtergrondkleur, het kan `transparent` zijn (default: `white`)
- `schema {String}` voorbereid object voor verzending (de standaard: `{file:base64,filename:filename}`, `base64` + `filename` is een waarde van de voorbeeld)
- `quality {Number}` JPEG kwaliteit (default: `90`)
- `customize {Boolean}` resecteert de afbeelding naar de gedefinieerde grootte (default: `true`)
- `preview {String}` bereidt een voorwaarde URL (default: `null`)
	- Voorbeeld: `value => '/download/' + value + '.jpg'`
- `map {String}` bereidt een reactiewaarde voor op een waarde (default: `null`)
	- Voorbeeld: `value => value.id`
- `empty {String}` een link naar het leeg beeld
- `keeporiginal {Boolean}` behoudt de oorspronkelijke afbeelding als de dimensie hetzelfde is als de breedte/hoge gedefinieerd in de configuratie (default: `false`)
- __NEW__ `output {String}` uitgangstype `base64` (default) of `file`
- __NEW__ `convert {String}` een afbeelding type `jpg` (default) of `png`
- __NEW__ `exec {String}` een route naar de methode `function(next(url))` (het voorkomt het bestand upload dialoog)
- __NEW__ `center {Boolean}` regelt de afbeelding en etiket naar het centrum

__Methoden__:

- `component.reupload()` heroplaadt een huidige beeldwaarde als basis64.

Gebruik het met `<ui-component name="preview">`Wanneer de component nog niet is geladen, jComponent Download het op eerste gebruik van het adres in `DEF.fallback` (De Componentator Schrijver: Peter Širka. bron: de Componentator Componenten repository, MIT licentie.

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

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