image-blobber
A small module for reading image file base64/dimensions, and scaling them to a max height or width.
Installation
image-blobber can be installed from npm.
npm install --save image-blobber
//ES6; //Node-style requireconst imageblobber = ;
Usage
All image-blobber functions are promisified.
Supported: boolean
An exported boolean that indicates whether the current environment supports the FileReader needed by the getFileBlobs
function. If false
, getFileBlobs
will throw an error.
; if !Supported
getFileBlobs(input: HtmlInputElement): Promise<File[]>
Gets all file blobs for an HTML5 file input element.
; ; getFileBlobsinput.then;
getBase64(file: File): Promise<BlobDetails>
Gets the base64 string, filename and dimensions for the given image file. See below for the BlobDetails
interface.
; ; getBase64file.then;
scaleBase64(base64: string, options: ScaleOptions): Promise<ScaleResult>
Scales a base64 image string according to the options passed in. See below for the ScaleOptions
and ScaleResult
interfaces.
; ; scaleBase64base64, .then;
Tie it all together
;; ; blobber.getFileBlobsinput .then .then .then
Interfaces
The following interfaces are used or returned at some point by image-blobber. If you're using Typescript, the compiler should automatically pick up these definitions when image-blobber is installed.
Dimensions
Property | Type | Comments |
---|---|---|
height | number | The image's height. |
width | number | The image's width. |
BlobDetails
Property | Type | Comments |
---|---|---|
filename | string | The name of the file as it appears on the user's machine. |
base64 | string | A base64 string representing the image. Can be set as an <img /> element's src . |
dimensions | Dimensions | The image's height and width dimensions. |
ScaleResult
Property | Type | Comments |
---|---|---|
scaledBase64 | string | A base64 string representing the scaled image. Can be set as an <img /> element's src . |
scaledDimensions | Dimensions | The scaled image's new height and width dimensions. |
ScaleOptions
Property | Type | Comments |
---|---|---|
height | number | The maximum height allowed for a scaled image. Optional, but options must include either a height or width. |
width | number | The maximum width allowed for a scaled image. Optional, but options must include either a height or width. |
preserveRatio | boolean | Whether aspect ratio should be preserved. If true, image will be scaled to an aspect ratio that satisfies both height and width . Default true. |