Archives/tobspr_shapez.io
1
0
Fork 0
mirror of https://github.com/tobspr/shapez.io.git synced 2025-12-16 19:51:50 +00:00
Code Issues Projects Releases Wiki Activity

UI for savegame

Browse Source 
- Made use of new `FormElementDetails`
- Added todos for translations
- Checkbox / Toggle for non-primarycolors
This commit is contained in:
Daan Breur 2021-11-21 21:32:05 +01:00
parent cc8db54831
commit 96b76aa631
1 changed files with 22 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
src/js/states/main_menu.js
View File

@ -3,7 +3,7 @@ import { cachebust } from "../core/cachebust";
import { A_B_TESTING_LINK_TYPE, globalConfig, THIRDPARTY_URLS } from "../core/config"; import { A_B_TESTING_LINK_TYPE, globalConfig, THIRDPARTY_URLS } from "../core/config";
import { GameState } from "../core/game_state"; import { GameState } from "../core/game_state";
import { DialogWithForm } from "../core/modal_dialog_elements"; import { DialogWithForm } from "../core/modal_dialog_elements";
import { FormElementInput } from "../core/modal_dialog_forms"; import { FormElementCheckbox, FormElementDetails, FormElementInput } from "../core/modal_dialog_forms";
import { ReadWriteProxy } from "../core/read_write_proxy"; import { ReadWriteProxy } from "../core/read_write_proxy";
import { import {
formatSecondsToTimeAgo, formatSecondsToTimeAgo,
@ -677,29 +677,43 @@ export class MainMenuState extends GameState {
const nameInput = new FormElementInput({ const nameInput = new FormElementInput({
id: "nameInput", id: "nameInput",
// label: T.dialogs.newSavegame.nameInputLabel, // @TODO: Add translation (T.dialogs.newSavegame.nameInputLabel)
label: "Name:", label: "Name:",
placeholder: "", placeholder: "",
defaultValue: "", defaultValue: "Unnamed",
validator: val => val.match(regex) && trim(val).length > 0, validator: val => val.match(regex) && trim(val).length > 0,
}); });
const seedInput = new FormElementInput({ const seedInput = new FormElementInput({
id: "seedInput", id: "seedInput",
// label: T.dialogs.newSavegame.seedInputLabel, // @TODO: Add translation (T.dialogs.newSavegame.seedInputLabel)
label: "Seed:", label: "Seed:",
placeholder: "", placeholder: "",
defaultValue: randomInt(0, 100000).toString(), defaultValue: randomInt(0, 100000).toString(),
validator: val => Number.isInteger(Number(val)) && Number(val) >= 0 && Number(val) <= 100000, validator: val => Number.isInteger(Number(val)) && Number(val) >= 0 && Number(val) <= 100000,
}); });
const allowColorsCheckbox = new FormElementCheckbox({
id: "allowColorsCheckbox",
// @TODO: Add translation (T.dialogs.newSavegame.allowColorsCheckboxLabel)
label: "Allow non-primarycolors",
defaultValue: false,
});
const advancedContainer = new FormElementDetails({
id: "advancedContainer",
// @TODO Add translation (T.dialogs.newSavegame.advanced)
label: "Advanced Options",
formElements: [seedInput, allowColorsCheckbox],
});
const dialog = new DialogWithForm({ const dialog = new DialogWithForm({
app: this.app, app: this.app,
// title: T.dialogs.newSavegame.title, // @TODO: Add translation (T.dialogs.newSavegame.title)
// desc: T.dialogs.newSavegame.desc,
title: "New Game Options", title: "New Game Options",
// @TODO: Add translation (T.dialogs.newSavegame.desc)
desc: "Configure your new savegame", desc: "Configure your new savegame",
formElements: [nameInput, seedInput], formElements: [nameInput, advancedContainer],
buttons: ["ok:good:enter"], buttons: ["ok:good:enter"],
}); });
this.dialogs.internalShowDialog(dialog); this.dialogs.internalShowDialog(dialog);
@ -717,6 +731,7 @@ export class MainMenuState extends GameState {
this.moveToState("InGameState", { this.moveToState("InGameState", {
savegame, savegame,
seed: Number(seedInput.getValue()), seed: Number(seedInput.getValue()),
allowNonPrimaryColors: allowColorsCheckbox.getValue(),
}); });
this.app.analytics.trackUiClick("startgame_adcomplete"); this.app.analytics.trackUiClick("startgame_adcomplete");
}); });