Adjust caption extension to new menu

This commit is contained in:
SillyLossy
2023-05-18 00:17:20 +03:00
parent e990a9e5cc
commit 069316218a
4 changed files with 22 additions and 36 deletions

View File

@ -15,9 +15,9 @@ async function moduleWorker() {
async function setImageIcon() { async function setImageIcon() {
try { try {
const sendButton = document.getElementById('send_picture'); const sendButton = $('#send_picture .extensionsMenuExtensionButton');
sendButton.classList.add('fa-image'); sendButton.addClass('fa-image');
sendButton.classList.remove('fa-hourglass-half'); sendButton.removeClass('fa-hourglass-half');
} }
catch (error) { catch (error) {
console.log(error); console.log(error);
@ -26,9 +26,9 @@ async function setImageIcon() {
async function setSpinnerIcon() { async function setSpinnerIcon() {
try { try {
const sendButton = document.getElementById('send_picture'); const sendButton = $('#send_picture .extensionsMenuExtensionButton');
sendButton.classList.remove('fa-image'); sendButton.removeClass('fa-image');
sendButton.classList.add('fa-hourglass-half'); sendButton.addClass('fa-hourglass-half');
} }
catch (error) { catch (error) {
console.log(error); console.log(error);
@ -92,15 +92,17 @@ async function onSelectImage(e) {
} }
} }
$(document).ready(function () { jQuery(function () {
function addSendPictureButton() { function addSendPictureButton() {
const sendButton = document.createElement('div'); const sendButton = $(`
sendButton.id = 'send_picture'; <div id="send_picture" class="list-group-item flex-container flexGap5">
sendButton.title = 'Send a picture to chat'; <div class="fa-solid fa-image extensionsMenuExtensionButton"></div>
sendButton.classList.add('fa-solid'); Send a picture
</div>`);
$('#extensionsMenu').prepend(sendButton);
$(sendButton).hide(); $(sendButton).hide();
$(sendButton).on('click', () => $('#img_file').click()); $(sendButton).on('click', () => $('#img_file').trigger('click'));
$('#send_but_sheld').prepend(sendButton);
} }
function addPictureSendForm() { function addPictureSendForm() {
const inputHtml = `<input id="img_file" type="file" accept="image/*">`; const inputHtml = `<input id="img_file" type="file" accept="image/*">`;

View File

@ -1,24 +1,3 @@
#send_picture {
order: 200;
width: 40px;
height: 40px;
margin: 0;
padding: 1px;
outline: none;
border: none;
cursor: pointer;
transition: 0.3s;
opacity: 0.7;
display: flex;
align-items: center;
justify-content: center;
}
#send_picture:hover {
opacity: 1;
filter: brightness(1.2);
}
#img_form { #img_form {
display: none; display: none;
} }

View File

@ -549,7 +549,7 @@ function addSDGenButtons() {
const buttonHtml = ` const buttonHtml = `
<div id="sd_gen" class="list-group-item flex-container flexGap5"> <div id="sd_gen" class="list-group-item flex-container flexGap5">
<div class="fa-solid fa-paintbrush extensionsMenuExtensionButton" title="Trigger Stable Diffusion" /></div> <div class="fa-solid fa-paintbrush extensionsMenuExtensionButton" title="Trigger Stable Diffusion" /></div>
StableDiffusion Stable Diffusion
</div> </div>
`; `;
@ -757,7 +757,7 @@ jQuery(async () => {
<select id="sd_model"></select> <select id="sd_model"></select>
<label for="sd_sampler">Sampling method</label> <label for="sd_sampler">Sampling method</label>
<select id="sd_sampler"></select> <select id="sd_sampler"></select>
<div class="flex-container flexGap5 marginTop10 margin-bot-10px"> <div class="flex-container flexGap5 margin-bot-10px">
<label class="checkbox_label"> <label class="checkbox_label">
<input id="sd_horde_karras" type="checkbox" /> <input id="sd_horde_karras" type="checkbox" />
Karras (only for Horde, not all samplers supported) Karras (only for Horde, not all samplers supported)

View File

@ -538,6 +538,11 @@ code {
cursor: pointer; cursor: pointer;
} }
#extensionsMenu>div {
transition: 0.3s;
opacity: 0.7;
}
.options-content a div:first-child { .options-content a div:first-child {
min-width: 20px; min-width: 20px;
} }