constprocessedImagebase64=newImageFilter(originalImage).changeBrightness(brightness).changeContrast(contrast).getResult();exportclassImageFilter{imagedata:ImageDatacanvas:HTMLCanvasElement;ctx:CanvasRenderingContext2D|null;/**
* Create a Image Filter instance
* @param {HTMLImageElement} inputImage An Image Element was expected
* @returns call getResult() to get the processed image in base64 format
*/constructor(inputImage:HTMLImageElement){this.canvas=document.createElement('canvas');this.canvas.width=inputImage.width;this.canvas.height=inputImage.height;this.ctx=this.canvas.getContext('2d');if(this.ctx){this.ctx.drawImage(inputImage,0,0,this.canvas.width,this.canvas.height);this.imagedata=this.ctx.getImageData(0,0,this.canvas.width,this.canvas.height);}else{throwError("ImageFilter init failed: Can't get context of canvas");}}/**
* Get processed image in base64 format
* @returns {string} success: processed image in base64 format
* @returns {undefined} failed: return undefined
*/getResult(){if(this.ctx){this.ctx.putImageData(this.imagedata,0,0);returnthis.canvas.toDataURL();}else{returnundefined;}}/**
* Change Brightness
* @param {number} amount 0:dark, 1:original, 2:brigher
* @returns {ImageFilter} imageFilter object will be returned
*/changeBrightness(amount:number){constdata=this.imagedata.data;letadjustedAmount=amount;if(amount>2){adjustedAmount=2;}if(amount<0){adjustedAmount=0;}letr,g,b;for(leti=0;i<data.length;i+=4){r=data[i]*adjustedAmount;g=data[i+1]*adjustedAmount;b=data[i+2]*adjustedAmount;data[i]=r;data[i+1]=g;data[i+2]=b;}returnthis;}/**
* Change Contrast
* @param {number} amount 0:less, 1:original, 2:more
* @returns {ImageFilter} imageFilter object will be returned
*/changeContrast(amount:number){constdata=this.imagedata.data;letadjustedAmount=amount;if(amount>2){adjustedAmount=2;}if(amount<0){adjustedAmount=0;}letr,g,b;for(leti=0;i<data.length;i+=4){r=128+(data[i]-128)*adjustedAmount;g=128+(data[i+1]-128)*adjustedAmount;b=128+(data[i+2]-128)*adjustedAmount;data[i]=r;data[i+1]=g;data[i+2]=b;}returnthis;}}
Top comments (0)