From 0be4a249ae670bf1c3e4c27467d371b8abefc18d Mon Sep 17 00:00:00 2001 From: canisminor1990 Date: Sun, 14 Jan 2024 16:12:22 +0800 Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9B=20fix:=20Fix=20extranetwork=20load?= =?UTF-8?q?ing?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- javascript/main.js | 9 ++++++++- src/features/ExtraNetworkSidebar/refreshExtraNetwork.ts | 6 ++++++ src/features/ExtraNetworkSidebar/style.ts | 8 ++++++++ src/features/ExtraNetworkSidebar/useCivitaiHelperFix.ts | 1 + 4 files changed, 23 insertions(+), 1 deletion(-) diff --git a/javascript/main.js b/javascript/main.js index 57e83e5..905cdab 100644 --- a/javascript/main.js +++ b/javascript/main.js @@ -2096,6 +2096,13 @@ const le={attribute:!0,type:String,converter:v,reflect:!1,hasChanged:y},se=(e=le } .extra-networks { + .pending { + opacity: 1 !important; + } + .wrap.center.full.translucent { + display: none !important; + } + .tab-nav { align-items: center; @@ -2267,7 +2274,7 @@ const le={attribute:!0,type:String,converter:v,reflect:!1,hasChanged:y},se=(e=le } `,container:e` height: calc(100vh - ${n}px); - `}))),Tre=["txt2img","img2img"],Are=["textual_inversion","hypernetworks","checkpoints","lora","lycoris"],Fre={checkpoints:"ckp",hypernetworks:"hyper",lora:"lora",lycoris:"lycoris",textual_inversion:"ti"},Rre=new Set(["🌐","💡","🏷️"]),Mre="lobeDone",Lre=(e,t)=>{t?(e.style.display="inline",e.style.fontSize="100%",e.style.position="static",e.style.backgroundImage="none"):(e.style.fontSize="15px",e.style.margin="0")};function zre(e){return null==e}const Bre=()=>{let e,t=0;const n=()=>{const r=()=>setTimeout(n,500);let o=0;const i=setInterval((()=>{var n;fe.info("🤯 [civitai helper] update card for civitai");const a=document.querySelector("#txt2img_lora_cards");if(a||o>5){if(e!==a){t=0,e=a;for(const e of Tre){const t=document.querySelectorAll(`#${e}_extra_tabs .tab-nav button`);if(t)for(const e of t)e.removeEventListener("click",r),e.addEventListener("click",r)}}const l=null==(n=(()=>{var e;if(!document.querySelector("#tab_civitai_helper"))return;const t=getTranslation("replace preview")||"replace preview",n=document.querySelector("#ch_always_display_ckb input"),r=document.querySelector("#ch_show_btn_on_thumb_ckb input"),o=(null==n?void 0:n.checked)||!1,i=(null==r?void 0:r.checked)||!1;let a,l,s,c,u,d,f,p,h,g="",m=!1,b=!1;const v=[];for(const y of Tre)for(const n of Are){if(p=Fre[n],a=`${y}_${n}_cards`,l=document.querySelector(`#${a}`),zre(l))continue;b=l.classList.contains("extra-network-thumbs"),h=l.querySelectorAll(".card");const r=!!document.querySelector(`#${a}_html .pending`);if((null==h?void 0:h.length)&&!r){v.push(n);for(const n of h){if("1"===n.dataset[Mre])break;if(n.dataset[Mre]="1",n.querySelectorAll(".actions .additional a").length>2)continue;if(s=n.querySelector(".metadata-button"),c=n.querySelector(".actions .additional"),d=n.querySelector(".actions .additional ul"),zre(d)&&(d=document.createElement("ul"),c.append(d)),u=n.querySelector(".actions .additional a"),zre(u)&&(u=document.createElement("a"),c.append(u)),null==(e=d.querySelector("br"))||e.remove(),b&&c){if(c.style.display=void 0,!i){d.style.background=void 0;const e=d.querySelectorAll("a");if(!(null==e?void 0:e.length))continue;for(const n of e)n.style.display=void 0,Rre.has(n.innerHTML)?n.remove():(n.innerHTML=t,n.style.display=void 0,n.style.fontSize=void 0,n.style.position=void 0,n.style.backgroundImage=void 0);continue}d.style.background="rgba(0, 0, 0, 0.8)"}else c.style.display=o?"block":void 0;if("🖼️"!==u.innerHTML&&(m=!0,u.innerHTML="🖼️",Lre(u,b)),!m)continue;if(f=n.querySelector(".actions .additional .search_term"),!f)return;if(g=f.innerHTML,!g)continue;const r=document.createElement("a");r.href="#",r.innerHTML="🌐",Lre(r,b),r.title="Open this model's civitai url",r.setAttribute("onclick",`open_model_url(event, '${p}', '${g}')`);const a=document.createElement("a");a.href="#",a.innerHTML="💡",Lre(a,b),a.title="Add trigger words to prompt",a.setAttribute("onclick",`add_trigger_words(event, '${p}', '${g}')`);const l=document.createElement("a");l.href="#",l.innerHTML="🏷️",Lre(l,b),l.title="Use prompt from preview image",l.setAttribute("onclick",`use_preview_prompt(event, '${p}', '${g}')`),d.append(r),b&&s&&d.append(document.createElement("br")),d.append(a),d.append(l)}}else!r&&l.querySelector(".nocards")&&v.push(n)}return v})())?void 0:n.length;OU(l)&&l5||!a||l>=Are.length||l>t)&&(clearInterval(i),t=l??t)}o++}),500)};return n},Hre=e=>{var t;document.querySelector(`#${e}2img_extra_refresh`).click();const n=null==(t=document.querySelector(`#${e}2img_extra_refresh`))?void 0:t.nextSibling;n&&(n.onclick=Bre)},Wre=e=>{const t=(n=`div#tab_${e}2img`,W.useRef(gradioApp().querySelector(n)));var n;const r=W.useRef(null);return a8(r,`div#${e}2img_extra_tabs`),a8(t,"div.tabitem.gradio-tabitem",{id:`${e}2img_render`,onSuccess:()=>{(e=>{const t=document.querySelectorAll(`#${e}2img_extra_tabs > .tab-nav > button`)[1];null==t||t.click()})(e)},parent:`div#${e}2img_extra_tabs`}),r},Ure=W.memo((()=>{const e=Wre("txt"),t=Wre("img"),n=hne(dne,m5),r=hne(fne),[o,i]=W.useState(n.extraNetworkCardSize||86),{styles:a}=Ire({size:o}),{isLoading:l}=(({onStart:e,onSuccess:t,debug:n,timeout:r=500}={})=>{const[o,i]=W.useState(!0),a=W.useRef(!1);return W.useEffect((()=>{if(a.current)return;let o;if(null==e||e(),document.querySelector("#tab_civitai_helper")&&document.querySelector("#txt2img_extra_refresh"))try{o=setTimeout((()=>{Hre("txt"),Hre("img"),Bre()}),r)}catch(l){i(!1),n&&fe.success(`🤯 ${n}`,l)}return null==t||t(),a.current=!0,i(!1),n&&fe.success(`🤯 ${n}`),()=>{o&&clearTimeout(o)}}),[]),{isLoading:o}})({debug:"[layout] inject - ExtraNetworkSidebar"});return Z.jsxs(Z.Fragment,{children:[Z.jsxs(o5,{className:a.body,children:[l&&Z.jsx(wF,{active:!0}),Z.jsxs("div",{style:l?{display:"none"}:{},children:[Z.jsx("div",{id:"txt2img-extra-network-sidebar",ref:e,style:"tab_img2img"===r?{display:"none"}:{}}),Z.jsx("div",{id:"img2img-extra-network-sidebar",ref:t,style:"tab_img2img"===r?{}:{display:"none"}})]})]}),Z.jsxs(u5,{children:[Z.jsx(sW,{icon:n.extraNetworkCardSizei(n.extraNetworkCardSize),size:{blockSize:24,fontSize:16}}),Z.jsx(hB,{defaultValue:o,max:256,min:64,onChange:i,step:8,style:{flex:1},value:o})]})]})})),qre=W.memo((({headerHeight:e})=>{const{mobile:t}=tH(),n=hne(dne,m5),[r,o]=W.useState(!t&&n.extraNetworkSidebarExpand),[i,a]=W.useState("fixed"===n.extraNetworkFixedMode),{styles:l,theme:s}=Ire({headerHeight:e}),{t:c}=T7();W.useEffect((()=>{t&&o(!1)}),[t]);const u=t||i?"fixed":"float";return Z.jsx(NQ,{defaultSize:{width:n.extraNetworkSidebarWidth},expand:r,minWidth:n.extraNetworkSidebarWidth,mode:u,onExpandChange:o,pin:i,placement:"right",children:Z.jsx(k4,{children:Z.jsxs(l5,{className:l.container,style:"float"===u?{background:s.colorBgContainer,minWidth:n.extraNetworkSidebarWidth}:{minWidth:n.extraNetworkSidebarWidth},children:[Z.jsx(h5,{pin:i,position:"right",setExpand:o,setPin:a,title:c("sidebar.extraNetwork")}),Z.jsx(Ure,{})]})})})})),Vre=[{description:"AUTOMATIC111",openExternal:!0,title:"Stable Diffusion Webui",url:"https://github.com/AUTOMATIC1111/stable-diffusion-webui"},{description:"WebUI extension",openExternal:!0,title:"Controlnet",url:"https://github.com/Mikubill/sd-webui-controlnet"},{description:"Art models",openExternal:!0,title:"Civitai",url:"https://civitai.com/"},{description:"Artist Inspired Styles",openExternal:!0,title:"Cheat Sheet",url:"https://supagruen.github.io/StableDiffusion-CheatSheet"},{description:"Image Resizing",openExternal:!0,title:"Birme",url:"https://www.birme.net/?target_width=512&target_height=512"}],Gre=[{icon:Z.jsx(WH,{icon:qd,size:"small"}),openExternal:!0,title:"Sponsor",url:"https://opencollective.com/lobehub"},{icon:Z.jsx(WH,{icon:Td,size:"small"}),openExternal:!0,title:"Report Bug",url:`${Zte}/issues/new/choose`},{icon:Z.jsx(WH,{icon:Wd,size:"small"}),openExternal:!0,title:"Request Feature",url:`${Zte}/issues/new/choose`}],Xre=[{icon:Z.jsx(WH,{icon:Ud,size:"small"}),openExternal:!0,title:"GitHub",url:Zte},{icon:Z.jsx(WH,{icon:Bd,size:"small"}),openExternal:!0,title:"Changelog",url:`${Zte}/blob/main/CHANGELOG.md`}],Kre=[{description:"Stable Diffusion Extension",openExternal:!0,title:"🤯 Lobe Theme",url:"https://github.com/lobehub/sd-webui-lobe-theme"},{description:"Minifier ExtraNetwrok Covers",openExternal:!0,title:"✂️ Cover Minifier",url:"https://github.com/canisminor1990/sd-webui-cover-minifier"},{description:"OpenAI Chat Bot",openExternal:!0,title:"🤖 Lobe Chat",url:"https://chat.lobehub.com"},{description:"AIGC Components",openExternal:!0,title:"🍭 Lobe UI",url:"https://ui.lobehub.com"},{description:"I18n AI Workflow",openExternal:!0,title:"🌐 Lobe i18n",url:"https://github.com/lobehub/lobe-cli-toolbox"}],Yre=jH((({css:e})=>({footer:e` + `}))),Tre=["txt2img","img2img"],Are=["textual_inversion","hypernetworks","checkpoints","lora","lycoris"],Fre={checkpoints:"ckp",hypernetworks:"hyper",lora:"lora",lycoris:"lycoris",textual_inversion:"ti"},Rre=new Set(["🌐","💡","🏷️"]),Mre="lobeDone",Lre=(e,t)=>{t?(e.style.display="inline",e.style.fontSize="100%",e.style.position="static",e.style.backgroundImage="none"):(e.style.fontSize="15px",e.style.margin="0")};function zre(e){return null==e}const Bre=()=>{let e,t=0;const n=()=>{const r=()=>setTimeout(n,500);let o=0;const i=setInterval((()=>{var n;fe.info("🤯 [civitai helper] update card for civitai");const a=document.querySelector("#txt2img_lora_cards");if(a||o>5){if(e!==a){t=0,e=a;for(const e of Tre){const t=document.querySelectorAll(`#${e}_extra_tabs .tab-nav button`);if(t)for(const e of t)e.removeEventListener("click",r),e.addEventListener("click",r)}}const l=null==(n=(()=>{var e;if(!document.querySelector("#tab_civitai_helper"))return;const t=getTranslation("replace preview")||"replace preview",n=document.querySelector("#ch_always_display_ckb input"),r=document.querySelector("#ch_show_btn_on_thumb_ckb input"),o=(null==n?void 0:n.checked)||!1,i=(null==r?void 0:r.checked)||!1;let a,l,s,c,u,d,f,p,h,g="",m=!1,b=!1;const v=[];for(const y of Tre)for(const n of Are){if(p=Fre[n],a=`${y}_${n}_cards`,l=document.querySelector(`#${a}`),zre(l))continue;b=l.classList.contains("extra-network-thumbs"),h=l.querySelectorAll(".card");const r=!!document.querySelector(`#${a}_html .pending`);if((null==h?void 0:h.length)&&!r){v.push(n);for(const n of h){if("1"===n.dataset[Mre])break;if(n.dataset[Mre]="1",n.querySelectorAll(".actions .additional a").length>2)continue;if(s=n.querySelector(".metadata-button"),c=n.querySelector(".actions .additional"),d=n.querySelector(".actions .additional ul"),zre(d)&&(d=document.createElement("ul"),c.append(d)),u=n.querySelector(".actions .additional a"),zre(u)&&(u=document.createElement("a"),c.append(u)),null==(e=d.querySelector("br"))||e.remove(),b&&c){if(c.style.display=void 0,!i){d.style.background=void 0;const e=d.querySelectorAll("a");if(!(null==e?void 0:e.length))continue;for(const n of e)n.style.display=void 0,Rre.has(n.innerHTML)?n.remove():(n.innerHTML=t,n.style.display=void 0,n.style.fontSize=void 0,n.style.position=void 0,n.style.backgroundImage=void 0);continue}d.style.background="rgba(0, 0, 0, 0.8)"}else c.style.display=o?"block":void 0;if("🖼️"!==u.innerHTML&&(m=!0,u.innerHTML="🖼️",Lre(u,b)),!m)continue;if(f=n.querySelector(".actions .additional .search_term"),!f)return;if(g=f.innerHTML,!g)continue;const r=document.createElement("a");r.href="#",r.innerHTML="🌐",Lre(r,b),r.title="Open this model's civitai url",r.setAttribute("onclick",`open_model_url(event, '${p}', '${g}')`);const a=document.createElement("a");a.href="#",a.innerHTML="💡",Lre(a,b),a.title="Add trigger words to prompt",a.setAttribute("onclick",`add_trigger_words(event, '${p}', '${g}')`);const l=document.createElement("a");l.href="#",l.innerHTML="🏷️",Lre(l,b),l.title="Use prompt from preview image",l.setAttribute("onclick",`use_preview_prompt(event, '${p}', '${g}')`),d.append(r),b&&s&&d.append(document.createElement("br")),d.append(a),d.append(l)}}else!r&&l.querySelector(".nocards")&&v.push(n)}return v})())?void 0:n.length;OU(l)&&l5||!a||l>=Are.length||l>t)&&(clearInterval(i),t=l??t)}o++}),500)};return n},Hre=e=>{var t;document.querySelector(`#${e}2img_extra_refresh`).click();const n=null==(t=document.querySelector(`#${e}2img_extra_refresh`))?void 0:t.nextSibling;n&&(n.onclick=Bre)},Wre=e=>{const t=(n=`div#tab_${e}2img`,W.useRef(gradioApp().querySelector(n)));var n;const r=W.useRef(null);return a8(r,`div#${e}2img_extra_tabs`),a8(t,"div.tabitem.gradio-tabitem",{id:`${e}2img_render`,onSuccess:()=>{(e=>{const t=document.querySelectorAll(`#${e}2img_extra_tabs > .tab-nav > button`)[1];null==t||t.click();const n=Array.from(document.querySelectorAll(`#${e}2img_extra_tabs button.search-all`));for(const r of n)r.click()})(e)},parent:`div#${e}2img_extra_tabs`}),r},Ure=W.memo((()=>{const e=Wre("txt"),t=Wre("img"),n=hne(dne,m5),r=hne(fne),[o,i]=W.useState(n.extraNetworkCardSize||86),{styles:a}=Ire({size:o}),{isLoading:l}=(({onStart:e,onSuccess:t,debug:n,timeout:r=500}={})=>{const[o,i]=W.useState(!0),a=W.useRef(!1);return W.useEffect((()=>{if(a.current)return;let o;if(null==e||e(),document.querySelector("#tab_civitai_helper")&&document.querySelector("#txt2img_extra_refresh"))try{o=setTimeout((()=>{Hre("txt"),Hre("img"),Bre()}),r)}catch(l){i(!1),n&&fe.success(`🤯 ${n}`,l)}return null==t||t(),a.current=!0,i(!1),n&&fe.success(`🤯 ${n}`),()=>{o&&clearTimeout(o)}}),[]),{isLoading:o}})({debug:"[layout] inject - ExtraNetworkSidebar"});return Z.jsxs(Z.Fragment,{children:[Z.jsxs(o5,{className:a.body,children:[l&&Z.jsx(wF,{active:!0}),Z.jsxs("div",{style:l?{display:"none"}:{},children:[Z.jsx("div",{id:"txt2img-extra-network-sidebar",ref:e,style:"tab_img2img"===r?{display:"none"}:{}}),Z.jsx("div",{id:"img2img-extra-network-sidebar",ref:t,style:"tab_img2img"===r?{}:{display:"none"}})]})]}),Z.jsxs(u5,{children:[Z.jsx(sW,{icon:n.extraNetworkCardSizei(n.extraNetworkCardSize),size:{blockSize:24,fontSize:16}}),Z.jsx(hB,{defaultValue:o,max:256,min:64,onChange:i,step:8,style:{flex:1},value:o})]})]})})),qre=W.memo((({headerHeight:e})=>{const{mobile:t}=tH(),n=hne(dne,m5),[r,o]=W.useState(!t&&n.extraNetworkSidebarExpand),[i,a]=W.useState("fixed"===n.extraNetworkFixedMode),{styles:l,theme:s}=Ire({headerHeight:e}),{t:c}=T7();W.useEffect((()=>{t&&o(!1)}),[t]);const u=t||i?"fixed":"float";return Z.jsx(NQ,{defaultSize:{width:n.extraNetworkSidebarWidth},expand:r,minWidth:n.extraNetworkSidebarWidth,mode:u,onExpandChange:o,pin:i,placement:"right",children:Z.jsx(k4,{children:Z.jsxs(l5,{className:l.container,style:"float"===u?{background:s.colorBgContainer,minWidth:n.extraNetworkSidebarWidth}:{minWidth:n.extraNetworkSidebarWidth},children:[Z.jsx(h5,{pin:i,position:"right",setExpand:o,setPin:a,title:c("sidebar.extraNetwork")}),Z.jsx(Ure,{})]})})})})),Vre=[{description:"AUTOMATIC111",openExternal:!0,title:"Stable Diffusion Webui",url:"https://github.com/AUTOMATIC1111/stable-diffusion-webui"},{description:"WebUI extension",openExternal:!0,title:"Controlnet",url:"https://github.com/Mikubill/sd-webui-controlnet"},{description:"Art models",openExternal:!0,title:"Civitai",url:"https://civitai.com/"},{description:"Artist Inspired Styles",openExternal:!0,title:"Cheat Sheet",url:"https://supagruen.github.io/StableDiffusion-CheatSheet"},{description:"Image Resizing",openExternal:!0,title:"Birme",url:"https://www.birme.net/?target_width=512&target_height=512"}],Gre=[{icon:Z.jsx(WH,{icon:qd,size:"small"}),openExternal:!0,title:"Sponsor",url:"https://opencollective.com/lobehub"},{icon:Z.jsx(WH,{icon:Td,size:"small"}),openExternal:!0,title:"Report Bug",url:`${Zte}/issues/new/choose`},{icon:Z.jsx(WH,{icon:Wd,size:"small"}),openExternal:!0,title:"Request Feature",url:`${Zte}/issues/new/choose`}],Xre=[{icon:Z.jsx(WH,{icon:Ud,size:"small"}),openExternal:!0,title:"GitHub",url:Zte},{icon:Z.jsx(WH,{icon:Bd,size:"small"}),openExternal:!0,title:"Changelog",url:`${Zte}/blob/main/CHANGELOG.md`}],Kre=[{description:"Stable Diffusion Extension",openExternal:!0,title:"🤯 Lobe Theme",url:"https://github.com/lobehub/sd-webui-lobe-theme"},{description:"Minifier ExtraNetwrok Covers",openExternal:!0,title:"✂️ Cover Minifier",url:"https://github.com/canisminor1990/sd-webui-cover-minifier"},{description:"OpenAI Chat Bot",openExternal:!0,title:"🤖 Lobe Chat",url:"https://chat.lobehub.com"},{description:"AIGC Components",openExternal:!0,title:"🍭 Lobe UI",url:"https://ui.lobehub.com"},{description:"I18n AI Workflow",openExternal:!0,title:"🌐 Lobe i18n",url:"https://github.com/lobehub/lobe-cli-toolbox"}],Yre=jH((({css:e})=>({footer:e` footer { display: block !important; } diff --git a/src/features/ExtraNetworkSidebar/refreshExtraNetwork.ts b/src/features/ExtraNetworkSidebar/refreshExtraNetwork.ts index f5363b5..00f5427 100644 --- a/src/features/ExtraNetworkSidebar/refreshExtraNetwork.ts +++ b/src/features/ExtraNetworkSidebar/refreshExtraNetwork.ts @@ -3,4 +3,10 @@ export const refreshExtraNetwork = (type: 'txt' | 'img') => { `#${type}2img_extra_tabs > .tab-nav > button`, )[1] as HTMLButtonElement; extraNetworkButton?.click(); + + const searchAll = Array.from( + document.querySelectorAll(`#${type}2img_extra_tabs button.search-all`), + ) as HTMLButtonElement[]; + + for (const e of searchAll) e.click(); }; diff --git a/src/features/ExtraNetworkSidebar/style.ts b/src/features/ExtraNetworkSidebar/style.ts index 4ecf04f..4dfe62c 100644 --- a/src/features/ExtraNetworkSidebar/style.ts +++ b/src/features/ExtraNetworkSidebar/style.ts @@ -56,6 +56,14 @@ export const useStyles = createStyles( } .extra-networks { + .pending { + opacity: 1 !important; + } + + .wrap.center.full.translucent { + display: none !important; + } + .tab-nav { align-items: center; diff --git a/src/features/ExtraNetworkSidebar/useCivitaiHelperFix.ts b/src/features/ExtraNetworkSidebar/useCivitaiHelperFix.ts index b462786..3bc0d0c 100644 --- a/src/features/ExtraNetworkSidebar/useCivitaiHelperFix.ts +++ b/src/features/ExtraNetworkSidebar/useCivitaiHelperFix.ts @@ -52,6 +52,7 @@ export const useCivitaiHelperFix = ({ onSuccess?.(); isInject.current = true; + setIsLoading(false); if (debug) consola.success(`🤯 ${debug}`);