diff --git a/js/index.js b/js/index.js index 6ffb60e..6bd0411 100644 --- a/js/index.js +++ b/js/index.js @@ -345,7 +345,13 @@ function clearPaintedMask() { maskPaintCtx.clearRect(0, 0, maskPaintCanvas.width, maskPaintCanvas.height); } -function march(bb) { +function march(bb, options = {}) { + defaultOpt(options, { + style: "#FFFF", + width: "2px", + filter: null, + }); + const expanded = {...bb}; expanded.x--; expanded.y--; @@ -360,7 +366,7 @@ function march(bb) { let offset = 0; const interval = setInterval(() => { - drawMarchingAnts(layer.ctx, bb, offset++); + drawMarchingAnts(layer.ctx, bb, offset++, options); offset %= 12; }, 20); @@ -370,13 +376,18 @@ function march(bb) { }; } -function drawMarchingAnts(ctx, bb, offset) { +function drawMarchingAnts(ctx, bb, offset, options) { + ctx.save(); + ctx.clearRect(0, 0, bb.w + 2, bb.h + 2); - ctx.strokeStyle = "#FFFFFFFF"; //"#55000077"; - ctx.strokeWidth = "2px"; + ctx.strokeStyle = options.style; + ctx.strokeWidth = options.width; + ctx.filter = options.filter; ctx.setLineDash([4, 2]); ctx.lineDashOffset = -offset; ctx.strokeRect(1, 1, bb.w, bb.h); + + ctx.restore(); } function changeSampler() { diff --git a/js/ui/floating/layers.js b/js/ui/floating/layers.js index c8f3be8..0bee020 100644 --- a/js/ui/floating/layers.js +++ b/js/ui/floating/layers.js @@ -31,6 +31,13 @@ const uil = { return this.layer && this.active.layer.ctx; }, + get w() { + return imageCollection.size.w; + }, + get h() { + return imageCollection.size.h; + }, + /** * Synchronizes layer array to DOM */ diff --git a/js/ui/tool/interrogate.js b/js/ui/tool/interrogate.js index 6a45c81..40ef27b 100644 --- a/js/ui/tool/interrogate.js +++ b/js/ui/tool/interrogate.js @@ -22,6 +22,8 @@ const interrogateTool = () => // Hide Mask setMask("none"); + + uiCtx.clearRect(0, 0, uiCanvas.width, uiCanvas.height); }, { init: (state) => { @@ -98,7 +100,7 @@ const _interrogate_onwheel = (evn, state) => { } }; -const interrogate_callback = (evn, state) => { +const interrogate_callback = async (evn, state) => { const bb = getBoundingBox( evn.x, evn.y, @@ -107,7 +109,9 @@ const interrogate_callback = (evn, state) => { state.snapToGrid && basePixelCount ); // Do nothing if no image exists - if (isCanvasBlank(bb.x, bb.y, bb.w, bb.h, imgCanvas)) return; + const sectionCanvas = uil.getVisible({x: bb.x, y: bb.y, w: bb.w, h: bb.h}); + + if (isCanvasBlank(0, 0, bb.w, bb.h, sectionCanvas)) return; // Build request to the API const request = {}; @@ -122,16 +126,25 @@ const interrogate_callback = (evn, state) => { // Get init image auxCtx.fillRect(0, 0, bb.w, bb.h); - auxCtx.drawImage(imgCanvas, bb.x, bb.y, bb.w, bb.h, 0, 0, bb.w, bb.h); + auxCtx.drawImage(sectionCanvas, 0, 0); request.image = auxCanvas.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; + const stopMarching = march(bb, {style: "#AFAF"}); + try { + const result = await _interrogate(request); + const text = prompt( + result + + "\n\nDo you want to replace your prompt with this? You can change it down below:", + result + ); + if (text) { + document.getElementById("prompt").value = text; tools.dream.enable(); } - }); + } finally { + stopMarching(); + } }; /**