Archives/tobspr_shapez.io
1
0
Fork 0
mirror of https://github.com/tobspr/shapez.io.git synced 2026-03-02 03:39:21 +00:00
Code Issues Projects Releases Wiki Activity

Add customizable keybindings & watermark

Browse Source
This commit is contained in:
tobspr
2020-05-19 09:14:40 +02:00
parent 2968fe3788
commit 3714a59fca
30 changed files with 581 additions and 129 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
src/js/game/camera.js
View File

@@ -17,6 +17,7 @@ import { clamp } from "../core/utils";
import { mixVector, Vector } from "../core/vector";
import { BasicSerializableObject, types } from "../savegame/serialization";
import { GameRoot } from "./root";
import { KEYMAPPINGS } from "./key_action_mapper";
const logger = createLogger("camera");
@@ -330,12 +331,12 @@ export class Camera extends BasicSerializableObject {
*/
bindKeys() {
const mapper = this.root.gameState.keyActionMapper;
mapper.getBinding("map_move_up").add(() => (this.keyboardForce.y = -1));
mapper.getBinding("map_move_down").add(() => (this.keyboardForce.y = 1));
mapper.getBinding("map_move_right").add(() => (this.keyboardForce.x = 1));
mapper.getBinding("map_move_left").add(() => (this.keyboardForce.x = -1));
mapper.getBinding(KEYMAPPINGS.ingame.mapMoveUp).add(() => (this.keyboardForce.y = -1));
mapper.getBinding(KEYMAPPINGS.ingame.mapMoveDown).add(() => (this.keyboardForce.y = 1));
mapper.getBinding(KEYMAPPINGS.ingame.mapMoveRight).add(() => (this.keyboardForce.x = 1));
mapper.getBinding(KEYMAPPINGS.ingame.mapMoveLeft).add(() => (this.keyboardForce.x = -1));
mapper.getBinding("center_map").add(() => this.centerOnMap());
mapper.getBinding(KEYMAPPINGS.ingame.centerMap).add(() => this.centerOnMap());
}
centerOnMap() {
@@ -867,19 +868,19 @@ export class Camera extends BasicSerializableObject {
let forceY = 0;
const actionMapper = this.root.gameState.keyActionMapper;
if (actionMapper.getBinding("map_move_up").currentlyDown) {
if (actionMapper.getBinding(KEYMAPPINGS.ingame.mapMoveUp).currentlyDown) {
forceY -= 1;
}
if (actionMapper.getBinding("map_move_down").currentlyDown) {
if (actionMapper.getBinding(KEYMAPPINGS.ingame.mapMoveDown).currentlyDown) {
forceY += 1;
}
if (actionMapper.getBinding("map_move_left").currentlyDown) {
if (actionMapper.getBinding(KEYMAPPINGS.ingame.mapMoveLeft).currentlyDown) {
forceX -= 1;
}
if (actionMapper.getBinding("map_move_right").currentlyDown) {
if (actionMapper.getBinding(KEYMAPPINGS.ingame.mapMoveRight).currentlyDown) {
forceX += 1;
}

8
src/js/game/hud/base_hud_part.js
View File

@@ -154,10 +154,10 @@ export class BaseHUDPart {
*/
forwardMapMovementKeybindings(sourceMapper) {
sourceMapper.forward(this.root.gameState.keyActionMapper, [
"map_move_up",
"map_move_right",
"map_move_down",
"map_move_left",
"mapMoveUp",
"mapMoveRight",
"mapMoveDown",
"mapMoveLeft",
]);
}
}

10
src/js/game/hud/hud.js
View File

@@ -23,6 +23,8 @@ import { HUDNotifications, enumNotificationType } from "./parts/notifications";
import { HUDSettingsMenu } from "./parts/settings_menu";
import { HUDDebugInfo } from "./parts/debug_info";
import { HUDEntityDebugger } from "./parts/entity_debugger";
import { KEYMAPPINGS } from "../key_action_mapper";
import { HUDWatermark } from "./parts/watermark";
export class GameHUD {
/**
@@ -76,6 +78,10 @@ export class GameHUD {
this.parts.entityDebugger = new HUDEntityDebugger(this.root);
}
if (!G_IS_STANDALONE && G_IS_RELEASE) {
this.parts.watermark = new HUDWatermark(this.root);
}
const frag = document.createDocumentFragment();
for (const key in this.parts) {
this.parts[key].createElements(frag);
@@ -88,7 +94,7 @@ export class GameHUD {
}
this.internalInitSignalConnections();
this.root.gameState.keyActionMapper.getBinding("toggle_hud").add(this.toggleUi, this);
this.root.gameState.keyActionMapper.getBinding(KEYMAPPINGS.ingame.toggleHud).add(this.toggleUi, this);
}
/**
@@ -186,7 +192,7 @@ export class GameHUD {
* @param {DrawParameters} parameters
*/
drawOverlays(parameters) {
const partsOrder = [];
const partsOrder = ["watermark"];
for (let i = 0; i < partsOrder.length; ++i) {
if (this.parts[partsOrder[i]]) {

21
src/js/game/hud/parts/building_placer.js
View File

@@ -19,6 +19,7 @@ import { defaultBuildingVariant, MetaBuilding } from "../../meta_building";
import { BaseHUDPart } from "../base_hud_part";
import { DynamicDomAttach } from "../dynamic_dom_attach";
import { T } from "../../../translations";
import { KEYMAPPINGS } from "../../key_action_mapper";
export class HUDBuildingPlacer extends BaseHUDPart {
initialize() {
@@ -30,11 +31,13 @@ export class HUDBuildingPlacer extends BaseHUDPart {
this.fakeEntity = null;
const keyActionMapper = this.root.gameState.keyActionMapper;
keyActionMapper.getBinding("building_abort_placement").add(this.abortPlacement, this);
keyActionMapper.getBinding("back").add(this.abortPlacement, this);
keyActionMapper
.getBinding(KEYMAPPINGS.placement.abortBuildingPlacement)
.add(this.abortPlacement, this);
keyActionMapper.getBinding(KEYMAPPINGS.general.back).add(this.abortPlacement, this);
keyActionMapper.getBinding("rotate_while_placing").add(this.tryRotate, this);
keyActionMapper.getBinding("cycle_variants").add(this.cycleVariants, this);
keyActionMapper.getBinding(KEYMAPPINGS.placement.rotateWhilePlacing).add(this.tryRotate, this);
keyActionMapper.getBinding(KEYMAPPINGS.placement.cycleBuildingVariants).add(this.cycleVariants, this);
this.domAttach = new DynamicDomAttach(this.root, this.element, {});
@@ -281,7 +284,9 @@ export class HUDBuildingPlacer extends BaseHUDPart {
this.buildingInfoElements.label.innerHTML = T.buildings[metaBuilding.id].name;
this.buildingInfoElements.descText.innerHTML = T.buildings[metaBuilding.id].description;
const binding = this.root.gameState.keyActionMapper.getBinding("building_" + metaBuilding.getId());
const binding = this.root.gameState.keyActionMapper.getBinding(
KEYMAPPINGS.buildings[metaBuilding.getId()]
);
this.buildingInfoElements.hotkey.innerHTML = T.ingame.buildingPlacement.hotkeyLabel.replace(
"<key>",
"<code class='keybinding'>" + binding.getKeyCodeString() + "</code>"
@@ -322,7 +327,9 @@ export class HUDBuildingPlacer extends BaseHUDPart {
T.ingame.buildingPlacement.cycleBuildingVariants.replace(
"<key>",
"<code class='keybinding'>" +
this.root.gameState.keyActionMapper.getBinding("cycle_variants").getKeyCodeString() +
this.root.gameState.keyActionMapper
.getBinding(KEYMAPPINGS.placement.cycleBuildingVariants)
.getKeyCodeString() +
"</code>"
)
);
@@ -452,7 +459,7 @@ export class HUDBuildingPlacer extends BaseHUDPart {
) {
// Succesfully placed
if (metaBuilding.getFlipOrientationAfterPlacement()) {
if (metaBuilding.getFlipOrientationAfterPlacement() && !this.root.app.inputMgr.ctrlIsDown) {
this.currentBaseRotation = (180 + this.currentBaseRotation) % 360;
}

5
src/js/game/hud/parts/buildings_toolbar.js
View File

@@ -14,6 +14,7 @@ import { MetaTrashBuilding } from "../../buildings/trash";
import { MetaUndergroundBeltBuilding } from "../../buildings/underground_belt";
import { MetaBuilding } from "../../meta_building";
import { BaseHUDPart } from "../base_hud_part";
import { KEYMAPPINGS } from "../../key_action_mapper";
const toolbarBuildings = [
MetaBeltBaseBuilding,
@@ -65,7 +66,7 @@ export class HUDBuildingsToolbar extends BaseHUDPart {
for (let i = 0; i < toolbarBuildings.length; ++i) {
const metaBuilding = gMetaBuildingRegistry.findByClass(toolbarBuildings[i]);
const binding = actionMapper.getBinding("building_" + metaBuilding.getId());
const binding = actionMapper.getBinding(KEYMAPPINGS.buildings[metaBuilding.getId()]);
const itemContainer = makeDiv(items, null, ["building"]);
itemContainer.setAttribute("data-icon", "building_icons/" + metaBuilding.getId() + ".png");
@@ -91,7 +92,7 @@ export class HUDBuildingsToolbar extends BaseHUDPart {
);
this.lastSelectedIndex = 0;
actionMapper.getBinding("cycle_buildings").add(this.cycleBuildings, this);
actionMapper.getBinding(KEYMAPPINGS.placement.cycleBuildings).add(this.cycleBuildings, this);
}
update() {

5
src/js/game/hud/parts/game_menu.js
View File

@@ -3,6 +3,7 @@ import { makeDiv, randomInt } from "../../../core/utils";
import { SOUNDS } from "../../../platform/sound";
import { enumNotificationType } from "./notifications";
import { T } from "../../../translations";
import { KEYMAPPINGS } from "../../key_action_mapper";
export class HUDGameMenu extends BaseHUDPart {
initialize() {}
@@ -14,7 +15,7 @@ export class HUDGameMenu extends BaseHUDPart {
id: "shop",
label: "Upgrades",
handler: () => this.root.hud.parts.shop.show(),
keybinding: "menu_open_shop",
keybinding: KEYMAPPINGS.ingame.menuOpenShop,
badge: () => this.root.hubGoals.getAvailableUpgradeCount(),
notification: /** @type {[string, enumNotificationType]} */ ([
T.ingame.notifications.newUpgrade,
@@ -25,7 +26,7 @@ export class HUDGameMenu extends BaseHUDPart {
id: "stats",
label: "Stats",
handler: () => this.root.hud.parts.statistics.show(),
keybinding: "menu_open_stats",
keybinding: KEYMAPPINGS.ingame.menuOpenStats,
},
];

16
src/js/game/hud/parts/keybinding_overlay.js
View File

@@ -1,6 +1,6 @@
import { BaseHUDPart } from "../base_hud_part";
import { makeDiv } from "../../../core/utils";
import { getStringForKeyCode } from "../../key_action_mapper";
import { getStringForKeyCode, KEYMAPPINGS } from "../../key_action_mapper";
import { TrackedState } from "../../../core/tracked_state";
import { queryParamOptions } from "../../../core/query_parameters";
import { T } from "../../../translations";
@@ -32,16 +32,16 @@ export class HUDKeybindingOverlay extends BaseHUDPart {
[],
`
<div class="binding">
<code class="keybinding">${getKeycode("center_map")}</code>
<code class="keybinding">${getKeycode(KEYMAPPINGS.ingame.centerMap)}</code>
<label>${T.ingame.keybindingsOverlay.centerMap}</label>
</div>
<div class="binding">
<code class="keybinding leftMouse"></code><i></i>
<code class="keybinding">${getKeycode("map_move_up")}</code>
<code class="keybinding">${getKeycode("map_move_left")}</code>
<code class="keybinding">${getKeycode("map_move_down")}</code>
<code class="keybinding">${getKeycode("map_move_right")}</code>
<code class="keybinding">${getKeycode(KEYMAPPINGS.ingame.mapMoveUp)}</code>
<code class="keybinding">${getKeycode(KEYMAPPINGS.ingame.mapMoveLeft)}</code>
<code class="keybinding">${getKeycode(KEYMAPPINGS.ingame.mapMoveDown)}</code>
<code class="keybinding">${getKeycode(KEYMAPPINGS.ingame.mapMoveRight)}</code>
<label>${T.ingame.keybindingsOverlay.moveMap}</label>
</div>
@@ -55,12 +55,12 @@ export class HUDKeybindingOverlay extends BaseHUDPart {
<div class="binding placementOnly">
<code class="keybinding rightMouse"></code><i></i>
<code class="keybinding">${getKeycode("building_abort_placement")}</code>
<code class="keybinding">${getKeycode(KEYMAPPINGS.placement.abortBuildingPlacement)}</code>
<label>${T.ingame.keybindingsOverlay.stopPlacement}</label>
</div>
<div class="binding placementOnly">
<code class="keybinding">${getKeycode("rotate_while_placing")}</code>
<code class="keybinding">${getKeycode(KEYMAPPINGS.placement.rotateWhilePlacing)}</code>
<label>${T.ingame.keybindingsOverlay.rotateBuilding}</label>
</div>

13
src/js/game/hud/parts/mass_selector.js
View File

@@ -10,15 +10,18 @@ import { DynamicDomAttach } from "../dynamic_dom_attach";
import { createLogger } from "../../../core/logging";
import { enumMouseButton } from "../../camera";
import { T } from "../../../translations";
import { KEYMAPPINGS } from "../../key_action_mapper";
const logger = createLogger("hud/mass_selector");
export class HUDMassSelector extends BaseHUDPart {
createElements(parent) {
const removalKeybinding = this.root.gameState.keyActionMapper
.getBinding("confirm_mass_delete")
.getBinding(KEYMAPPINGS.massSelect.confirmMassDelete)
.getKeyCodeString();
const abortKeybinding = this.root.gameState.keyActionMapper
.getBinding(KEYMAPPINGS.general.back)
.getKeyCodeString();
const abortKeybinding = this.root.gameState.keyActionMapper.getBinding("back").getKeyCodeString();
this.element = makeDiv(
parent,
@@ -43,8 +46,10 @@ export class HUDMassSelector extends BaseHUDPart {
this.root.camera.movePreHandler.add(this.onMouseMove, this);
this.root.camera.upPostHandler.add(this.onMouseUp, this);
this.root.gameState.keyActionMapper.getBinding("back").add(this.onBack, this);
this.root.gameState.keyActionMapper.getBinding("confirm_mass_delete").add(this.confirmDelete, this);
this.root.gameState.keyActionMapper.getBinding(KEYMAPPINGS.general.back).add(this.onBack, this);
this.root.gameState.keyActionMapper
.getBinding(KEYMAPPINGS.massSelect.confirmMassDelete)
.add(this.confirmDelete, this);
this.domAttach = new DynamicDomAttach(this.root, this.element);
}

7
src/js/game/hud/parts/settings_menu.js
View File

@@ -2,7 +2,7 @@ import { BaseHUDPart } from "../base_hud_part";
import { makeDiv, formatSeconds, formatBigNumberFull } from "../../../core/utils";
import { DynamicDomAttach } from "../dynamic_dom_attach";
import { InputReceiver } from "../../../core/input_receiver";
import { KeyActionMapper } from "../../key_action_mapper";
import { KeyActionMapper, KEYMAPPINGS } from "../../key_action_mapper";
import { T } from "../../../translations";
import { StaticMapEntityComponent } from "../../components/static_map_entity";
import { ItemProcessorComponent } from "../../components/item_processor";
@@ -72,7 +72,7 @@ export class HUDSettingsMenu extends BaseHUDPart {
}
initialize() {
this.root.gameState.keyActionMapper.getBinding("back").add(this.show, this);
this.root.gameState.keyActionMapper.getBinding(KEYMAPPINGS.general.back).add(this.show, this);
this.domAttach = new DynamicDomAttach(this.root, this.background, {
attachClass: "visible",
@@ -80,8 +80,7 @@ export class HUDSettingsMenu extends BaseHUDPart {
this.inputReciever = new InputReceiver("settingsmenu");
this.keyActionMapper = new KeyActionMapper(this.root, this.inputReciever);
this.keyActionMapper.getBinding("back").add(this.close, this);
this.keyActionMapper.getBinding(KEYMAPPINGS.general.back).add(this.close, this);
this.close();
}

6
src/js/game/hud/parts/shop.js
View File

@@ -3,7 +3,7 @@ import { ClickDetector } from "../../../core/click_detector";
import { InputReceiver } from "../../../core/input_receiver";
import { formatBigNumber, makeDiv } from "../../../core/utils";
import { T } from "../../../translations";
import { KeyActionMapper } from "../../key_action_mapper";
import { KeyActionMapper, KEYMAPPINGS } from "../../key_action_mapper";
import { UPGRADES } from "../../upgrades";
import { BaseHUDPart } from "../base_hud_part";
import { DynamicDomAttach } from "../dynamic_dom_attach";
@@ -168,8 +168,8 @@ export class HUDShop extends BaseHUDPart {
this.inputReciever = new InputReceiver("shop");
this.keyActionMapper = new KeyActionMapper(this.root, this.inputReciever);
this.keyActionMapper.getBinding("back").add(this.close, this);
this.keyActionMapper.getBinding("menu_open_shop").add(this.close, this);
this.keyActionMapper.getBinding(KEYMAPPINGS.general.back).add(this.close, this);
this.keyActionMapper.getBinding(KEYMAPPINGS.ingame.menuOpenShop).add(this.close, this);
this.close();

6
src/js/game/hud/parts/statistics.js
View File

@@ -1,7 +1,7 @@
import { Math_min } from "../../../core/builtins";
import { InputReceiver } from "../../../core/input_receiver";
import { makeButton, makeDiv, removeAllChildren, capitalizeFirstLetter } from "../../../core/utils";
import { KeyActionMapper } from "../../key_action_mapper";
import { KeyActionMapper, KEYMAPPINGS } from "../../key_action_mapper";
import { enumAnalyticsDataSource } from "../../production_analytics";
import { BaseHUDPart } from "../base_hud_part";
import { DynamicDomAttach } from "../dynamic_dom_attach";
@@ -81,8 +81,8 @@ export class HUDStatistics extends BaseHUDPart {
this.inputReciever = new InputReceiver("statistics");
this.keyActionMapper = new KeyActionMapper(this.root, this.inputReciever);
this.keyActionMapper.getBinding("back").add(this.close, this);
this.keyActionMapper.getBinding("menu_open_stats").add(this.close, this);
this.keyActionMapper.getBinding(KEYMAPPINGS.general.back).add(this.close, this);
this.keyActionMapper.getBinding(KEYMAPPINGS.ingame.menuOpenStats).add(this.close, this);
/** @type {Object.<string, HUDShapeStatisticsHandle>} */
this.activeHandles = {};

27
src/js/game/hud/parts/watermark.js Normal file
View File

@@ -0,0 +1,27 @@
import { BaseHUDPart } from "../base_hud_part";
import { DrawParameters } from "../../../core/draw_parameters";
export class HUDWatermark extends BaseHUDPart {
createElements() {}
initialize() {}
/**
*
* @param {DrawParameters} parameters
*/
drawOverlays(parameters) {
const w = this.root.gameWidth;
parameters.context.fillStyle = "#f77";
parameters.context.font = "50px GameFont";
parameters.context.textAlign = "center";
parameters.context.fillText("DEMO VERSION", w / 2, 100);
parameters.context.fillStyle = "#aaaca9";
parameters.context.font = "20px GameFont";
parameters.context.fillText("Get shapez.io on steam for the full experience!", w / 2, 140);
parameters.context.textAlign = "left";
}
}

92
src/js/game/key_action_mapper.js
View File

@@ -7,55 +7,72 @@ import { Application } from "../application";
import { Signal, STOP_PROPAGATION } from "../core/signal";
import { IS_MOBILE } from "../core/config";
import { T } from "../translations";
import { JSON_stringify } from "../core/builtins";
function key(str) {
return str.toUpperCase().charCodeAt(0);
}
// TODO: Configurable
export const defaultKeybindings = {
export const KEYMAPPINGS = {
general: {
confirm: { keyCode: 13 }, // enter
back: { keyCode: 27, builtin: true }, // escape
},
ingame: {
map_move_up: { keyCode: key("W") },
map_move_right: { keyCode: key("D") },
map_move_down: { keyCode: key("S") },
map_move_left: { keyCode: key("A") },
mapMoveUp: { keyCode: key("W") },
mapMoveRight: { keyCode: key("D") },
mapMoveDown: { keyCode: key("S") },
mapMoveLeft: { keyCode: key("A") },
center_map: { keyCode: 32 },
centerMap: { keyCode: 32 },
menu_open_shop: { keyCode: key("F") },
menu_open_stats: { keyCode: key("G") },
menuOpenShop: { keyCode: key("F") },
menuOpenStats: { keyCode: key("G") },
confirm_mass_delete: { keyCode: key("X") }, // DEL
toggle_hud: { keyCode: 113 }, // F2
toggleHud: { keyCode: 113 }, // F2
},
toolbar: {
building_belt: { keyCode: key("1") },
building_splitter: { keyCode: key("2") },
building_underground_belt: { keyCode: key("3") },
building_miner: { keyCode: key("4") },
building_cutter: { keyCode: key("5") },
building_rotater: { keyCode: key("6") },
building_stacker: { keyCode: key("7") },
building_mixer: { keyCode: key("8") },
building_painter: { keyCode: key("9") },
building_trash: { keyCode: key("0") },
buildings: {
belt: { keyCode: key("1") },
splitter: { keyCode: key("2") },
underground_belt: { keyCode: key("3") },
miner: { keyCode: key("4") },
cutter: { keyCode: key("5") },
rotater: { keyCode: key("6") },
stacker: { keyCode: key("7") },
mixer: { keyCode: key("8") },
painter: { keyCode: key("9") },
trash: { keyCode: key("0") },
},
building_abort_placement: { keyCode: key("Q") },
placement: {
abortBuildingPlacement: { keyCode: key("Q") },
rotateWhilePlacing: { keyCode: key("R") },
cycleBuildingVariants: { keyCode: key("T") },
cycleBuildings: { keyCode: 9 }, // TAB
},
rotate_while_placing: { keyCode: key("R") },
massSelect: {
massSelectStart: { keyCode: 17, builtin: true }, // CTRL
massSelectSelectMultiple: { keyCode: 16, builtin: true }, // SHIFT
confirmMassDelete: { keyCode: key("X") },
},
cycle_variants: { keyCode: key("T") },
cycle_buildings: { keyCode: 9 },
placementModifiers: {
placementDisableAutoOrientation: { keyCode: 17, builtin: true }, // CTRL
placeMultiple: { keyCode: 16, builtin: true }, // SHIFT
placeInverse: { keyCode: 18, builtin: true }, // ALT
},
};
// Assign ids
for (const categoryId in KEYMAPPINGS) {
for (const mappingId in KEYMAPPINGS[categoryId]) {
KEYMAPPINGS[categoryId][mappingId].id = mappingId;
}
}
/**
* Returns a keycode -> string
* @param {number} code
@@ -271,14 +288,14 @@ export class KeyActionMapper {
/** @type {Object.<string, Keybinding>} */
this.keybindings = {};
// const overrides = root.app.settings.getKeybindingOverrides();
const overrides = root.app.settings.getKeybindingOverrides();
for (const category in defaultKeybindings) {
for (const key in defaultKeybindings[category]) {
let payload = Object.assign({}, defaultKeybindings[category][key]);
// if (overrides[key]) {
// payload.keyCode = overrides[key];
// }
for (const category in KEYMAPPINGS) {
for (const key in KEYMAPPINGS[category]) {
let payload = Object.assign({}, KEYMAPPINGS[category][key]);
if (overrides[key]) {
payload.keyCode = overrides[key];
}
this.keybindings[key] = new Keybinding(this.root.app, payload);
}
@@ -380,10 +397,13 @@ export class KeyActionMapper {
/**
* Returns a given keybinding
* @param {string} id
* @param {{ keyCode: number }} binding
* @returns {Keybinding}
*/
getBinding(id) {
getBinding(binding) {
// @ts-ignore
const id = binding.id;
assert(id, "Not a valid keybinding: " + JSON_stringify(binding));
assert(this.keybindings[id], "Keybinding " + id + " not known!");
return this.keybindings[id];
}