mishig's picture
mishig HF staff
smaller margin
a10bbc6
raw
history blame
4.64 kB
import{S as Y,i as Z,s as ee,k as _,a as A,q as z,H as te,l as y,m as E,h as d,c as F,r as H,n as o,I as J,p as K,F as p,b as $,J as G,K as Q,A as W,L as ae,o as ne,M as se}from"../../chunks/index-3def1fb1.js";const{document:L}=se;function re(v){let w,h,b,i,j,u,n,l,g,q,s,m,x,I,P,B,r,t,f,D,c,C;return{c(){w=_("link"),h=_("script"),i=_("script"),u=A(),n=_("div"),l=_("div"),g=_("div"),q=A(),s=_("div"),m=_("input"),x=A(),I=_("button"),P=z("diffuse the f rest"),r=A(),t=_("p"),f=z("pro tip: upload img by dropping on the canvas"),this.h()},l(e){const a=te('[data-svelte="svelte-18yikln"]',L.head);w=y(a,"LINK",{href:!0,rel:!0}),h=y(a,"SCRIPT",{src:!0});var O=E(h);O.forEach(d),i=y(a,"SCRIPT",{src:!0});var M=E(i);M.forEach(d),a.forEach(d),u=F(e),n=y(e,"DIV",{class:!0});var T=E(n);l=y(T,"DIV",{class:!0});var S=E(l);g=y(S,"DIV",{id:!0,style:!0}),E(g).forEach(d),q=F(S),s=y(S,"DIV",{class:!0});var k=E(s);m=y(k,"INPUT",{type:!0,class:!0,placeholder:!0}),x=F(k),I=y(k,"BUTTON",{class:!0});var U=E(I);P=H(U,"diffuse the f rest"),U.forEach(d),k.forEach(d),r=F(S),t=y(S,"P",{class:!0});var V=E(t);f=H(V,"pro tip: upload img by dropping on the canvas"),V.forEach(d),S.forEach(d),T.forEach(d),this.h()},h(){o(w,"href","https://cdnjs.cloudflare.com/ajax/libs/drawingboard.js/0.4.2/drawingboard.css"),o(w,"rel","stylesheet"),J(h.src,b="https://code.jquery.com/jquery-1.12.4.min.js")||o(h,"src",b),J(i.src,j="https://cdnjs.cloudflare.com/ajax/libs/drawingboard.js/0.4.2/drawingboard.min.js")||o(i,"src",j),o(g,"id","board-container"),K(g,"width","512px"),K(g,"height","545px"),o(m,"type","text"),o(m,"class","border-2 "),o(m,"placeholder","Add prompt"),o(I,"class","bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4"),o(s,"class",B="flex gap-x-2 mt-4 items-center justify-center "+(v[1]?"animate-pulse":"")),o(t,"class","mt-2 opacity-50"),o(l,"class",D=v[1]?"pointer-events-none":""),o(n,"class","flex flex-wrap gap-x-8 justify-center mt-8")},m(e,a){p(L.head,w),p(L.head,h),p(L.head,i),$(e,u,a),$(e,n,a),p(n,l),p(l,g),p(l,q),p(l,s),p(s,m),G(m,v[0]),p(s,x),p(s,I),p(I,P),p(l,r),p(l,t),p(t,f),c||(C=[Q(m,"input",v[3]),Q(I,"click",v[2])],c=!0)},p(e,[a]){a&1&&m.value!==e[0]&&G(m,e[0]),a&2&&B!==(B="flex gap-x-2 mt-4 items-center justify-center "+(e[1]?"animate-pulse":""))&&o(s,"class",B),a&2&&D!==(D=e[1]?"pointer-events-none":"")&&o(l,"class",D)},i:W,o:W,d(e){d(w),d(h),d(i),e&&d(u),e&&d(n),c=!1,ae(C)}}}const R=500,X=3e3,N=512;async function oe(v){const w=v.toDataURL("png"),b=await(await fetch(w)).blob(),i=new File([b],"canvas shot.png",{type:"image/png"}),j=v.getContext("2d").getImageData(0,0,N,N),u=await createImageBitmap(j);return{imgFile:i,imgBitmap:u}}function ie(v,w,h){let b="",i=!1,j=!1,u,n,l,g,q,s;async function m(){if(!n)return;const r=n.createImageData(u.width,u.height),t=r.data;for(let c=0,C=t.length;c<C;c+=4)t[c]=40*Math.random()*7,t[c+1]=40*Math.random()*7,t[c+2]=40*Math.random()*7,t[c+3]=255;const f=await createImageBitmap(r),D=performance.now()-l;n.globalAlpha=Math.min(D,X)/X,n.drawImage(f,0,0,N,N),i&&window.requestAnimationFrame(m)}function x(r){if(!n)return;const t=performance.now()-g;n.globalAlpha=Math.min(t,R)/R,n.drawImage(r,0,0,N,N),t<R&&window.requestAnimationFrame(()=>x(r))}async function I(){if(!b)return alert("Please add prompt");if(!u||!n)return;h(1,i=!0),l=performance.now(),m();const{imgFile:r,imgBitmap:t}=await oe(u),f=new FormData;f.append("prompt",b),f.append("image",r);const D=await fetch("https://sdb.pcuenca.net/i2i",{method:"POST",body:f});try{const c=JSON.parse(await D.text()),{images:C}=c,e=await Promise.all(C.map(async O=>{const M=new Image;return M.src=`data:image/png;base64, ${O}`,await new Promise((T,S)=>{M.onload=()=>T(M)}),M}));e.push(t),h(1,i=!1),s&&clearInterval(s);let a=0;g=performance.now(),x(e[a%e.length]),q=()=>{s&&clearInterval(s),g=performance.now(),a=a+1,x(e[a%e.length])},s=setInterval(()=>{a=a+1,g=performance.now(),x(e[a%e.length])},2500),j||P()}catch(c){console.error(c),alert("Error happened: please see console")}}function P(){const r=document.createElement("div");r.className="drawing-board-control";const t=document.createElement("button");t.innerHTML="\u23EF",t.onclick=q,r.append(t);const f=document.querySelector(".drawing-board-controls");f&&(f.appendChild(r),j=!0,f.onclick=()=>{s&&clearInterval(s)})}ne(()=>{u=new window.DrawingBoard.Board("board-container",{size:10,controls:["Color",{Size:{type:"dropdown"}},{DrawingMode:{filler:!1}},"Navigation"],droppable:!0,webStorage:!1}).canvas,n=u.getContext("2d")});function B(){b=this.value,h(0,b)}return[b,i,I,B]}class ce extends Y{constructor(w){super(),Z(this,w,ie,re,ee,{})}}export{ce as default};