Skip to content

Commit

Permalink
better resolution scaling, support non-square images (+1 squashed com…
Browse files Browse the repository at this point in the history 
…mits)

Squashed commits:

[6efee4f] better resolution scaling
  • Loading branch information
@LostRuins
LostRuins committed Mar 9, 2024
1 parent b4ca544 commit 4682918
Show file tree
Hide file tree
Showing 2 changed files with 104 additions and 20 deletions.
104 changes: 90 additions & 14 deletions klite.embd
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ Just copy this single static HTML file anywhere and open it in a browser, or fro
Please go to https://github.com/LostRuins/lite.koboldai.net for updates on Kobold Lite.
If you are submitting a pull request for Lite, PLEASE use the above repo, not the KoboldCpp one.
Kobold Lite is under the AGPL v3.0 License unless otherwise exempted. Please do not remove this line.
Current version: 121
Current version: 122
-Concedo
-->

Expand Down Expand Up @@ -1526,14 +1526,35 @@ Current version: 121
.zoomedimg
{
border-radius: 6%;
width:420px;
height:420px;
width:462px;
height:462px;
}
@media (max-width: 520px) {
.zoomedimg.portrait
{
width:308px;
height:462px;
}
.zoomedimg.landscape
{
width:462px;
height:308px;
}

@media (max-width: 620px) {
.zoomedimg {
width:min(96vw, 420px);
height:min(96vw, 420px);
}
.zoomedimg.portrait
{
width:min(64vw, 280px);
height:min(96vw, 420px);
}
.zoomedimg.landscape
{
width:min(96vw, 420px);
height:min(64vw, 280px);
}
}
.mdlpicker::-webkit-calendar-picker-indicator {
opacity: 100;
Expand Down Expand Up @@ -3539,6 +3560,7 @@ Current version: 121
img_allowhd: false,
img_steps: 20,
img_sampler: "Euler a",
img_aspect:0, //0=square,1=portrait,2=landscape
save_images: true,
save_remote_images: false,
prompt_for_savename: false,
Expand Down Expand Up @@ -7996,6 +8018,7 @@ Current version: 121
document.getElementById("save_images").checked = localsettings.save_images;
document.getElementById("save_remote_images").checked = localsettings.save_remote_images;
document.getElementById("img_cfgscale").value = localsettings.img_cfgscale;
document.getElementById("img_aspect").value = localsettings.img_aspect;
document.getElementById("img_sampler").value = localsettings.img_sampler;
document.getElementById("img_steps").value = localsettings.img_steps;
document.getElementById("prompt_for_savename").checked = localsettings.prompt_for_savename;
Expand Down Expand Up @@ -8217,6 +8240,7 @@ Current version: 121
update_genimg_button_visiblility();

localsettings.img_cfgscale = parseFloat(document.getElementById("img_cfgscale").value);
localsettings.img_aspect = parseInt(document.getElementById("img_aspect").value);
localsettings.img_sampler = document.getElementById("img_sampler").value;
localsettings.img_steps = parseInt(document.getElementById("img_steps").value);
if(isNaN(localsettings.img_steps))
Expand All @@ -8227,6 +8251,10 @@ Current version: 121
{
localsettings.img_cfgscale = defaultsettings.img_cfgscale;
}
if(isNaN(localsettings.img_aspect))
{
localsettings.img_aspect = defaultsettings.img_aspect;
}

if((localsettings.gui_type_story!=0 && localsettings.opmode==1)
||(localsettings.gui_type_adventure!=0 && localsettings.opmode==2)
Expand Down Expand Up @@ -8994,6 +9022,7 @@ Current version: 121
let nimgtag = "[<|p|" + imgid + "|p|>]";
gametext_arr.push(nimgtag);
image_db[imgid] = { done: false, queue: "Generating", result: "", prompt:"", local:true };
image_db[imgid].aspect = 0;
let origImg = img.target.result;
let imgres = localsettings.img_allowhd?HD_RES_PX:NO_HD_RES_PX;
compressImage(origImg, (newDataUri) => {
Expand Down Expand Up @@ -10424,13 +10453,24 @@ Current version: 121
negprompt = "";
}

let iwidth = 512;
let iheight = 512;
if(localsettings.img_aspect==1)
{
iheight = 768;
}
else if(localsettings.img_aspect==2)
{
iwidth = 768;
}

let genimg_payload = {
"prompt": (sentence + negprompt),
"params": {
"cfg_scale": localsettings.img_cfgscale,
"sampler_name": usedsampler,
"height": 512,
"width": 512,
"height": iheight,
"width": iwidth,
"steps": localsettings.img_steps,
"karras": false,
"n": 1,
Expand Down Expand Up @@ -10464,6 +10504,7 @@ Current version: 121
let nimgtag = "[<|p|" + data.id + "|p|>]";
gametext_arr.push(nimgtag);
image_db[data.id] = { done: false, queue: "Starting", result: "", prompt:sentence, local:false };
image_db[data.id].aspect = (iwidth>iheight?2:(iwidth<iheight?1:0));
console.log("New image queued " + nimgtag);
}
else {
Expand All @@ -10484,6 +10525,7 @@ Current version: 121
let nimgtag = "[<|p|" + imgid + "|p|>]";
gametext_arr.push(nimgtag);
image_db[imgid] = { done: false, queue: "Generating", result: "", prompt:sentence, local:true };
image_db[imgid].aspect = (iwidth>iheight?2:(iwidth<iheight?1:0));
generate_a1111_image(genimg_payload,(outputimg)=>{
if(outputimg)
{
Expand All @@ -10493,7 +10535,7 @@ Current version: 121
compressImage(origImg, (newDataUri) => {
image_db[imgid].done = true;
image_db[imgid].result = newDataUri;
}, true, true, imgres,0.35,true);
}, true, true, imgres,0.35,false);
}else{
image_db[imgid].queue = "Failed";
msgbox("Image Generation Failed!\n\nPlease make sure A1111 is running and properly configured!\nIn your local install of Automatic1111 WebUi, modify webui-user.bat and add these flags to enable API access:\n\nset COMMANDLINE_ARGS= --api --listen --cors-allow-origins=*\n");
Expand All @@ -10512,6 +10554,7 @@ Current version: 121
let nimgtag = "[<|p|" + imgid + "|p|>]";
gametext_arr.push(nimgtag);
image_db[imgid] = { done: false, queue: "Generating", result: "", prompt:sentence, local:true };
image_db[imgid].aspect = 0;
generate_dalle_image(genimg_payload,(outputimg)=>{
if(outputimg)
{
Expand All @@ -10521,7 +10564,7 @@ Current version: 121
compressImage(origImg, (newDataUri) => {
image_db[imgid].done = true;
image_db[imgid].result = newDataUri;
}, true, true, imgres,0.35,true);
}, true, true, imgres,0.35,false);
}else{
image_db[imgid].queue = "Failed";
msgbox("Image Generation Failed!\n\nPlease make sure your OpenAI key is set correctly and you are allowed to use DALL-E.\n");
Expand Down Expand Up @@ -10638,11 +10681,22 @@ Current version: 121
let savedmeta = completed_imgs_meta[imghash];
if(!savedmeta && imghash!="")
{
savedmeta = completed_imgs_meta[imghash] = {prompt:"", desc:"", enabled:false};
savedmeta = completed_imgs_meta[imghash] = {prompt:"", desc:"", enabled:false, aspect:0};
}

if(savedmeta)
{
document.getElementById("zoomedimg").classList.remove("portrait");
document.getElementById("zoomedimg").classList.remove("landscape");
if(savedmeta.aspect==1)
{
document.getElementById("zoomedimg").classList.add("portrait");
}
else if(savedmeta.aspect==2)
{
document.getElementById("zoomedimg").classList.add("landscape");
}

let origprompt = (savedmeta.prompt?replaceAll(savedmeta.prompt,"\n"," ") : "No Saved Description");
latest_orig_prompt = origprompt;
let visionstatus = (savedmeta.enabled?(savedmeta.desc?`<span class="color_green">Active</span>`:`<span class="color_yellow">Analyzing...</span>`):`<span class="color_red">Inactive</span>`);
Expand Down Expand Up @@ -10701,6 +10755,8 @@ Current version: 121

function render_image_html(data, pend_txt = "", float=true, center=false) {
var dim = (localsettings.opmode == 2 ? 160 : 180); //adventure mode has smaller pictures
dimW = dim;
dimH = dim;
let siclass = (float?"storyimgfloat":(center?"storyimgcenter":"storyimgside"));
let reinvertcolor = localsettings.invert_colors?" invert_colors":"";
let alttxt = "";
Expand All @@ -10721,8 +10777,18 @@ Current version: 121
let imghash = cyrb_hash(data).trim();
if (completed_imgs_meta[imghash] != null) {
alttxt = completed_imgs_meta[imghash].prompt?escapeHtml(completed_imgs_meta[imghash].prompt):"";
if(completed_imgs_meta[imghash].aspect==1) //portrait
{
dimH *= 1.35;
dimW *= 0.9;
}
else if(completed_imgs_meta[imghash].aspect==2) //landscape
{
dimW *= 1.35;
dimH *= 0.9;
}
}
return prefix + `<div class="`+siclass+reinvertcolor+`"><img src="` + data + `" width=` + dim + ` height=` + dim + ` title="`+alttxt+`" style="border-radius: 6%; cursor: pointer;" onclick="return click_image(this,\'`+imghash+`\');"></div>` + suffix;
return prefix + `<div class="`+siclass+reinvertcolor+`"><img src="` + data + `" width=` + dimW + ` height=` + dimH + ` title="`+alttxt+`" style="border-radius: 6%; cursor: pointer;" onclick="return click_image(this,\'`+imghash+`\');"></div>` + suffix;
}
}

Expand Down Expand Up @@ -11030,7 +11096,7 @@ Current version: 121
let imgres = localsettings.img_allowhd?HD_RES_PX:NO_HD_RES_PX;
compressImage(origImg, (newDataUri) => {
img.result = newDataUri;
}, true, true, imgres,0.35,true);
}, true, true, imgres,0.35,false);
}
})
.catch((error) => {
Expand Down Expand Up @@ -11069,7 +11135,7 @@ Current version: 121
console.log("Replacing with Image: " + matchstr);
gametext_arr[i] = gametext_arr[i].replace(matchstr, newstr);
let metaid = cyrb_hash(img.result);
completed_imgs_meta[metaid] = {prompt:image_db[key].prompt, desc:"", enabled:false};
completed_imgs_meta[metaid] = {prompt:image_db[key].prompt, desc:"", enabled:false, aspect:image_db[key].aspect};
delete image_db[key];
}
}
Expand Down Expand Up @@ -13759,7 +13825,7 @@ Current version: 121

<div class="popupcontainer flex hidden" id="zoomedimgcontainer">
<div class="popupbg flex"></div>
<div class="nspopup flexsizesmall highest">
<div class="nspopup flexsize highest">
<div class="popuptitlebar">
<div class="popuptitletext">Image Information</div>
</div>
Expand Down Expand Up @@ -14594,7 +14660,7 @@ Current version: 121
</div>
<div class="inlinelabel">
<div class="justifyleft" style="padding:4px">Sampler: </div>
<select style="padding:1px; height:23px; width: 90px;" class="form-control" id="img_sampler">
<select style="padding:1px; height:23px; width: 100px;" class="form-control" id="img_sampler">
<option value="Euler a">Euler A</option>
<option value="Euler">Euler</option>
<option value="Heun">Heun</option>
Expand All @@ -14603,6 +14669,16 @@ Current version: 121
<option value="DPM++ 2M">DPM++ 2M</option>
</select>
</div>
<div class="inlinelabel">
<div class="justifyleft" style="padding:4px">Aspect Ratio<span class="helpicon">?
<span class="helptext">Square is recommended. Changing aspect ratio will affect the resolution used to generate. This may impact quality or memory usage.</span>
</span>: </div>
<select style="padding:1px; height:23px; width: 100px;" class="form-control" id="img_aspect">
<option value="0">Square</option>
<option value="1">Portrait</option>
<option value="2">Landscape</option>
</select>
</div>
<div class="inlinelabel">
<div class="justifyleft" style="padding:4px">Save Higher-Res <span class="helpicon">?
<span class="helptext">This option will result in larger save files which may be slower. Changing this setting only applies to NEW images.</span>
Expand Down
20 changes: 14 additions & 6 deletions koboldcpp.py
View file
Original file line number Diff line number Diff line change
Expand Up @@ -514,29 +514,37 @@ def sd_generate(genparams):
sample_method = genparams.get("sampler_name", "k_euler_a")
is_quiet = True if args.quiet else False


#clean vars
width = width - (width%64)
height = height - (height%64)
cfg_scale = (1 if cfg_scale < 1 else (25 if cfg_scale > 25 else cfg_scale))
sample_steps = (1 if sample_steps < 1 else (80 if sample_steps > 80 else sample_steps))
width = (128 if width < 128 else (1024 if width > 1024 else width))
height = (128 if height < 128 else (1024 if height > 1024 else height))
reslimit = 1024
width = (64 if width < 64 else width)
height = (64 if height < 64 else height)

#quick mode
if args.sdconfig and len(args.sdconfig)>1:
if args.sdconfig[1]=="quick":
cfg_scale = 1
sample_steps = 7
sample_method = "dpm++ 2m karras"
width = (512 if width > 512 else width)
height = (512 if height > 512 else height)
reslimit = 512
print("Image generation set to Quick Mode (Low Quality). Step counts, resolution, sampler, and cfg scale are fixed.")
elif args.sdconfig[1]=="clamped":
sample_steps = (40 if sample_steps > 40 else sample_steps)
width = (512 if width > 512 else width)
height = (512 if height > 512 else height)
reslimit = 512
print("Image generation set to Clamped Mode (For Shared Use). Step counts and resolution are clamped.")

biggest = max(width,height)
if biggest > reslimit:
scaler = biggest / reslimit
width = width / scaler
height = height / scaler
width = width - (width%64)
height = height - (height%64)

inputs = sd_generation_inputs()
inputs.prompt = prompt.encode("UTF-8")
inputs.negative_prompt = negative_prompt.encode("UTF-8")
Expand Down

0 comments on commit 4682918

Please sign in to comment.