Commit 184e23eb authored by AUTOMATIC's avatar AUTOMATIC
Browse files

relocate tool buttons next to generate button 

prevent extra network tabs from putting images into wrong prompts
prevent settings leaking into prompt
parent 6d805b66

html/extra-networks-card.html

+1 −1
Original line number Diff line number Diff line 
<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>

javascript/extraNetworks.js

+13 −20
Original line number Diff line number Diff line
@@ -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)

javascript/ui.js

+2 −2
Original line number Diff line number Diff line
@@ -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);

modules/ui.py

+21 −22
Original line number Diff line number Diff line
@@ -349,30 +349,13 @@ 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:
@@ -380,7 +363,7 @@ def create_toprow(is_img2img): 
                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")
@@ -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

style.css

+7 −11
Original line number Diff line number Diff line
@@ -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{
@@ -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{
@@ -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;
@@ -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;

}

CRA Git | Maintained and supported by SUSTech CRA and CCSE