From 44e131f9ac30a9b684097c8c83df89f265730cfb Mon Sep 17 00:00:00 2001 From: blessedcoolant Date: Thu, 24 Mar 2022 05:07:33 +1300 Subject: [PATCH 1/2] Added desktop application mode Run lama-cleaner as a desktop application. --- README.md | 7 ++++++ lama_cleaner/app/build/asset-manifest.json | 8 +++--- lama_cleaner/app/build/index.html | 2 +- ...a0ea.chunk.css => main.0a04cd80.chunk.css} | 0 ...da4def.chunk.js => main.288df200.chunk.js} | 2 +- lama_cleaner/app/package.json | 4 ++- lama_cleaner/app/src/App.tsx | 21 ++++++++++++++++ main.py | 25 +++++++++++++++---- requirements.txt | 1 + 9 files changed, 58 insertions(+), 12 deletions(-) rename lama_cleaner/app/build/static/css/{main.1144a0ea.chunk.css => main.0a04cd80.chunk.css} (100%) rename lama_cleaner/app/build/static/js/{main.eeda4def.chunk.js => main.288df200.chunk.js} (70%) diff --git a/README.md b/README.md index 245ec53..e79ead0 100644 --- a/README.md +++ b/README.md @@ -35,6 +35,13 @@ python3 main.py --device=cuda --port=8080 --model=ldm --ldm-steps=50 Diffusion model is **MUCH MORE** slower than GANs(1080x720 image takes 8s on 3090), but it's possible to get better results than LaMa. +### GUI + +You can run lama-cleaner as a desktop application using the following command line arguments. + +`--gui`: Launch lama-cleaner as a desktop application +`--gui_size`: Set the window size for the application. Usage: --gui_size 1200 900 + |Original Image|LaMa|LDM| |--------------|------|----| |![photo-1583445095369-9c651e7e5d34](https://user-images.githubusercontent.com/3998421/156923525-d6afdec3-7b98-403f-ad20-88ebc6eb8d6d.jpg)|![photo-1583445095369-9c651e7e5d34_cleanup_lama](https://user-images.githubusercontent.com/3998421/156923620-a40cc066-fd4a-4d85-a29f-6458711d1247.png)|![photo-1583445095369-9c651e7e5d34_cleanup_ldm](https://user-images.githubusercontent.com/3998421/156923652-0d06c8c8-33ad-4a42-a717-9c99f3268933.png)| diff --git a/lama_cleaner/app/build/asset-manifest.json b/lama_cleaner/app/build/asset-manifest.json index 60f06ef..737a5b2 100644 --- a/lama_cleaner/app/build/asset-manifest.json +++ b/lama_cleaner/app/build/asset-manifest.json @@ -1,7 +1,7 @@ { "files": { - "main.css": "/static/css/main.1144a0ea.chunk.css", - "main.js": "/static/js/main.eeda4def.chunk.js", + "main.css": "/static/css/main.0a04cd80.chunk.css", + "main.js": "/static/js/main.288df200.chunk.js", "runtime-main.js": "/static/js/runtime-main.5e86ac81.js", "static/js/2.d3149f41.chunk.js": "/static/js/2.d3149f41.chunk.js", "index.html": "/index.html", @@ -10,7 +10,7 @@ "entrypoints": [ "static/js/runtime-main.5e86ac81.js", "static/js/2.d3149f41.chunk.js", - "static/css/main.1144a0ea.chunk.css", - "static/js/main.eeda4def.chunk.js" + "static/css/main.0a04cd80.chunk.css", + "static/js/main.288df200.chunk.js" ] } \ No newline at end of file diff --git a/lama_cleaner/app/build/index.html b/lama_cleaner/app/build/index.html index 6cf05fe..269ac89 100644 --- a/lama_cleaner/app/build/index.html +++ b/lama_cleaner/app/build/index.html @@ -1 +1 @@ -lama-cleaner - Image inpainting powered by LaMa
\ No newline at end of file +lama-cleaner - Image inpainting powered by LaMa
\ No newline at end of file diff --git a/lama_cleaner/app/build/static/css/main.1144a0ea.chunk.css b/lama_cleaner/app/build/static/css/main.0a04cd80.chunk.css similarity index 100% rename from lama_cleaner/app/build/static/css/main.1144a0ea.chunk.css rename to lama_cleaner/app/build/static/css/main.0a04cd80.chunk.css diff --git a/lama_cleaner/app/build/static/js/main.eeda4def.chunk.js b/lama_cleaner/app/build/static/js/main.288df200.chunk.js similarity index 70% rename from lama_cleaner/app/build/static/js/main.eeda4def.chunk.js rename to lama_cleaner/app/build/static/js/main.288df200.chunk.js index d1276a8..a26d294 100644 --- a/lama_cleaner/app/build/static/js/main.eeda4def.chunk.js +++ b/lama_cleaner/app/build/static/js/main.288df200.chunk.js @@ -1 +1 @@ -(this["webpackJsonplama-cleaner"]=this["webpackJsonplama-cleaner"]||[]).push([[0],{20:function(e,t,n){},23:function(e,t,n){"use strict";n.r(t);var a=n(0),c=n(14),r=n.n(c),i=(n(20),n(3)),s=n.n(i),o=n(5),l=n(2),u=n(7),h=n(27),d=n(29),b=n(1);function p(e){var t=e.children,n=e.className,c=e.disabled,r=e.icon,i=e.primary,s=e.onKeyDown,o=e.onClick,u=e.onDown,h=e.onUp,d=Object(a.useState)(!1),p=Object(l.a)(d,2),j=p[0],f=p[1],v="";i&&!c&&(v="bg-primary hover:bg-black hover:text-white"),j&&(v="bg-black text-white"),i||j||(v="hover:bg-primary");return Object(b.jsxs)("div",{role:"button",onKeyDown:s,onClick:function(e){e.currentTarget.blur(),null===o||void 0===o||o()},onPointerDown:function(e){f(!0),null===u||void 0===u||u(e.nativeEvent)},onPointerUp:function(e){f(!1),null===h||void 0===h||h(e.nativeEvent)},tabIndex:-1,className:["inline-flex py-3 px-3 rounded-md cursor-pointer",t?"space-x-3":"",v,c?"pointer-events-none opacity-50":"",n].join(" "),children:[r,Object(b.jsx)("span",{className:"whitespace-nowrap select-none",children:t})]})}var j=n(6);function f(e){var t=e.onSelection,n=Object(a.useState)(!1),c=Object(l.a)(n,2),r=c[0],i=c[1],u=Object(a.useState)("file-upload-".concat(Math.random().toString())),h=Object(l.a)(u,1)[0];function d(e){if(e&&e.type.match("image.*"))try{if(e.size>20971520)throw new Error("file too large");t(e)}catch(n){alert("error: ".concat(n.message))}}function p(e){return f.apply(this,arguments)}function f(){return(f=Object(o.a)(s.a.mark((function e(t){return s.a.wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return e.abrupt("return",new Promise((function(e){t.file((function(t){return e(t)}))})));case 1:case"end":return e.stop()}}),e)})))).apply(this,arguments)}function v(e){return m.apply(this,arguments)}function m(){return(m=Object(o.a)(s.a.mark((function e(t){var n,a,c,r,i;return s.a.wrap((function(e){for(;;)switch(e.prev=e.next){case 0:for(n=[],a=[],c=0;c0)){e.next=23;break}if(!(null===(r=a.shift())||void 0===r?void 0:r.isFile)){e.next=12;break}return e.next=8,p(r);case 8:i=e.sent,n.push(i),e.next=21;break;case 12:if(!(null===r||void 0===r?void 0:r.isDirectory)){e.next=21;break}return e.t0=a.push,e.t1=a,e.t2=j.a,e.next=18,x(r.createReader());case 18:e.t3=e.sent,e.t4=(0,e.t2)(e.t3),e.t0.apply.call(e.t0,e.t1,e.t4);case 21:e.next=3;break;case 23:return e.abrupt("return",n);case 24:case"end":return e.stop()}}),e)})))).apply(this,arguments)}function x(e){return O.apply(this,arguments)}function O(){return(O=Object(o.a)(s.a.mark((function e(t){var n,a;return s.a.wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return n=[],e.next=3,g(t);case 3:a=e.sent;case 4:if(!(a.length>0)){e.next=11;break}return n.push.apply(n,Object(j.a)(a)),e.next=8,g(t);case 8:a=e.sent,e.next=4;break;case 11:return e.abrupt("return",n);case 12:case"end":return e.stop()}}),e)})))).apply(this,arguments)}function g(e){return w.apply(this,arguments)}function w(){return(w=Object(o.a)(s.a.mark((function e(t){return s.a.wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return e.abrupt("return",new Promise((function(e,n){t.readEntries(e,n)})));case 1:case"end":return e.stop()}}),e)})))).apply(this,arguments)}function y(){return(y=Object(o.a)(s.a.mark((function e(t){var n;return s.a.wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return t.preventDefault(),e.next=3,v(t.dataTransfer.items);case 3:n=e.sent,i(!1),d(n[0]);case 6:case"end":return e.stop()}}),e)})))).apply(this,arguments)}return Object(b.jsx)("label",{htmlFor:h,className:"block w-full h-full group relative cursor-pointer rounded-md font-medium focus-within:outline-none",children:Object(b.jsxs)("div",{className:["w-full h-full flex items-center justify-center px-6 pt-5 pb-6 text-md","border-2 border-dashed rounded-md","hover:border-black hover:bg-primary","text-center",r?"border-black bg-primary":"bg-gray-100 border-gray-300"].join(" "),onDrop:function(e){return y.apply(this,arguments)},onDragOver:function(e){e.stopPropagation(),e.preventDefault(),i(!0)},onDragLeave:function(){return i(!1)},children:[Object(b.jsx)("input",{id:h,name:h,type:"file",className:"sr-only",onChange:function(e){var t,n=null===(t=e.currentTarget.files)||void 0===t?void 0:t[0];n&&d(n)},accept:"image/png, image/jpeg"}),Object(b.jsx)("p",{className:"hidden sm:block",children:"Click here or drag an image file"}),Object(b.jsx)("p",{className:"sm:hidden",children:"Tap here to load your picture"})]})})}var v=n(25),m=n(12);function x(e){var t=e.children,n=e.onClose,c=e.className,r=Object(a.useRef)(null);return Object(v.a)(r,(function(){null===n||void 0===n||n()})),Object(m.a)("Escape",n,{event:"keydown"}),Object(b.jsx)("div",{className:["absolute w-full h-full flex justify-center items-center","z-20","bg-gray-300 bg-opacity-40 backdrop-filter backdrop-blur-md"].join(" "),children:Object(b.jsxs)("div",{ref:r,className:"bg-white max-w-4xl relative rounded-md shadow-md ".concat(c||"p-8 sm:p-12"),children:[Object(b.jsx)(p,{icon:Object(b.jsx)(u.e,{className:"w-6 h-6"}),className:["absolute right-4 top-4 rounded-full bg-gray-100 w-10 h-10","flex justify-center items-center py-0 px-0 sm:px-0"].join(" "),onClick:n}),t]})})}function O(e){var t=e.children,n=e.content;return Object(b.jsxs)("div",{className:"h-full flex flex-row space-x-6 justify-between",children:[Object(b.jsx)("div",{className:"mr-12 border-2 rounded-xl px-2 py-1",children:t}),Object(b.jsx)("div",{className:"flex flex-col justify-center",children:n})]})}function g(e){var t=e.onClose;return Object(b.jsx)(x,{onClose:t,className:"h-full sm:h-auto p-0 sm:p-0",children:Object(b.jsx)("div",{className:"h-full sm:h-auto flex flex-col sm:flex-row",children:Object(b.jsxs)("div",{className:"flex sm:p-14 flex flex-col justify-center space-y-6",children:[Object(b.jsx)(O,{content:"Enable multi-stroke mask drawing",children:Object(b.jsx)("p",{children:"Hold Cmd/Ctrl"})}),Object(b.jsx)(O,{content:"Undo inpainting",children:Object(b.jsx)("p",{children:"Cmd/Ctrl + z"})}),Object(b.jsx)(O,{content:"Pan",children:Object(b.jsx)("p",{children:"Space & Drag"})}),Object(b.jsx)(O,{content:"View original image",children:Object(b.jsx)("p",{children:"Hold Tab"})}),Object(b.jsx)(O,{content:"Reset zoom/pan & Cancel mask drawing",children:Object(b.jsx)("p",{children:"Esc"})}),Object(b.jsx)(O,{content:"Decrease Brush Size",children:Object(b.jsx)("p",{children:"["})}),Object(b.jsx)(O,{content:"Increase Brush Size",children:Object(b.jsx)("p",{children:"]"})})]})})})}var w=n(11),y=n(26),k=n(30);function N(e){for(var t=e.split(",")[0].split(":")[1].split(";")[0],n=atob(e.split(",")[1]),a=[],c=0;cn?c:n);if(c>n){var a=Math.ceil(t*n);return"".concat(e,"x").concat(a)}var r=Math.ceil(t*c);return"".concat(r,"x").concat(e)},s=Object(a.useCallback)((function(){for(var e=c>n?c:n,t=[],a=0;a2&&void 0!==arguments[2]?arguments[2]:T;e.strokeStyle=n,e.lineCap="round",e.lineJoin="round",t.forEach((function(t){(null===t||void 0===t?void 0:t.pts.length)&&t.size&&(e.lineWidth=t.size,e.beginPath(),e.moveTo(t.pts[0].x,t.pts[0].y),t.pts.forEach((function(t){return e.lineTo(t.x,t.y)})),e.stroke())}))}function I(e){var t=e.file,n=Object(a.useState)(40),c=Object(l.a)(n,2),r=c[0],i=c[1],h=function(e){var t=Object(a.useState)(new Image),n=Object(l.a)(t,1)[0],c=Object(a.useState)(!1),r=Object(l.a)(c,2),i=r[0],s=r[1];return Object(a.useEffect)((function(){return n.onload=function(){s(!0)},s(!1),n.src=URL.createObjectURL(e),function(){n.onload=null}}),[e,n]),[n,i]}(t),f=Object(l.a)(h,2),v=f[0],x=f[1],O=Object(a.useState)([]),g=Object(l.a)(O,2),N=g[0],S=g[1],M=Object(a.useState)(),E=Object(l.a)(M,2),L=E[0],A=E[1],T=Object(a.useState)((function(){return document.createElement("canvas")})),I=Object(l.a)(T,1)[0],F=Object(a.useState)([{pts:[]}]),W=Object(l.a)(F,2),Z=W[0],R=W[1],U=Object(a.useState)([{pts:[]}]),V=Object(l.a)(U,2),B=V[0],K=V[1],Y=Object(a.useState)([]),J=Object(l.a)(Y,2),X=J[0],$=J[1],_=Object(a.useState)({x:-1,y:-1}),G=Object(l.a)(_,2),Q=G[0],q=Q.x,ee=Q.y,te=G[1],ne=Object(a.useState)(!1),ae=Object(l.a)(ne,2),ce=ae[0],re=ae[1],ie=Object(a.useState)(!1),se=Object(l.a)(ie,2),oe=se[0],le=se[1],ue=Object(a.useState)(!1),he=Object(l.a)(ue,2),de=he[0],be=he[1],pe=Object(a.useState)(!1),je=Object(l.a)(pe,2),fe=je[0],ve=je[1],me=Object(a.useState)(!1),xe=Object(l.a)(me,2),Oe=xe[0],ge=xe[1],we=Object(a.useState)(1),ye=Object(l.a)(we,2),ke=ye[0],Ne=ye[1],Ce=Object(a.useState)(),Se=Object(l.a)(Ce,2),ze=Se[0],Me=Se[1],De=Object(y.a)("sizeLimit","1080"),Ee=Object(l.a)(De,2),Le=Ee[0],Ae=Ee[1],He=Object(d.a)(),Te=Object(a.useRef)(),Pe=Object(a.useState)(!1),Ie=Object(l.a)(Pe,2),Fe=Ie[0],We=Ie[1],Ze=Object(a.useState)(!1),Re=Object(l.a)(Ze,2),Ue=Re[0],Ve=Re[1],Be=Object(a.useCallback)((function(){if(L){L.clearRect(0,0,L.canvas.width,L.canvas.height);var e=N[N.length-1];(null===e||void 0===e?void 0:e.src)?L.drawImage(e,0,0,v.naturalWidth,v.naturalHeight):L.drawImage(v,0,0),P(L,B)}}),[L,B,v,N]),Ke=Object(a.useCallback)((function(){if(!(null===L||void 0===L?void 0:L.canvas.width)||!(null===L||void 0===L?void 0:L.canvas.height))throw new Error("canvas has invalid size");I.width=null===L||void 0===L?void 0:L.canvas.width,I.height=null===L||void 0===L?void 0:L.canvas.height;var e=I.getContext("2d");if(!e)throw new Error("could not retrieve mask canvas");P(e,Z,"white")}),[null===L||void 0===L?void 0:L.canvas.height,null===L||void 0===L?void 0:L.canvas.width,Z,I]),Ye=Object(a.useCallback)(Object(o.a)(s.a.mark((function e(){var n,a;return s.a.wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return ve(!0),Ke(),e.prev=2,e.next=5,z(t,I.toDataURL(),Le);case 5:if(n=e.sent){e.next=8;break}throw new Error("empty response");case 8:return a=new Image,e.next=11,C(a,n);case 11:N.push(a),Z.push({pts:[]}),S(Object(j.a)(N)),R(Object(j.a)(Z)),X.push(B.length),$(X),B.length=0,K([{pts:[]}]),e.next=24;break;case 21:e.prev=21,e.t0=e.catch(2),alert(e.t0.message?e.t0.message:e.t0.toString());case 24:ve(!1),Be();case 26:case"end":return e.stop()}}),e,null,[[2,21]])}))),[Be,t,Z,B,I,Ke,N,Le,X]),Je=function(){return 0!==B.length&&0!==B[0].pts.length},Xe=function(){return 0!==N.length},$e=function(){We(!1),B.length=0,K([{pts:[]}])},_e=function(e){return"Control"===e.key||"Meta"===e.key};Object(m.a)(_e,(function(){Ue&&(fe||(Ve(!1),Je()&&Ye()))}),{event:"keyup"},[fe,Ue,Je]),Object(m.a)(_e,(function(){fe||Ve(!0)}),{event:"keydown"},[fe]),Object(a.useEffect)((function(){if(v&&x){var e=He.width/v.naturalWidth,t=(He.height-200)/v.naturalHeight;if(e<1||t<1){var n=Math.min(e,t);Me(n),Ne(n)}else Me(1);(null===L||void 0===L?void 0:L.canvas)&&(L.canvas.width=v.naturalWidth,L.canvas.height=v.naturalHeight),Be()}}),[null===L||void 0===L?void 0:L.canvas,Be,v,x,He]);var Ge=Object(a.useCallback)((function(){if(ze&&v&&He){var e=Te.current;if(!e)throw new Error("no viewport");var t=(He.width-v.width*ze)/2,n=(He.height-v.height*ze)/2;e.setTransform(t,n,ze,200,"easeOutQuad"),e.state.scale=ze,Ne(ze)}}),[Te,ze,v,He]);Object(m.a)("Escape",(function(){fe||(Fe||Ue?$e():Ge())}),{event:"keydown"},[Fe,fe,Ue,Ge,$e]);var Qe=function(e,t){B[B.length-1].pts.push({x:e,y:t}),Z[Z.length-1].pts.push({x:e,y:t}),Be()},qe=function(){if(N.length&&X.length){for(var e=Z,t=X[X.length-1],n=0;n<=t;n+=1)e.pop();R([].concat(Object(j.a)(e),[{pts:[]}])),X.pop(),$(X);var a=N;a.pop(),S(Object(j.a)(a))}};Object(m.a)((function(e){var t=(e.metaKey||e.ctrlKey)&&"z"===e.key;return"Tab"===e.key&&e.preventDefault(),!!t&&(e.preventDefault(),!0)}),qe),Object(k.a)("Tab",(function(e){null===e||void 0===e||e.preventDefault(),null===e||void 0===e||e.stopPropagation(),Xe()&&(ge(!0),be(!0))}),(function(e){null===e||void 0===e||e.preventDefault(),null===e||void 0===e||e.stopPropagation(),Xe()&&(be(!1),setTimeout((function(){return ge(!1)}),300))}));var et=function(e){e===ce||oe||re(e)},tt=Object(a.useCallback)((function(){return oe?"grab":ce?"none":void 0}),[ce,oe]);Object(k.a)("[",(function(){i((function(e){return e>10?e-10:e<=10&&e>0?e-5:e}))})),Object(k.a)("]",(function(){i((function(e){return e+10}))})),Object(k.a)(" ",(function(e){null===e||void 0===e||e.preventDefault(),null===e||void 0===e||e.stopPropagation(),re(!1),le(!0)}),(function(e){null===e||void 0===e||e.preventDefault(),null===e||void 0===e||e.stopPropagation(),re(!0),le(!1)}));return v&&ke&&ze?Object(b.jsxs)("div",{className:"flex flex-col items-center",style:{height:"100%",width:"100%"},"aria-hidden":"true",onMouseMove:function(e){var t=e.nativeEvent;te({x:t.pageX,y:t.pageY})},onMouseUp:function(){if(!oe&&(v.src&&(null===L||void 0===L?void 0:L.canvas)&&!fe&&Fe)){if(We(!1),Ue)return Z.push({pts:[]}),R(Object(j.a)(Z)),B.push({pts:[]}),void K(Object(j.a)(B));0!==B.length&&0!==B[0].pts.length&&Ye()}},children:[Object(b.jsx)(w.b,{ref:function(e){e&&(Te.current=e)},panning:{disabled:!oe,velocityDisabled:!0},wheel:{step:.05},centerZoomedOut:!0,alignmentAnimation:{disabled:!0},centerOnInit:!0,limitToBounds:!1,doubleClick:{disabled:!0},initialScale:ze,minScale:ze,onZoom:function(e){Ne(e.state.scale)},children:Object(b.jsx)(w.a,{wrapperStyle:{width:"100%",height:"100%"},contentClass:fe?"animate-pulse-fast pointer-events-none transition-opacity":"",children:Object(b.jsxs)(b.Fragment,{children:[Object(b.jsx)("canvas",{className:"rounded-sm",style:{cursor:tt()},onContextMenu:function(e){e.preventDefault()},onMouseOver:function(){return et(!0)},onFocus:function(){return et(!0)},onMouseLeave:function(){return et(!1)},onMouseDown:function(e){if(!oe&&(v.src&&(null===L||void 0===L?void 0:L.canvas)&&!fe)){We(!0),B[B.length-1].size=r,Z[Z.length-1].size=r;var t=e.nativeEvent;Qe(t.offsetX,t.offsetY)}},onMouseMove:function(e){if(!oe&&Fe){var t=e.nativeEvent,n=t.offsetX,a=t.offsetY;Qe(n,a)}},ref:function(e){if(e&&!L){var t=e.getContext("2d");t&&A(t)}}}),Object(b.jsx)("div",{className:["absolute top-0 right-0 pointer-events-none","overflow-hidden","border-primary",Oe?"border-l-4":""].join(" "),style:{width:de?"".concat(Math.round(v.naturalWidth),"px"):"0px",height:v.naturalHeight,transitionProperty:"width, height",transitionTimingFunction:"cubic-bezier(0.4, 0, 0.2, 1)",transitionDuration:"300ms"},children:Object(b.jsx)("img",{className:"absolute right-0",src:v.src,alt:"original",width:"".concat(v.naturalWidth,"px"),height:"".concat(v.naturalHeight,"px"),style:{width:"".concat(v.naturalWidth,"px"),height:"".concat(v.naturalHeight,"px"),maxWidth:"none"}})})]})})}),ce&&!fe&&!oe&&Object(b.jsx)("div",{className:"hidden sm:block absolute rounded-full border border-primary bg-primary bg-opacity-80 pointer-events-none",style:function(){var e=function(){var e,t,n=ze;return void 0!==(null===(e=Te.current)||void 0===e?void 0:e.state.scale)&&(n=null===(t=Te.current)||void 0===t?void 0:t.state.scale),n}();return{width:"".concat(r*e,"px"),height:"".concat(r*e,"px"),left:"".concat(q,"px"),top:"".concat(ee,"px"),transform:"translate(-50%, -50%)"}}()}),Object(b.jsx)("div",{className:"fixed w-full bottom-0 flex items-center justify-center",style:{height:"90px"},children:Object(b.jsxs)("div",{className:["flex items-center justify-center space-x-6",""].join(" "),children:[Object(b.jsx)(H,{value:Le||"1080",onChange:function(e){Ae(e)},originalWidth:v.naturalWidth,originalHeight:v.naturalHeight}),Object(b.jsx)(D,{label:Object(b.jsx)("span",{children:Object(b.jsx)("span",{className:"hidden md:inline",children:"Brush"})}),min:10,max:150,value:r,onChange:i}),Object(b.jsxs)("div",{children:[Object(b.jsx)(p,{className:"mr-2",icon:Object(b.jsx)(u.b,{className:"w-6 h-6"}),disabled:ke===ze,onClick:Ge}),Object(b.jsx)(p,{className:"mr-2",icon:Object(b.jsx)("svg",{width:"19",height:"9",viewBox:"0 0 19 9",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:"w-6 h-6",children:Object(b.jsx)("path",{d:"M2 1C2 0.447715 1.55228 0 1 0C0.447715 0 0 0.447715 0 1H2ZM1 8H0V9H1V8ZM8 9C8.55228 9 9 8.55229 9 8C9 7.44771 8.55228 7 8 7V9ZM16.5963 7.42809C16.8327 7.92721 17.429 8.14016 17.9281 7.90374C18.4272 7.66731 18.6402 7.07103 18.4037 6.57191L16.5963 7.42809ZM16.9468 5.83205L17.8505 5.40396L16.9468 5.83205ZM0 1V8H2V1H0ZM1 9H8V7H1V9ZM1.66896 8.74329L6.66896 4.24329L5.33104 2.75671L0.331035 7.25671L1.66896 8.74329ZM16.043 6.26014L16.5963 7.42809L18.4037 6.57191L17.8505 5.40396L16.043 6.26014ZM6.65079 4.25926C9.67554 1.66661 14.3376 2.65979 16.043 6.26014L17.8505 5.40396C15.5805 0.61182 9.37523 -0.710131 5.34921 2.74074L6.65079 4.25926Z",fill:"currentColor"})}),onClick:qe,disabled:0===N.length}),Object(b.jsx)(p,{className:"mr-2",icon:Object(b.jsx)(u.d,{className:"w-6 h-6"}),onDown:function(e){e.preventDefault(),ge(!0),be(!0)},onUp:function(){be(!1),setTimeout((function(){return ge(!1)}),300)},disabled:0===N.length,children:void 0}),Object(b.jsx)(p,{icon:Object(b.jsx)(u.c,{className:"w-6 h-6"}),disabled:!N.length,onClick:function(){var e=t.name.replace(/(\.[\w\d_-]+)$/i,"_cleanup$1");!function(e,t){var n=document.createElement("a");n.href=e,n.download=t,n.dispatchEvent(new MouseEvent("click",{bubbles:!0,cancelable:!0,view:window})),setTimeout((function(){n.remove()}),100)}(N[N.length-1].currentSrc,e)},children:void 0})]}),Object(b.jsx)("div",{className:"absolute bg-black backdrop-blur backdrop-filter bg-opacity-10 rounded-xl",style:{height:"58px",width:"600px",zIndex:-1,marginLeft:"-1px"},children:void 0})]})})]}):Object(b.jsx)(b.Fragment,{})}var F=function(){var e=Object(a.useState)(),t=Object(l.a)(e,2),n=t[0],c=t[1],r=Object(h.a)(!1),i=Object(l.a)(r,2),j=i[0],v=i[1],m=Object(d.a)();return Object(b.jsxs)("div",{className:"h-full full-visible-h-safari flex flex-col",children:[Object(b.jsxs)("header",{className:"absolute z-10 flex w-full p-1 justify-center sm:justify-between items-center sm:items-start bg-white backdrop-blur backdrop-filter bg-opacity-30",children:[n?Object(b.jsx)(p,{icon:Object(b.jsx)(u.a,{className:"w-6 h-6"}),onClick:function(){c(void 0)},children:m.width>640?"Start new":void 0}):Object(b.jsx)(b.Fragment,{}),n?Object(b.jsx)(p,{onClick:v,icon:Object(b.jsxs)("svg",{xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",role:"img",width:"28",height:"28",preserveAspectRatio:"xMidYMid meet",viewBox:"0 0 16 16",children:[Object(b.jsx)("rect",{x:"0",y:"0",width:"16",height:"16",fill:"none",stroke:"none"}),Object(b.jsxs)("g",{fill:"currentColor",children:[Object(b.jsx)("path",{d:"M14 5a1 1 0 0 1 1 1v5a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V6a1 1 0 0 1 1-1h12zM2 4a2 2 0 0 0-2 2v5a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2H2z"}),Object(b.jsx)("path",{d:"M13 10.25a.25.25 0 0 1 .25-.25h.5a.25.25 0 0 1 .25.25v.5a.25.25 0 0 1-.25.25h-.5a.25.25 0 0 1-.25-.25v-.5zm0-2a.25.25 0 0 1 .25-.25h.5a.25.25 0 0 1 .25.25v.5a.25.25 0 0 1-.25.25h-.5a.25.25 0 0 1-.25-.25v-.5zm-5 0A.25.25 0 0 1 8.25 8h.5a.25.25 0 0 1 .25.25v.5a.25.25 0 0 1-.25.25h-.5A.25.25 0 0 1 8 8.75v-.5zm2 0a.25.25 0 0 1 .25-.25h1.5a.25.25 0 0 1 .25.25v.5a.25.25 0 0 1-.25.25h-1.5a.25.25 0 0 1-.25-.25v-.5zm1 2a.25.25 0 0 1 .25-.25h.5a.25.25 0 0 1 .25.25v.5a.25.25 0 0 1-.25.25h-.5a.25.25 0 0 1-.25-.25v-.5zm-5-2A.25.25 0 0 1 6.25 8h.5a.25.25 0 0 1 .25.25v.5a.25.25 0 0 1-.25.25h-.5A.25.25 0 0 1 6 8.75v-.5zm-2 0A.25.25 0 0 1 4.25 8h.5a.25.25 0 0 1 .25.25v.5a.25.25 0 0 1-.25.25h-.5A.25.25 0 0 1 4 8.75v-.5zm-2 0A.25.25 0 0 1 2.25 8h.5a.25.25 0 0 1 .25.25v.5a.25.25 0 0 1-.25.25h-.5A.25.25 0 0 1 2 8.75v-.5zm11-2a.25.25 0 0 1 .25-.25h.5a.25.25 0 0 1 .25.25v.5a.25.25 0 0 1-.25.25h-.5a.25.25 0 0 1-.25-.25v-.5zm-2 0a.25.25 0 0 1 .25-.25h.5a.25.25 0 0 1 .25.25v.5a.25.25 0 0 1-.25.25h-.5a.25.25 0 0 1-.25-.25v-.5zm-2 0A.25.25 0 0 1 9.25 6h.5a.25.25 0 0 1 .25.25v.5a.25.25 0 0 1-.25.25h-.5A.25.25 0 0 1 9 6.75v-.5zm-2 0A.25.25 0 0 1 7.25 6h.5a.25.25 0 0 1 .25.25v.5a.25.25 0 0 1-.25.25h-.5A.25.25 0 0 1 7 6.75v-.5zm-2 0A.25.25 0 0 1 5.25 6h.5a.25.25 0 0 1 .25.25v.5a.25.25 0 0 1-.25.25h-.5A.25.25 0 0 1 5 6.75v-.5zm-3 0A.25.25 0 0 1 2.25 6h1.5a.25.25 0 0 1 .25.25v.5a.25.25 0 0 1-.25.25h-1.5A.25.25 0 0 1 2 6.75v-.5zm0 4a.25.25 0 0 1 .25-.25h.5a.25.25 0 0 1 .25.25v.5a.25.25 0 0 1-.25.25h-.5a.25.25 0 0 1-.25-.25v-.5zm2 0a.25.25 0 0 1 .25-.25h5.5a.25.25 0 0 1 .25.25v.5a.25.25 0 0 1-.25.25h-5.5a.25.25 0 0 1-.25-.25v-.5z"})]})]})}):Object(b.jsx)(b.Fragment,{})]}),j&&Object(b.jsx)(g,{onClose:v}),Object(b.jsx)("main",{className:["h-full flex flex-1 flex-col sm:items-center sm:justify-center overflow-hidden","items-center justify-center"].join(" "),children:n?Object(b.jsx)(I,{file:n}):Object(b.jsxs)(b.Fragment,{children:[Object(b.jsx)("div",{className:["flex flex-col sm:flex-row items-center","space-y-5 sm:space-y-0 sm:space-x-6 p-5 pt-0 pb-10"].join(" "),children:Object(b.jsx)("div",{className:"max-w-xl flex flex-col items-center sm:items-start p-0 m-0 space-y-5",children:Object(b.jsxs)("h1",{className:"text-center sm:text-left text-xl sm:text-3xl",children:["Image inpainting powered by \ud83e\udd99",Object(b.jsx)("u",{children:Object(b.jsx)("a",{href:"https://github.com/saic-mdal/lama",children:"LaMa"})})]})})}),Object(b.jsx)("div",{className:"h-20 sm:h-52 px-4 w-full",style:{maxWidth:"800px"},children:Object(b.jsx)(f,{onSelection:function(){var e=Object(o.a)(s.a.mark((function e(t){return s.a.wrap((function(e){for(;;)switch(e.prev=e.next){case 0:c(t);case 1:case"end":return e.stop()}}),e)})));return function(t){return e.apply(this,arguments)}}()})})]})})]})};r.a.render(Object(b.jsx)(F,{}),document.getElementById("root"))}},[[23,1,2]]]); \ No newline at end of file +(this["webpackJsonplama-cleaner"]=this["webpackJsonplama-cleaner"]||[]).push([[0],{20:function(e,t,n){},23:function(e,t,n){"use strict";n.r(t);var a=n(0),c=n(14),r=n.n(c),i=(n(20),n(3)),s=n.n(i),o=n(2),l=n(5),u=n(7),h=n(27),d=n(29),b=n(1);function p(e){var t=e.children,n=e.className,c=e.disabled,r=e.icon,i=e.primary,s=e.onKeyDown,l=e.onClick,u=e.onDown,h=e.onUp,d=Object(a.useState)(!1),p=Object(o.a)(d,2),j=p[0],f=p[1],v="";i&&!c&&(v="bg-primary hover:bg-black hover:text-white"),j&&(v="bg-black text-white"),i||j||(v="hover:bg-primary");return Object(b.jsxs)("div",{role:"button",onKeyDown:s,onClick:function(e){e.currentTarget.blur(),null===l||void 0===l||l()},onPointerDown:function(e){f(!0),null===u||void 0===u||u(e.nativeEvent)},onPointerUp:function(e){f(!1),null===h||void 0===h||h(e.nativeEvent)},tabIndex:-1,className:["inline-flex py-3 px-3 rounded-md cursor-pointer",t?"space-x-3":"",v,c?"pointer-events-none opacity-50":"",n].join(" "),children:[r,Object(b.jsx)("span",{className:"whitespace-nowrap select-none",children:t})]})}var j=n(6);function f(e){var t=e.onSelection,n=Object(a.useState)(!1),c=Object(o.a)(n,2),r=c[0],i=c[1],u=Object(a.useState)("file-upload-".concat(Math.random().toString())),h=Object(o.a)(u,1)[0];function d(e){if(e&&e.type.match("image.*"))try{if(e.size>20971520)throw new Error("file too large");t(e)}catch(n){alert("error: ".concat(n.message))}}function p(e){return f.apply(this,arguments)}function f(){return(f=Object(l.a)(s.a.mark((function e(t){return s.a.wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return e.abrupt("return",new Promise((function(e){t.file((function(t){return e(t)}))})));case 1:case"end":return e.stop()}}),e)})))).apply(this,arguments)}function v(e){return m.apply(this,arguments)}function m(){return(m=Object(l.a)(s.a.mark((function e(t){var n,a,c,r,i;return s.a.wrap((function(e){for(;;)switch(e.prev=e.next){case 0:for(n=[],a=[],c=0;c0)){e.next=23;break}if(!(null===(r=a.shift())||void 0===r?void 0:r.isFile)){e.next=12;break}return e.next=8,p(r);case 8:i=e.sent,n.push(i),e.next=21;break;case 12:if(!(null===r||void 0===r?void 0:r.isDirectory)){e.next=21;break}return e.t0=a.push,e.t1=a,e.t2=j.a,e.next=18,x(r.createReader());case 18:e.t3=e.sent,e.t4=(0,e.t2)(e.t3),e.t0.apply.call(e.t0,e.t1,e.t4);case 21:e.next=3;break;case 23:return e.abrupt("return",n);case 24:case"end":return e.stop()}}),e)})))).apply(this,arguments)}function x(e){return O.apply(this,arguments)}function O(){return(O=Object(l.a)(s.a.mark((function e(t){var n,a;return s.a.wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return n=[],e.next=3,g(t);case 3:a=e.sent;case 4:if(!(a.length>0)){e.next=11;break}return n.push.apply(n,Object(j.a)(a)),e.next=8,g(t);case 8:a=e.sent,e.next=4;break;case 11:return e.abrupt("return",n);case 12:case"end":return e.stop()}}),e)})))).apply(this,arguments)}function g(e){return w.apply(this,arguments)}function w(){return(w=Object(l.a)(s.a.mark((function e(t){return s.a.wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return e.abrupt("return",new Promise((function(e,n){t.readEntries(e,n)})));case 1:case"end":return e.stop()}}),e)})))).apply(this,arguments)}function y(){return(y=Object(l.a)(s.a.mark((function e(t){var n;return s.a.wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return t.preventDefault(),e.next=3,v(t.dataTransfer.items);case 3:n=e.sent,i(!1),d(n[0]);case 6:case"end":return e.stop()}}),e)})))).apply(this,arguments)}return Object(b.jsx)("label",{htmlFor:h,className:"block w-full h-full group relative cursor-pointer rounded-md font-medium focus-within:outline-none",children:Object(b.jsxs)("div",{className:["w-full h-full flex items-center justify-center px-6 pt-5 pb-6 text-md","border-2 border-dashed rounded-md","hover:border-black hover:bg-primary","text-center",r?"border-black bg-primary":"bg-gray-100 border-gray-300"].join(" "),onDrop:function(e){return y.apply(this,arguments)},onDragOver:function(e){e.stopPropagation(),e.preventDefault(),i(!0)},onDragLeave:function(){return i(!1)},children:[Object(b.jsx)("input",{id:h,name:h,type:"file",className:"sr-only",onChange:function(e){var t,n=null===(t=e.currentTarget.files)||void 0===t?void 0:t[0];n&&d(n)},accept:"image/png, image/jpeg"}),Object(b.jsx)("p",{className:"hidden sm:block",children:"Click here or drag an image file"}),Object(b.jsx)("p",{className:"sm:hidden",children:"Tap here to load your picture"})]})})}var v=n(25),m=n(12);function x(e){var t=e.children,n=e.onClose,c=e.className,r=Object(a.useRef)(null);return Object(v.a)(r,(function(){null===n||void 0===n||n()})),Object(m.a)("Escape",n,{event:"keydown"}),Object(b.jsx)("div",{className:["absolute w-full h-full flex justify-center items-center","z-20","bg-gray-300 bg-opacity-40 backdrop-filter backdrop-blur-md"].join(" "),children:Object(b.jsxs)("div",{ref:r,className:"bg-white max-w-4xl relative rounded-md shadow-md ".concat(c||"p-8 sm:p-12"),children:[Object(b.jsx)(p,{icon:Object(b.jsx)(u.e,{className:"w-6 h-6"}),className:["absolute right-4 top-4 rounded-full bg-gray-100 w-10 h-10","flex justify-center items-center py-0 px-0 sm:px-0"].join(" "),onClick:n}),t]})})}function O(e){var t=e.children,n=e.content;return Object(b.jsxs)("div",{className:"h-full flex flex-row space-x-6 justify-between",children:[Object(b.jsx)("div",{className:"mr-12 border-2 rounded-xl px-2 py-1",children:t}),Object(b.jsx)("div",{className:"flex flex-col justify-center",children:n})]})}function g(e){var t=e.onClose;return Object(b.jsx)(x,{onClose:t,className:"h-full sm:h-auto p-0 sm:p-0",children:Object(b.jsx)("div",{className:"h-full sm:h-auto flex flex-col sm:flex-row",children:Object(b.jsxs)("div",{className:"flex sm:p-14 flex flex-col justify-center space-y-6",children:[Object(b.jsx)(O,{content:"Enable multi-stroke mask drawing",children:Object(b.jsx)("p",{children:"Hold Cmd/Ctrl"})}),Object(b.jsx)(O,{content:"Undo inpainting",children:Object(b.jsx)("p",{children:"Cmd/Ctrl + z"})}),Object(b.jsx)(O,{content:"Pan",children:Object(b.jsx)("p",{children:"Space & Drag"})}),Object(b.jsx)(O,{content:"View original image",children:Object(b.jsx)("p",{children:"Hold Tab"})}),Object(b.jsx)(O,{content:"Reset zoom/pan & Cancel mask drawing",children:Object(b.jsx)("p",{children:"Esc"})}),Object(b.jsx)(O,{content:"Decrease Brush Size",children:Object(b.jsx)("p",{children:"["})}),Object(b.jsx)(O,{content:"Increase Brush Size",children:Object(b.jsx)("p",{children:"]"})})]})})})}var w=n(11),y=n(26),k=n(30);function N(e){for(var t=e.split(",")[0].split(":")[1].split(";")[0],n=atob(e.split(",")[1]),a=[],c=0;cn?c:n);if(c>n){var a=Math.ceil(t*n);return"".concat(e,"x").concat(a)}var r=Math.ceil(t*c);return"".concat(r,"x").concat(e)},s=Object(a.useCallback)((function(){for(var e=c>n?c:n,t=[],a=0;a2&&void 0!==arguments[2]?arguments[2]:T;e.strokeStyle=n,e.lineCap="round",e.lineJoin="round",t.forEach((function(t){(null===t||void 0===t?void 0:t.pts.length)&&t.size&&(e.lineWidth=t.size,e.beginPath(),e.moveTo(t.pts[0].x,t.pts[0].y),t.pts.forEach((function(t){return e.lineTo(t.x,t.y)})),e.stroke())}))}function I(e){var t=e.file,n=Object(a.useState)(40),c=Object(o.a)(n,2),r=c[0],i=c[1],h=function(e){var t=Object(a.useState)(new Image),n=Object(o.a)(t,1)[0],c=Object(a.useState)(!1),r=Object(o.a)(c,2),i=r[0],s=r[1];return Object(a.useEffect)((function(){return n.onload=function(){s(!0)},s(!1),n.src=URL.createObjectURL(e),function(){n.onload=null}}),[e,n]),[n,i]}(t),f=Object(o.a)(h,2),v=f[0],x=f[1],O=Object(a.useState)([]),g=Object(o.a)(O,2),N=g[0],S=g[1],M=Object(a.useState)(),E=Object(o.a)(M,2),L=E[0],A=E[1],T=Object(a.useState)((function(){return document.createElement("canvas")})),I=Object(o.a)(T,1)[0],F=Object(a.useState)([{pts:[]}]),W=Object(o.a)(F,2),Z=W[0],R=W[1],U=Object(a.useState)([{pts:[]}]),V=Object(o.a)(U,2),B=V[0],K=V[1],Y=Object(a.useState)([]),J=Object(o.a)(Y,2),X=J[0],G=J[1],$=Object(a.useState)({x:-1,y:-1}),_=Object(o.a)($,2),Q=_[0],q=Q.x,ee=Q.y,te=_[1],ne=Object(a.useState)(!1),ae=Object(o.a)(ne,2),ce=ae[0],re=ae[1],ie=Object(a.useState)(!1),se=Object(o.a)(ie,2),oe=se[0],le=se[1],ue=Object(a.useState)(!1),he=Object(o.a)(ue,2),de=he[0],be=he[1],pe=Object(a.useState)(!1),je=Object(o.a)(pe,2),fe=je[0],ve=je[1],me=Object(a.useState)(!1),xe=Object(o.a)(me,2),Oe=xe[0],ge=xe[1],we=Object(a.useState)(1),ye=Object(o.a)(we,2),ke=ye[0],Ne=ye[1],Ce=Object(a.useState)(),Se=Object(o.a)(Ce,2),ze=Se[0],Me=Se[1],De=Object(y.a)("sizeLimit","1080"),Ee=Object(o.a)(De,2),Le=Ee[0],Ae=Ee[1],He=Object(d.a)(),Te=Object(a.useRef)(),Pe=Object(a.useState)(!1),Ie=Object(o.a)(Pe,2),Fe=Ie[0],We=Ie[1],Ze=Object(a.useState)(!1),Re=Object(o.a)(Ze,2),Ue=Re[0],Ve=Re[1],Be=Object(a.useCallback)((function(){if(L){L.clearRect(0,0,L.canvas.width,L.canvas.height);var e=N[N.length-1];(null===e||void 0===e?void 0:e.src)?L.drawImage(e,0,0,v.naturalWidth,v.naturalHeight):L.drawImage(v,0,0),P(L,B)}}),[L,B,v,N]),Ke=Object(a.useCallback)((function(){if(!(null===L||void 0===L?void 0:L.canvas.width)||!(null===L||void 0===L?void 0:L.canvas.height))throw new Error("canvas has invalid size");I.width=null===L||void 0===L?void 0:L.canvas.width,I.height=null===L||void 0===L?void 0:L.canvas.height;var e=I.getContext("2d");if(!e)throw new Error("could not retrieve mask canvas");P(e,Z,"white")}),[null===L||void 0===L?void 0:L.canvas.height,null===L||void 0===L?void 0:L.canvas.width,Z,I]),Ye=Object(a.useCallback)(Object(l.a)(s.a.mark((function e(){var n,a;return s.a.wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return ve(!0),Ke(),e.prev=2,e.next=5,z(t,I.toDataURL(),Le);case 5:if(n=e.sent){e.next=8;break}throw new Error("empty response");case 8:return a=new Image,e.next=11,C(a,n);case 11:N.push(a),Z.push({pts:[]}),S(Object(j.a)(N)),R(Object(j.a)(Z)),X.push(B.length),G(X),B.length=0,K([{pts:[]}]),e.next=24;break;case 21:e.prev=21,e.t0=e.catch(2),alert(e.t0.message?e.t0.message:e.t0.toString());case 24:ve(!1),Be();case 26:case"end":return e.stop()}}),e,null,[[2,21]])}))),[Be,t,Z,B,I,Ke,N,Le,X]),Je=function(){return 0!==B.length&&0!==B[0].pts.length},Xe=function(){return 0!==N.length},Ge=function(){We(!1),B.length=0,K([{pts:[]}])},$e=function(e){return"Control"===e.key||"Meta"===e.key};Object(m.a)($e,(function(){Ue&&(fe||(Ve(!1),Je()&&Ye()))}),{event:"keyup"},[fe,Ue,Je]),Object(m.a)($e,(function(){fe||Ve(!0)}),{event:"keydown"},[fe]),Object(a.useEffect)((function(){if(v&&x){var e=He.width/v.naturalWidth,t=(He.height-200)/v.naturalHeight;if(e<1||t<1){var n=Math.min(e,t);Me(n),Ne(n)}else Me(1);(null===L||void 0===L?void 0:L.canvas)&&(L.canvas.width=v.naturalWidth,L.canvas.height=v.naturalHeight),Be()}}),[null===L||void 0===L?void 0:L.canvas,Be,v,x,He]);var _e=Object(a.useCallback)((function(){if(ze&&v&&He){var e=Te.current;if(!e)throw new Error("no viewport");var t=(He.width-v.width*ze)/2,n=(He.height-v.height*ze)/2;e.setTransform(t,n,ze,200,"easeOutQuad"),e.state.scale=ze,Ne(ze)}}),[Te,ze,v,He]);Object(m.a)("Escape",(function(){fe||(Fe||Ue?Ge():_e())}),{event:"keydown"},[Fe,fe,Ue,_e,Ge]);var Qe=function(e,t){B[B.length-1].pts.push({x:e,y:t}),Z[Z.length-1].pts.push({x:e,y:t}),Be()},qe=function(){if(N.length&&X.length){for(var e=Z,t=X[X.length-1],n=0;n<=t;n+=1)e.pop();R([].concat(Object(j.a)(e),[{pts:[]}])),X.pop(),G(X);var a=N;a.pop(),S(Object(j.a)(a))}};Object(m.a)((function(e){var t=(e.metaKey||e.ctrlKey)&&"z"===e.key;return"Tab"===e.key&&e.preventDefault(),!!t&&(e.preventDefault(),!0)}),qe),Object(k.a)("Tab",(function(e){null===e||void 0===e||e.preventDefault(),null===e||void 0===e||e.stopPropagation(),Xe()&&(ge(!0),be(!0))}),(function(e){null===e||void 0===e||e.preventDefault(),null===e||void 0===e||e.stopPropagation(),Xe()&&(be(!1),setTimeout((function(){return ge(!1)}),300))}));var et=function(e){e===ce||oe||re(e)},tt=Object(a.useCallback)((function(){return oe?"grab":ce?"none":void 0}),[ce,oe]);Object(k.a)("[",(function(){i((function(e){return e>10?e-10:e<=10&&e>0?e-5:e}))})),Object(k.a)("]",(function(){i((function(e){return e+10}))})),Object(k.a)(" ",(function(e){null===e||void 0===e||e.preventDefault(),null===e||void 0===e||e.stopPropagation(),re(!1),le(!0)}),(function(e){null===e||void 0===e||e.preventDefault(),null===e||void 0===e||e.stopPropagation(),re(!0),le(!1)}));return v&&ke&&ze?Object(b.jsxs)("div",{className:"flex flex-col items-center",style:{height:"100%",width:"100%"},"aria-hidden":"true",onMouseMove:function(e){var t=e.nativeEvent;te({x:t.pageX,y:t.pageY})},onMouseUp:function(){if(!oe&&(v.src&&(null===L||void 0===L?void 0:L.canvas)&&!fe&&Fe)){if(We(!1),Ue)return Z.push({pts:[]}),R(Object(j.a)(Z)),B.push({pts:[]}),void K(Object(j.a)(B));0!==B.length&&0!==B[0].pts.length&&Ye()}},children:[Object(b.jsx)(w.b,{ref:function(e){e&&(Te.current=e)},panning:{disabled:!oe,velocityDisabled:!0},wheel:{step:.05},centerZoomedOut:!0,alignmentAnimation:{disabled:!0},centerOnInit:!0,limitToBounds:!1,doubleClick:{disabled:!0},initialScale:ze,minScale:ze,onZoom:function(e){Ne(e.state.scale)},children:Object(b.jsx)(w.a,{wrapperStyle:{width:"100%",height:"100%"},contentClass:fe?"animate-pulse-fast pointer-events-none transition-opacity":"",children:Object(b.jsxs)(b.Fragment,{children:[Object(b.jsx)("canvas",{className:"rounded-sm",style:{cursor:tt()},onContextMenu:function(e){e.preventDefault()},onMouseOver:function(){return et(!0)},onFocus:function(){return et(!0)},onMouseLeave:function(){return et(!1)},onMouseDown:function(e){if(!oe&&(v.src&&(null===L||void 0===L?void 0:L.canvas)&&!fe)){We(!0),B[B.length-1].size=r,Z[Z.length-1].size=r;var t=e.nativeEvent;Qe(t.offsetX,t.offsetY)}},onMouseMove:function(e){if(!oe&&Fe){var t=e.nativeEvent,n=t.offsetX,a=t.offsetY;Qe(n,a)}},ref:function(e){if(e&&!L){var t=e.getContext("2d");t&&A(t)}}}),Object(b.jsx)("div",{className:["absolute top-0 right-0 pointer-events-none","overflow-hidden","border-primary",Oe?"border-l-4":""].join(" "),style:{width:de?"".concat(Math.round(v.naturalWidth),"px"):"0px",height:v.naturalHeight,transitionProperty:"width, height",transitionTimingFunction:"cubic-bezier(0.4, 0, 0.2, 1)",transitionDuration:"300ms"},children:Object(b.jsx)("img",{className:"absolute right-0",src:v.src,alt:"original",width:"".concat(v.naturalWidth,"px"),height:"".concat(v.naturalHeight,"px"),style:{width:"".concat(v.naturalWidth,"px"),height:"".concat(v.naturalHeight,"px"),maxWidth:"none"}})})]})})}),ce&&!fe&&!oe&&Object(b.jsx)("div",{className:"hidden sm:block absolute rounded-full border border-primary bg-primary bg-opacity-80 pointer-events-none",style:function(){var e=function(){var e,t,n=ze;return void 0!==(null===(e=Te.current)||void 0===e?void 0:e.state.scale)&&(n=null===(t=Te.current)||void 0===t?void 0:t.state.scale),n}();return{width:"".concat(r*e,"px"),height:"".concat(r*e,"px"),left:"".concat(q,"px"),top:"".concat(ee,"px"),transform:"translate(-50%, -50%)"}}()}),Object(b.jsx)("div",{className:"fixed w-full bottom-0 flex items-center justify-center",style:{height:"90px"},children:Object(b.jsxs)("div",{className:["flex items-center justify-center space-x-6",""].join(" "),children:[Object(b.jsx)(H,{value:Le||"1080",onChange:function(e){Ae(e)},originalWidth:v.naturalWidth,originalHeight:v.naturalHeight}),Object(b.jsx)(D,{label:Object(b.jsx)("span",{children:Object(b.jsx)("span",{className:"hidden md:inline",children:"Brush"})}),min:10,max:150,value:r,onChange:i}),Object(b.jsxs)("div",{children:[Object(b.jsx)(p,{className:"mr-2",icon:Object(b.jsx)(u.b,{className:"w-6 h-6"}),disabled:ke===ze,onClick:_e}),Object(b.jsx)(p,{className:"mr-2",icon:Object(b.jsx)("svg",{width:"19",height:"9",viewBox:"0 0 19 9",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:"w-6 h-6",children:Object(b.jsx)("path",{d:"M2 1C2 0.447715 1.55228 0 1 0C0.447715 0 0 0.447715 0 1H2ZM1 8H0V9H1V8ZM8 9C8.55228 9 9 8.55229 9 8C9 7.44771 8.55228 7 8 7V9ZM16.5963 7.42809C16.8327 7.92721 17.429 8.14016 17.9281 7.90374C18.4272 7.66731 18.6402 7.07103 18.4037 6.57191L16.5963 7.42809ZM16.9468 5.83205L17.8505 5.40396L16.9468 5.83205ZM0 1V8H2V1H0ZM1 9H8V7H1V9ZM1.66896 8.74329L6.66896 4.24329L5.33104 2.75671L0.331035 7.25671L1.66896 8.74329ZM16.043 6.26014L16.5963 7.42809L18.4037 6.57191L17.8505 5.40396L16.043 6.26014ZM6.65079 4.25926C9.67554 1.66661 14.3376 2.65979 16.043 6.26014L17.8505 5.40396C15.5805 0.61182 9.37523 -0.710131 5.34921 2.74074L6.65079 4.25926Z",fill:"currentColor"})}),onClick:qe,disabled:0===N.length}),Object(b.jsx)(p,{className:"mr-2",icon:Object(b.jsx)(u.d,{className:"w-6 h-6"}),onDown:function(e){e.preventDefault(),ge(!0),be(!0)},onUp:function(){be(!1),setTimeout((function(){return ge(!1)}),300)},disabled:0===N.length,children:void 0}),Object(b.jsx)(p,{icon:Object(b.jsx)(u.c,{className:"w-6 h-6"}),disabled:!N.length,onClick:function(){var e=t.name.replace(/(\.[\w\d_-]+)$/i,"_cleanup$1");!function(e,t){var n=document.createElement("a");n.href=e,n.download=t,n.dispatchEvent(new MouseEvent("click",{bubbles:!0,cancelable:!0,view:window})),setTimeout((function(){n.remove()}),100)}(N[N.length-1].currentSrc,e)},children:void 0})]}),Object(b.jsx)("div",{className:"absolute bg-black backdrop-blur backdrop-filter bg-opacity-10 rounded-xl",style:{height:"58px",width:"600px",zIndex:-1,marginLeft:"-1px"},children:void 0})]})})]}):Object(b.jsx)(b.Fragment,{})}function F(){return F=Object(l.a)(s.a.mark((function e(){var t,n,a=arguments;return s.a.wrap((function(e){for(;;)switch(e.prev=e.next){case 0:return t=a.length>0&&void 0!==a[0]?a[0]:"",e.next=3,fetch(t,{method:"GET",cache:"no-cache"});case 3:return n=e.sent,e.abrupt("return",n.json());case 5:case"end":return e.stop()}}),e)}))),F.apply(this,arguments)}document.addEventListener("DOMContentLoaded",(function(){var e=document.location;setInterval((function(){(function(){return F.apply(this,arguments)})(e+"/flaskwebgui-keep-server-alive").then((function(e){return console.log(e)}))}),3e3)}));var W=function(){var e=Object(a.useState)(),t=Object(o.a)(e,2),n=t[0],c=t[1],r=Object(h.a)(!1),i=Object(o.a)(r,2),j=i[0],v=i[1],m=Object(d.a)();return Object(b.jsxs)("div",{className:"h-full full-visible-h-safari flex flex-col",children:[Object(b.jsxs)("header",{className:"absolute z-10 flex w-full p-1 justify-center sm:justify-between items-center sm:items-start bg-white backdrop-blur backdrop-filter bg-opacity-30",children:[n?Object(b.jsx)(p,{icon:Object(b.jsx)(u.a,{className:"w-6 h-6"}),onClick:function(){c(void 0)},children:m.width>640?"Start new":void 0}):Object(b.jsx)(b.Fragment,{}),n?Object(b.jsx)(p,{onClick:v,icon:Object(b.jsxs)("svg",{xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",role:"img",width:"28",height:"28",preserveAspectRatio:"xMidYMid meet",viewBox:"0 0 16 16",children:[Object(b.jsx)("rect",{x:"0",y:"0",width:"16",height:"16",fill:"none",stroke:"none"}),Object(b.jsxs)("g",{fill:"currentColor",children:[Object(b.jsx)("path",{d:"M14 5a1 1 0 0 1 1 1v5a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V6a1 1 0 0 1 1-1h12zM2 4a2 2 0 0 0-2 2v5a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2H2z"}),Object(b.jsx)("path",{d:"M13 10.25a.25.25 0 0 1 .25-.25h.5a.25.25 0 0 1 .25.25v.5a.25.25 0 0 1-.25.25h-.5a.25.25 0 0 1-.25-.25v-.5zm0-2a.25.25 0 0 1 .25-.25h.5a.25.25 0 0 1 .25.25v.5a.25.25 0 0 1-.25.25h-.5a.25.25 0 0 1-.25-.25v-.5zm-5 0A.25.25 0 0 1 8.25 8h.5a.25.25 0 0 1 .25.25v.5a.25.25 0 0 1-.25.25h-.5A.25.25 0 0 1 8 8.75v-.5zm2 0a.25.25 0 0 1 .25-.25h1.5a.25.25 0 0 1 .25.25v.5a.25.25 0 0 1-.25.25h-1.5a.25.25 0 0 1-.25-.25v-.5zm1 2a.25.25 0 0 1 .25-.25h.5a.25.25 0 0 1 .25.25v.5a.25.25 0 0 1-.25.25h-.5a.25.25 0 0 1-.25-.25v-.5zm-5-2A.25.25 0 0 1 6.25 8h.5a.25.25 0 0 1 .25.25v.5a.25.25 0 0 1-.25.25h-.5A.25.25 0 0 1 6 8.75v-.5zm-2 0A.25.25 0 0 1 4.25 8h.5a.25.25 0 0 1 .25.25v.5a.25.25 0 0 1-.25.25h-.5A.25.25 0 0 1 4 8.75v-.5zm-2 0A.25.25 0 0 1 2.25 8h.5a.25.25 0 0 1 .25.25v.5a.25.25 0 0 1-.25.25h-.5A.25.25 0 0 1 2 8.75v-.5zm11-2a.25.25 0 0 1 .25-.25h.5a.25.25 0 0 1 .25.25v.5a.25.25 0 0 1-.25.25h-.5a.25.25 0 0 1-.25-.25v-.5zm-2 0a.25.25 0 0 1 .25-.25h.5a.25.25 0 0 1 .25.25v.5a.25.25 0 0 1-.25.25h-.5a.25.25 0 0 1-.25-.25v-.5zm-2 0A.25.25 0 0 1 9.25 6h.5a.25.25 0 0 1 .25.25v.5a.25.25 0 0 1-.25.25h-.5A.25.25 0 0 1 9 6.75v-.5zm-2 0A.25.25 0 0 1 7.25 6h.5a.25.25 0 0 1 .25.25v.5a.25.25 0 0 1-.25.25h-.5A.25.25 0 0 1 7 6.75v-.5zm-2 0A.25.25 0 0 1 5.25 6h.5a.25.25 0 0 1 .25.25v.5a.25.25 0 0 1-.25.25h-.5A.25.25 0 0 1 5 6.75v-.5zm-3 0A.25.25 0 0 1 2.25 6h1.5a.25.25 0 0 1 .25.25v.5a.25.25 0 0 1-.25.25h-1.5A.25.25 0 0 1 2 6.75v-.5zm0 4a.25.25 0 0 1 .25-.25h.5a.25.25 0 0 1 .25.25v.5a.25.25 0 0 1-.25.25h-.5a.25.25 0 0 1-.25-.25v-.5zm2 0a.25.25 0 0 1 .25-.25h5.5a.25.25 0 0 1 .25.25v.5a.25.25 0 0 1-.25.25h-5.5a.25.25 0 0 1-.25-.25v-.5z"})]})]})}):Object(b.jsx)(b.Fragment,{})]}),j&&Object(b.jsx)(g,{onClose:v}),Object(b.jsx)("main",{className:["h-full flex flex-1 flex-col sm:items-center sm:justify-center overflow-hidden","items-center justify-center"].join(" "),children:n?Object(b.jsx)(I,{file:n}):Object(b.jsxs)(b.Fragment,{children:[Object(b.jsx)("div",{className:["flex flex-col sm:flex-row items-center","space-y-5 sm:space-y-0 sm:space-x-6 p-5 pt-0 pb-10"].join(" "),children:Object(b.jsx)("div",{className:"max-w-xl flex flex-col items-center sm:items-start p-0 m-0 space-y-5",children:Object(b.jsxs)("h1",{className:"text-center sm:text-left text-xl sm:text-3xl",children:["Image inpainting powered by \ud83e\udd99",Object(b.jsx)("u",{children:Object(b.jsx)("a",{href:"https://github.com/saic-mdal/lama",children:"LaMa"})})]})})}),Object(b.jsx)("div",{className:"h-20 sm:h-52 px-4 w-full",style:{maxWidth:"800px"},children:Object(b.jsx)(f,{onSelection:function(){var e=Object(l.a)(s.a.mark((function e(t){return s.a.wrap((function(e){for(;;)switch(e.prev=e.next){case 0:c(t);case 1:case"end":return e.stop()}}),e)})));return function(t){return e.apply(this,arguments)}}()})})]})})]})};r.a.render(Object(b.jsx)(W,{}),document.getElementById("root"))}},[[23,1,2]]]); \ No newline at end of file diff --git a/lama_cleaner/app/package.json b/lama_cleaner/app/package.json index b5865c6..69a3336 100644 --- a/lama_cleaner/app/package.json +++ b/lama_cleaner/app/package.json @@ -31,12 +31,14 @@ "scripts": { "dev": "run-p watch:css react-scripts:start", "build": "run-s build:css react-scripts:build", + "build:windows": "run-s build:css react-scripts:winbuild", "test": "react-scripts test", "eject": "react-scripts eject", "build:css": "cross-env TAILWIND_MODE=build NODE_ENV=production postcss src/styles/tailwind.css -o src/styles/index.css", "watch:css": "cross-env TAILWIND_MODE=watch NODE_ENV=development postcss src/styles/tailwind.css -o src/styles/index.css --watch", "react-scripts:start": "delay 5 && react-scripts start", - "react-scripts:build": "GENERATE_SOURCEMAP=false react-scripts build" + "react-scripts:build": "GENERATE_SOURCEMAP=false react-scripts build", + "react-scripts:winbuild": "set \"GENERATE_SOURCEMAP=false\" && react-scripts build" }, "eslintConfig": { "extends": "react-app" diff --git a/lama_cleaner/app/src/App.tsx b/lama_cleaner/app/src/App.tsx index 162bfc3..86255fd 100644 --- a/lama_cleaner/app/src/App.tsx +++ b/lama_cleaner/app/src/App.tsx @@ -6,6 +6,27 @@ import FileSelect from './components/FileSelect' import ShortcutsModal from './components/ShortcutsModal' import Editor from './Editor' +// Keeping GUI Window Open +async function getRequest(url = '') { + const response = await fetch(url, { + method: 'GET', + cache: 'no-cache', + }) + return response.json() +} + +if (!process.env.NODE_ENV || process.env.NODE_ENV === 'production') { + document.addEventListener('DOMContentLoaded', function () { + const url = document.location + const route = '/flaskwebgui-keep-server-alive' + const intervalRequest = 3 * 1000 + function keepAliveServer() { + getRequest(url + route).then(data => console.log(data)) + } + setInterval(keepAliveServer, intervalRequest) + }) +} + function App() { const [file, setFile] = useState() const [showShortcuts, toggleShowShortcuts] = useToggle(false) diff --git a/main.py b/main.py index a50df20..8ca074c 100644 --- a/main.py +++ b/main.py @@ -13,6 +13,8 @@ import torch from lama_cleaner.lama import LaMa from lama_cleaner.ldm import LDM +from flaskwebgui import FlaskUI + try: torch._C._jit_override_can_fuse_on_cpu(False) torch._C._jit_override_can_fuse_on_gpu(False) @@ -41,7 +43,8 @@ os.environ["NUMEXPR_NUM_THREADS"] = NUM_THREADS if os.environ.get("CACHE_DIR"): os.environ["TORCH_HOME"] = os.environ["CACHE_DIR"] -BUILD_DIR = os.environ.get("LAMA_CLEANER_BUILD_DIR", "./lama_cleaner/app/build") +BUILD_DIR = os.environ.get("LAMA_CLEANER_BUILD_DIR", + "./lama_cleaner/app/build") app = Flask(__name__, static_folder=os.path.join(BUILD_DIR, "static")) app.config["JSON_AS_ASCII"] = False @@ -66,12 +69,14 @@ def process(): size_limit = int(size_limit) print(f"Origin image shape: {original_shape}") - image = resize_max_size(image, size_limit=size_limit, interpolation=interpolation) + image = resize_max_size(image, size_limit=size_limit, + interpolation=interpolation) print(f"Resized image shape: {image.shape}") image = norm_img(image) mask = load_img(input["mask"].read(), gray=True) - mask = resize_max_size(mask, size_limit=size_limit, interpolation=interpolation) + mask = resize_max_size(mask, size_limit=size_limit, + interpolation=interpolation) mask = norm_img(mask) start = time.time() @@ -111,6 +116,10 @@ def get_args_parser(): "The larger the value, the better the result, but it will be more time-consuming", ) parser.add_argument("--device", default="cuda", type=str) + parser.add_argument("--gui", action="store_true", + help="Launch as desktop app") + parser.add_argument("--gui_size", default=[1600, 1000], nargs=2, type=int, + help="Set window size for GUI") parser.add_argument("--debug", action="store_true") return parser.parse_args() @@ -125,13 +134,19 @@ def main(): crop_size = [int(it) for it in args.crop_size.split(",")] if args.model == "lama": - model = LaMa(crop_trigger_size=crop_trigger_size, crop_size=crop_size, device=device) + model = LaMa(crop_trigger_size=crop_trigger_size, + crop_size=crop_size, device=device) elif args.model == "ldm": model = LDM(device, steps=args.ldm_steps) else: raise NotImplementedError(f"Not supported model: {args.model}") - app.run(host="0.0.0.0", port=args.port, debug=args.debug) + if args.gui: + app_width, app_height = args.gui_size + ui = FlaskUI(app, width=app_width, height=app_height) + ui.run() + else: + app.run(host="127.0.0.1", port=args.port, debug=args.debug) if __name__ == "__main__": diff --git a/requirements.txt b/requirements.txt index 2cb9902..5bb3a13 100644 --- a/requirements.txt +++ b/requirements.txt @@ -2,4 +2,5 @@ torch>=1.8.2 opencv-python flask_cors flask +flaskwebgui tqdm From 57bf1533aba3bd23cf81d31e625748a6ada9494b Mon Sep 17 00:00:00 2001 From: blessedcoolant <54517381+blessedcoolant@users.noreply.github.com> Date: Thu, 24 Mar 2022 05:12:16 +1300 Subject: [PATCH 2/2] Update README.md --- README.md | 1 + 1 file changed, 1 insertion(+) diff --git a/README.md b/README.md index e79ead0..11354cc 100644 --- a/README.md +++ b/README.md @@ -40,6 +40,7 @@ results than LaMa. You can run lama-cleaner as a desktop application using the following command line arguments. `--gui`: Launch lama-cleaner as a desktop application + `--gui_size`: Set the window size for the application. Usage: --gui_size 1200 900 |Original Image|LaMa|LDM|