@thegraid/hexlib 1.0.0

package/dist/game-setup.js

@@ -0,0 +1,280 @@
+import { C, DropdownChoice, ParamGUI, blinkAndThen, makeStage, stime } from "@thegraid/easeljs-lib";
+import { Container } from "@thegraid/easeljs-module";
+import { parse as JSON5_parse } from 'json5';
+import { EBC, PidChoice } from "./choosers";
+import { GamePlay, NamedContainer } from "./game-play";
+import { Meeple } from "./meeple";
+import { Player } from "./player";
+import { ScenarioParser } from "./scenario-parser";
+import { RectShape } from "./shapes";
+import { LogReader, LogWriter } from "./stream-writer";
+import { Table } from "./table";
+import { TP } from "./table-params";
+import { Tile } from "./tile";
+/** show " R" for " N" */
+stime.anno = (obj) => {
+    let stage = (typeof obj !== 'string') ? (obj?.stage || obj?.table?.stage) : undefined;
+    return !!stage ? (!!stage.canvas ? " C" : " R") : " -";
+};
+;
+class MultiChoice extends DropdownChoice {
+    // constructor(items: MultiItem[], item_w: number, item_h: number, style?: DropdownStyle) {
+    //   super(items, item_w, item_h, style);
+    // }
+    select(item) {
+        this.changed(item);
+        return item;
+    }
+}
+/** initialize & reset & startup the application/game. */
+export class GameSetup {
+    qParams;
+    stage;
+    gamePlay;
+    paramGUIs;
+    netGUI; // paramGUIs[2]
+    /**
+     * ngAfterViewInit --> start here!
+     * @param canvasId supply undefined for 'headless' Stage
+     */
+    constructor(canvasId, qParams = []) {
+        this.qParams = qParams;
+        stime.fmt = "MM-DD kk:mm:ss.SSSL";
+        this.stage = makeStage(canvasId, false);
+        this.stage.snapToPixel = TP.snapToPixel;
+        this.setupToParseState(); // restart when/if 'SetState' button is clicked
+        this.setupToReadFileState(); // restart when/if 'LoadFile' button is clicked
+        Tile.loader.loadImages(() => this.startup(qParams));
+    }
+    /** set from qParams['n'] */
+    nPlayers = 2;
+    makeNplayers(gamePlay) {
+        // Create and Inject all the Players:
+        const allPlayers = gamePlay.allPlayers;
+        allPlayers.length = 0;
+        for (let ndx = 0; ndx < this.nPlayers; ndx++) {
+            new Player(ndx, gamePlay); // make real Players...
+        }
+        gamePlay.curPlayerNdx = 0; // gamePlay.setNextPlayer(0); ???
+        gamePlay.curPlayer = allPlayers[gamePlay.curPlayerNdx];
+    }
+    _netState = " "; // or "yes" or "ref"
+    set netState(val) {
+        this._netState = (val == "cnx") ? this._netState : val || " ";
+        this.gamePlay.ll(2) && console.log(stime(this, `.netState('${val}')->'${this._netState}'`));
+        this.netGUI?.selectValue("Network", val);
+    }
+    get netState() { return this._netState; }
+    set playerId(val) { this.netGUI?.selectValue("PlayerId", val || "     "); }
+    logTime_js;
+    logWriter = this.makeLogWriter();
+    makeLogWriter() {
+        const logTime_js = this.logTime_js = `log_${stime.fs('MM-DD_Lkk_mm')}.js`;
+        const logWriter = new LogWriter(logTime_js, '[\n', ']\n'); // terminate array, but insert before terminal
+        return logWriter;
+    }
+    restartable = false;
+    /** C-s ==> kill game, start a new one, possibly with new dbp */
+    restart(stateInfo) {
+        if (!this.restartable)
+            return;
+        let netState = this.netState;
+        // this.gamePlay.closeNetwork('restart')
+        // this.gamePlay.logWriter?.closeFile()
+        this.gamePlay.forEachPlayer(p => p.endGame());
+        Tile.allTiles.forEach(tile => tile.hex = undefined);
+        let deContainer = (cont) => {
+            cont.children.forEach(dObj => {
+                dObj.removeAllEventListeners();
+                if (dObj instanceof Container)
+                    deContainer(dObj);
+            });
+            cont.removeAllChildren();
+        };
+        deContainer(this.stage);
+        this.resetState(stateInfo);
+        // next tick, new thread...
+        setTimeout(() => this.netState = netState, 100); // onChange-> ("new", "join", "ref") initiate a new connection
+    }
+    /** override: invoked by restart(); with stateInfo JSON5_parse(stateText) */
+    resetState(stateInfo) {
+        const { mh, nh, hexRad } = stateInfo; // for example
+        TP.mHexes = mh ?? TP.mHexes;
+        TP.nHexes = nh ?? TP.nHexes;
+        TP.hexRad = hexRad ?? TP.hexRad;
+        this.startup();
+    }
+    /** read & parse State from text element */
+    setupToParseState() {
+        const parseStateButton = document.getElementById('parseStateButton');
+        const parseStateText = document.getElementById('parseStateText');
+        parseStateButton.onclick = () => {
+            const stateText = parseStateText.value;
+            const state = JSON5_parse(stateText);
+            state.Aname = state.Aname ?? `parseStateText`;
+            blinkAndThen(this.gamePlay.hexMap.mapCont.markCont, () => this.restart(state));
+        };
+    }
+    fileReadPromise;
+    async setupToReadFileState() {
+        const logReader = new LogReader(`log/date_time.js`, 'fsReadFileButton');
+        this.fileReadPromise = logReader.setButtonToReadFile();
+        const fileHandle = await this.fileReadPromise;
+        const fileText = await logReader.readFile(fileHandle);
+        const fullName = fileHandle.name;
+        const [fileName, ext] = fullName.split('.');
+        const readFileNameElt = document.getElementById('readFileName');
+        const readFileName = readFileNameElt.value;
+        const [fname, turnstr] = readFileName.split('@'); // fileName@turn
+        const turn = Number.parseInt(turnstr);
+        const state = this.extractStateFromString(fileName, fileText, turn);
+        this.setupToReadFileState(); // another thread to wait for next click
+        this.restart(state);
+    }
+    extractStateFromString(fileName, fileText, turn) {
+        const logArray = JSON5_parse(fileText);
+        const [, ...stateArray] = logArray;
+        const state = stateArray.find(state => state.turn === turn) ?? {};
+        state.Aname = `${fileName}@${turn}`;
+        return state;
+    }
+    /**
+     * Make new Table/layout & gamePlay/hexMap & Players.
+     * @param qParams from URL
+     */
+    startup(qParams = this.qParams) {
+        this.nPlayers = Math.min(TP.maxPlayers, qParams?.['n'] ? Number.parseInt(qParams?.['n']) : 2);
+        this.startScenario({ turn: 0, Aname: 'defaultScenario' });
+    }
+    /** scenario.turn indicate a FULL/SAVED scenario */
+    startScenario(scenario) {
+        Tile.allTiles = [];
+        Meeple.allMeeples = [];
+        Player.allPlayers = [];
+        const table = new Table(this.stage); // EventDispatcher, ScaleCont, GUI-Player
+        // Inject Table into GamePlay & make allPlayers:
+        const gamePlay = new GamePlay(scenario, table, this); // hexMap, players, fillBag, gStats, mouse/keyboard->GamePlay
+        this.gamePlay = gamePlay;
+        this.makeNplayers(gamePlay); // Players have: civics & meeples & TownSpec
+        // Inject GamePlay to Table; all the GUI components, makeAllDistricts(), addTerrain, initialRegions
+        table.layoutTable(gamePlay); // mutual injection & make all panelForPlayer
+        gamePlay.forEachPlayer(p => table.setPlayerScore(p, 0));
+        this.gamePlay.turnNumber = -1; // in prep for setNextPlayer or parseScenario
+        // Place Pieces and Figures on map:
+        this.parseScenenario(scenario); // may change gamePlay.turnNumber, gamePlay.phase (& conflictRegion)
+        this.gamePlay.logWriterLine0();
+        gamePlay.forEachPlayer(p => p.newGame(gamePlay)); // make Planner *after* table & gamePlay are setup
+        this.restartable = false;
+        this.makeGUIs(table);
+        this.restartable = true; // *after* makeLines has stablilized selectValue
+        table.startGame(scenario); // parseScenario; allTiles.makeDragable(); setNextPlayer();
+        return gamePlay;
+    }
+    makeGUIs(table) {
+        const scaleCont = table.scaleCont, scale = TP.hexRad / 60, cx = -200, cy = 250, d = 5;
+        // this.makeParamGUI(table.scaleCont, -400, 250);
+        const gpanel = (makeGUI, name, cx, cy, scale = 1) => {
+            const guiC = new NamedContainer(name, cx * scale, cy * scale);
+            // const map = table.hexMap.mapCont.parent;
+            scaleCont.addChildAt(guiC);
+            guiC.scaleX = guiC.scaleY = scale;
+            const gui = makeGUI.call(this, guiC); // @[0, 0]
+            guiC.x -= (gui.linew + d) * scale;
+            const bgr = new RectShape({ x: -d, y: -d, w: gui.linew + 2 * d, h: gui.ymax + 2 * d }, 'rgb(200,200,200,.5)', '');
+            guiC.addChildAt(bgr, 0);
+            table.dragger.makeDragable(guiC);
+            return gui;
+        };
+        let ymax = 0;
+        const gui3 = gpanel(this.makeNetworkGUI, 'NetGUI', cx, cy + ymax, scale);
+        ymax += gui3.ymax + 20;
+        const gui1 = gpanel(this.makeParamGUI, 'ParamGUI', cx, cy + ymax, scale);
+        ymax += gui1.ymax + 20;
+        const gui2 = gpanel(this.makeParamGUI2, 'AI_GUI', cx, cy + ymax, scale);
+        ymax += gui2.ymax + 20;
+        scaleCont.addChild(gui2.parent, gui1.parent, gui3.parent); // lower y values ABOVE to dropdown is not obscured
+        // TODO: dropdown to use given 'top' container!
+        gui1.stage.update();
+    }
+    scenarioParser;
+    parseScenenario(scenario) {
+        const hexMap = this.gamePlay.hexMap;
+        const scenarioParser = this.scenarioParser = new ScenarioParser(hexMap, this.gamePlay);
+        this.gamePlay.logWriter.writeLine(`// GameSetup.parseScenario: ${scenario.Aname}`);
+        scenarioParser.parseScenario(scenario);
+    }
+    /** affects the rules of the game & board
+     *
+     * ParamGUI   --> board & rules [under stats panel]
+     * ParamGUI2  --> AI Player     [left of ParamGUI]
+     * NetworkGUI --> network       [below ParamGUI2]
+     */
+    makeParamGUI(parent, x = 0, y = 0) {
+        const gui = new ParamGUI(TP, { textAlign: 'right' });
+        gui.makeParamSpec('hexRad', [30, 60, 90, 120], { fontColor: 'red' });
+        TP.hexRad;
+        gui.makeParamSpec('nHexes', [2, 3, 4, 5, 6, 7, 8, 9, 10, 11], { fontColor: 'red' });
+        TP.nHexes;
+        gui.makeParamSpec('mHexes', [1, 2, 3], { fontColor: 'red' });
+        TP.mHexes;
+        gui.spec("hexRad").onChange = (item) => { this.restart({ hexRad: item.value }); };
+        gui.spec("nHexes").onChange = (item) => { this.restart({ nh: item.value }); };
+        gui.spec("mHexes").onChange = (item) => { this.restart({ mh: item.value }); };
+        parent.addChild(gui);
+        gui.x = x; // (3*cw+1*ch+6*m) + max(line.width) - (max(choser.width) + 20)
+        gui.y = y;
+        gui.makeLines();
+        return gui;
+    }
+    /** configures the AI player */
+    makeParamGUI2(parent, x = 0, y = 0) {
+        const gui = new ParamGUI(TP, { textAlign: 'center' });
+        gui.makeParamSpec("log", [-1, 0, 1, 2], { style: { textAlign: 'right' } });
+        TP.log;
+        gui.makeParamSpec("maxPlys", [1, 2, 3, 4, 5, 6, 7, 8], { fontColor: "blue" });
+        TP.maxPlys;
+        gui.makeParamSpec("maxBreadth", [5, 6, 7, 8, 9, 10], { fontColor: "blue" });
+        TP.maxBreadth;
+        parent.addChild(gui);
+        gui.x = x;
+        gui.y = y;
+        gui.makeLines();
+        gui.stage.update();
+        return gui;
+    }
+    netColor = "rgba(160,160,160, .8)";
+    netStyle = { textAlign: 'right' };
+    /** controls multiplayer network participation */
+    makeNetworkGUI(parent, x = 0, y = 0) {
+        const gui = this.netGUI = new ParamGUI(TP, this.netStyle);
+        gui.makeParamSpec("Network", [" ", "new", "join", "no", "ref", "cnx"], { fontColor: "red" });
+        gui.makeParamSpec("PlayerId", ["     ", 0, 1, 2, 3, "ref"], { chooser: PidChoice, fontColor: "red" });
+        gui.makeParamSpec("networkGroup", [TP.networkGroup], { chooser: EBC, name: 'gid', fontColor: C.GREEN, style: { textColor: C.BLACK } });
+        TP.networkGroup;
+        gui.spec("Network").onChange = (item) => {
+            if (['new', 'join', 'ref'].includes(item.value)) {
+                const group = gui.findLine('networkGroup').chooser.editBox.innerText;
+                // this.gamePlay.closeNetwork()
+                // this.gamePlay.network(item.value, gui, group)
+            }
+            // if (item.value === "no") this.gamePlay.closeNetwork()     // provoked by ckey
+        };
+        this.stage.canvas?.parentElement?.addEventListener('paste', (ev) => {
+            const text = ev.clipboardData?.getData('Text');
+            ;
+            gui.findLine('networkGroup').chooser.setValue(text);
+        });
+        this.showNetworkGroup();
+        parent.addChild(gui);
+        gui.makeLines();
+        gui.x = x;
+        gui.y = y;
+        parent.stage.update();
+        return gui;
+    }
+    showNetworkGroup(group_name = TP.networkGroup) {
+        document.getElementById('group_name').innerText = group_name;
+        const line = this.netGUI.findLine("networkGroup"), chooser = line?.chooser;
+        chooser?.setValue(group_name, chooser.items[0], undefined);
+    }
+}

package/dist/game-state.js

@@ -0,0 +1,112 @@
+import { stime } from "@thegraid/common-lib";
+export class GameState {
+    gamePlay;
+    constructor(gamePlay) {
+        this.gamePlay = gamePlay;
+        Object.keys(this.states).forEach((key) => this.states[key].Aname = key);
+    }
+    state;
+    get table() { return this.gamePlay?.table; }
+    get curPlayer() { return this.gamePlay.curPlayer; }
+    saveGame() {
+        this.gamePlay.gameSetup.scenarioParser.saveState(this.gamePlay);
+    }
+    // [eventName, eventSpecial, phase, args]
+    saveState() {
+    }
+    parseState(args) {
+    }
+    startPhase = 'BeginTurn';
+    startArgs = [];
+    /** Bootstrap the Scenario: set bastetPlayer and then this.phase(startPhase, ...startArgs). */
+    start() {
+        this.phase(this.startPhase, ...this.startArgs);
+    }
+    /** set state and start with given args. */
+    phase(phase, ...args) {
+        console.log(stime(this, `.phase: ${this.state?.Aname ?? 'Initialize'} -> ${phase}`));
+        this.state = this.states[phase];
+        this.state.start(...args);
+    }
+    /** set label & paint button with color;
+     * empty label hides & disables.
+     * optional continuation function on 'drawend'.
+     */
+    doneButton(label, color = this.curPlayer.color, afterUpdate = undefined) {
+        const doneButton = this.table.doneButton;
+        doneButton.visible = !!label;
+        doneButton.label_text = label;
+        doneButton.paint(color, true);
+        doneButton.updateWait(false, afterUpdate);
+    }
+    /** invoked when 'Done' button clicked. [or whenever phase is 'done' by other means] */
+    done(...args) {
+        (this.state.done ?? ((...args) => { alert('no done method'); }))(...args);
+    }
+    undoAction() {
+        // const action = this.selectedAction;
+        // if (!action) return;
+        // this.states[action].undo?.();
+    }
+    states = {
+        BeginTurn: {
+            start: () => {
+                this.saveGame();
+                this.phase('ChooseAction');
+            },
+            done: () => {
+                this.phase('ChooseAction');
+            }
+        },
+        Move: {
+            start: () => {
+                this.doneButton('Move done');
+            },
+            done: (ok) => {
+                this.phase('EndAction');
+            },
+        },
+        Summon: {
+            start: () => {
+                this.doneButton('Summon done');
+            },
+            done: () => {
+                this.phase('EndAction');
+            },
+        },
+        EndAction: {
+            nextPhase: 'ChooseAction',
+            start: () => {
+                const nextPhase = this.state.nextPhase = 'Event';
+                this.phase(nextPhase); // directl -> nextPhase
+            },
+            done: () => {
+                this.phase(this.state.nextPhase ?? 'Start'); // TS want defined...
+            }
+        },
+        Conflict: {
+            start: () => {
+            },
+        },
+        ConflictRegionDone: {
+            start: () => {
+                this.phase('ConflictNextRegion');
+            }
+        },
+        ConflictDone: {
+            start: () => {
+                this.phase('EventDone');
+            },
+            // TODO: coins from Scales to Toth, add Devotion(Scales)
+        },
+        EndTurn: {
+            start: () => {
+                this.gamePlay.endTurn();
+                this.phase('BeginTurn');
+            },
+        },
+        /** Hathor: after addFollowers() Ankh-Event, BuildMonument, Worshipful, Summon-AnubisRansom */
+    };
+    setup() {
+    }
+}

package/dist/hex-intfs.js

@@ -0,0 +1,82 @@
+/** Hexagonal canonical directions */
+export var Dir;
+(function (Dir) {
+    Dir[Dir["C"] = 0] = "C";
+    Dir[Dir["NE"] = 1] = "NE";
+    Dir[Dir["E"] = 2] = "E";
+    Dir[Dir["SE"] = 3] = "SE";
+    Dir[Dir["SW"] = 4] = "SW";
+    Dir[Dir["W"] = 5] = "W";
+    Dir[Dir["NW"] = 6] = "NW";
+})(Dir || (Dir = {}));
+/** Hex things */
+export var H;
+(function (H) {
+    H.degToRadians = Math.PI / 180;
+    H.sqrt3 = Math.sqrt(3); // 1.7320508075688772
+    H.sqrt3_2 = H.sqrt3 / 2;
+    H.infin = String.fromCodePoint(0x221E);
+    H.C = "C"; // not a HexDir, but identifies a Center
+    H.N = "N";
+    H.S = "S";
+    H.E = "E";
+    H.W = "W";
+    H.NE = "NE";
+    H.SE = "SE";
+    H.SW = "SW";
+    H.NW = "NW";
+    H.EN = "EN";
+    H.ES = "ES";
+    H.WS = "WS";
+    H.WN = "WN";
+    function hexBounds(r, tilt = 0) {
+        // dp(...6), so tilt: 30 | 0; being nsAxis (ewTopo) or ewAxis (nsTopo);
+        const w = r * Math.cos(H.degToRadians * tilt);
+        const h = r * Math.cos(H.degToRadians * (tilt - 30));
+        return { x: -w, y: -h, width: 2 * w, height: 2 * h };
+    }
+    H.hexBounds = hexBounds;
+    /** neighborhood topology, E-W & N-S orientation; even(n0) & odd(n1) rows: */
+    H.ewEvenRow = {
+        NE: { dc: 0, dr: -1 }, E: { dc: 1, dr: 0 }, SE: { dc: 0, dr: 1 },
+        SW: { dc: -1, dr: 1 }, W: { dc: -1, dr: 0 }, NW: { dc: -1, dr: -1 }
+    };
+    H.ewOddRow = {
+        NE: { dc: 1, dr: -1 }, E: { dc: 1, dr: 0 }, SE: { dc: 1, dr: 1 },
+        SW: { dc: 0, dr: 1 }, W: { dc: -1, dr: 0 }, NW: { dc: 0, dr: -1 }
+    };
+    H.nsEvenCol = {
+        EN: { dc: +1, dr: -1 }, N: { dc: 0, dr: -1 }, ES: { dc: +1, dr: 0 },
+        WS: { dc: -1, dr: 0 }, S: { dc: 0, dr: +1 }, WN: { dc: -1, dr: -1 }
+    };
+    H.nsOddCol = {
+        EN: { dc: 1, dr: 0 }, N: { dc: 0, dr: -1 }, ES: { dc: 1, dr: 1 },
+        WS: { dc: -1, dr: 1 }, S: { dc: 0, dr: 1 }, WN: { dc: -1, dr: 0 }
+    };
+    function nsTopo(rc) { return (rc.col % 2 == 0) ? H.nsEvenCol : H.nsOddCol; }
+    H.nsTopo = nsTopo;
+    ;
+    function ewTopo(rc) { return (rc.row % 2 == 0) ? H.ewEvenRow : H.ewOddRow; }
+    H.ewTopo = ewTopo;
+    ;
+    /** includes E & W, suitable for EwTopo */
+    H.ewDirs = [H.NE, H.E, H.SE, H.SW, H.W, H.NW]; // directions for EwTOPO
+    /** includes N & S, suitable for NsTopo */
+    H.nsDirs = [H.N, H.EN, H.ES, H.S, H.WS, H.WN]; // directions for NsTOPO
+    /** all hexDirs */
+    H.hexDirs = H.ewDirs.concat(H.nsDirs); // standard direction signifiers () ClockWise
+    // angles for ewTopo!
+    H.ewDirRot = { NE: 30, E: 90, SE: 150, SW: 210, W: 270, NW: 330 };
+    // angles for nwTopo!
+    H.nsDirRot = { N: 0, EN: 60, ES: 120, S: 180, WS: 240, WN: 300 };
+    H.dirRot = { ...H.ewDirRot, ...H.nsDirRot };
+    H.dirRev = { N: H.S, S: H.N, E: H.W, W: H.E, NE: H.SW, SE: H.NW, SW: H.NE, NW: H.SE, ES: H.WN, EN: H.WS, WS: H.EN, WN: H.ES };
+    H.dirRevEW = { E: H.W, W: H.E, NE: H.SW, SE: H.NW, SW: H.NE, NW: H.SE };
+    H.dirRevNS = { N: H.S, S: H.N, EN: H.WS, ES: H.WN, WS: H.EN, WN: H.ES };
+    H.rotDir = { 0: 'N', 30: 'NE', 60: 'EN', 90: 'E', 120: 'ES', 150: 'SE', 180: 'S', 210: 'SW', 240: 'WS', 270: 'W', 300: 'WN', 330: 'NW', 360: 'N' };
+    H.capColor1 = "rgba(150,  0,   0, .8)"; // unplayable: captured last turn
+    H.capColor2 = "rgba(128,  80, 80, .8)"; // protoMove would capture
+    H.sacColor1 = "rgba(228,  80,  0, .8)"; // unplayable: sacrifice w/o capture
+    H.sacColor2 = "rgba(228, 120,  0, .6)"; // isplayable: sacrifice w/ capture
+    H.fjColor = "rgba(228, 228,  0, .8)"; // ~unplayable: jeopardy w/o capture
+})(H || (H = {}));