image-wire
Version:
0 dependencies, less than 1kb library to glue images together
2 lines (1 loc) • 1.02 kB
JavaScript
;Object.defineProperty(exports,"__esModule",{value:!0}),exports[Symbol.toStringTag]="Module";const e={gap:0,direction:"horizontal",type:"image/png",quality:.92};exports.imageWire=async function(t,o){const{direction:i,gap:a,color:r,type:n,quality:h}={...e,...o},l=t instanceof FileList?Array.from(t).map(URL.createObjectURL):t,c=document.createElement("canvas"),g=c.getContext("2d"),d=l.map((e=>new Promise(((t,o)=>{const i=new Image;i.onerror=()=>o(new Error("Couldn't load image")),i.onload=()=>t(i),i.src=e})))),s=await Promise.all(d),m=(e,t)=>s.slice(0,t).reduce(((t,o,i)=>t+o[e]+(i?a:0)),0),p=e=>Math.max(...s.map((t=>t[e])));return"horizontal"===i?(c.width=m("width",s.length),c.height=p("height")):(c.width=p("width"),c.height=m("height",s.length)),r&&(g.fillStyle=r,g.fillRect(0,0,c.width,c.height)),s.forEach(((e,t)=>{const o=(e=>e?"horizontal"===i?[m("width",e)+a,0]:[0,m("height",e)+a]:[0,0])(t);g.drawImage(e,...o)})),fetch(c.toDataURL(n,h)).then((e=>e.blob())).then((e=>[URL.createObjectURL(e),e]))};