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