surprise interrogate tool

index.html

@@ -283,6 +283,7 @@
 		<script src="js/ui/tool/colorbrush.js" type="text/javascript"></script>
 		<script src="js/ui/tool/select.js" type="text/javascript"></script>
 		<script src="js/ui/tool/stamp.js" type="text/javascript"></script>
+		<script src="js/ui/tool/interrogate.js" type="text/javascript"></script>
 
 		<!-- Initialize -->
 		<script

js/initalize/shortcuts.populate.js

@@ -26,3 +26,6 @@ keyboard.onShortcut({key: "KeyS"}, () => {
 keyboard.onShortcut({key: "KeyU"}, () => {
 	tools.stamp.enable();
 });
+keyboard.onShortcut({key: "KeyN"}, () => {
+	tools.interrogate.enable();
+});

js/initalize/toolbar.populate.js

@@ -25,4 +25,9 @@ toolbar.addSeparator();
 tools.selecttransform = selectTransformTool();
 tools.stamp = stampTool();
 
+/**
+ * Interrogator tool
+ */
+toolbar.addSeparator();
+tools.interrogate = interrogateTool();
 toolbar.tools[0].enable();

js/ui/tool/interrogate.js

@@ -0,0 +1,151 @@
+const interrogateTool = () =>
+	toolbar.registerTool(
+		"res/icons/microscope.svg",
+		"Interrogate",
+		(state, opt) => {
+			// Draw new cursor immediately
+			ovCtx.clearRect(0, 0, ovCanvas.width, ovCanvas.height);
+			state.mousemovecb({
+				...mouse.coords.world.pos,
+			});
+
+			// Start Listeners
+			mouse.listen.world.onmousemove.on(state.mousemovecb);
+			mouse.listen.world.onwheel.on(state.wheelcb);
+			mouse.listen.world.btn.left.onclick.on(state.interrogatecb);
+		},
+		(state, opt) => {
+			// Clear Listeners
+			mouse.listen.world.onmousemove.clear(state.mousemovecb);
+			mouse.listen.world.onwheel.clear(state.wheelcb);
+			mouse.listen.world.btn.left.onclick.clear(state.interrogatecb);
+
+			// Hide Mask
+			setMask("none");
+		},
+		{
+			init: (state) => {
+				state.config = {
+					cursorSizeScrollSpeed: 1,
+				};
+
+				state.cursorSize = 512;
+
+				state.snapToGrid = true;
+				state.invertMask = false;
+				state.overMaskPx = 0;
+
+				state.erasePrevReticle = () =>
+					ovCtx.clearRect(0, 0, ovCanvas.width, ovCanvas.height);
+
+				state.mousemovecb = (evn) => {
+					state.erasePrevReticle();
+					state.erasePrevReticle = _reticle_draw(evn, state);
+				};
+				state.wheelcb = (evn) => {
+					_interrogate_onwheel(evn, state);
+				};
+				state.interrogatecb = (evn) => {
+					interrogate_callback(evn, state);
+				};
+			},
+			populateContextMenu: (menu, state) => {
+				if (!state.ctxmenu) {
+					state.ctxmenu = {};
+
+					// Cursor Size Slider
+					const cursorSizeSlider = _toolbar_input.slider(
+						state,
+						"cursorSize",
+						"Cursor Size",
+						{
+							min: 0,
+							max: 2048,
+							step: 128,
+							textStep: 2,
+						}
+					);
+
+					state.setCursorSize = cursorSizeSlider.setValue;
+					state.ctxmenu.cursorSizeSlider = cursorSizeSlider.slider;
+
+					// Snap to Grid Checkbox
+					state.ctxmenu.snapToGridLabel = _toolbar_input.checkbox(
+						state,
+						"snapToGrid",
+						"Snap To Grid"
+					).label;
+				}
+
+				menu.appendChild(state.ctxmenu.cursorSizeSlider);
+				menu.appendChild(state.ctxmenu.snapToGridLabel);
+			},
+			shortcut: "N",
+		}
+	);
+
+/**
+ * Generic wheel handler
+ */
+
+const _interrogate_onwheel = (evn, state) => {
+	if (!evn.evn.ctrlKey) {
+		const v =
+			state.cursorSize -
+			Math.floor(state.config.cursorSizeScrollSpeed * evn.delta);
+		state.cursorSize = state.setCursorSize(v + snap(v, 0, 128));
+		state.mousemovecb(evn);
+	}
+};
+
+const interrogate_callback = (evn, state) => {
+	const bb = getBoundingBox(
+		evn.x,
+		evn.y,
+		state.cursorSize,
+		state.cursorSize,
+		state.snapToGrid && basePixelCount
+	);
+	// Do nothing if no image exists
+	if (isCanvasBlank(bb.x, bb.y, bb.w, bb.h, imgCanvas)) return;
+
+	// Build request to the API
+	const request = {};
+	//Object.assign(request, stableDiffusionData);
+	request.image = imgCanvas.toDataURL();
+	request.model = "clip"; //TODO maybe make a selectable option once A1111 supports the new openclip thingy?
+	const interrogation = _interrogate(request).then(function (result) {
+		if (confirm(result + "\n\nDo you want to replace your prompt with this?")) {
+			document.getElementById("prompt").value = result;
+			tools.dream.enable();
+		}
+	});
+};
+
+/**
+ * our private eye
+ *
+ * @param {StableDiffusionRequest} request Stable diffusion request
+ * @returns {Promise<string[]>}
+ */
+const _interrogate = async (request) => {
+	const apiURL = `${host}${url}` + "interrogate";
+
+	/** @type {StableDiffusionResponse} */
+	let data = null;
+	try {
+		const response = await fetch(apiURL, {
+			method: "POST",
+			headers: {
+				Accept: "application/json",
+				"Content-Type": "application/json",
+			},
+			body: JSON.stringify(request),
+		});
+
+		data = await response.json();
+	} finally {
+	}
+
+	return data.caption;
+};

res/icons/microscope.svg

@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+  <path d="M6 18h8"></path>
+  <path d="M3 22h18"></path>
+  <path d="M14 22a7 7 0 1 0 0-14h-1"></path>
+  <path d="M9 14h2"></path>
+  <path d="M8 6h4"></path>
+  <path d="M13 10V6.5a.5.5 0 0 0-.5-.5.5.5 0 0 1-.5-.5V3a1 1 0 0 0-1-1H9a1 1 0 0 0-1 1v2.5a.5.5 0 0 1-.5.5.5.5 0 0 0-.5.5V10c0 1.1.9 2 2 2h2a2 2 0 0 0 2-2Z"></path>
+
+</svg>