Imagine
Imagine is a hoodie plugin for handling image uploads. This is a functional but very early version so there might be some changes in the future.
features
- resizes images client-side to reduce traffic and server processing time
- create image groups and types to manage images
- automated cropping & resizing
- jpg & png images supported
- define different filters (uses GraphicsMagick)
- sepia
- monochrome
- blur 30, 20
- colorize 100, 0, 0
- modulate 100, 50
API
All methods except .get
are returning promises. Also .add
, .update
and .upsert
call a progress as soon as an image is resized client-side.
// uploads an image and returns a image objecthoodieimagine; hoodieimagine;hoodieimagine; // find an image by an id or an array of ids, returns an image objecthoodieimagine; // find images of current user// you can also filter the images by grouphoodieimagine; // remove a single imagehoodieimagine; // remove all images by current userhoodieimagine; // a preview image will be returned by a progress call (.add and .update only)previewImageid; // final id of the image, keep it for later ;)previewImagedataUrl; // dataUrl of resized imagepreviewImagewidth; // width of resized imagepreviewImageheight; // height of resized imagepreviewImagecanvas; // canvas used for resizing, you can copy it to show a preview // an image object has an id property and a url method. imageid;image;
keep in mind
There is currently no group/type update mechanism. Your changes will be applied to new uploads only (.add
, .update
). You need to restart the hoodie server to apply the configuration.
example with data-url
// upload file { return { var dataUrl = evtargetresult; hoodieimagine ; };} // handle selection of file input { ev; var files = evtargetfiles; $;} ;