|
import{S as fe,i as me,s as he,k as g,a as H,q as ne,H as ge,l as w,m as C,h as p,c as K,r as re,n as i,I as se,p as we,F as r,b as le,J as ce,K as W,L as ve,M as be,A as de,N as _e,o as ye,z as Ie,O as Ee,P as oe}from"../../chunks/index-c0a82f06.js";const{document:Z,window:pe}=Ee;function De(s){let P,n,y,v,q,b,I,c,S,j,M,E,a,m,A,o,D,d,F,x,J,N,Y,L,G,U,R,T,B,Q,V,X,$;return{c(){P=g("link"),n=g("script"),v=g("script"),b=g("script"),c=H(),S=g("div"),j=g("canvas"),E=H(),a=g("div"),m=g("div"),A=H(),o=g("div"),D=g("div"),d=g("input"),F=H(),x=g("button"),J=ne("diffuse the f rest"),Y=H(),L=g("p"),G=ne("pro tip: upload img by pasting OR dropping on the canvas"),U=H(),R=g("div"),T=g("label"),B=g("input"),Q=ne(` |
|
upload img`),ae.forEach(p),te.forEach(p),f.forEach(p),k.forEach(p),u.forEach(p),this.h()},h(){i(P,"href","https://cdnjs.cloudflare.com/ajax/libs/drawingboard.js/0.4.2/drawingboard.css"),i(P,"rel","stylesheet"),se(n.src,y="https://code.jquery.com/jquery-1.12.4.min.js")||i(n,"src",y),se(v.src,q="https://cdnjs.cloudflare.com/ajax/libs/drawingboard.js/0.4.2/drawingboard.min.js")||i(v,"src",q),se(b.src,I="https://cdnjs.cloudflare.com/ajax/libs/iframe-resizer/4.3.1/iframeResizer.contentWindow.min.js")||i(b,"src",I),i(j,"class",M="border-[1.2px] desktop:mt-[34px] "+(s[5]?"":"hidden")),i(m,"id","board-container"),i(d,"type","text"),i(d,"class","border-2 py-1"),i(d,"placeholder","Add prompt"),i(x,"class","bg-blue-500 hover:bg-blue-700 text-white font-bold py-1.5 px-4"),i(D,"class",N="flex gap-x-2 mt-3 items-center justify-center "+(s[1]?"animate-pulse":"")),i(L,"class","no-hover:hidden mt-2 opacity-50"),i(B,"accept","image/*"),we(B,"display","none"),i(B,"type","file"),i(T,"class","with-hover:hidden border py-1 px-1.5 bg-slate-200 cursor-pointer"),i(R,"class","mt-2"),i(a,"class",V="flex flex-col items-center "+(s[1]?"pointer-events-none":"")),i(S,"class","flex flex-wrap gap-x-4 gap-y-2 justify-center my-8")},m(h,e){r(Z.head,P),r(Z.head,n),r(Z.head,v),r(Z.head,b),le(h,c,e),le(h,S,e),r(S,j),s[11](j),r(S,E),r(S,a),r(a,m),s[12](m),r(a,A),r(a,o),r(o,D),r(D,d),ce(d,s[0]),r(D,F),r(D,x),r(x,J),r(o,Y),r(o,L),r(L,G),r(o,U),r(o,R),r(R,T),r(T,B),s[14](B),r(T,Q),X||($=[W(pe,"drop",ve(be(s[8]))),W(pe,"paste",s[9]),W(d,"keydown",s[10]),W(d,"input",s[13]),W(x,"click",s[6]),W(B,"change",s[7])],X=!0)},p(h,e){e[0]&32&&M!==(M="border-[1.2px] desktop:mt-[34px] "+(h[5]?"":"hidden"))&&i(j,"class",M),e[0]&1&&d.value!==h[0]&&ce(d,h[0]),e[0]&2&&N!==(N="flex gap-x-2 mt-3 items-center justify-center "+(h[1]?"animate-pulse":""))&&i(D,"class",N),e[0]&2&&V!==(V="flex flex-col items-center "+(h[1]?"pointer-events-none":""))&&i(a,"class",V)},i:de,o:de,d(h){p(P),p(n),p(v),p(b),h&&p(c),h&&p(S),s[11](null),s[12](null),s[14](null),X=!1,_e($)}}}const ie=500,ue=3e3;function Ce(){window.createImageBitmap=async function(s){return new Promise((P,n)=>{const y=document.createElement("canvas"),v=y.getContext("2d");y.width=s.width,y.height=s.height,v.putImageData(s,0,0);const q=y.toDataURL(),b=document.createElement("img");b.addEventListener("load",()=>{P(b)}),b.src=q})}}function Se(s,P,n){let y="",v=!1,q=!1,b,I,c,S,j,M,E,a=400,m,A,o,D=!1,d=[];async function F(){if(!c)return;const e=c.createImageData(I.width,I.height),t=e.data;for(let u=0,k=t.length;u<k;u+=4)t[u]=40*Math.random()*7,t[u+1]=40*Math.random()*7,t[u+2]=40*Math.random()*7,t[u+3]=255;const l=await createImageBitmap(e),_=performance.now()-S;c.globalAlpha=Math.min(_,ue)/ue,c.drawImage(l,0,0,a,a),v&&window.requestAnimationFrame(F)}function x(e){if(!c)return;const t=performance.now()-j;c.globalAlpha=Math.min(t,ie)/ie,c.drawImage(e,0,0,a,a),t<ie&&window.requestAnimationFrame(()=>x(e))}async function J(e){const t=e.toDataURL("png"),_=await(await fetch(t)).blob(),u=new File([_],"canvas shot.png",{type:"image/png"}),k=e.getContext("2d").getImageData(0,0,a,a),f=await createImageBitmap(k);return{imgFile:u,imgBitmap:f}}async function N(){if(!y)return alert("Please add prompt");if(!I||!c)return;n(1,v=!0),n(5,D=!1),G(),S=performance.now(),F();const{imgFile:e,imgBitmap:t}=await J(I),l=new FormData;l.append("prompt",y),l.append("strength","0.85"),l.append("image",e);try{const _=await fetch("https://sdb.pcuenca.net/i2i",{method:"POST",body:l}),u=JSON.parse(await _.text()),{images:k}=u;if(!k.length)return alert("All the results were flagged. Please try again with diffeerent sketch + prompt");d=await Promise.all(k.map(async z=>{const O=new Image;return O.src=`data:image/png;base64, ${z}`,await new Promise((ee,te)=>{O.onload=()=>ee(O)}),O})),n(1,v=!1),E&&clearInterval(E),n(5,D=!0);let f=0;j=performance.now(),x(d[f%d.length]),M=()=>{E&&clearInterval(E),j=performance.now(),f=f+1,x(d[f%d.length])},E=setInterval(()=>{f=f+1,j=performance.now(),x(d[f%d.length])},2500),!q&&d.length>1&&Y()}catch(_){console.error(_),alert("Error happened, queue might be full. Please try again in a bit :)")}}function Y(){const e=document.createElement("div");e.className="drawing-board-control";const t=document.createElement("button");t.innerHTML="\u23EF",t.onclick=M,e.append(t);const l=document.querySelector(".drawing-board-controls");l&&(l.appendChild(e),q=!0,n(2,m.onclick=()=>{E&&clearInterval(E)},m))}function L(){const e=document.createElement("div");e.className="drawing-board-control";const t=document.createElement("button");t.innerHTML="\u{1F9F9}",t.onclick=()=>{c==null||c.clearRect(0,0,a,a)},e.append(t);const l=document.querySelector(".drawing-board-controls");l&&l.appendChild(e)}function G(){const e=o.getContext("2d");n(4,o.width=I.width,o),n(4,o.height=I.height,o),e.drawImage(I,0,0)}async function U(e){E&&clearInterval(E);const t=new Image;t.src=URL.createObjectURL(e),await new Promise((u,k)=>{t.onload=()=>u(t)});const{width:l,height:_}=t;c==null||c.drawImage(t,0,0,l,_,0,0,a,a)}function R(){var t;const e=(t=A.files)==null?void 0:t[0];e&&U(e)}function T(e){var _;if(!((_=e.dataTransfer)!=null&&_.files))return;e.preventDefault();const l=Array.from(e.dataTransfer.files)[0];U(l)}function B(e){if(!e.clipboardData)return;const t=Array.from(e.clipboardData.files);if(t.length===0)return;e.preventDefault();const l=t[0];U(l)}function Q(e){e.code==="Enter"&&(e.preventDefault(),N())}ye(async()=>{typeof createImageBitmap>"u"&&Ce();const{innerWidth:e}=window;a=Math.min(a,Math.floor(e*.75)),n(2,m.style.width=`${a}px`,m),n(2,m.style.height=`${a}px`,m),n(4,o.style.width=`${a}px`,o),n(4,o.style.height=`${a}px`,o),await Ie(),b=new window.DrawingBoard.Board("board-container",{size:10,controls:["Color",{Size:{type:"dropdown"}},{DrawingMode:{filler:!1}}],webStorage:!1,enlargeYourContainer:!0}),I=b.canvas,c=I.getContext("2d"),I.ondragover=function(t){return t.preventDefault(),!1},L()});function V(e){oe[e?"unshift":"push"](()=>{o=e,n(4,o)})}function X(e){oe[e?"unshift":"push"](()=>{m=e,n(2,m)})}function $(){y=this.value,n(0,y)}function h(e){oe[e?"unshift":"push"](()=>{A=e,n(3,A)})}return[y,v,m,A,o,D,N,R,T,B,Q,V,X,$,h]}class xe extends fe{constructor(P){super(),me(this,P,Se,De,he,{},null,[-1,-1])}}export{xe as default}; |
