Reference · Playable surface mazes
SolidMountOptionstype
A PLAYABLE MAZE OVER A SOLID IN ANY PAGE: mountSolid(host, { recipe }) draws a cube, a globe or a solid of triangles with a maze over the whole of
its surface, and plays it by touch and mouse.
The solid is looked at from outside, and only the side facing you is drawn. You draw by pressing the start (or the end of your line) and dragging
along the passages: the line follows the cells, cannot cross a wall, and drawing back shortens it, exactly as in a flat maze, because it is
the very game (game.ts) played on a different graph. You turn the solid by dragging anywhere that is not the end of your line (on the solid or off it),
with two fingers (which also pinch to zoom and twist), by the arrow buttons or keys, and by Face me, which brings the end of your line round to face
you. And when your line nears the edge of the side you can see, the solid turns by itself, gently, to keep the end of the line in view
(edgeTurn, on unless turned off), so a line can be drawn across an edge from one face to the next without letting go.
What it keeps and tells is a flat board's: mazeGame(), run() and restore() (the line as steps, and the stones after a ~), the events
meikyuu-move, meikyuu-solve and meikyuu-stones, the data attributes on the host, stones laid beside the line, undo, restart and hints. None of it
knows how the solid is turned: the answer is a list of cells.
It paints on a canvas (the solid is redrawn whole at each turn, in a few dozen strokes), so it needs a page, and nothing it draws can be selected.
The handle is also on the host, as host.meikyuuSolid.
Import it
import type { SolidMountOptions } from "@johnmorrisdotca/meikyuu/3d/play";
Definition
type SolidMountOptions = MazeLook & {
recipe: string | SolidRecipe;
tap?: boolean;
hints?: boolean;
banner?: boolean;
controls?: boolean;
zoom?: boolean;
edgeTurn?: boolean;
turnMode?: boolean;
sound?: boolean;
stones?: StoneOption;
draw?: boolean;
still?: boolean;
gutter?: number;
reserve?: number;
language?: MeikyuuLanguage;
onMove?: (detail: SolidEventDetail) => void;
onSolve?: (detail: SolidEventDetail) => void;
onStones?: (detail: SolidEventDetail) => void;
};
Members
| Name | Type | Description |
|---|---|---|
board (optional) | MeikyuuBoardLook | "paper" | "wood" | "green" | "blue" | "red" | "black" | undefined | A board by name, or its colours. |
trail (optional) | "green" | "blue" | "red" | "violet" | "orange" | (string & {}) | undefined | The line's colour: one of the named ones, or any CSS colour. |
wall (optional) | number | undefined | The thickness of a wall, in cells. Default 0.12. |
line (optional) | number | undefined | The thickness of the line, in cells. Default 0.34. |
recipe | string | SolidRecipe | The maze, as its code ( |
tap (optional) | boolean | undefined | A tap runs the line along the corridor to the next fork. Default false. |
hints (optional) | boolean | undefined | Offer the Hint button. Default true. |
banner (optional) | boolean | undefined | Show the message over the solid when the maze is solved ("Solved in 3 strokes."); a tap on it, its close button or Escape puts it away. False for none (the line of words under the solid still says so). Default true. |
controls (optional) | boolean | undefined | The buttons and the lines of words under the solid. Default true. |
zoom (optional) | boolean | undefined | The zoom buttons. Default true. |
edgeTurn (optional) | boolean | undefined | The solid turns by itself as the end of a line being drawn nears the edge of the side in view. Default true. |
turnMode (optional) | boolean | undefined | Start with every one-finger drag turning the solid, drawing nothing (the Turn only button toggles it). Default false. |
sound (optional) | boolean | undefined | Make a sound for each thing that happens. Default false. |
stones (optional) | StoneOption | undefined | Stones, as for a flat maze ( |
draw (optional) | boolean | undefined | False for a solid that can be turned but not drawn on (a finished maze looked at). Default true. |
still (optional) | boolean | undefined | True for a picture of a solid: it takes no input at all, not a touch, a key or the wheel, so the page scrolls over it, and it is not focusable. Default false. |
gutter (optional) | number | undefined | The page left beside the box on each side, in pixels, at least. Default 24. |
reserve (optional) | number | undefined | What the window holds besides the box, in pixels. Default 200. |
language (optional) | MeikyuuLanguage | undefined | |
onMove (optional) | ((detail: SolidEventDetail) => void) | undefined | |
onSolve (optional) | ((detail: SolidEventDetail) => void) | undefined | |
onStones (optional) | ((detail: SolidEventDetail) => void) | undefined |
Examples
import type { MazeRecipe } from "@johnmorrisdotca/meikyuu";
import type { SolidRecipe } from "@johnmorrisdotca/meikyuu/3d";
import type { SolidMountOptions } from "@johnmorrisdotca/meikyuu/3d/play";
const recipe: MazeRecipe = {shape:"square",w:5,h:5,algorithm:"backtracker",mode:"to-goal",seed:42};
const solidRecipe: SolidRecipe = {kind:"cube",n:2,algorithm:"backtracker",seed:42};
const value: SolidMountOptions = {recipe:solidRecipe,language:"en"};
console.log(value);{
recipe: { kind: 'cube', n: 2, algorithm: 'backtracker', seed: 42 },
language: 'en'
}What it prints (run when this page was built)