# j-Preview

> Diese Komponente passt die Größe des Bildes automatisch entsprechend den Einstellungen an und lädt es im Base64-Format auf den Server hoch.

Framework: jcomponent20
Product: jComponent 20 (jcomponent@20)
Language: de
Content-SHA256: 35c942af20baed9dd792022b313e5d032cb9d4434e6ec57c37461e1036fee322
Snapshot: c0700e321579725c5cf4f5ace1ad7d2866d1b4f93c24a63c0b41b6b7998e976c
Sources: components@910ed1a86f6e72b4f031d3ad0dc7844f9fc5cb8e
Review: not-recorded

Diese Komponente resiziert das Bild automatisch nach den Einstellungen und laden es in `base64`-Format auf den Server.

- Antwort vom Server muss die URL des Bildes enthalten
- Funktioniert mit dem Bootstrap Grid System
- Drag-and-Drop-Unterstützung
- Unterstützung für EXIF-Orientation

__Pfad__:

Der Wert/Reaktion (von der Aufgabe) wird als URL für die Vorstellung verwendet.

__Konfiguration__:

- `url {String}` (__IMPORTANT__) upload URL, kann auch eine Methode enthalten (bedarf)
- `width {Number}` eine Bildweite (erfordert)
- `height {Number}` eine Bildhöhe (erfordert)
- `percentage {Number}` resisiert ein Bild nach dem Prozentsatz (siehe `width` und `height` sind nicht erforderlich)
- `icon {String}` (optional) die Etikett-Ikon ohne `ti`, (Default: `null`)
- `background {String}` (optional) eine Hintergrundfarbe, es kann `transparent` sein (Default: `white`)
- `schema {String}` vorbereitetes Objekt für die Sendung (Default: `{file:base64,filename:filename}`, `base64` + `filename` ist ein Wert aus der Vorstellung)
- `quality {Number}` JPEG Qualität (Default: `90`)
- `customize {Boolean}` reduziert das Bild auf die definierte Größe (Default: `true`)
- `preview {String}` bereitet eine Wertevorsichts-URL vor (Default: `null`)
	- Beispiele für `value => '/download/' + value + '.jpg'`
- `map {String}` bereitet Reaktionswert auf einen Wert vor (Default: `null`)
	- Beispiele für `value => value.id`
- `empty {String}` eine Verbindung zum leeren Bild
- `keeporiginal {Boolean}` behält das Originalbild bei, wenn die Abmessung mit der in der Konfiguration definierten Breite/Höhe übereinstimmt (Standard: `false`)
- __NEW__ `output {String}` Ausgabetyp `base64` (Standard) oder `file`
- __NEW__ `convert {String}` ein Bildtyp `jpg` (Default) oder `png`
- __NEW__ `exec {String}` einen Weg zur Methode `function(next(url))` (es verhindert den Datei-Upload-Dialog)
- __NEW__ `center {Boolean}` vereinigt das Bild und die Etikette mit dem Zentrum

__Methoden__:

- `component.reupload()` erhebt einen aktuellen Bildwert als Basis64.

Verwenden Sie es mit `<ui-component name="preview">`. Wenn die Komponente noch nicht geladen ist, lädt jComponent sie bei der ersten Verwendung von der Adresse in `DEF.fallback` herunter (standardmäßig das CDN Componentator). Autor: Peter Širka. Quelle: Componentator-Komponenten-Repository, MIT-Lizenz.

```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>
```