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

Add 'copy key' button to shape viewer

This commit is contained in:
tobspr
2020-06-24 21:03:46 +02:00
parent 3a846ab3c9
commit de94c6ea82
6 changed files with 80 additions and 18 deletions

View File

@@ -6,6 +6,7 @@ export const CHANGELOG = [
"Preparations for the wires update",
"Update belt placement performance on huge factories (by Phlosioneer)",
"Allow clicking on variants to select them",
"Add 'copy key' button to shape viewer",
"Add setting (on by default) to store the last used rotation per building instead of globally storing it (by Magos)",
"Added chinese (traditional) translation",
"Updated translations",

View File

@@ -1,12 +1,13 @@
import { BaseHUDPart } from "../base_hud_part";
import { InputReceiver } from "../../../core/input_receiver";
import { makeDiv, removeAllChildren } from "../../../core/utils";
import { T } from "../../../translations";
import { defaultBuildingVariant } from "../../meta_building";
import { KeyActionMapper, KEYMAPPINGS } from "../../key_action_mapper";
import { ShapeDefinition } from "../../shape_definition";
import { KEYMAPPINGS, KeyActionMapper } from "../../key_action_mapper";
import { InputReceiver } from "../../../core/input_receiver";
import { BaseHUDPart } from "../base_hud_part";
import { DynamicDomAttach } from "../dynamic_dom_attach";
const copy = require("clipboard-copy");
export class HUDShapeViewer extends BaseHUDPart {
createElements(parent) {
this.background = makeDiv(parent, "ingame_HUD_ShapeViewer", ["ingameDialog"]);
@@ -17,6 +18,15 @@ export class HUDShapeViewer extends BaseHUDPart {
this.closeButton = makeDiv(this.title, null, ["closeButton"]);
this.trackClicks(this.closeButton, this.close);
this.contentDiv = makeDiv(this.dialogInner, null, ["content"]);
this.renderArea = makeDiv(this.contentDiv, null, ["renderArea"]);
this.infoArea = makeDiv(this.contentDiv, null, ["infoArea"]);
// Create button to copy the shape area
this.copyButton = document.createElement("button");
this.copyButton.classList.add("styledButton", "copyKey");
this.copyButton.innerText = T.ingame.shapeViewer.copyKey;
this.infoArea.appendChild(this.copyButton);
}
initialize() {
@@ -26,14 +36,28 @@ export class HUDShapeViewer extends BaseHUDPart {
attachClass: "visible",
});
this.currentShapeKey = null;
this.inputReciever = new InputReceiver("shape_viewer");
this.keyActionMapper = new KeyActionMapper(this.root, this.inputReciever);
this.keyActionMapper.getBinding(KEYMAPPINGS.general.back).add(this.close, this);
this.trackClicks(this.copyButton, this.onCopyKeyRequested);
this.close();
}
/**
* Called when the copying of a key was requested
*/
onCopyKeyRequested() {
if (this.currentShapeKey) {
copy(this.currentShapeKey);
this.close();
}
}
/**
* Closes the dialog
*/
@@ -53,11 +77,15 @@ export class HUDShapeViewer extends BaseHUDPart {
document.body.classList.add("ingameDialogOpen");
this.root.app.inputMgr.makeSureAttachedAndOnTop(this.inputReciever);
removeAllChildren(this.contentDiv);
removeAllChildren(this.renderArea);
this.currentShapeKey = definition.getHash();
const layers = definition.layers;
this.contentDiv.setAttribute("data-layers", layers.length);
for (let i = 0; i < layers.length; ++i) {
const layerElem = makeDiv(this.contentDiv, null, ["layer", "layer-" + i]);
const layerElem = makeDiv(this.renderArea, null, ["layer", "layer-" + i]);
let fakeLayers = [];
for (let k = 0; k < i; ++k) {
@@ -89,10 +117,6 @@ export class HUDShapeViewer extends BaseHUDPart {
);
}
}
if (i < layers.length - 1) {
makeDiv(this.contentDiv, null, ["seperator"], "+");
}
}
}