From 7962249191e846598301cc41b04f6b4ec2e914c1 Mon Sep 17 00:00:00 2001 From: grabowski Date: Sat, 24 Oct 2026 17:52:23 +0700 Subject: [PATCH] Middle mouse button only moves the camera A press with the middle (or any other non-left) mouse button never reaches the Studio's drag, place or select handlers: dragging pans the view even on a selected object or while placing, and a click selects nothing. A middle click no longer starts the browser's autoscroll. check_studio covers a middle-drag on the selected truck (it stays put, the view moves), a middle click on another object (the selection is kept), and a middle-drag while placing (nothing is placed). --- studio/index.html | 2 +- tools/check_studio.py | 37 +++++++++++++++++++++++++++++++++++++ viewer/isokit-view.js | 13 ++++++++++--- 3 files changed, 48 insertions(+), 4 deletions(-) diff --git a/studio/index.html b/studio/index.html index c319511..16f2610 100644 --- a/studio/index.html +++ b/studio/index.html @@ -70,7 +70,7 @@ document.documentElement.setAttribute("data-theme",t);})(); TurnR / Shift+R, or the ⟲ ⟳ buttons Copy / deleteCtrl+D / Delete Undo / redoCtrl+Z / Ctrl+Y - Viewdrag the ground to pan, Ctrl + wheel or pinch to zoom, ↺ ↻ to rotate, levels to look inside + Viewdrag the ground to pan, or drag with the middle mouse button anywhere (it never moves an object); Ctrl + wheel or pinch to zoom, ↺ ↻ to rotate, levels to look inside Agent✦ Agent opens a chat with a language model that edits the scene for you; Undo takes its steps back. Drag the window by its title, resize it at the top-left corner MCPconnect an AI agent over MCP; its edits appear here live (see the panel when nothing is selected) diff --git a/tools/check_studio.py b/tools/check_studio.py index 9dbe5a9..0f79b5f 100644 --- a/tools/check_studio.py +++ b/tools/check_studio.py @@ -198,6 +198,43 @@ with sync_playwright() as p: pg.evaluate("__studio.select(null)") pg.wait_for_timeout(400) + # the middle mouse button only moves the camera: it never drags, selects or places anything + pg.locator('#objects li[data-id="truck"]').click() + pg.evaluate("__studio.view.focus('truck', 3)") + pg.wait_for_timeout(400) + t0 = obj("truck") + p0 = at(t0["x"], t0["y"]) + tb = pg.locator('.iso-svg g[data-obj="truck"] path.iso-t').first.bounding_box() + mx, my = tb["x"] + tb["width"] / 2, tb["y"] + tb["height"] / 2 + pg.mouse.move(mx, my) + pg.mouse.down(button="middle") + for i in range(1, 11): + pg.mouse.move(mx + 8 * i, my + 5 * i) + pg.wait_for_timeout(15) + pg.mouse.up(button="middle") + pg.wait_for_timeout(600) + t1, p1 = obj("truck"), at(t0["x"], t0["y"]) + check((t1["x"], t1["y"]) == (t0["x"], t0["y"]) and abs(p1[0] - p0[0] - 80) < 3 and abs(p1[1] - p0[1] - 50) < 3, + f"a middle-drag on the selected truck pans the view and leaves the truck where it was (moved {p1[0] - p0[0]:.0f}, {p1[1] - p0[1]:.0f} px)") + gb = pg.locator('.iso-svg g[data-obj="genset"] path.iso-t').first.bounding_box() + pg.mouse.click(gb["x"] + gb["width"] / 2, gb["y"] + gb["height"] / 2, button="middle") + pg.wait_for_timeout(400) + check(pg.evaluate("__studio.S.sel") == "truck", "a middle click on another object does not select it") + n2 = len(doc()["objects"]) + pg.locator('.st-tile[data-type="tree"]').click() + pg.mouse.move(mx, my) + pg.mouse.down(button="middle") + for i in range(1, 11): + pg.mouse.move(mx - 8 * i, my - 5 * i) + pg.wait_for_timeout(15) + pg.mouse.up(button="middle") + pg.wait_for_timeout(600) + check(len(doc()["objects"]) == n2 and pg.evaluate("__studio.S.placing") == "tree", + "while placing, a middle-drag pans and places nothing") + pg.keyboard.press("Escape") + pg.evaluate("__studio.select(null)") + pg.wait_for_timeout(300) + # an agent edits over MCP: the open Studio follows init = mcp({"jsonrpc": "2.0", "id": 1, "method": "initialize", "params": {"protocolVersion": "2025-06-18", "capabilities": {}, "clientInfo": {"name": "test", "version": "0"}}}) check(init["result"]["serverInfo"]["name"] == "isokit", "MCP initialize") diff --git a/viewer/isokit-view.js b/viewer/isokit-view.js index 0fa2c93..5089a87 100644 --- a/viewer/isokit-view.js +++ b/viewer/isokit-view.js @@ -286,10 +286,14 @@ var ptrs = {}, down = null, moved = false, pinch = null, hoverId = null, claimed = false; function npt() { return Object.keys(ptrs).length; } svg.addEventListener("pointerdown", function (e) { + // the middle (or any other non-left) mouse button only moves the camera: it never + // drags, places or selects an object, whatever is under the pointer + var cam = e.pointerType === "mouse" && e.button !== 0; + if (cam && e.button === 1) e.preventDefault(); ptrs[e.pointerId] = { x: e.clientX, y: e.clientY }; if (npt() === 1) { - down = { x: e.clientX, y: e.clientY, id: e.pointerId, t: e.target }; moved = false; - claimed = !!(opts.interact && call(opts.interact.down, e, { obj: targetObj(e.target), id: targetId(e.target), world: toWorld(e.clientX, e.clientY, 0) })); + down = { x: e.clientX, y: e.clientY, id: e.pointerId, t: e.target, cam: cam }; moved = false; + claimed = !cam && !!(opts.interact && call(opts.interact.down, e, { obj: targetObj(e.target), id: targetId(e.target), world: toWorld(e.clientX, e.clientY, 0) })); if (claimed) { try { svg.setPointerCapture(e.pointerId); } catch (er) { /* ignore */ } } } if (npt() === 2) { @@ -336,12 +340,15 @@ if (npt() < 2) pinch = null; if (wasDown) { if (claimed) call(opts.interact.up, e, { moved: moved, world: toWorld(e.clientX, e.clientY, 0), cancel: e.type !== "pointerup" }); - else if (!moved && e.type === "pointerup") pick(e.target, e.clientX, e.clientY); + else if (!moved && !down.cam && e.type === "pointerup") pick(e.target, e.clientX, e.clientY); } if (npt() === 0) { down = null; claimed = false; wrap.classList.remove("iso-dragging"); } } svg.addEventListener("pointerup", up); svg.addEventListener("pointercancel", up); + // no browser autoscroll or paste on a middle click + svg.addEventListener("mousedown", function (e) { if (e.button === 1) e.preventDefault(); }); + svg.addEventListener("auxclick", function (e) { if (e.button === 1) e.preventDefault(); }); svg.addEventListener("pointerleave", function (e) { if (e.pointerType === "mouse" && hoverId) { setHover(hoverId, false); hoverId = null; if (!st.sel) hideTip(); } }); svg.addEventListener("wheel", function (e) { if (!(e.ctrlKey || e.metaKey || opts.wheelZoom)) return;