cleanup code in pr #75

JS formatting, fix the visibility toggle to make slightly more sense, reinstate a few standardized labels
This commit is contained in:
Alex "mcmonkey" Goodwin
2023-10-09 15:11:23 -07:00
parent ecdac7f22a
commit 223c0f7352
2 changed files with 62 additions and 72 deletions
+46 -56
View File
@@ -1,63 +1,53 @@
(function(){ (function(){
var accordions = {}; let accordions = {};
var enabled = {}; let enabled = {};
onUiUpdate(() => { onUiUpdate(() => {
var accordion_id_prefix = "#dynthres_"; let accordion_id_prefix = "#dynthres_";
var extension_checkbox_class = ".dynthres-enabled"; let extension_checkbox_class = ".dynthres-enabled";
function triggerEvent(element, eventName) { function attachEnabledButtonListener(checkbox, accordion) {
var event = document.createEvent("HTMLEvents"); let span = accordion.querySelector('.label-wrap span');
event.initEvent(eventName, false, true); let badge = document.createElement('input');
element.dispatchEvent(event); badge.type = "checkbox";
} badge.checked = checkbox.checked;
badge.addEventListener('click', (e) => {
checkbox.checked = !checkbox.checked;
checkbox.dispatchEvent(new Event('change'));
e.stopPropagation();
});
function updateActiveState(checkbox, accordion) { badge.className = checkbox.className;
// change checkbox state badge.classList.add('primary');
const badge = accordion.querySelector('.label-wrap span input'); span.insertBefore(badge, span.firstChild);
badge.checked = checkbox.checked; let space = document.createElement('span');
} space.innerHTML = " ";
span.insertBefore(space, badge.nextSibling);
function attachEnabledButtonListener(checkbox, accordion) { checkbox.addEventListener('click', () => {
// add checkbox let badge = accordion.querySelector('.label-wrap span input');
const span = accordion.querySelector('.label-wrap span'); badge.checked = checkbox.checked;
const badge = document.createElement('input'); });
badge.type = "checkbox"; checkbox.parentNode.style.display = "none";
badge.checked = checkbox.checked; }
badge.addEventListener('click', (e) => {
checkbox.checked = !checkbox.checked;
triggerEvent(checkbox, 'change');
e.stopPropagation();
});
badge.className = checkbox.className; if (Object.keys(accordions).length < 2) {
badge.classList.add('primary'); let accordion = gradioApp().querySelector(accordion_id_prefix + 'txt2img');
span.insertBefore(badge, span.firstChild); if (accordion) {
var space = document.createElement('span'); accordions.txt2img = accordion;
space.innerHTML = "&nbsp;"; }
span.insertBefore(space, badge.nextSibling); accordion = gradioApp().querySelector(accordion_id_prefix + 'img2img');
if (accordion) {
accordions.img2img = accordion;
}
}
checkbox.addEventListener('click', () => { if (Object.keys(accordions).length > 0 && accordions.txt2img && !enabled.txt2img) {
updateActiveState(checkbox, accordion); enabled.txt2img = accordions.txt2img.querySelector(extension_checkbox_class + ' input');
}); attachEnabledButtonListener(enabled.txt2img, accordions.txt2img);
checkbox.parentNode.style.display = "none"; }
} if (Object.keys(accordions).length > 0 && accordions.img2img && !enabled.img2img) {
enabled.img2img = accordions.img2img.querySelector(extension_checkbox_class + ' input');
if (Object.keys(accordions).length < 2) { attachEnabledButtonListener(enabled.img2img, accordions.img2img);
var accordion = gradioApp().querySelector(accordion_id_prefix + 'txt2img'); }
if (accordion) });
accordions.txt2img = accordion;
accordion = gradioApp().querySelector(accordion_id_prefix + 'img2img');
if (accordion)
accordions.img2img = accordion;
}
if (Object.keys(accordions).length > 0 && accordions.txt2img && !enabled.txt2img) {
enabled.txt2img = accordions.txt2img.querySelector(extension_checkbox_class + ' input');
attachEnabledButtonListener(enabled.txt2img, accordions.txt2img);
}
if (Object.keys(accordions).length > 0 && accordions.img2img && !enabled.img2img) {
enabled.img2img = accordions.img2img.querySelector(extension_checkbox_class + ' input');
attachEnabledButtonListener(enabled.img2img, accordions.img2img);
}
});
})(); })();
+16 -16
View File
@@ -44,24 +44,24 @@ class Script(scripts.Script):
# "Dynamic Thresholding (CFG Scale Fix)" # "Dynamic Thresholding (CFG Scale Fix)"
with gr.Accordion("Dynamic Thresholding (CFG Scale Fix)", open=False, elem_id="dynthres_" + ("img2img" if is_img2img else "txt2img")): with gr.Accordion("Dynamic Thresholding (CFG Scale Fix)", open=False, elem_id="dynthres_" + ("img2img" if is_img2img else "txt2img")):
with gr.Row(): with gr.Row():
enabled = gr.Checkbox(value=False, label="Dynamic Thresholding Enable", elem_classes=["dynthres-enabled"]) enabled = gr.Checkbox(value=False, label="Enable Dynamic Thresholding (CFG Scale Fix)", elem_classes=["dynthres-enabled"])
gr.HTML(value=f"View <a style=\"border-bottom: 1px #00ffff dotted;\" href=\"https://github.com/mcmonkeyprojects/sd-dynamic-thresholding/wiki/Usage-Tips\">the wiki for usage tips.</a><br><br>", elem_id='dynthres_wiki_link')
with gr.Group(visible=False) as accordion: with gr.Group(visible=False) as accordion:
gr.HTML(value=f"View <a style=\"border-bottom: 1px #00ffff dotted;\" href=\"https://github.com/mcmonkeyprojects/sd-dynamic-thresholding/wiki/Usage-Tips\">the wiki for usage tips.</a><br><br>", elem_id='dynthres_wiki_link')
mimic_scale = gr.Slider(minimum=1.0, maximum=30.0, step=0.5, label='Mimic CFG Scale', value=7.0, elem_id='dynthres_mimic_scale') mimic_scale = gr.Slider(minimum=1.0, maximum=30.0, step=0.5, label='Mimic CFG Scale', value=7.0, elem_id='dynthres_mimic_scale')
with gr.Accordion("Advanced Options", open=False, elem_id='dynthres_advanced_opts'): with gr.Accordion("Advanced Options", open=False, elem_id='dynthres_advanced_opts'):
with gr.Row(): with gr.Row():
threshold_percentile = gr.Slider(minimum=90.0, value=100.0, maximum=100.0, step=0.05, label='Top percentile of latents to clamp', elem_id='dynthres_threshold_percentile') threshold_percentile = gr.Slider(minimum=90.0, value=100.0, maximum=100.0, step=0.05, label='Top percentile of latents to clamp', elem_id='dynthres_threshold_percentile')
interpolate_phi = gr.Slider(minimum=0.0, maximum=1.0, step=0.01, label="Interpolate Phi", value=1.0, elem_id='dynthres_interpolate_phi') interpolate_phi = gr.Slider(minimum=0.0, maximum=1.0, step=0.01, label="Interpolate Phi", value=1.0, elem_id='dynthres_interpolate_phi')
with gr.Row(): with gr.Row():
mimic_mode = gr.Dropdown(dynthres_core.DynThresh.Modes, value="Constant", label="Mimic Scale Scheduler", elem_id='dynthres_mimic_mode') mimic_mode = gr.Dropdown(dynthres_core.DynThresh.Modes, value="Constant", label="Mimic Scale Scheduler", elem_id='dynthres_mimic_mode')
cfg_mode = gr.Dropdown(dynthres_core.DynThresh.Modes, value="Constant", label="CFG Scale Scheduler", elem_id='dynthres_cfg_mode') cfg_mode = gr.Dropdown(dynthres_core.DynThresh.Modes, value="Constant", label="CFG Scale Scheduler", elem_id='dynthres_cfg_mode')
mimic_scale_min = gr.Slider(minimum=0.0, maximum=30.0, step=0.5, visible=False, label="Minimum value of the Mimic Scale Scheduler", elem_id='dynthres_mimic_scale_min') mimic_scale_min = gr.Slider(minimum=0.0, maximum=30.0, step=0.5, visible=False, label="Minimum value of the Mimic Scale Scheduler", elem_id='dynthres_mimic_scale_min')
cfg_scale_min = gr.Slider(minimum=0.0, maximum=30.0, step=0.5, visible=False, label="Minimum value of the CFG Scale Scheduler", elem_id='dynthres_cfg_scale_min') cfg_scale_min = gr.Slider(minimum=0.0, maximum=30.0, step=0.5, visible=False, label="Minimum value of the CFG Scale Scheduler", elem_id='dynthres_cfg_scale_min')
sched_val = gr.Slider(minimum=0.0, maximum=40.0, step=0.5, value=4.0, visible=False, label="Scheduler Value", info="Value unique to the scheduler mode - for Power Up/Down, this is the power. For Linear/Cosine Repeating, this is the number of repeats per image.", elem_id='dynthres_sched_val') sched_val = gr.Slider(minimum=0.0, maximum=40.0, step=0.5, value=4.0, visible=False, label="Scheduler Value", info="Value unique to the scheduler mode - for Power Up/Down, this is the power. For Linear/Cosine Repeating, this is the number of repeats per image.", elem_id='dynthres_sched_val')
with gr.Row(): with gr.Row():
separate_feature_channels = gr.Checkbox(value=True, label="Separate Feature Channels", elem_id='dynthres_separate_feature_channels') separate_feature_channels = gr.Checkbox(value=True, label="Separate Feature Channels", elem_id='dynthres_separate_feature_channels')
scaling_startpoint = gr.Radio(["ZERO", "MEAN"], value="MEAN", label="Scaling Startpoint") scaling_startpoint = gr.Radio(["ZERO", "MEAN"], value="MEAN", label="Scaling Startpoint")
variability_measure = gr.Radio(["STD", "AD"], value="AD", label="Variability Measure") variability_measure = gr.Radio(["STD", "AD"], value="AD", label="Variability Measure")
def shouldShowSchedulerValue(cfgMode, mimicMode): def shouldShowSchedulerValue(cfgMode, mimicMode):
sched_vis = cfgMode in MODES_WITH_VALUE or mimicMode in MODES_WITH_VALUE sched_vis = cfgMode in MODES_WITH_VALUE or mimicMode in MODES_WITH_VALUE
return vis_change(sched_vis), vis_change(mimicMode != "Constant"), vis_change(cfgMode != "Constant") return vis_change(sched_vis), vis_change(mimicMode != "Constant"), vis_change(cfgMode != "Constant")