feat(editor): the three-dot button in the simulation too
A tap on a device in the simulation now also chooses it, so its three-dot button shows as in the design, wherever the simulation's menu offers something (the desktop, each card's data exchange; a switch has none). Java's action of the tap stays (desktop, switch and NAT tables), a tap beside lets go. The device sheet stays closed — the design is locked — and the others see no frame. Java opens that menu only with a right click. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
@@ -390,7 +390,8 @@ export function Editor({ doc, createSimHost, projectName, readOnly = false, froz
|
||||
|
||||
// The others: told this editor's chosen device and open windows (a window is open only while the simulation runs).
|
||||
const windows = simulating ? desktops.map((desktop) => (desktop.viewer === 'capture' ? windowKey('capture') : windowKey(desktop.viewer ?? 'desktop', desktop.id))) : [];
|
||||
const told = JSON.stringify([selected?.id ?? null, windows, moving]);
|
||||
// A device chosen in the simulation only carries its three-dot button: the others see it chosen only in the design.
|
||||
const told = JSON.stringify([simulating ? null : (selected?.id ?? null), windows, moving]);
|
||||
const publish = presence?.publish;
|
||||
useEffect(() => {
|
||||
const [device, open, drag] = JSON.parse(told) as [string | null, string[], Moving | null];
|
||||
@@ -484,6 +485,7 @@ export function Editor({ doc, createSimHost, projectName, readOnly = false, froz
|
||||
else if (kind === 'networkSwitch') openDesktop(id, 'sat');
|
||||
else if (kind === 'gateway') openDesktop(id, 'nat');
|
||||
}}
|
||||
hasMenu={(target) => menuItems(target).length > 0}
|
||||
onMenu={(target, at) => {
|
||||
if (readOnly && !simulating) return;
|
||||
if (editorMode === 'documentation') {
|
||||
@@ -640,8 +642,8 @@ export function Editor({ doc, createSimHost, projectName, readOnly = false, froz
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
{/* Java shows the settings of the device that is chosen; closing them lets go of it, as a click beside it does. */}
|
||||
{selected === undefined ? null : (
|
||||
{/* Java shows the settings of the device that is chosen (not in the simulation: the design is locked); closing them lets go of it, as a click beside it does. */}
|
||||
{selected === undefined || simulating ? null : (
|
||||
<DeviceSheet
|
||||
key={selected.id}
|
||||
doc={doc}
|
||||
|
||||
@@ -77,9 +77,10 @@ export interface CanvasProps {
|
||||
/** A cable drawn active, as Java draws the cable of the card whose tab is open (Kabel.setAktiv). */
|
||||
readonly highlightedLink?: string | null;
|
||||
/**
|
||||
* The simulation: a tap on a device activates it (a computer's desktop),
|
||||
* a long press opens its menu; nothing moves, nothing is selected, as in
|
||||
* Java's simulation mode. The documentation mode: see above.
|
||||
* The simulation: a tap on a device activates it (a computer's desktop)
|
||||
* and chooses it, so that its three-dot button shows as in the design; a
|
||||
* long press opens its menu; nothing moves, as in Java's simulation mode.
|
||||
* The documentation mode: see above.
|
||||
*/
|
||||
readonly mode?: 'design' | 'simulation' | 'documentation';
|
||||
/**
|
||||
@@ -97,6 +98,8 @@ export interface CanvasProps {
|
||||
/** The cables that carry a frame now, drawn as Java draws them then (JCablePanel.farbeBlinken). */
|
||||
readonly activeLinks?: ReadonlySet<string>;
|
||||
readonly onActivate?: (id: string) => void;
|
||||
/** In the simulation: whether the chosen device has a menu at all (a switch has none) — only then its three-dot button. */
|
||||
readonly hasMenu?: (target: Selection) => boolean;
|
||||
}
|
||||
|
||||
const NO_LINKS: ReadonlySet<string> = new Set();
|
||||
@@ -274,6 +277,7 @@ export const Canvas = forwardRef<CanvasHandle, CanvasProps>(function Canvas(
|
||||
chosenBy = NO_CHOICES,
|
||||
activeLinks = NO_LINKS,
|
||||
onActivate,
|
||||
hasMenu,
|
||||
onDocFrame,
|
||||
renderDocText,
|
||||
},
|
||||
@@ -542,7 +546,7 @@ export const Canvas = forwardRef<CanvasHandle, CanvasProps>(function Canvas(
|
||||
return;
|
||||
}
|
||||
if (now.kind === 'background') {
|
||||
if (!now.moved && !simulating) {
|
||||
if (!now.moved) {
|
||||
onSelect?.(null);
|
||||
if (cableFrom !== null) onCableStart?.(null);
|
||||
}
|
||||
@@ -554,7 +558,10 @@ export const Canvas = forwardRef<CanvasHandle, CanvasProps>(function Canvas(
|
||||
}
|
||||
if (now.longPressed) return;
|
||||
if (simulating) {
|
||||
if (!now.moved) onActivate?.(now.id);
|
||||
if (!now.moved) {
|
||||
onSelect?.({ kind: 'device', id: now.id });
|
||||
onActivate?.(now.id);
|
||||
}
|
||||
return;
|
||||
}
|
||||
if (locked) {
|
||||
@@ -706,7 +713,7 @@ export const Canvas = forwardRef<CanvasHandle, CanvasProps>(function Canvas(
|
||||
const corner = toScreen(current, { x: item.x, y: item.y });
|
||||
return renderDocText(item, { left: corner.x, top: corner.y, width: item.width * current.scale, height: item.height * current.scale, scale: current.scale });
|
||||
})()}
|
||||
{menuButton === null || selection === null || simulating || locked ? null : (
|
||||
{menuButton === null || selection === null || (simulating ? hasMenu?.(selection) !== true : locked) ? null : (
|
||||
<button
|
||||
type="button"
|
||||
className="device-menu-button"
|
||||
|
||||
Reference in New Issue
Block a user