Skip to content

Commit

Permalink
relocate tool buttons next to generate button
Browse files Browse the repository at this point in the history 
prevent extra network tabs from putting images into wrong prompts
prevent settings leaking into prompt
  • Loading branch information
@AUTOMATIC1111
AUTOMATIC1111 committed Jan 21, 2023
1 parent 6d805b6 commit 184e23e
Show file tree
Hide file tree
Showing 5 changed files with 44 additions and 56 deletions.
2 changes: 1 addition & 1 deletion html/extra-networks-card.html
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
<div class='card' {preview_html} onclick='return cardClicked({prompt}, {allow_negative_prompt})'>
<div class='card' {preview_html} onclick='return cardClicked({tabname}, {prompt}, {allow_negative_prompt})'>
<div class='actions'>
<div class='additional'>
<ul>
Expand Down
33 changes: 13 additions & 20 deletions javascript/extraNetworks.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,49 +6,42 @@ function setupExtraNetworksForTab(tabname){
gradioApp().querySelector('#'+tabname+'_extra_tabs > div').appendChild(gradioApp().getElementById(tabname+'_extra_close'))
}

var activePromptTextarea = null;
var activePositivePromptTextarea = null;
var activePromptTextarea = {};

function setupExtraNetworks(){
setupExtraNetworksForTab('txt2img')
setupExtraNetworksForTab('img2img')

function registerPrompt(id, isNegative){
function registerPrompt(tabname, id){
var textarea = gradioApp().querySelector("#" + id + " > label > textarea");

if (activePromptTextarea == null){
activePromptTextarea = textarea
}
if (activePositivePromptTextarea == null && ! isNegative){
activePositivePromptTextarea = textarea
if (! activePromptTextarea[tabname]){
activePromptTextarea[tabname] = textarea
}

textarea.addEventListener("focus", function(){
activePromptTextarea = textarea;
if(! isNegative) activePositivePromptTextarea = textarea;
activePromptTextarea[tabname] = textarea;
});
}

registerPrompt('txt2img_prompt')
registerPrompt('txt2img_neg_prompt', true)
registerPrompt('img2img_prompt')
registerPrompt('img2img_neg_prompt', true)
registerPrompt('txt2img', 'txt2img_prompt')
registerPrompt('txt2img', 'txt2img_neg_prompt')
registerPrompt('img2img', 'img2img_prompt')
registerPrompt('img2img', 'img2img_neg_prompt')
}

onUiLoaded(setupExtraNetworks)

function cardClicked(textToAdd, allowNegativePrompt){
textarea = allowNegativePrompt ? activePromptTextarea : activePositivePromptTextarea
function cardClicked(tabname, textToAdd, allowNegativePrompt){
var textarea = allowNegativePrompt ? activePromptTextarea[tabname] : gradioApp().querySelector("#" + tabname + "_prompt > label > textarea")

textarea.value = textarea.value + " " + textToAdd
updateInput(textarea)

return false
}

function saveCardPreview(event, tabname, filename){
textarea = gradioApp().querySelector("#" + tabname + '_preview_filename > label > textarea')
button = gradioApp().getElementById(tabname + '_save_preview')
var textarea = gradioApp().querySelector("#" + tabname + '_preview_filename > label > textarea')
var button = gradioApp().getElementById(tabname + '_save_preview')

textarea.value = filename
updateInput(textarea)
Expand Down
4 changes: 2 additions & 2 deletions javascript/ui.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -203,8 +203,8 @@ onUiUpdate(function(){
json_elem = gradioApp().getElementById('settings_json')
if(json_elem == null) return;

textarea = json_elem.querySelector('textarea')
jsdata = textarea.value
var textarea = json_elem.querySelector('textarea')
var jsdata = textarea.value
opts = JSON.parse(jsdata)
executeCallbacks(optionsChangedCallbacks);

Expand Down
43 changes: 21 additions & 22 deletions modules/ui.py
View file
Original file line number Diff line number Diff line change
Expand Up @@ -349,38 +349,21 @@ def create_toprow(is_img2img):
with gr.Row():
with gr.Column(scale=80):
with gr.Row():
prompt = gr.Textbox(label="Prompt", elem_id=f"{id_part}_prompt", show_label=False, lines=2, placeholder="Prompt (press Ctrl+Enter or Alt+Enter to generate)")
prompt = gr.Textbox(label="Prompt", elem_id=f"{id_part}_prompt", show_label=False, lines=3, placeholder="Prompt (press Ctrl+Enter or Alt+Enter to generate)")

with gr.Row():
with gr.Column(scale=80):
with gr.Row():
negative_prompt = gr.Textbox(label="Negative prompt", elem_id=f"{id_part}_neg_prompt", show_label=False, lines=2, placeholder="Negative prompt (press Ctrl+Enter or Alt+Enter to generate)")

with gr.Column(scale=1, elem_id="roll_col"):
paste = ToolButton(value=paste_symbol, elem_id="paste")
clear_prompt_button = ToolButton(value=clear_prompt_symbol, elem_id=f"{id_part}_clear_prompt")
extra_networks_button = ToolButton(value=extra_networks_symbol, elem_id=f"{id_part}_extra_networks")

token_counter = gr.HTML(value="<span></span>", elem_id=f"{id_part}_token_counter")
token_button = gr.Button(visible=False, elem_id=f"{id_part}_token_button")
negative_token_counter = gr.HTML(value="<span></span>", elem_id=f"{id_part}_negative_token_counter")
negative_token_button = gr.Button(visible=False, elem_id=f"{id_part}_negative_token_button")

clear_prompt_button.click(
fn=lambda *x: x,
_js="confirm_clear_prompt",
inputs=[prompt, negative_prompt],
outputs=[prompt, negative_prompt],
)

button_interrogate = None
button_deepbooru = None
if is_img2img:
with gr.Column(scale=1, elem_id="interrogate_col"):
button_interrogate = gr.Button('Interrogate\nCLIP', elem_id="interrogate")
button_deepbooru = gr.Button('Interrogate\nDeepBooru', elem_id="deepbooru")

with gr.Column(scale=1):
with gr.Column(scale=1, elem_id=f"{id_part}_actions_column"):
with gr.Row(elem_id=f"{id_part}_generate_box"):
interrupt = gr.Button('Interrupt', elem_id=f"{id_part}_interrupt")
skip = gr.Button('Skip', elem_id=f"{id_part}_skip")
Expand All @@ -398,13 +381,29 @@ def create_toprow(is_img2img):
outputs=[],
)

with gr.Row(elem_id=f"{id_part}_tools"):
paste = ToolButton(value=paste_symbol, elem_id="paste")
clear_prompt_button = ToolButton(value=clear_prompt_symbol, elem_id=f"{id_part}_clear_prompt")
extra_networks_button = ToolButton(value=extra_networks_symbol, elem_id=f"{id_part}_extra_networks")
prompt_style_apply = ToolButton(value=apply_style_symbol, elem_id=f"{id_part}_style_apply")
save_style = ToolButton(value=save_style_symbol, elem_id=f"{id_part}_style_create")

token_counter = gr.HTML(value="<span></span>", elem_id=f"{id_part}_token_counter")
token_button = gr.Button(visible=False, elem_id=f"{id_part}_token_button")
negative_token_counter = gr.HTML(value="<span></span>", elem_id=f"{id_part}_negative_token_counter")
negative_token_button = gr.Button(visible=False, elem_id=f"{id_part}_negative_token_button")

clear_prompt_button.click(
fn=lambda *x: x,
_js="confirm_clear_prompt",
inputs=[prompt, negative_prompt],
outputs=[prompt, negative_prompt],
)

with gr.Row(elem_id=f"{id_part}_styles_row"):
prompt_styles = gr.Dropdown(label="Styles", elem_id=f"{id_part}_styles", choices=[k for k, v in shared.prompt_styles.styles.items()], value=[], multiselect=True)
create_refresh_button(prompt_styles, shared.prompt_styles.reload, lambda: {"choices": [k for k, v in shared.prompt_styles.styles.items()]}, f"refresh_{id_part}_styles")

prompt_style_apply = ToolButton(value=apply_style_symbol, elem_id="style_apply")
save_style = ToolButton(value=save_style_symbol, elem_id="style_create")

return prompt, prompt_styles, negative_prompt, submit, button_interrogate, button_deepbooru, prompt_style_apply, save_style, paste, extra_networks_button, token_counter, token_button, negative_token_counter, negative_token_button


Expand Down
18 changes: 7 additions & 11 deletions style.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -124,15 +124,12 @@
height: 100%;
}

#roll_col{
min-width: unset !important;
flex-grow: 0 !important;
padding: 0 1em 0 0;
#txt2img_actions_column, #img2img_actions_column{
gap: 0;
}

#roll_col > button {
margin: 0.1em 0;
#txt2img_tools, #img2img_tools{
gap: 0.4em;
}

#interrogate_col{
Expand All @@ -153,7 +150,6 @@

#txt2img_styles_row, #img2img_styles_row{
gap: 0.25em;
margin-top: 0.5em;
}

#txt2img_styles_row > button, #img2img_styles_row > button{
Expand All @@ -164,6 +160,10 @@
padding: 0;
}

#txt2img_styles > label > div, #img2img_styles > label > div{
min-height: 3.2em;
}

#txt2img_styles ul, #img2img_styles ul{
max-height: 35em;
z-index: 2000;
Expand Down Expand Up @@ -770,10 +770,6 @@ footer {
line-height: 2.4em;
}

#txt2img_extra_networks, #img2img_extra_networks{
margin-top: -1em;
}

.extra-networks > div > [id *= '_extra_']{
margin: 0.3em;
}
Expand Down

0 comments on commit 184e23e

Please sign in to comment.