1
0
mirror of https://github.com/tobspr/shapez.io.git synced 2026-03-02 03:39:21 +00:00

Add customizable keybindings & watermark

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

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",
]);
}
}

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]]) {

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;
}

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() {

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,
},
];

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>

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);
}

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();
}

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();

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 = {};

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";
}
}