Web Component: j-Preview
j-Preview
This component resizes the picture automatically according to the settings and uploads it to the server in base64 format.
- jComponent
v19|v20 - response from server needs to contain URL address to the picture
- easy usage
- works with Bootstrap Grid System
- drag and drop support
- supports EXIF orientation
Path:
The value/response (from the upload) will be used as a URL address for preview.
Configuration:
url{String}(IMPORTANT) upload URL, can contain a method too (required)width{Number}a picture width (required)height{Number}a picture height (required)percentage{Number}resizes a picture according to the percentage (thenwidthandheightaren't required)icon{String}(optional) the label icon withoutti, (default:null)background{String}(optional) a background color, it can betransparent(default:white)schema{String}prepared object for sending (default:{file:base64,filename:filename},base64+filenameis a value from preview)quality{Number}JPEG quality (default:90)customize{Boolean}resizes picture to the defined size (default:true)preview{String}prepares a value preview URL address (default:null)- example:
value => '/download/' + value + '.jpg'
- example:
map{String}prepares response value to a value (default:null)- example:
value => value.id
- example:
empty{String}a link to the empty imagekeeporiginal{Boolean}keeps the original image if the dimension is the same as the width/height defined in the configuration (default:false)- NEW
output{String}output typebase64(default) orfile - NEW
convert{String}an image typejpg(default) orpng - NEW
exec{String}a path to the methodfunction(next(url))(it prevents file upload dialog) - NEW
center{Boolean}aligns the image and label to the center
Methods:
component.reupload()it reuploads a current image value as a base64.
Author
- Peter Širka petersirka@gmail.com
- License
Created
23. november 2017
Updated
11. july 2024
jComponent library
19 | 20
Version
v1
License
https://www.totaljs.com/license/
Dark mode
Yes
Responsive
Yes
Author
Peter Širka
Email
petersirka@gmail.com

