From a08eb418a661791d2767743859e8ffad5defbbbd Mon Sep 17 00:00:00 2001 From: PeekabooSteam Date: Mon, 4 Sep 2023 22:54:01 +0100 Subject: [PATCH] Stash commit to open a new branch. --- client/package-lock.json | 36 ++++---- client/package.json | 4 +- client/src/index.ts | 92 ++++++++++++------- client/src/indexapp.ts | 15 +-- client/src/olympusapp.ts | 10 ++ client/src/other/manager.ts | 2 + client/src/plugin/plugin.ts | 14 ++- .../plugins/helloworld/pluginhelloworld.ts | 12 ++- client/src/shortcut/shortcut.ts | 70 ++++++++++++++ client/src/shortcut/shortcutmanager.ts | 18 ++++ 10 files changed, 203 insertions(+), 70 deletions(-) create mode 100644 client/src/shortcut/shortcut.ts create mode 100644 client/src/shortcut/shortcutmanager.ts diff --git a/client/package-lock.json b/client/package-lock.json index 44c2fe56..95dcb9ea 100644 --- a/client/package-lock.json +++ b/client/package-lock.json @@ -6179,9 +6179,9 @@ "dev": true }, "node_modules/nodemon": { - "version": "2.0.20", - "resolved": "https://registry.npmjs.org/nodemon/-/nodemon-2.0.20.tgz", - "integrity": "sha512-Km2mWHKKY5GzRg6i1j5OxOHQtuvVsgskLfigG25yTtbyfRGn/GNvIbRyOf1PSCKJ2aT/58TiuUsuOU5UToVViw==", + "version": "2.0.22", + "resolved": "https://registry.npmjs.org/nodemon/-/nodemon-2.0.22.tgz", + "integrity": "sha512-B8YqaKMmyuCO7BowF1Z1/mkPqLk6cs/l63Ojtd6otKjMx47Dq1utxfRxcavH1I7VSaL8n5BUaoutadnsX3AAVQ==", "dev": true, "dependencies": { "chokidar": "^3.5.2", @@ -6231,9 +6231,9 @@ "dev": true }, "node_modules/nodemon/node_modules/semver": { - "version": "5.7.1", - "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.1.tgz", - "integrity": "sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ==", + "version": "5.7.2", + "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.2.tgz", + "integrity": "sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g==", "dev": true, "bin": { "semver": "bin/semver" @@ -6840,9 +6840,9 @@ } }, "node_modules/semver": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz", - "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==", + "version": "6.3.1", + "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz", + "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==", "dev": true, "bin": { "semver": "bin/semver.js" @@ -12508,9 +12508,9 @@ "dev": true }, "nodemon": { - "version": "2.0.20", - "resolved": "https://registry.npmjs.org/nodemon/-/nodemon-2.0.20.tgz", - "integrity": "sha512-Km2mWHKKY5GzRg6i1j5OxOHQtuvVsgskLfigG25yTtbyfRGn/GNvIbRyOf1PSCKJ2aT/58TiuUsuOU5UToVViw==", + "version": "2.0.22", + "resolved": "https://registry.npmjs.org/nodemon/-/nodemon-2.0.22.tgz", + "integrity": "sha512-B8YqaKMmyuCO7BowF1Z1/mkPqLk6cs/l63Ojtd6otKjMx47Dq1utxfRxcavH1I7VSaL8n5BUaoutadnsX3AAVQ==", "dev": true, "requires": { "chokidar": "^3.5.2", @@ -12547,9 +12547,9 @@ "dev": true }, "semver": { - "version": "5.7.1", - "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.1.tgz", - "integrity": "sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ==", + "version": "5.7.2", + "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.2.tgz", + "integrity": "sha512-cBznnQ9KjJqU67B52RMC65CMarK2600WFnbkcaiwWq3xy/5haFJlshgnpjovMVJ+Hff49d8GEn0b87C5pDQ10g==", "dev": true }, "supports-color": { @@ -13058,9 +13058,9 @@ } }, "semver": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz", - "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==", + "version": "6.3.1", + "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz", + "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==", "dev": true }, "send": { diff --git a/client/package.json b/client/package.json index e199321e..d3df3e95 100644 --- a/client/package.json +++ b/client/package.json @@ -14,9 +14,9 @@ "debug": "~2.6.9", "ejs": "^3.1.8", "express": "~4.16.1", + "express-basic-auth": "^1.2.1", "morgan": "~1.9.1", - "save": "^2.9.0", - "express-basic-auth": "^1.2.1" + "save": "^2.9.0" }, "devDependencies": { "@babel/preset-env": "^7.21.4", diff --git a/client/src/index.ts b/client/src/index.ts index 3a925873..aabfedcf 100644 --- a/client/src/index.ts +++ b/client/src/index.ts @@ -20,6 +20,9 @@ import { BLUE_COMMANDER, GAME_MASTER, RED_COMMANDER } from "./constants/constant import { ServerStatusPanel } from "./panels/serverstatuspanel"; import { WeaponsManager } from "./weapon/weaponsmanager"; import { IndexApp } from "./indexapp"; +import { ShortcutKeyboard } from "./shortcut/shortcut"; +import { ShortcutManager } from "./shortcut/shortcutmanager"; +import { OlympusApp } from "./olympusapp"; var map: Map; @@ -86,9 +89,6 @@ function setup() { atc.startUpdates(); } - /* Setup event handlers */ - setupEvents(); - /* Load the config file */ getConfig(readConfig); @@ -114,8 +114,9 @@ function setup() { "unitDataTable": unitDataTable, "unitsManager": unitsManager }); - - indexApp.start(); + + /* Setup event handlers */ + setupEvents( indexApp ); } @@ -131,7 +132,7 @@ function readConfig(config: any) { } } -function setupEvents() { +function setupEvents( indexApp:OlympusApp ) { /* Generic clicks */ document.addEventListener("click", (ev) => { @@ -158,48 +159,69 @@ function setupEvents() { } }); - /* Keyup events */ - document.addEventListener("keyup", ev => { - if (keyEventWasInInput(ev)) { - return; - } - switch (ev.code) { - case "KeyT": + + const shortcutManager = indexApp.getShortcutManager(); + + shortcutManager .add( "toggleDemo", new ShortcutKeyboard({ + "callback": () => { toggleDemoEnabled(); - break; - case "Quote": + }, + "code": "KeyT" + }) + ) + .add( "toggleUnitDataTable", new ShortcutKeyboard({ + "callback": () => { unitDataTable.toggle(); - break - case "Space": + }, + "code": "Quote" + }) + ) + .add( "togglePause", new ShortcutKeyboard({ + "callback": () => { setPaused(!getPaused()); - break; - case "KeyW": case "KeyA": case "KeyS": case "KeyD": - case "ArrowLeft": case "ArrowRight": case "ArrowUp": case "ArrowDown": + }, + "code": "space" + }) + ); + + [ "KeyW", "KeyA", "KeyS", "KeyD", "ArrowLeft", "ArrowRight", "ArrowUp", "ArrowDown" ].forEach( code => { + shortcutManager.add( `pan${code}keydown`, new ShortcutKeyboard({ + "callback": ( ev:KeyboardEvent ) => { getMap().handleMapPanning(ev); - break; - case "Digit1": case "Digit2": case "Digit3": case "Digit4": case "Digit5": case "Digit6": case "Digit7": case "Digit8": case "Digit9": - // Using the substring because the key will be invalid when pressing the Shift key + }, + "code": code, + "event": "keydown" + })); + }); + + [ "KeyW", "KeyA", "KeyS", "KeyD", "ArrowLeft", "ArrowRight", "ArrowUp", "ArrowDown" ].forEach( code => { + shortcutManager.add( `pan${code}keyup`, new ShortcutKeyboard({ + "callback": ( ev:KeyboardEvent ) => { + getMap().handleMapPanning(ev); + }, + "code": code + })); + }); + + [ "Digit1", "Digit2", "Digit3", "Digit4", "Digit5", "Digit6", "Digit7", "Digit8", "Digit9" ].forEach( code => { + shortcutManager.add( `hotgroup${code}`, new ShortcutKeyboard({ + "callback": ( ev:KeyboardEvent ) => { if (ev.ctrlKey && ev.shiftKey) getUnitsManager().selectedUnitsAddToHotgroup(parseInt(ev.code.substring(5))); else if (ev.ctrlKey && !ev.shiftKey) getUnitsManager().selectedUnitsSetHotgroup(parseInt(ev.code.substring(5))); else getUnitsManager().selectUnitsByHotgroup(parseInt(ev.code.substring(5))); - break; - } + }, + "code": code + })); }); + /* Keyup events */ + + /* Keydown events */ - document.addEventListener("keydown", ev => { - if (keyEventWasInInput(ev)) { - return; - } - switch (ev.code) { - case "KeyW": case "KeyA": case "KeyS": case "KeyD": case "ArrowLeft": case "ArrowRight": case "ArrowUp": case "ArrowDown": - getMap().handleMapPanning(ev); - break; - } - }); + document.addEventListener("closeDialog", (ev: CustomEventInit) => { ev.detail._element.closest(".ol-dialog").classList.add("hide"); diff --git a/client/src/indexapp.ts b/client/src/indexapp.ts index 30c20287..3f567586 100644 --- a/client/src/indexapp.ts +++ b/client/src/indexapp.ts @@ -45,13 +45,14 @@ export class IndexApp extends OlympusApp { // this.setMap( config.map ); // Panels - this.getPanelsManager().add( "connectionStatus", config.panels.connectionStatus ); - this.getPanelsManager().add( "hotgroup", config.panels.hotgroup ); - this.getPanelsManager().add( "log", config.panels.log ); - this.getPanelsManager().add( "mouseInfo", config.panels.mouseInfo ); - this.getPanelsManager().add( "serverStatus", config.panels.serverStatus ); - this.getPanelsManager().add( "unitControl", config.panels.unitControl ); - this.getPanelsManager().add( "unitInfo", config.panels.unitInfo ); + this.getPanelsManager() + .add( "connectionStatus", config.panels.connectionStatus ) + .add( "hotgroup", config.panels.hotgroup ) + .add( "log", config.panels.log ) + .add( "mouseInfo", config.panels.mouseInfo ) + .add( "serverStatus", config.panels.serverStatus ) + .add( "unitControl", config.panels.unitControl ) + .add( "unitInfo", config.panels.unitInfo ); // Popup this.getPanelsManager().add( "unitPopup", config.panels.infoPopup ); diff --git a/client/src/olympusapp.ts b/client/src/olympusapp.ts index aa031d7f..6d344161 100644 --- a/client/src/olympusapp.ts +++ b/client/src/olympusapp.ts @@ -3,6 +3,7 @@ import { FeatureSwitches } from "./features/featureswitches"; import { Map } from "./map/map"; import { MissionHandler } from "./mission/missionhandler"; import { PanelsManager } from "./panels/panelsmanager"; +import { ShortcutManager } from "./shortcut/shortcutmanager"; import { UnitsManager } from "./unit/unitsmanager"; export interface IOlympusApp { @@ -18,6 +19,7 @@ export abstract class OlympusApp { #map!: Map; #missionHandler: MissionHandler; #panelsManager: PanelsManager = new PanelsManager( this ); + #shortcutManager: ShortcutManager = new ShortcutManager( this ); #unitDataTable: UnitDataTable; #unitsManager: UnitsManager; @@ -38,10 +40,18 @@ export abstract class OlympusApp { return this.#map; } + getMissionHandler() { + return this.#missionHandler; + } + getPanelsManager() { return this.#panelsManager; } + getShortcutManager() { + return this.#shortcutManager; + } + getUnitDataTable() { return this.#unitDataTable; } diff --git a/client/src/other/manager.ts b/client/src/other/manager.ts index 80d2bddd..92bfd949 100644 --- a/client/src/other/manager.ts +++ b/client/src/other/manager.ts @@ -29,6 +29,8 @@ export abstract class Manager { this.#items[ name ] = item; + return this; + } get( name:string ) { diff --git a/client/src/plugin/plugin.ts b/client/src/plugin/plugin.ts index 130ade43..97204563 100644 --- a/client/src/plugin/plugin.ts +++ b/client/src/plugin/plugin.ts @@ -1,12 +1,11 @@ import { OlympusApp } from "../olympusapp"; - -export interface PluginInterface { -} +const templateParser = require( "ejs" ); export abstract class Plugin { #olympusApp!:OlympusApp; protected name = ""; + #templateParser:any; constructor( olympusApp:OlympusApp, pluginName:string ) { @@ -16,8 +15,9 @@ export abstract class Plugin { throw new Error( `Plugin names must match regex: ${regex}` ); } - this.name = pluginName; - this.#olympusApp = olympusApp; + this.name = pluginName; + this.#olympusApp = olympusApp; + this.#templateParser = templateParser; } @@ -29,4 +29,8 @@ export abstract class Plugin { return this.#olympusApp; } + getTemplateParser() { + return this.#templateParser; + } + } \ No newline at end of file diff --git a/client/src/plugins/helloworld/pluginhelloworld.ts b/client/src/plugins/helloworld/pluginhelloworld.ts index a7126650..398fee6f 100644 --- a/client/src/plugins/helloworld/pluginhelloworld.ts +++ b/client/src/plugins/helloworld/pluginhelloworld.ts @@ -1,8 +1,8 @@ import { OlympusApp } from "../../olympusapp"; -import { Plugin, PluginInterface } from "../../plugin/plugin"; +import { Plugin } from "../../plugin/plugin"; -export class PluginHelloWorld extends Plugin implements PluginInterface { +export class PluginHelloWorld extends Plugin { constructor( olympusApp:OlympusApp ) { @@ -23,7 +23,13 @@ export class PluginHelloWorld extends Plugin implements PluginInterface { } }); - //const tpl = new ejs + const tpl = ` +
+ Hello world! +
+ `; + + panel.getElement().innerHTML = this.getTemplateParser().render( tpl ); } } \ No newline at end of file diff --git a/client/src/shortcut/shortcut.ts b/client/src/shortcut/shortcut.ts new file mode 100644 index 00000000..a2b9bac0 --- /dev/null +++ b/client/src/shortcut/shortcut.ts @@ -0,0 +1,70 @@ +import { keyEventWasInInput } from "../other/utils"; + +interface IShortcut { + altKey?:boolean; + callback:CallableFunction; + ctrlKey?:boolean; + name?:string; + shiftKey?:boolean; +} + +interface IShortcutKeyboard extends IShortcut { + code:string; + event?:"keydown"|"keyup"; +} + +interface IShortcutMouse extends IShortcut { + button:number; + event:"mousedown"|"mouseup"; +} + +export abstract class Shortcut { + + #config:IShortcut + + constructor( config:IShortcut ) { + this.#config = config; + } + + getConfig() { + return this.#config; + } + +} + +export class ShortcutKeyboard extends Shortcut { + + constructor( config:IShortcutKeyboard ) { + + config.event = config.event || "keyup"; + + super( config ); + + document.addEventListener( config.event, ( ev:any ) => { + + if ( ev instanceof KeyboardEvent === false || keyEventWasInInput( ev )) { + return; + } + + if ( config.code !== ev.code ) { + return; + } + + if ( ( ( typeof config.altKey !== "boolean" ) || ( typeof config.altKey === "boolean" && ev.altKey === config.altKey ) ) + && ( ( typeof config.ctrlKey !== "boolean" ) || ( typeof config.ctrlKey === "boolean" && ev.ctrlKey === config.ctrlKey ) ) + && ( ( typeof config.shiftKey !== "boolean" ) || ( typeof config.shiftKey === "boolean" && ev.shiftKey === config.shiftKey ) ) ) { + config.callback( ev ); + } + }); + + } + +} + +export class ShortcutMouse extends Shortcut { + + constructor( config:IShortcutMouse ) { + super( config ); + } + +} \ No newline at end of file diff --git a/client/src/shortcut/shortcutmanager.ts b/client/src/shortcut/shortcutmanager.ts new file mode 100644 index 00000000..af35324a --- /dev/null +++ b/client/src/shortcut/shortcutmanager.ts @@ -0,0 +1,18 @@ +import { OlympusApp } from "../olympusapp"; +import { Manager } from "../other/manager"; +import { Shortcut } from "./shortcut"; + +export class ShortcutManager extends Manager { + + constructor( olympusApp:OlympusApp ) { + + super( olympusApp ); + + } + + add( name:string, shortcut:Shortcut ) { + super.add( name, shortcut ); + return this; + } + +} \ No newline at end of file