forked from olcxjas-softworks/LarpixClient
2 lines
4 KiB
JavaScript
2 lines
4 KiB
JavaScript
class t{frames;parsedFrames;commonCropOptions;convertorCanvas;containerCanvas;convertCtx;containerCtx;cropperJsOpts;offsetX=0;offsetY=0;containerCenterX=0;containerCenterY=0;resultFrames=[];constructor(t){this.init(t)}init({commonCropOptions:t}){this.commonCropOptions=t,this.cropperJsOpts=t.cropperJsOpts,this.resultFrames=[],this.containerCanvas&&this.convertorCanvas||this.setupCanvas(),this.setCanvasWH()}async cropGif(t){const{frames:s,parsedFrames:e}=t;this.frames=s,this.parsedFrames=e;let a=0;for(;a<this.frames.length;){const t=this.frames[a];if(1!==this.parsedFrames[a].disposalType&&this.containerCtx.clearRect(0,0,this.containerCanvas.width,this.containerCanvas.height),this.containerCtx.globalCompositeOperation&&this.cropperJsOpts?.background&&(this.containerCtx.fillStyle=this.cropperJsOpts?.background||"",this.containerCtx.globalCompositeOperation="destination-over",this.containerCtx.fillRect(0,0,this.containerCanvas.width,this.containerCanvas.height),this.containerCtx.globalCompositeOperation="source-over"),!t)continue;const s=this.transformFrame(this.drawImgDataToCanvas(t,a));this.resultFrames.push(s),this.ifDebugRun(s,a),a++}return this.resultFrames}cropStaticImage(t){return this.transformFrame(t)}transformFrame(t){this.containerCtx.save(),this.containerCtx.translate(this.containerCenterX,this.containerCenterY),this.containerCtx.rotate(this.cropperJsOpts.rotate*Math.PI/180),this.containerCtx.scale(this.cropperJsOpts.scaleX,this.cropperJsOpts.scaleY),this.containerCtx.drawImage(t,-this.convertorCanvas.width/2,-this.convertorCanvas.height/2),this.containerCtx.restore();return this.containerCtx.getImageData(1*this.cropperJsOpts.x+this.offsetX,1*this.cropperJsOpts.y+this.offsetY,this.cropperJsOpts.width,this.cropperJsOpts.height)}drawImgDataToCanvas(t,s){const e=this.parsedFrames[s]?.dims;return this.convertCtx.clearRect(0,0,this.convertorCanvas.width,this.convertorCanvas.height),this.convertCtx.putImageData(t,e.left,e.top),this.convertorCanvas}ifDebugRun(t,s){location.search.includes("isCropDebug=true")&&s&&this.renderEachFrame(t,s)}renderEachFrame(t,s){const e=this.parsedFrames[s]?.dims,a=document.createElement("canvas");a.width=this.convertorCanvas.width,a.height=this.convertorCanvas.height;const r=a.getContext("2d");r&&(r?.putImageData(t,e.left,e.top),r.fillStyle="red",r.strokeStyle="blue",r.lineWidth=5,r.save(),r.beginPath(),r.font="70px orbitron",r.fillText(String(s),10,50),r.restore(),r.closePath(),document.body.appendChild(a))}setupCanvas(){const t=this.containerCanvas=document.createElement("canvas"),s=this.convertorCanvas=document.createElement("canvas");t.className="containerCanvas",s.className="convertorCanvas",t.style.display="none",s.style.display="none";const e=t.getContext("2d",{willReadFrequently:!0}),a=s.getContext("2d");e&&(this.containerCtx=e),a&&(this.convertCtx=a),document.body.appendChild(s),document.body.appendChild(t)}setCanvasWH(){Math.PI,this.cropperJsOpts.rotate;const t=this.commonCropOptions.imageData,s=t.naturalWidth,e=t.naturalHeight;this.offsetX=-Math.min(this.cropperJsOpts.x,0),this.offsetY=-Math.min(this.cropperJsOpts.y,0),this.containerCenterX=this.offsetX+s/2,this.containerCenterY=this.offsetY+e/2,this.containerCanvas.width=Math.max(this.offsetX+s,this.offsetX+this.cropperJsOpts.width,this.cropperJsOpts.x+this.cropperJsOpts.width),this.containerCanvas.height=Math.max(this.offsetY+e,this.offsetY+this.cropperJsOpts.height,this.cropperJsOpts.y+this.cropperJsOpts.height),this.convertorCanvas.width=t.naturalWidth,this.convertorCanvas.height=t.naturalHeight,this.containerCtx.clearRect(0,0,this.containerCanvas.width,this.containerCanvas.height),this.convertCtx.clearRect(0,0,this.convertorCanvas.width,this.convertorCanvas.height)}frameToImgData(t,s){if(!t)return;const e=s.pixels.length,a=t.createImageData(s.dims.width,s.dims.height),r=a.data;for(let t=0;t<e;t++){const e=4*t,a=s.pixels[t],n=s.colorTable[a];r[e]=n[0],r[e+1]=n[1],r[e+2]=n[2],r[e+3]=a!==s.transparentIndex?255:0}return a}}export{t as FrameCropper};
|
|
//# sourceMappingURL=cropper.js.map
|