Merge branch 'master' of https://github.com/AbdullahAlfaraj/Auto-Photoshop-StableDiffusion-Plugin into silent_mode_resolve
Abdullah Alfaraj
commit
75e191549a
293
index.html
293
index.html
|
|
@ -824,111 +824,210 @@
|
|||
<!-- </div> -->
|
||||
</div>
|
||||
<div class="sp-tab-page" id="sp-control_net-tab-page">
|
||||
<!-- Horde tab page -->
|
||||
<!-- control net tab page -->
|
||||
<div></div>
|
||||
<div style="display: flex">
|
||||
<div
|
||||
id="control_net_image_container"
|
||||
class="imgContainer controlNetImaageContainer"
|
||||
>
|
||||
<!-- <button class="column-item button-style" id="btnSnapAndFill">Snap And Fill</button> -->
|
||||
|
||||
<div>
|
||||
<img
|
||||
id="control_net_image"
|
||||
class="column-item-image"
|
||||
src="https://source.unsplash.com/random"
|
||||
width="300px"
|
||||
height="100px"
|
||||
/>
|
||||
<div id="controlnet_settings_0" style="display: none">
|
||||
<div class="flexContainer">
|
||||
<sp-label slot="label">Control Net Settings Slot 0</sp-label>
|
||||
</div>
|
||||
<div style="display: flex">
|
||||
<div id="control_net_image_container_0" class="imgContainer controlNetImaageContainer">
|
||||
<!-- <button class="column-item button-style" id="btnSnapAndFill">Snap And Fill</button> -->
|
||||
|
||||
<div>
|
||||
<img id="control_net_image_0" class="column-item-image" src="https://source.unsplash.com/random"
|
||||
width="300px" height="100px" />
|
||||
</div>
|
||||
<div class="imgButton">
|
||||
<button class="column-item button-style btnSquare" id="bSetControlImage_0">
|
||||
Set CtrlNet Img
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="imgButton">
|
||||
<button
|
||||
class="column-item button-style btnSquare"
|
||||
id="bSetControlImage"
|
||||
>
|
||||
Set CtrlNet Img
|
||||
</button>
|
||||
<div id="control_net_mask_container_0" class="imgContainer controlNetImaageContainer">
|
||||
<!-- <button class="column-item button-style" id="btnSnapAndFill">Snap And Fill</button> -->
|
||||
|
||||
<div>
|
||||
<img id="control_net_mask_0" class="column-item-image" src="https://source.unsplash.com/random"
|
||||
width="300px" height="100px" />
|
||||
</div>
|
||||
<div class="imgButton btnClass">
|
||||
<button class="column-item button-style btnSquare" id="bControlMask_0">
|
||||
View Mask
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
id="control_net_mask_container"
|
||||
class="imgContainer controlNetImaageContainer"
|
||||
>
|
||||
<!-- <button class="column-item button-style" id="btnSnapAndFill">Snap And Fill</button> -->
|
||||
|
||||
<div>
|
||||
<img
|
||||
id="control_net_mask"
|
||||
class="column-item-image"
|
||||
src="https://source.unsplash.com/random"
|
||||
width="300px"
|
||||
height="100px"
|
||||
/>
|
||||
</div>
|
||||
<div class="imgButton btnClass">
|
||||
<button
|
||||
class="column-item button-style btnSquare"
|
||||
id="bControlMask"
|
||||
>
|
||||
View Mask
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<sp-checkbox id="chEnableControlNet">Enable</sp-checkbox>
|
||||
<sp-checkbox checked id="chlowVram">Low VRAM</sp-checkbox>
|
||||
<sp-checkbox id="chGuessMode">Guess Mode</sp-checkbox>
|
||||
|
||||
<div>
|
||||
|
||||
<sp-checkbox id="chEnableControlNet_0">Enable</sp-checkbox>
|
||||
<sp-checkbox checked id="chlowVram_0">Low VRAM</sp-checkbox>
|
||||
<sp-checkbox id="chGuessMode_0">Guess Mode</sp-checkbox>
|
||||
|
||||
<div>
|
||||
<sp-slider
|
||||
show-value="false"
|
||||
id="slControlNetWeight"
|
||||
min="0"
|
||||
max="100"
|
||||
value="50"
|
||||
title="2 will keep the composition; 0 will allow composition to change"
|
||||
>
|
||||
<sp-label slot="label">Weight:</sp-label>
|
||||
<sp-label slot="label" id="lControlNetWeight"
|
||||
>1.0</sp-label
|
||||
>
|
||||
</sp-slider>
|
||||
<sp-slider
|
||||
show-value="false"
|
||||
id="slControlNetGuidanceStrength"
|
||||
min="0"
|
||||
max="100"
|
||||
value="100"
|
||||
>
|
||||
<sp-label slot="label">Guidance strength:</sp-label>
|
||||
<sp-label
|
||||
slot="label"
|
||||
id="lControlNetGuidanceStrength"
|
||||
>1.0</sp-label
|
||||
>
|
||||
</sp-slider>
|
||||
<div>
|
||||
<sp-slider show-value="false" id="slControlNetWeight_0" min="0" max="100" value="50"
|
||||
title="2 will keep the composition; 0 will allow composition to change">
|
||||
<sp-label slot="label">Weight:</sp-label>
|
||||
<sp-label slot="label" id="lControlNetWeight_0">1.0</sp-label>
|
||||
</sp-slider>
|
||||
<sp-slider show-value="false" id="slControlNetGuidanceStrength_0" min="0" max="100" value="100">
|
||||
<sp-label slot="label">Guidance strength:</sp-label>
|
||||
<sp-label slot="label" id="lControlNetGuidanceStrength_0">1.0</sp-label>
|
||||
</sp-slider>
|
||||
</div>
|
||||
</div>
|
||||
<div id="menu-bar-control_net_0" style="display: flex">
|
||||
<sp-picker size="m" label="Selection type">
|
||||
<sp-menu id="mModuleMenuControlNet_0" slot="options">
|
||||
<!-- <sp-menu-item> item </sp-menu-item> -->
|
||||
</sp-menu>
|
||||
</sp-picker>
|
||||
<sp-picker size="m" label="Selection type">
|
||||
<sp-menu id="mModelsMenuControlNet_0" slot="options">
|
||||
<!-- <sp-menu-item> item </sp-menu-item> -->
|
||||
</sp-menu>
|
||||
</sp-picker>
|
||||
|
||||
<!-- <button class="btnSquare" id="btnRefreshModelsHorde">
|
||||
Refresh Models
|
||||
</button> -->
|
||||
</div>
|
||||
</div>
|
||||
<div id="menu-bar-control_net" style="display: flex">
|
||||
<sp-picker size="m" label="Selection type">
|
||||
<sp-menu id="mModuleMenuControlNet" slot="options">
|
||||
<!-- <sp-menu-item> item </sp-menu-item> -->
|
||||
</sp-menu>
|
||||
</sp-picker>
|
||||
<sp-picker size="m" label="Selection type">
|
||||
<sp-menu id="mModelsMenuControlNet" slot="options">
|
||||
<!-- <sp-menu-item> item </sp-menu-item> -->
|
||||
</sp-menu>
|
||||
</sp-picker>
|
||||
|
||||
<!-- <button class="btnSquare" id="btnRefreshModelsHorde">
|
||||
Refresh Models
|
||||
</button> -->
|
||||
<div></div>
|
||||
<div id="controlnet_settings_1" style="display: none">
|
||||
<div class="flexContainer">
|
||||
<sp-label slot="label">Control Net Settings Slot 1</sp-label>
|
||||
</div>
|
||||
<div style="display: flex">
|
||||
<div id="control_net_image_container_1" class="imgContainer controlNetImaageContainer">
|
||||
<!-- <button class="column-item button-style" id="btnSnapAndFill">Snap And Fill</button> -->
|
||||
|
||||
<div>
|
||||
<img id="control_net_image_1" class="column-item-image" src="https://source.unsplash.com/random"
|
||||
width="300px" height="100px" />
|
||||
</div>
|
||||
<div class="imgButton">
|
||||
<button class="column-item button-style btnSquare" id="bSetControlImage_1">
|
||||
Set CtrlNet Img
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div id="control_net_mask_container_1" class="imgContainer controlNetImaageContainer">
|
||||
<!-- <button class="column-item button-style" id="btnSnapAndFill">Snap And Fill</button> -->
|
||||
|
||||
<div>
|
||||
<img id="control_net_mask_1" class="column-item-image" src="https://source.unsplash.com/random"
|
||||
width="300px" height="100px" />
|
||||
</div>
|
||||
<div class="imgButton btnClass">
|
||||
<button class="column-item button-style btnSquare" id="bControlMask_1">
|
||||
View Mask
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<sp-checkbox id="chEnableControlNet_1">Enable</sp-checkbox>
|
||||
<sp-checkbox checked id="chlowVram_1">Low VRAM</sp-checkbox>
|
||||
<sp-checkbox id="chGuessMode_1">Guess Mode</sp-checkbox>
|
||||
|
||||
<div>
|
||||
<div>
|
||||
<sp-slider show-value="false" id="slControlNetWeight_1" min="0" max="100" value="50"
|
||||
title="2 will keep the composition; 0 will allow composition to change">
|
||||
<sp-label slot="label">Weight:</sp-label>
|
||||
<sp-label slot="label" id="lControlNetWeight_1">1.0</sp-label>
|
||||
</sp-slider>
|
||||
<sp-slider show-value="false" id="slControlNetGuidanceStrength_1" min="0" max="100" value="100">
|
||||
<sp-label slot="label">Guidance strength:</sp-label>
|
||||
<sp-label slot="label" id="lControlNetGuidanceStrength_1">1.0</sp-label>
|
||||
</sp-slider>
|
||||
</div>
|
||||
</div>
|
||||
<div id="menu-bar-control_net_1" style="display: flex">
|
||||
<sp-picker size="m" label="Selection type">controlnet_settings_
|
||||
<sp-menu id="mModuleMenuControlNet_1" slot="options">
|
||||
<!-- <sp-menu-item> item </sp-menu-item> -->
|
||||
</sp-menu>
|
||||
</sp-picker>
|
||||
<sp-picker size="m" label="Selection type">
|
||||
<sp-menu id="mModelsMenuControlNet_1" slot="options">
|
||||
<!-- <sp-menu-item> item </sp-menu-item> -->
|
||||
</sp-menu>
|
||||
</sp-picker>
|
||||
|
||||
<!-- <button class="btnSquare" id="btnRefreshModelsHorde">
|
||||
Refresh Models
|
||||
</button> -->
|
||||
</div>
|
||||
<div></div>
|
||||
<div id="controlnet_settings_2" style="display: none">
|
||||
<div class="flexContainer">
|
||||
<sp-label slot="label">Control Net Settings Slot 2</sp-label>
|
||||
</div>
|
||||
<div style="display: flex">
|
||||
<div id="control_net_image_container_2" class="imgContainer controlNetImaageContainer">
|
||||
<!-- <button class="column-item button-style" id="btnSnapAndFill">Snap And Fill</button> -->
|
||||
|
||||
<div>
|
||||
<img id="control_net_image_2" class="column-item-image" src="https://source.unsplash.com/random"
|
||||
width="300px" height="100px" />
|
||||
</div>
|
||||
<div class="imgButton">
|
||||
<button class="column-item button-style btnSquare" id="bSetControlImage_2">
|
||||
Set CtrlNet Img
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div id="control_net_mask_container_2" class="imgContainer controlNetImaageContainer">
|
||||
<!-- <button class="column-item button-style" id="btnSnapAndFill">Snap And Fill</button> -->
|
||||
|
||||
<div>
|
||||
<img id="control_net_mask_2" class="column-item-image" src="https://source.unsplash.com/random"
|
||||
width="300px" height="100px" />
|
||||
</div>
|
||||
<div class="imgButton btnClass">
|
||||
<button class="column-item button-style btnSquare" id="bControlMask_2">
|
||||
View Mask
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<sp-checkbox id="chEnableControlNet_2">Enable</sp-checkbox>
|
||||
<sp-checkbox checked id="chlowVram_2">Low VRAM</sp-checkbox>
|
||||
<sp-checkbox id="chGuessMode_2">Guess Mode</sp-checkbox>
|
||||
|
||||
<div>
|
||||
<div>
|
||||
<sp-slider show-value="false" id="slControlNetWeight_2" min="0" max="100" value="50"
|
||||
title="2 will keep the composition; 0 will allow composition to change">
|
||||
<sp-label slot="label">Weight:</sp-label>
|
||||
<sp-label slot="label" id="lControlNetWeight_2">1.0</sp-label>
|
||||
</sp-slider>
|
||||
<sp-slider show-value="false" id="slControlNetGuidanceStrength_2" min="0" max="100" value="100">
|
||||
<sp-label slot="label">Guidance strength:</sp-label>
|
||||
<sp-label slot="label" id="lControlNetGuidanceStrength_2">1.0</sp-label>
|
||||
</sp-slider>
|
||||
</div>
|
||||
</div>
|
||||
<div id="menu-bar-control_net_2" style="display: flex">
|
||||
<sp-picker size="m" label="Selection type">
|
||||
<sp-menu id="mModuleMenuControlNet_2" slot="options">
|
||||
<!-- <sp-menu-item> item </sp-menu-item> -->
|
||||
</sp-menu>
|
||||
</sp-picker>
|
||||
<sp-picker size="m" label="Selection type">
|
||||
<sp-menu id="mModelsMenuControlNet_2" slot="options">
|
||||
<!-- <sp-menu-item> item </sp-menu-item> -->
|
||||
</sp-menu>
|
||||
</sp-picker>
|
||||
|
||||
<!-- <button class="btnSquare" id="btnRefreshModelsHorde">
|
||||
Refresh Models
|
||||
</button> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sp-tab-page" id="sp-history-tab-page">
|
||||
<div class="subTabOptionsContainer"></div>
|
||||
|
|
|
|||
|
|
@ -578,23 +578,28 @@ async function requestGetUpscalers() {
|
|||
|
||||
async function requestControlNetTxt2Img(plugin_settings) {
|
||||
console.log('requestControlNetTxt2Img: ')
|
||||
// const full_url = 'http://127.0.0.1:8000/swapModel'
|
||||
|
||||
const full_url = `${g_sd_url}/controlnet/txt2img`
|
||||
const control_net_settings =
|
||||
control_net.mapPluginSettingsToControlNet(plugin_settings)
|
||||
if (!control_net_settings['controlnet_input_image'][0]) {
|
||||
app.showAlert('you need to add a valid ControlNet input image')
|
||||
throw 'you need to add a valid ControlNet input image'
|
||||
}
|
||||
let control_networks = 0;
|
||||
for (let index = 0; index < control_net.getControlNetMaxModelsNumber(); index++) {
|
||||
if(!control_net.getEnableControlNet(index))
|
||||
break
|
||||
control_networks++
|
||||
if (!control_net_settings['controlnet_units'][index]['input_image'][0]) {
|
||||
app.showAlert('you need to add a valid ControlNet input image')
|
||||
throw 'you need to add a valid ControlNet input image'
|
||||
}
|
||||
|
||||
if (!control_net_settings['controlnet_module']) {
|
||||
app.showAlert('you need to select a valid ControlNet Module')
|
||||
throw 'you need to select a valid ControlNet Module'
|
||||
}
|
||||
if (!control_net_settings['controlnet_model']) {
|
||||
app.showAlert('you need to select a valid ControlNet Model')
|
||||
throw 'you need to select a valid ControlNet Model'
|
||||
if (!control_net_settings['controlnet_units'][index]['module']) {
|
||||
app.showAlert('you need to select a valid ControlNet Module')
|
||||
throw 'you need to select a valid ControlNet Module'
|
||||
}
|
||||
if (!control_net_settings['controlnet_units'][index]['model']) {
|
||||
app.showAlert('you need to select a valid ControlNet Model')
|
||||
throw 'you need to select a valid ControlNet Model'
|
||||
}
|
||||
}
|
||||
|
||||
let request = await fetch(full_url, {
|
||||
|
|
@ -604,7 +609,6 @@ async function requestControlNetTxt2Img(plugin_settings) {
|
|||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify(control_net_settings),
|
||||
// body: JSON.stringify(payload),
|
||||
})
|
||||
|
||||
let json = await request.json()
|
||||
|
|
@ -612,13 +616,16 @@ async function requestControlNetTxt2Img(plugin_settings) {
|
|||
|
||||
//update the mask in controlNet tab
|
||||
const numOfImages = json['images'].length
|
||||
const base64_mask = json['images'][numOfImages - 1]
|
||||
const base64_mask = json['images'].slice(numOfImages - control_networks)
|
||||
|
||||
html_manip.setControlMaskSrc(base64ToBase64Url(base64_mask))
|
||||
for (let index = 0; index < control_networks; index++) {
|
||||
html_manip.setControlMaskSrc(base64ToBase64Url(base64_mask[index]), index)
|
||||
}
|
||||
|
||||
g_generation_session.controlNetMask = base64_mask
|
||||
const standard_response = await py_re.convertToStandardResponse(
|
||||
control_net_settings,
|
||||
json['images'].slice(0, -1),
|
||||
json['images'].slice(0, numOfImages - control_networks),
|
||||
plugin_settings['uniqueDocumentId']
|
||||
)
|
||||
console.log('standard_response:', standard_response)
|
||||
|
|
@ -634,18 +641,24 @@ async function requestControlNetImg2Img(plugin_settings) {
|
|||
const control_net_settings =
|
||||
control_net.mapPluginSettingsToControlNet(plugin_settings)
|
||||
|
||||
if (!control_net_settings['controlnet_input_image'][0]) {
|
||||
app.showAlert('you need to add a valid ControlNet input image')
|
||||
throw 'you need to add a valid ControlNet input image'
|
||||
}
|
||||
let control_networks = 0;
|
||||
for (let index = 0; index < control_net.getControlNetMaxModelsNumber(); index++) {
|
||||
if(!control_net.getEnableControlNet(index))
|
||||
break
|
||||
control_networks++
|
||||
if (!control_net_settings['controlnet_units'][index]['input_image'][0]) {
|
||||
app.showAlert('you need to add a valid ControlNet input image')
|
||||
throw 'you need to add a valid ControlNet input image'
|
||||
}
|
||||
|
||||
if (!control_net_settings['controlnet_module']) {
|
||||
app.showAlert('you need to select a valid ControlNet Module')
|
||||
throw 'you need to select a valid ControlNet Module'
|
||||
}
|
||||
if (!control_net_settings['controlnet_model']) {
|
||||
app.showAlert('you need to select a valid ControlNet Model')
|
||||
throw 'you need to select a valid ControlNet Model'
|
||||
if (!control_net_settings['controlnet_units'][index]['module']) {
|
||||
app.showAlert('you need to select a valid ControlNet Module')
|
||||
throw 'you need to select a valid ControlNet Module'
|
||||
}
|
||||
if (!control_net_settings['controlnet_units'][index]['model']) {
|
||||
app.showAlert('you need to select a valid ControlNet Model')
|
||||
throw 'you need to select a valid ControlNet Model'
|
||||
}
|
||||
}
|
||||
|
||||
let request = await fetch(full_url, {
|
||||
|
|
@ -663,13 +676,17 @@ async function requestControlNetImg2Img(plugin_settings) {
|
|||
|
||||
//update the mask in controlNet tab
|
||||
const numOfImages = json['images'].length
|
||||
const base64_mask = json['images'][numOfImages - 1]
|
||||
const base64_mask = json['images'].slice(numOfImages - control_networks)
|
||||
|
||||
for (let index = 0; index < control_networks; index++) {
|
||||
html_manip.setControlMaskSrc(base64ToBase64Url(base64_mask[index]), index)
|
||||
}
|
||||
|
||||
g_generation_session.controlNetMask = base64_mask
|
||||
html_manip.setControlMaskSrc(base64ToBase64Url(base64_mask))
|
||||
|
||||
const standard_response = await py_re.convertToStandardResponse(
|
||||
control_net_settings,
|
||||
json['images'].slice(0, -1), //remove the last image, mask image
|
||||
json['images'].slice(0, numOfImages - control_networks),
|
||||
plugin_settings['uniqueDocumentId']
|
||||
)
|
||||
console.log('standard_response:', standard_response)
|
||||
|
|
|
|||
|
|
@ -423,14 +423,14 @@ function setInitImageSrc(image_src) {
|
|||
const ini_image_element = getInitImageElement()
|
||||
ini_image_element.src = image_src
|
||||
}
|
||||
function setControlImageSrc(image_src) {
|
||||
function setControlImageSrc(image_src, element_index = 0) {
|
||||
const control_net_image_element =
|
||||
document.getElementById('control_net_image')
|
||||
document.getElementById('control_net_image'+'_'+element_index)
|
||||
control_net_image_element.src = image_src
|
||||
}
|
||||
function setControlMaskSrc(image_src) {
|
||||
function setControlMaskSrc(image_src, element_index = 0) {
|
||||
const control_net_image_element =
|
||||
document.getElementById('control_net_mask')
|
||||
document.getElementById('control_net_mask'+'_'+element_index)
|
||||
control_net_image_element.src = image_src
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -34,6 +34,27 @@ class SdConfig {
|
|||
console.warn(e)
|
||||
}
|
||||
}
|
||||
|
||||
getControlNetMaxModelsNum() {
|
||||
try {
|
||||
let max_models_num
|
||||
for (let comp of this.config.components) {
|
||||
if (comp?.props?.elem_id) {
|
||||
const elem_id = comp?.props?.elem_id
|
||||
if (elem_id === 'setting_control_net_max_models_num') {
|
||||
console.log('setting_control_net_max_models_num: ', comp?.props?.value)
|
||||
max_models_num = comp?.props?.value
|
||||
break
|
||||
}
|
||||
}
|
||||
}
|
||||
console.log('max_models_num: ', max_models_num)
|
||||
return max_models_num
|
||||
|
||||
} catch (e) {
|
||||
console.warn(e)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
|
|
|
|||
|
|
@ -36,8 +36,8 @@ class GenerationSession {
|
|||
this.image_paths_to_layers = {}
|
||||
this.progress_layer
|
||||
this.last_settings //the last settings been used for generation
|
||||
this.controlNetImage // base64 image
|
||||
this.controlNetMask //base64 image
|
||||
this.controlNetImage = [] // base64 images (one for each control net)
|
||||
this.controlNetMask = [] // base64 images (one for each control net)
|
||||
this.request_status = Enum.RequestStateEnum['Finished'] //finish or ideal state
|
||||
this.is_control_net = false
|
||||
this.control_net_selection_info
|
||||
|
|
@ -201,8 +201,7 @@ class GenerationSession {
|
|||
this.deleteProgressImageHtml()
|
||||
await this.deleteProgressLayer()
|
||||
}
|
||||
async setControlNetImage() {
|
||||
// debugger
|
||||
async setControlNetImage(control_net_index = 0) {
|
||||
//check if the selection area is active
|
||||
//convert layer to base64
|
||||
//the width and height of the exported image
|
||||
|
|
@ -239,8 +238,11 @@ class GenerationSession {
|
|||
|
||||
await layer_util.deleteLayers([layer]) //delete the snapshot layer if it exists
|
||||
|
||||
this.controlNetImage = base64_image
|
||||
html_manip.setControlImageSrc(base64ToBase64Url(base64_image))
|
||||
this.controlNetImage[control_net_index] = base64_image
|
||||
html_manip.setControlImageSrc(
|
||||
base64ToBase64Url(base64_image),
|
||||
control_net_index
|
||||
)
|
||||
// console.log('base64_img:', base64_image)
|
||||
// await io.IO.base64ToLayer(base64_image)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2,6 +2,7 @@ const api = require('../api')
|
|||
const html_manip = require('../html_manip')
|
||||
const selection = require('../../selection')
|
||||
const note = require('../notification')
|
||||
const g_controlnet_max_supported_models = 3
|
||||
|
||||
async function checkIfControlNetInstalled() {}
|
||||
async function requestControlNetModelList() {
|
||||
|
|
@ -45,197 +46,202 @@ async function requestControlNetModuleList() {
|
|||
async function populateModelMenu() {
|
||||
try {
|
||||
const models = await requestControlNetModelList()
|
||||
|
||||
html_manip.populateMenu(
|
||||
'mModelsMenuControlNet',
|
||||
'mModelsMenuItemControlNet',
|
||||
models,
|
||||
(item, item_html_element) => {
|
||||
item_html_element.innerHTML = item
|
||||
}
|
||||
)
|
||||
for (let index = 0; index < g_controlnet_max_supported_models; index++) {
|
||||
html_manip.populateMenu(
|
||||
'mModelsMenuControlNet_' + index,
|
||||
'mModelsMenuItemControlNet_' + index,
|
||||
models,
|
||||
(item, item_html_element) => {
|
||||
item_html_element.innerHTML = item
|
||||
}
|
||||
)
|
||||
}
|
||||
} catch (e) {
|
||||
console.warn(e)
|
||||
}
|
||||
}
|
||||
|
||||
async function populatePreprocessorMenu() {
|
||||
try {
|
||||
const modules = await requestControlNetModuleList()
|
||||
html_manip.populateMenu(
|
||||
'mModuleMenuControlNet',
|
||||
'mModuleMenuItemControlNet',
|
||||
modules,
|
||||
(item, item_html_element) => {
|
||||
item_html_element.innerHTML = item
|
||||
}
|
||||
)
|
||||
for (let index = 0; index < g_controlnet_max_supported_models; index++) {
|
||||
|
||||
html_manip.populateMenu(
|
||||
'mModuleMenuControlNet_' + index,
|
||||
'mModuleMenuItemControlNet_' + index,
|
||||
modules,
|
||||
(item, item_html_element) => {
|
||||
item_html_element.innerHTML = item
|
||||
}
|
||||
)
|
||||
}
|
||||
} catch (e) {
|
||||
console.warn(e)
|
||||
}
|
||||
}
|
||||
async function initializeControlNetTab() {
|
||||
await populateModelMenu()
|
||||
await populatePreprocessorMenu()
|
||||
}
|
||||
async function initializeControlNetTab(controlnet_max_models) {
|
||||
if(controlnet_max_models > g_controlnet_max_supported_models)
|
||||
controlnet_max_models = g_controlnet_max_supported_models
|
||||
|
||||
for (let index = 0; index < controlnet_max_models; index++) {
|
||||
await populateModelMenu(index)
|
||||
await populatePreprocessorMenu(index)
|
||||
document.getElementById('controlnet_settings_' + index).style.display = "block";
|
||||
}
|
||||
|
||||
function getControlNetWeightGuidanceStrength() {
|
||||
|
||||
|
||||
}
|
||||
// controlnet settings getters
|
||||
function getControlNetWeightGuidanceStrength(controlnet_index = 0) {
|
||||
const slider_value = document.getElementById(
|
||||
'slControlNetGuidanceStrength'
|
||||
'slControlNetGuidanceStrength_' + controlnet_index
|
||||
).value
|
||||
const sd_value = general.mapRange(slider_value, 0, 100, 0, 1) // convert slider value to SD ready value
|
||||
return sd_value
|
||||
}
|
||||
|
||||
function getControlNetWeight() {
|
||||
const slider_value = document.getElementById('slControlNetWeight').value
|
||||
function getControlNetWeight(controlnet_index = 0) {
|
||||
const slider_value = document.getElementById('slControlNetWeight_' + controlnet_index).value
|
||||
|
||||
// debugger
|
||||
const sd_value = general.mapRange(slider_value, 0, 100, 0, 2) // convert slider value to SD ready value
|
||||
return sd_value
|
||||
}
|
||||
function getUseLowVram() {
|
||||
const b_result = document.getElementById('chlowVram').checked
|
||||
function getUseLowVram(controlnet_index = 0) {
|
||||
const b_result = document.getElementById('chlowVram_' + controlnet_index).checked
|
||||
return b_result
|
||||
}
|
||||
function getEnableControlNet() {
|
||||
const is_enable = document.getElementById('chEnableControlNet').checked
|
||||
function getEnableControlNet(controlnet_index = 0) {
|
||||
const is_enable = document.getElementById('chEnableControlNet_' + controlnet_index).checked
|
||||
return is_enable
|
||||
}
|
||||
|
||||
function getSelectedModule() {
|
||||
function getSelectedModule(controlnet_index = 0) {
|
||||
const module_name = html_manip.getSelectedMenuItemTextContent(
|
||||
'mModuleMenuControlNet'
|
||||
'mModuleMenuControlNet_' + controlnet_index
|
||||
)
|
||||
|
||||
return module_name
|
||||
}
|
||||
function getSelectedModel() {
|
||||
function getSelectedModel(controlnet_index = 0) {
|
||||
const model_name = html_manip.getSelectedMenuItemTextContent(
|
||||
'mModelsMenuControlNet'
|
||||
'mModelsMenuControlNet_' + controlnet_index
|
||||
)
|
||||
return model_name
|
||||
}
|
||||
function getUseGuessMode() {
|
||||
const is_guess_mode = document.getElementById('chGuessMode').checked
|
||||
function getUseGuessMode(controlnet_index = 0) {
|
||||
const is_guess_mode = document.getElementById('chGuessMode_' + controlnet_index).checked
|
||||
return is_guess_mode
|
||||
}
|
||||
function mapPluginSettingsToControlNet(plugin_settings) {
|
||||
const ps = plugin_settings // for shortness
|
||||
let control_net_payload = {}
|
||||
control_net_payload['control_net_weight'] = getControlNetWeight()
|
||||
control_net_payload['controlnet_guidance'] =
|
||||
getControlNetWeightGuidanceStrength()
|
||||
control_net_payload['controlnet_lowvram'] = getUseLowVram()
|
||||
control_net_payload['controlnet_input_image'] = [
|
||||
g_generation_session.controlNetImage,
|
||||
]
|
||||
|
||||
control_net_payload['controlnet_module'] = getSelectedModule()
|
||||
|
||||
control_net_payload['controlnet_model'] = getSelectedModel()
|
||||
getUseGuessMode()
|
||||
control_net_payload = {
|
||||
...ps, //all plugin settings
|
||||
...control_net_payload, //all control net ui settings
|
||||
// prompt: ps['prompt'],
|
||||
// negative_prompt: ps['negative_prompt'],
|
||||
// controlnet_input_image: [ps['control_net_image']],
|
||||
// controlnet_mask: [],
|
||||
|
||||
// controlnet_module: 'depth',
|
||||
// controlnet_model: 'control_sd15_depth [fef5e48e]',
|
||||
|
||||
// controlnet_weight: parseInt(ps['control_net_weight']),
|
||||
controlnet_resize_mode: 'Scale to Fit (Inner Fit)',
|
||||
// controlnet_lowvram: true,
|
||||
controlnet_processor_res: 512,
|
||||
controlnet_threshold_a: 64,
|
||||
controlnet_threshold_b: 64,
|
||||
// seed: ps['seed'],
|
||||
subseed: -1,
|
||||
// subseed_strength: -1,
|
||||
// subseed_strength: 0,
|
||||
// controlnet_guidance: 1,
|
||||
// sampler_index: ps['sampler_index'],
|
||||
// batch_size: parseInt(ps['batch_size']),
|
||||
// n_iter: 1,
|
||||
// steps: parseInt(ps['steps']),
|
||||
// cfg_scale: ps['cfg_scale'],
|
||||
// width: ps['width'],
|
||||
// height: ps['height'],
|
||||
// restore_faces: ps['restore_faces'],
|
||||
override_settings: {},
|
||||
override_settings_restore_afterwards: true,
|
||||
}
|
||||
if (
|
||||
plugin_settings['mode'] === Enum.generationModeEnum['Img2Img'] ||
|
||||
plugin_settings['mode'] === Enum.generationModeEnum['Inpaint'] ||
|
||||
plugin_settings['mode'] === Enum.generationModeEnum['Outpaint']
|
||||
) {
|
||||
const b_use_guess_mode = getUseGuessMode()
|
||||
control_net_payload = {
|
||||
...control_net_payload,
|
||||
|
||||
guess_mode: b_use_guess_mode,
|
||||
|
||||
include_init_images: true,
|
||||
}
|
||||
}
|
||||
|
||||
return control_net_payload
|
||||
function getControlNetMaxModelsNumber() {
|
||||
return g_controlnet_max_supported_models
|
||||
}
|
||||
|
||||
//event listeners
|
||||
document
|
||||
.getElementById('slControlNetGuidanceStrength')
|
||||
.addEventListener('input', (evt) => {
|
||||
// debugger
|
||||
const sd_value = general.mapRange(evt.target.value, 0, 100, 0, 1) // convert slider value to SD ready value
|
||||
document.getElementById('lControlNetGuidanceStrength').textContent =
|
||||
Number(sd_value).toFixed(2)
|
||||
})
|
||||
function mapPluginSettingsToControlNet(plugin_settings) {
|
||||
const ps = plugin_settings; // for shortness
|
||||
let controlnet_units = [];
|
||||
|
||||
document
|
||||
.getElementById('slControlNetWeight')
|
||||
.addEventListener('input', (evt) => {
|
||||
// debugger
|
||||
const sd_value = general.mapRange(evt.target.value, 0, 100, 0, 2) // convert slider value to SD ready value
|
||||
document.getElementById('lControlNetWeight').textContent =
|
||||
Number(sd_value).toFixed(2)
|
||||
})
|
||||
document
|
||||
.getElementById('bSetControlImage')
|
||||
.addEventListener('click', async () => {
|
||||
const selectionInfo = await selection.Selection.getSelectionInfoExe()
|
||||
if (selectionInfo) {
|
||||
await g_generation_session.setControlNetImage()
|
||||
for (let index = 0; index < g_controlnet_max_supported_models; index++) {
|
||||
if(!getEnableControlNet(index))
|
||||
break;
|
||||
controlnet_units[index] =
|
||||
{
|
||||
input_image: g_generation_session.controlNetImage[index],
|
||||
mask: "",
|
||||
module: getSelectedModule(index),
|
||||
model: getSelectedModel(index),
|
||||
weight: getControlNetWeight(index),
|
||||
resize_mode: "Scale to Fit (Inner Fit)",
|
||||
lowvram: getUseLowVram(index),
|
||||
processor_res: 512,
|
||||
threshold_a: 64,
|
||||
threshold_b: 64,
|
||||
guidance: getControlNetWeightGuidanceStrength(index),
|
||||
guidance_start: 0,
|
||||
guidance_end: 1,
|
||||
guessmode: false,
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
if (
|
||||
plugin_settings["mode"] ===
|
||||
Enum.generationModeEnum["Img2Img"] ||
|
||||
plugin_settings["mode"] ===
|
||||
Enum.generationModeEnum["Inpaint"] ||
|
||||
plugin_settings["mode"] ===
|
||||
Enum.generationModeEnum["Outpaint"]
|
||||
) {
|
||||
const b_use_guess_mode = getUseGuessMode();
|
||||
controlnet_units[0]["guessmode"] = b_use_guess_mode;
|
||||
}
|
||||
|
||||
const controlnet_payload = {
|
||||
...ps,
|
||||
controlnet_units,
|
||||
subseed: -1,
|
||||
override_settings: {},
|
||||
override_settings_restore_afterwards: true,
|
||||
};
|
||||
|
||||
return controlnet_payload;
|
||||
}
|
||||
|
||||
|
||||
for (let index = 0; index < g_controlnet_max_supported_models; index++) {
|
||||
//event listeners
|
||||
document
|
||||
.getElementById('slControlNetGuidanceStrength_' + index)
|
||||
.addEventListener('input', (evt) => {
|
||||
// debugger
|
||||
const sd_value = general.mapRange(evt.target.value, 0, 100, 0, 1) // convert slider value to SD ready value
|
||||
document.getElementById('lControlNetGuidanceStrength_' + index).textContent =
|
||||
Number(sd_value).toFixed(2)
|
||||
})
|
||||
|
||||
document
|
||||
.getElementById('slControlNetWeight_' + index)
|
||||
.addEventListener('input', (evt) => {
|
||||
// debugger
|
||||
const sd_value = general.mapRange(evt.target.value, 0, 100, 0, 2) // convert slider value to SD ready value
|
||||
document.getElementById('lControlNetWeight_' + index).textContent =
|
||||
Number(sd_value).toFixed(2)
|
||||
})
|
||||
document
|
||||
.getElementById('bSetControlImage_' + index)
|
||||
.addEventListener('click', async () => {
|
||||
const selectionInfo = await selection.Selection.getSelectionInfoExe()
|
||||
if (selectionInfo) {
|
||||
await g_generation_session.setControlNetImage(index)
|
||||
} else {
|
||||
await note.Notification.inactiveSelectionArea()
|
||||
}
|
||||
})
|
||||
|
||||
document.getElementById('bControlMask_' + index).addEventListener('click', async () => {
|
||||
// const selectionInfo = await selection.Selection.getSelectionInfoExe()
|
||||
|
||||
if (
|
||||
g_generation_session.control_net_selection_info &&
|
||||
g_generation_session.controlNetMask[index]
|
||||
) {
|
||||
const selection_info = g_generation_session.control_net_selection_info
|
||||
const layer = await io.IO.base64ToLayer(
|
||||
g_generation_session.controlNetMask[index],
|
||||
'ControlNet Mask.png',
|
||||
selection_info.left,
|
||||
selection_info.top,
|
||||
selection_info.width,
|
||||
selection_info.height
|
||||
)
|
||||
} else {
|
||||
await note.Notification.inactiveSelectionArea()
|
||||
// await note.Notification.inactiveSelectionArea()
|
||||
app.showAlert('Mask Image is not available')
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
document.getElementById('bControlMask').addEventListener('click', async () => {
|
||||
// const selectionInfo = await selection.Selection.getSelectionInfoExe()
|
||||
|
||||
if (
|
||||
g_generation_session.control_net_selection_info &&
|
||||
g_generation_session.controlNetMask
|
||||
) {
|
||||
// await g_generation_session.setControlNetImage()
|
||||
const selection_info = g_generation_session.control_net_selection_info
|
||||
const layer = await io.IO.base64ToLayer(
|
||||
g_generation_session.controlNetMask,
|
||||
'ControlNet Mask.png',
|
||||
selection_info.left,
|
||||
selection_info.top,
|
||||
selection_info.width,
|
||||
selection_info.height
|
||||
)
|
||||
} else {
|
||||
// await note.Notification.inactiveSelectionArea()
|
||||
app.showAlert('Mask Image is not available')
|
||||
}
|
||||
})
|
||||
|
||||
module.exports = {
|
||||
requestControlNetModelList,
|
||||
|
|
@ -246,4 +252,5 @@ module.exports = {
|
|||
getEnableControlNet,
|
||||
getSelectedModule,
|
||||
getSelectedModel,
|
||||
getControlNetMaxModelsNumber,
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue