UNPKG

@zsnout/ithkuil

Version:

A set of tools which can generate and parse romanized Ithkuil text and which can generate Ithkuil script from text and JSON data.

112 lines (111 loc) 7.3 kB
import { jsx as _jsx, jsxs as _jsxs } from "@zsnout/ithkuil-jsx/jsx-runtime"; import { deepFreeze } from "../generate/index.js"; import { Anchor, HANDWRITTEN_CORES, HANDWRITTEN_DIACRITICS, HANDWRITTEN_PRIMARY_CORES, HANDWRITTEN_REGISTERS, HANDWRITTEN_VALENCE, Secondary, Tertiary, Translate, CORES, CORE_DIACRITICS, PRIMARY_CORES, REGISTERS, VALENCE, } from "../script/index.js"; import { scale } from "../script/utilities/scale.js"; document.body.append(_jsx("script", { children: `new EventSource("/esbuild").addEventListener("change", () => location.reload())` })); const img = document.createElement("img"); img.src = "https://m.media-amazon.com/images/I/610wqKEjAJL._AC_UF894,1000_QL80_.jpg"; const SCALING_FACTOR = 0.75; const KEY_WIDTH = 220 * SCALING_FACTOR; const KEY_HEIGHT = 210 * SCALING_FACTOR; const KEY_MARGIN = 10 * SCALING_FACTOR; const KEYS = deepFreeze({ "`": [37, 212, "diacritic", "TWO_PART_DIAG_BAR", "CURVE_TO_BOTTOM_WITH_LINE"], "1": [282, 212, "diacritic", "DOT"], "2": [525, 212, "diacritic", "HORIZ_WITH_BOTTOM_LINE"], "3": [769, 212, "diacritic", "VERT_WITH_RIGHT_LINE"], "4": [1012, 212, "diacritic", "CURVE_TO_TOP"], "5": [1255, 212, "diacritic", "DIAG_BAR"], "6": [1497, 212, "diacritic", "CURVE_TO_BOTTOM"], "7": [1740, 212, "diacritic", "VERT_WITH_LEFT_LINE"], "8": [1983, 212, "diacritic", "HORIZ_WITH_TOP_LINE"], "9": [2226, 212, "diacritic", "HORIZ_BAR"], "0": [2468, 212, "diacritic", "VERT_BAR"], "-": [2712, 212, "diacritic", "CURVE_TO_LEFT", "CURVE_TO_LEFT_WITH_DOT"], "=": [2955, 212, "diacritic", "CURVE_TO_RIGHT", "CURVE_TO_RIGHT_WITH_DOT"], Q: [400, 445, "core", "p", "b"], W: [645, 445, "core", "t", "d"], E: [888, 445, "core", "k", "g"], R: [1132, 445, "core", "f", "v"], T: [1375, 445, "core", "ţ", "ḑ"], Y: [1618, 445, "core", "s", "z"], U: [1860, 445, "core", "š", "ž"], I: [2103, 445, "core", "ç", "h"], O: [2346, 445, "core", "c", "ż"], P: [2589, 445, "core", "č", "j"], "[": [2831, 445, "ext", "d_WITH_LINE", "g_WITH_LINE"], "]": [3075, 445, "ext", "'"], "|": [3318, 445, "ext", "EJECTIVE", "VELARIZED"], A: [461, 681, "other", "valence"], // valence S: [706, 681, "other", "phase"], // phase D: [949, 681, "other", "rotate"], // rotate F: [1193, 681, "spec", "BSC", "OBJ"], G: [1436, 681, "other", "up"], // up/left H: [1679, 681, "other", "down"], // down/right J: [1921, 681, "spec", "CTE", "CSV"], K: [2164, 681, "core", "STRESSED_SYLLABLE_PLACEHOLDER"], L: [2407, 681, "other", "effect"], // effect ";": [2650, 681, "other", "aspect"], // aspect "'": [2892, 681, "other", "register"], // register Z: [582, 914, "core", "l", "ļ"], X: [827, 914, "core", "x"], C: [1070, 914, "ext", "w", "y"], V: [1314, 914, "core", "m"], B: [1557, 914, "ext", "CORE_GEMINATE", "EXTENSION_GEMINATE"], N: [1800, 914, "core", "n", "ň"], M: [2042, 914, "core", "STANDARD_PLACEHOLDER", "TONAL_PLACEHOLDER"], ",": [2285, 914, "core", "ALPHABETIC_PLACEHOLDER", "BIAS"], ".": [2528, 914, "core", "r", "ř"], "/": [2771, 914, "ext", "p_WITH_LINE", "r_FLIPPED"], }); function Handwritten(props) { return _jsx("g", { children: props.children }); // return ( // <g // stroke-width={props.strokeWidth ?? 5} // fill="none" // stroke={props.stroke || "black"} // stroke-linecap="round" // stroke-linejoin="round" // > // {props.children} // </g> // ) } function Calligraphic(props) { return (_jsx("g", { "stroke-width": 0, fill: props.fill ?? "black", children: props.children })); } const svg = (_jsx("svg", { viewBox: `0 0 ${3576 * SCALING_FACTOR} ${1400 * SCALING_FACTOR}`, children: Object.values(KEYS).map(([x, y, type, a, b]) => (_jsx(Translate, { x: x * SCALING_FACTOR, y: y * SCALING_FACTOR, children: _jsxs("g", { fill: "white", children: [_jsx("path", { d: `M ${KEY_MARGIN} ${KEY_MARGIN} h ${KEY_WIDTH - 2 * KEY_MARGIN} v ${KEY_HEIGHT - 2 * KEY_MARGIN} h ${2 * KEY_MARGIN - KEY_WIDTH}`, opacity: 1, fill: "rgb(37,37,41)" }), _jsx("g", { children: _jsx(Handwritten, { stroke: "white", strokeWidth: 5, children: _jsx(Translate, { x: KEY_WIDTH / 2, y: KEY_HEIGHT / 2, children: type == "ext" ? _jsx(Secondary, { bottom: a, core: "STRESSED_SYLLABLE_PLACEHOLDER" }) : type == "core" ? _jsx(Anchor, { at: "cc", children: _jsx("path", { d: CORES[a].shape }) }) : type == "diacritic" ? b ? _jsx(Anchor, { at: "cc", children: _jsxs("g", { children: [_jsx(Anchor, { at: "bc", children: _jsx("path", { d: scale(CORE_DIACRITICS[b], 1.5) }) }), _jsx(Anchor, { at: "tc", y: a == "TWO_PART_DIAG_BAR" ? 10 : 20, children: _jsx("path", { d: scale(CORE_DIACRITICS[a], 1.5) }) })] }) }) : _jsx(Anchor, { at: "cc", children: _jsx("path", { d: scale(CORE_DIACRITICS[a], 2) }) }) : type == "spec" ? _jsx(Anchor, { at: "cc", children: _jsx("path", { d: PRIMARY_CORES[a] }) }) : a == "register" ? _jsx(Anchor, { at: "cc", children: _jsx("path", { d: scale(REGISTERS.alphabetic.NRR, 2) }) }) : a == "valence" ? _jsx(Anchor, { at: "cc", children: _jsx("path", { d: VALENCE.MNO }) }) : a == "phase" ? _jsx(Tertiary, { top: "PUN" }) : a == "effect" ? _jsx(Tertiary, { top: "1:BEN" }) : a == "aspect" ? _jsx(Tertiary, { top: "RTR" }) : a == "up" ? _jsx(Anchor, { at: "cc", children: _jsx("path", { d: "M 0 0 l 20 -20 l 20 20" }) }) : a == "down" ? _jsx(Anchor, { at: "cc", children: _jsx("path", { d: "M 0 0 l 20 20 l 20 -20" }) }) : a == "rotate" ? _jsx(Anchor, { at: "cc", children: _jsx("path", { d: "M 0 0 a 30 30 0 1 0 -30 -30 l -10 -20 m 10 20 l 20 -10" }) }) : _jsx("g", {}) }) }) })] }) }))) })); // @ts-ignore img.style = // @ts-ignore svg.style = `display: block; position: absolute; top: 0; left: 0; width: ${3576 * SCALING_FACTOR}px; height: ${1400 * SCALING_FACTOR}px`; document.body.append(img, svg);