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