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

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