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.
- 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 (thenwidth
andheight
aren'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
+filename
is 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
Methods:
component.reupload()
it reuploads a current image value as a base64.
Author
- Peter Širka petersirka@gmail.com
- License
Created
23. november 2017
Updated
15. march 2024
Version
v1
License
https://www.totaljs.com/license/
Dark mode
Yes
Responsive
Yes
Author
Peter Širka
Email
petersirka@gmail.com