wangbo/ComfyUI
1
0
Fork 0
mirror of https://github.com/comfyanonymous/ComfyUI.git synced 2026-02-10 13:32:36 +08:00
Code Issues Actions 13 Packages Projects Releases Wiki Activity

Enable brush preview for key and slider events

Browse Source
This commit is contained in:
Lt.Dr.Data 2023-04-27 14:59:02 +09:00
parent 45b049669b
commit 1f9e88fcd1
1 changed files with 20 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
web/extensions/core/maskeditor.js
View File

@ -185,6 +185,7 @@ class MaskEditorDialog extends ComfyDialog {
var brush_size_slider = this.createLeftSlider(self, "Thickness", "20px", (event) => { var brush_size_slider = this.createLeftSlider(self, "Thickness", "20px", (event) => {
self.brush_size = event.target.value; self.brush_size = event.target.value;
self.updateBrushPreview(self, null, null);
}); });
this.element.appendChild(imgCanvas); this.element.appendChild(imgCanvas);
@ -322,6 +323,8 @@ class MaskEditorDialog extends ComfyDialog {
} else if (event.key === '[') { } else if (event.key === '[') {
self.brush_size = Math.max(self.brush_size-2, 1); self.brush_size = Math.max(self.brush_size-2, 1);
} }
self.updateBrushPreview(self, null, null);
} }
static handleMouseUp(event) { static handleMouseUp(event) {
@ -329,6 +332,18 @@ class MaskEditorDialog extends ComfyDialog {
MaskEditorDialog.instance.drawing_mode = false; MaskEditorDialog.instance.drawing_mode = false;
} }
updateBrushPreview(self) {
const brush = self.brush;
var centerX = self.cursorX;
var centerY = self.cursorY;
brush.style.width = (self.brush_size - 1) * 2 + "px";
brush.style.height = (self.brush_size - 1) * 2 + "px";
brush.style.left = (centerX - self.brush_size) + "px";
brush.style.top = (centerY - self.brush_size) + "px";
}
handleWheelEvent(self, event) { handleWheelEvent(self, event) {
if(event.deltaY < 0) if(event.deltaY < 0)
self.brush_size = Math.min(self.brush_size+2, 100); self.brush_size = Math.min(self.brush_size+2, 100);
@ -337,19 +352,14 @@ class MaskEditorDialog extends ComfyDialog {
self.brush_slider_input.value = self.brush_size; self.brush_slider_input.value = self.brush_size;
const brush = this.brush; self.updateBrushPreview(self);
brush.style.width = (this.brush_size - 1) * 2 + "px";
brush.style.height = (this.brush_size - 1) * 2 + "px";
brush.style.left = (event.pageX - this.brush_size) + "px";
brush.style.top = (event.pageY - this.brush_size) + "px";
} }
draw_move(self, event) { draw_move(self, event) {
const brush = this.brush; this.cursorX = event.pageX;
brush.style.width = (this.brush_size - 1) * 2 + "px"; this.cursorY = event.pageY;
brush.style.height = (this.brush_size - 1) * 2 + "px";
brush.style.left = (event.pageX - this.brush_size) + "px"; this.updateBrushPreview(self);
brush.style.top = (event.pageY - this.brush_size) + "px";
if (event instanceof TouchEvent || event.buttons === 1) { if (event instanceof TouchEvent || event.buttons === 1) {
event.preventDefault(); event.preventDefault();