diff --git a/public/scripts/extensions/stable-diffusion/index.js b/public/scripts/extensions/stable-diffusion/index.js
index c69ae9a43..fbeffa212 100644
--- a/public/scripts/extensions/stable-diffusion/index.js
+++ b/public/scripts/extensions/stable-diffusion/index.js
@@ -7,6 +7,7 @@ import {
} from "../../../script.js";
import { getApiUrl, getContext, extension_settings, defaultRequestArgs } from "../../extensions.js";
import { stringFormat, initScrollHeight, resetScrollHeight } from "../../utils.js";
+export { MODULE_NAME };
// Wraps a string into monospace font-face span
const m = x => `${x}`;
@@ -15,6 +16,9 @@ const j = a => a.join(' / ');
// Wraps a string into paragraph block
const p = a => `
${a}
`
+const MODULE_NAME = 'sd';
+const UPDATE_INTERVAL = 1000;
+
const postHeaders = {
'Content-Type': 'application/json',
'Bypass-Tunnel-Reminder': 'bypass',
@@ -315,6 +319,104 @@ async function sendMessage(prompt, image) {
context.saveChat();
}
+function addSDGenButtons() {
+ const buttonHtml = `
+
+ `;
+
+ const waitButtonHtml = `
+
+ `
+ const dropdownHtml = `
+
+
Send me a picture of:
+
+ - Yourself
+ - Your Face
+ - Me
+ - The Whole Story
+ - The Last Message
+
+
`;
+
+ $('#send_but_sheld').prepend(buttonHtml);
+ $('#send_but_sheld').prepend(waitButtonHtml);
+ $(document.body).append(dropdownHtml)
+
+ const button = $('#sd_gen');
+ const waitButton = $("#sd_gen_wait");
+ const dropdown = $('#sd_dropdown');
+ waitButton.hide();
+ dropdown.hide();
+ button.hide();
+
+ let popper = Popper.createPopper(button.get(0), dropdown.get(0), {
+ placement: 'top-start',
+ });
+
+ $(document).on('click touchend', function (e) {
+ const target = $(e.target);
+ if (target.is(dropdown)) return;
+ if (target.is(button) && !dropdown.is(":visible") && $("#send_but").css('display') === 'flex') {
+ e.preventDefault();
+
+ dropdown.show(200);
+ popper.update();
+ } else {
+ dropdown.hide(200);
+ }
+ });
+}
+
+async function moduleWorker() {
+ const context = getContext();
+
+ /* if (context.onlineStatus === 'no_connection') {
+ $('#sd_gen').hide(200);
+ } else if ($("#send_but").css('display') === 'flex') {
+ $('#sd_gen').show(200);
+ $("#sd_gen_wait").hide(200);
+ } else {
+ $('#sd_gen').hide(200);
+ $("#sd_gen_wait").show(200);
+ } */
+
+ context.onlineStatus === 'no_connection'
+ ? $('#sd_gen').hide(200)
+ : $('#sd_gen').show(200)
+}
+
+addSDGenButtons();
+setInterval(moduleWorker, UPDATE_INTERVAL);
+
+$("#sd_dropdown [id]").on("click", function () {
+ var id = $(this).attr("id");
+ if (id == "sd_you") {
+ console.log("doing /sd you");
+ generatePicture('sd', 'you');
+ }
+
+ else if (id == "sd_face") {
+ console.log("doing /sd face");
+ generatePicture('sd', 'face');
+ }
+
+ else if (id == "sd_me") {
+ console.log("doing /sd me");
+ generatePicture('sd', 'me');
+ }
+
+ else if (id == "sd_world") {
+ console.log("doing /sd world");
+ generatePicture('sd', 'world');
+ }
+
+ else if (id == "sd_last") {
+ console.log("doing /sd last");
+ generatePicture('sd', 'last');
+ }
+});
+
jQuery(async () => {
getContext().registerSlashCommand('sd', generatePicture, ['picture', 'image'], helpString, true, true);
diff --git a/public/scripts/extensions/stable-diffusion/style.css b/public/scripts/extensions/stable-diffusion/style.css
index 0fe6446f8..07712cde8 100644
--- a/public/scripts/extensions/stable-diffusion/style.css
+++ b/public/scripts/extensions/stable-diffusion/style.css
@@ -1,3 +1,30 @@
.sd_settings label {
display: block;
+}
+
+#sd_gen {
+ order: 100;
+ 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;
+
+}
+
+#sd_gen:hover {
+ opacity: 1;
+ filter: brightness(1.2);
+}
+
+#sd_dropdown {
+ z-index: 100;
+ backdrop-filter: blur(--SmartThemeBlurStrength);
}
\ No newline at end of file