@notthatnathan/use-canvas-image
Version:
A React hook for automatically exporting a canvas to img.
3 lines (2 loc) • 1.42 kB
JavaScript
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("react"),require("usehooks-ts")):"function"==typeof define&&define.amd?define(["react","usehooks-ts"],t):(e||self).useCanvasImage=t(e.react,e.usehooksTs)}(this,function(e,t){return function(n){var r=n.canvas,u=n.imgClassname,s=void 0===u?"":u,i=n.canvasClassname,o=void 0===i?"":i,a=n.canvasAttributes,c=void 0===a?{}:a,l=n.fileType,f=void 0===l?"image/jpeg":l,d=n.quality,p=void 0===d?.7:d,v=n.interval,m=void 0===v?null:v,y=e.useRef(),b=e.useRef(),g=function(){requestAnimationFrame(function(){if(y.current&&b.current){var e=y.current.toDataURL(f,p);b.current.src=e}})};return e.useEffect(function(){var e;return function t(){var n,u;"string"==typeof r?y.current=document.querySelector(r):(null==r?void 0:r.current)instanceof HTMLCanvasElement?y.current=r.current:r instanceof HTMLCanvasElement&&(y.current=r),y.current?(Object.keys(c).forEach(function(e){y.current.setAttribute(e,c[e])}),o&&(n=y.current.classList).add.apply(n,o.split(" ")),y.current.style="position: absolute; top: 0; left: 0; z-index: 1;",b.current=new Image,s&&(u=b.current.classList).add.apply(u,s.split(" ")),b.current.style="position: absolute; top: 0; left: 0; z-index: 0;",y.current.after(b.current)):e=setTimeout(t,100)}(),function(){e&&clearTimeout(e)}},[]),t.useInterval(g,m),null===m||!1===m?g:null}});
//# sourceMappingURL=index.umd.js.map