feat(editor): the simulation opens sheets, not windows in the window
A tap on a device in the simulation now only chooses it; its three-dot button (or a long press) opens what Java's click opened: the desktop, and newly a switch's SAT table and a home router's NAT table, beside each card's data exchange. The desktop, the tables and the data exchange are no windows in the window any more but the simulation's sheet (SimulationSheet), after the dashboard's AppSheet: below the toolbar to the bottom, a head with icon, title, who else has it open, see-through and close. One at a time — it covers the surface. It stays over a return to the design with the program open on a desktop; a sheet whose device was removed closes. See-through fades the body (0.55) and keeps the head; the choice is kept in the browser. Java opens these as movable windows, several at once, with a click; named in CHANGES.md. Tests open through the menu (showFromMenu, showDesktop in editorPage.ts). Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
@@ -68,6 +68,29 @@ export async function onDevice(page: Page, id: string, across = 0.5, down = 0.4)
|
||||
return { x: box.x + box.width * across, y: box.y + box.height * down };
|
||||
}
|
||||
|
||||
/**
|
||||
* In the simulation: a tap chooses the device, its three-dot button opens its
|
||||
* menu, the item opens its sheet — a desktop, a table, the data exchange. A
|
||||
* sheet already open covers the surface; it is closed first. With `touch`,
|
||||
* by finger.
|
||||
*/
|
||||
export async function showFromMenu(page: Page, id: string, item: string | RegExp, touch = false): Promise<void> {
|
||||
const open = page.locator('.simulation-sheet__close');
|
||||
if ((await open.count()) > 0) await (touch ? open.tap() : open.click());
|
||||
const at = await onDevice(page, id);
|
||||
await (touch ? page.touchscreen.tap(at.x, at.y) : page.mouse.click(at.x, at.y));
|
||||
const button = page.locator('.device-menu-button');
|
||||
await (touch ? button.tap() : button.click());
|
||||
const entry = page.getByRole('menuitem', { name: item, exact: true });
|
||||
await (touch ? entry.tap() : entry.click());
|
||||
}
|
||||
|
||||
/** A computer's desktop as the simulation's sheet (showFromMenu), in either language; its section. */
|
||||
export async function showDesktop(page: Page, id: string, touch = false) {
|
||||
await showFromMenu(page, id, /^(Desktop anzeigen|Show desktop)$/, touch);
|
||||
return page.locator(`section[data-desktop="${id}"]`);
|
||||
}
|
||||
|
||||
/** The surface's scale. */
|
||||
export async function scaleOf(page: Page): Promise<number> {
|
||||
return Number(await page.locator('[data-zoom]').getAttribute('data-zoom'));
|
||||
|
||||
Reference in New Issue
Block a user