sneedgroup-holder/openOutpaint
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fixes #195

Browse source 
Signed-off-by: Victor Seiji Hariki <victorseijih@gmail.com>
This commit is contained in:
Victor Seiji Hariki 2023-02-19 10:14:38 -03:00
parent 2598cb9c41
commit fe0095421a
7 changed files with 71 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

26
js/lib/toolbar.js
View file

@ -151,18 +151,24 @@ const toolbar = {
* Premade inputs for populating the context menus
*/
const _toolbar_input = {
checkbox: (state, dataKey, text, classes, cb = null) => {
checkbox: (state, lsKey, dataKey, text, classes, cb = null) => {
if (state[dataKey] === undefined) state[dataKey] = false;
const savedValueStr = lsKey && localStorage.getItem(lsKey);
const savedValue = savedValueStr && JSON.parse(savedValueStr);
const checkbox = document.createElement("input");
checkbox.type = "checkbox";
checkbox.classList.add("oo-checkbox", "ui", "inline-icon");
if (savedValue !== null) state[dataKey] = checkbox.checked = savedValue;
if (typeof classes === "string") classes = [classes];
if (classes) checkbox.classList.add(...classes);
checkbox.checked = state[dataKey];
checkbox.onchange = () => {
if (lsKey) localStorage.setItem(lsKey, JSON.stringify(checkbox.checked));
state[dataKey] = checkbox.checked;
cb && cb();
};
@ -185,15 +191,19 @@ const _toolbar_input = {
};
},
slider: (state, dataKey, text, options = {}) => {
slider: (state, lsKey, dataKey, text, options = {}) => {
defaultOpt(options, {min: 0, max: 1, step: 0.1, textStep: null, cb: null});
const slider = document.createElement("div");
const savedValueStr = lsKey && localStorage.getItem(lsKey);
const savedValue = savedValueStr && JSON.parse(savedValueStr);
const value = createSlider(text, slider, {
min: options.min,
max: options.max,
step: options.step,
valuecb: (v) => {
if (lsKey) localStorage.setItem(lsKey, JSON.stringify(v));
state[dataKey] = v;
options.cb && options.cb(v);
},
@ -201,6 +211,8 @@ const _toolbar_input = {
textStep: options.textStep,
});
if (savedValue !== null) value.value = savedValue;
return {
slider,
rawSlider: value,
@ -213,12 +225,16 @@ const _toolbar_input = {
selectlist: (
state,
lsKey,
dataKey,
text,
options = {value, text},
defaultOptionValue,
cb = null
) => {
const savedValueStr = lsKey && localStorage.getItem(lsKey);
const savedValue = savedValueStr && JSON.parse(savedValueStr);
const selectlist = document.createElement("select");
selectlist.classList.add("bareselector");
Object.entries(options).forEach((opt) => {
@ -228,7 +244,13 @@ const _toolbar_input = {
selectlist.options.add(option);
});
selectlist.selectedIndex = defaultOptionValue;
if (savedValue !== null)
state[dataKey] = selectlist.selectedIndex = savedValue;
selectlist.onchange = () => {
if (lsKey)
localStorage.setItem(lsKey, JSON.stringify(selectlist.selectedIndex));
state[dataKey] = selectlist.selectedIndex;
cb && cb();
};

4
js/ui/tool/colorbrush.js
View file

@ -373,6 +373,7 @@ const colorBrushTool = () =>
const array = document.createElement("div");
const affectMaskCheckbox = _toolbar_input.checkbox(
state,
"openoutpaint/colorbrush-affectmask",
"affectMask",
"Affect Mask",
"icon-venetian-mask"
@ -384,6 +385,7 @@ const colorBrushTool = () =>
// Brush size slider
const brushSizeSlider = _toolbar_input.slider(
state,
"openoutpaint/colorbrush-brushsize",
"brushSize",
"Brush Size",
{
@ -399,6 +401,7 @@ const colorBrushTool = () =>
// Brush opacity slider
const brushOpacitySlider = _toolbar_input.slider(
state,
"openoutpaint/colorbrush-brushopacity",
"brushOpacity",
"Brush Opacity",
{
@ -413,6 +416,7 @@ const colorBrushTool = () =>
// Brush blur slider
const brushBlurSlider = _toolbar_input.slider(
state,
"openoutpaint/colorbrush-brushblur",
"brushBlur",
"Brush Blur",
{

21
js/ui/tool/dream.js
View file

@ -1600,6 +1600,7 @@ const dreamTool = () =>
// Cursor Size Slider
const cursorSizeSlider = _toolbar_input.slider(
state,
"openoutpaint/dream-cursorsize",
"cursorSize",
"Cursor Size",
{
@ -1632,6 +1633,7 @@ const dreamTool = () =>
// Snap to Grid Checkbox
state.ctxmenu.snapToGridLabel = _toolbar_input.checkbox(
state,
"openoutpaint/dream-snaptogrid",
"snapToGrid",
"Snap To Grid",
"icon-grid"
@ -1640,6 +1642,7 @@ const dreamTool = () =>
// Invert Mask Checkbox
state.ctxmenu.invertMaskLabel = _toolbar_input.checkbox(
state,
"openoutpaint/dream-invertmask",
"invertMask",
"Invert Mask",
["icon-venetian-mask", "invert-mask-checkbox"],
@ -1651,6 +1654,7 @@ const dreamTool = () =>
// Keep Masked Content Checkbox
state.ctxmenu.keepUnmaskedLabel = _toolbar_input.checkbox(
state,
"openoutpaint/dream-keepunmasked",
"keepUnmasked",
"Keep Unmasked",
"icon-pin",
@ -1674,6 +1678,7 @@ const dreamTool = () =>
// Keep Masked Content Blur Slider
state.ctxmenu.keepUnmaskedBlurSlider = _toolbar_input.slider(
state,
"openoutpaint/dream-keepunmaskedblur",
"keepUnmaskedBlur",
"Keep Unmasked Blur",
{
@ -1693,6 +1698,7 @@ const dreamTool = () =>
// outpaint fill type select list
state.ctxmenu.outpaintTypeSelect = _toolbar_input.selectlist(
state,
"openoutpaint/dream-outpainttype",
"outpainting_fill",
"Outpaint Type",
{
@ -1710,6 +1716,7 @@ const dreamTool = () =>
// Preserve Brushed Masks Checkbox
state.ctxmenu.preserveMasksLabel = _toolbar_input.checkbox(
state,
"openoutpaint/dream-preservemasks",
"preserveMasks",
"Preserve Brushed Masks",
"icon-paintbrush"
@ -1718,6 +1725,7 @@ const dreamTool = () =>
// Overmasking Slider
state.ctxmenu.overMaskPxLabel = _toolbar_input.slider(
state,
"openoutpaint/dream-overmaskpx",
"overMaskPx",
"Overmask px",
{
@ -1731,6 +1739,7 @@ const dreamTool = () =>
// Eager generation Slider
state.ctxmenu.eagerGenerateCountLabel = _toolbar_input.slider(
state,
"openoutpaint/dream-eagergeneratecount",
"eagerGenerateCount",
"Generate-ahead count",
{
@ -2148,6 +2157,7 @@ const img2imgTool = () =>
// Cursor Size Slider
const cursorSizeSlider = _toolbar_input.slider(
state,
"openoutpaint/img2img-cursorsize",
"cursorSize",
"Cursor Size",
{
@ -2177,6 +2187,7 @@ const img2imgTool = () =>
// Snap To Grid Checkbox
state.ctxmenu.snapToGridLabel = _toolbar_input.checkbox(
state,
"openoutpaint/img2img-snaptogrid",
"snapToGrid",
"Snap To Grid",
"icon-grid"
@ -2185,6 +2196,7 @@ const img2imgTool = () =>
// Invert Mask Checkbox
state.ctxmenu.invertMaskLabel = _toolbar_input.checkbox(
state,
"openoutpaint/img2img-invertmask",
"invertMask",
"Invert Mask",
["icon-venetian-mask", "invert-mask-checkbox"],
@ -2196,6 +2208,7 @@ const img2imgTool = () =>
// Keep Masked Content Checkbox
state.ctxmenu.keepUnmaskedLabel = _toolbar_input.checkbox(
state,
"openoutpaint/img2img-keepunmasked",
"keepUnmasked",
"Keep Unmasked",
"icon-pin",
@ -2219,6 +2232,7 @@ const img2imgTool = () =>
// Keep Masked Content Blur Slider
state.ctxmenu.keepUnmaskedBlurSlider = _toolbar_input.slider(
state,
"openoutpaint/img2img-unmaskedblur",
"keepUnmaskedBlur",
"Keep Unmasked Blur",
{
@ -2238,6 +2252,7 @@ const img2imgTool = () =>
// Preserve Brushed Masks Checkbox
state.ctxmenu.preserveMasksLabel = _toolbar_input.checkbox(
state,
"openoutpaint/img2img-preservemasks",
"preserveMasks",
"Preserve Brushed Masks",
"icon-paintbrush"
@ -2246,6 +2261,7 @@ const img2imgTool = () =>
// Inpaint Full Resolution Checkbox
state.ctxmenu.fullResolutionLabel = _toolbar_input.checkbox(
state,
"openoutpaint/img2img-fullresolution",
"fullResolution",
"Inpaint Full Resolution",
"icon-expand"
@ -2254,6 +2270,7 @@ const img2imgTool = () =>
// Denoising Strength Slider
state.ctxmenu.denoisingStrengthSlider = _toolbar_input.slider(
state,
"openoutpaint/img2img-denoisingstrength",
"denoisingStrength",
"Denoising Strength",
{
@ -2267,6 +2284,7 @@ const img2imgTool = () =>
// Border Mask Gradient Checkbox
state.ctxmenu.borderMaskGradientCheckbox = _toolbar_input.checkbox(
state,
"openoutpaint/img2img-gradient",
"gradient",
"Border Mask Gradient",
"icon-box-select"
@ -2275,6 +2293,7 @@ const img2imgTool = () =>
// Border Mask Size Slider
state.ctxmenu.borderMaskSlider = _toolbar_input.slider(
state,
"openoutpaint/img2img-keepbordersize",
"keepBorderSize",
"Keep Border Size",
{
@ -2288,6 +2307,7 @@ const img2imgTool = () =>
// inpaint fill type select list
state.ctxmenu.inpaintTypeSelect = _toolbar_input.selectlist(
state,
"openoutpaint/img2img-inpaintingtype",
"inpainting_fill",
"Inpaint Type",
{
@ -2305,6 +2325,7 @@ const img2imgTool = () =>
// Eager generation Slider
state.ctxmenu.eagerGenerateCountLabel = _toolbar_input.slider(
state,
"openoutpaint/img2img-eagergeneratecount",
"eagerGenerateCount",
"Generate-ahead count",
{

2
js/ui/tool/interrogate.js
View file

@ -80,6 +80,7 @@ const interrogateTool = () =>
// Cursor Size Slider
const cursorSizeSlider = _toolbar_input.slider(
state,
"openoutpaint/interrogate-cursorsize",
"cursorSize",
"Cursor Size",
{
@ -96,6 +97,7 @@ const interrogateTool = () =>
// Snap to Grid Checkbox
state.ctxmenu.snapToGridLabel = _toolbar_input.checkbox(
state,
"openoutpaint/interrogate-snaptogrid",
"snapToGrid",
"Snap To Grid",
"icon-grid"

3
js/ui/tool/maskbrush.js
View file

@ -186,6 +186,7 @@ const maskBrushTool = () =>
// Brush size slider
const brushSizeSlider = _toolbar_input.slider(
state,
"openoutpaint/maskbrush-brushsize",
"brushSize",
"Brush Size",
{
@ -206,6 +207,7 @@ const maskBrushTool = () =>
// Brush opacity slider
const brushOpacitySlider = _toolbar_input.slider(
state,
"openoutpaint/maskbrush-brushopacity",
"brushOpacity",
"Brush Opacity",
{
@ -220,6 +222,7 @@ const maskBrushTool = () =>
// Brush blur slider
const brushBlurSlider = _toolbar_input.slider(
state,
"openoutpaint/maskbrush-brushblur",
"brushBlur",
"Brush Blur",
{

4
js/ui/tool/select.js
View file

@ -652,6 +652,7 @@ const selectTransformTool = () =>
// Snap To Grid Checkbox
state.ctxmenu.snapToGridLabel = _toolbar_input.checkbox(
state,
"openoutpaint/select-snaptogrid",
"snapToGrid",
"Snap To Grid",
"icon-grid"
@ -660,6 +661,7 @@ const selectTransformTool = () =>
// Keep Aspect Ratio
state.ctxmenu.keepAspectRatioLabel = _toolbar_input.checkbox(
state,
"openoutpaint/select-keepaspectratio",
"keepAspectRatio",
"Keep Aspect Ratio",
"icon-maximize"
@ -668,6 +670,7 @@ const selectTransformTool = () =>
// Use Clipboard
const clipboardCheckbox = _toolbar_input.checkbox(
state,
"openoutpaint/select-useclipboard",
"useClipboard",
"Use clipboard",
"icon-clipboard-list"
@ -679,6 +682,7 @@ const selectTransformTool = () =>
// Selection Peek Opacity
state.ctxmenu.selectionPeekOpacitySlider = _toolbar_input.slider(
state,
"openoutpaint/select-peekopacity",
"selectionPeekOpacity",
"Peek Opacity",
{

19
js/ui/tool/stamp.js
View file

@ -495,6 +495,7 @@ const stampTool = () =>
array.appendChild(
_toolbar_input.checkbox(
state,
"openoutpaint/stamp-snaptogrid",
"snapToGrid",
"Snap To Grid",
"icon-grid"
@ -515,12 +516,18 @@ const stampTool = () =>
state.ctxmenu.buttonArray = array;
// Scale Slider
const scaleSlider = _toolbar_input.slider(state, "scale", "Scale", {
min: 0.01,
max: 10,
step: 0.1,
textStep: 0.001,
});
const scaleSlider = _toolbar_input.slider(
state,
null,
"scale",
"Scale",
{
min: 0.01,
max: 10,
step: 0.1,
textStep: 0.001,
}
);
state.ctxmenu.scaleSlider = scaleSlider.slider;
state.setScale = scaleSlider.setValue;