From a60d23da773cdb9577dafc3a34310e6c066071ad Mon Sep 17 00:00:00 2001 From: tobspr Date: Mon, 18 May 2020 22:08:33 +0200 Subject: [PATCH] Multiple improvements, fix saves on underground belts --- src/css/ingame_hud/entity_debugger.scss | 44 +++++++++++++ src/css/ingame_hud/keybindings_overlay.scss | 4 ++ src/css/ingame_hud/pinned_shapes.scss | 7 ++- src/css/ingame_hud/settings_menu.scss | 8 ++- src/css/ingame_hud/shop.scss | 4 +- src/css/main.scss | 2 + src/css/textual_game_state.scss | 1 + src/html/index.html | 2 +- src/js/core/config.js | 3 +- src/js/core/utils.js | 5 +- src/js/game/components/underground_belt.js | 1 + src/js/game/entity.js | 14 ----- src/js/game/hud/hud.js | 7 ++- src/js/game/hud/parts/entity_debugger.js | 68 +++++++++++++++++++++ src/js/game/hud/parts/settings_menu.js | 26 ++++++-- src/js/platform/wrapper.js | 2 +- translations/base-en.yaml | 4 +- 17 files changed, 171 insertions(+), 31 deletions(-) create mode 100644 src/css/ingame_hud/entity_debugger.scss create mode 100644 src/js/game/hud/parts/entity_debugger.js diff --git a/src/css/ingame_hud/entity_debugger.scss b/src/css/ingame_hud/entity_debugger.scss new file mode 100644 index 00000000..54896a6e --- /dev/null +++ b/src/css/ingame_hud/entity_debugger.scss @@ -0,0 +1,44 @@ +#ingame_HUD_EntityDebugger { + position: absolute; + @include S(right, 30px); + @include S(top, 250px); + + font-size: 14px; + line-height: 16px; + color: #fff; + background: rgba(0, 10, 20, 0.7); + padding: 10px; + &, + * { + pointer-events: all; + } + + .flag { + display: inline-block; + background: #333438; + @include S(padding, 2px); + @include S(margin-right, 2px); + + u { + opacity: 0.5; + } + } + + .components { + @include S(margin-top, 4px); + display: grid; + grid-template-columns: 1fr 1fr; + @include S(grid-gap, 3px); + .component { + @include S(padding, 2px); + background: #333; + display: flex; + flex-direction: column; + + .data { + @include S(width, 150px); + @include S(height, 50px); + } + } + } +} diff --git a/src/css/ingame_hud/keybindings_overlay.scss b/src/css/ingame_hud/keybindings_overlay.scss index 1c9aec84..e63f2e7f 100644 --- a/src/css/ingame_hud/keybindings_overlay.scss +++ b/src/css/ingame_hud/keybindings_overlay.scss @@ -43,6 +43,10 @@ color: $accentColorDark; @include SuperSmallText; text-transform: uppercase; + // font-weight: bold; + color: #fff; + text-shadow: #{D(1px)} #{D(1px)} 0 rgba(0, 10, 20, 0.2); + @include S(margin-left, 5px); } } diff --git a/src/css/ingame_hud/pinned_shapes.scss b/src/css/ingame_hud/pinned_shapes.scss index 2e4c8390..063711b4 100644 --- a/src/css/ingame_hud/pinned_shapes.scss +++ b/src/css/ingame_hud/pinned_shapes.scss @@ -15,7 +15,9 @@ justify-content: center; grid-template-columns: auto 1fr; grid-template-rows: 1fr 1fr; - @include S(margin-bottom, 5px); + @include S(margin-bottom, 4px); + color: #fff; + text-shadow: #{D(1px)} #{D(1px)} 0 rgba(0, 10, 20, 0.2); &.unpinable { > canvas { @@ -49,9 +51,10 @@ > .goalLabel { @include S(font-size, 7px); - opacity: 0.3; + opacity: 0.5; align-self: start; justify-self: start; + font-weight: normal; grid-row: 2 / 3; } diff --git a/src/css/ingame_hud/settings_menu.scss b/src/css/ingame_hud/settings_menu.scss index 3f2b3b18..e0cec1f6 100644 --- a/src/css/ingame_hud/settings_menu.scss +++ b/src/css/ingame_hud/settings_menu.scss @@ -1,17 +1,21 @@ #ingame_HUD_SettingsMenu { - .timePlayed { + .statsElement { position: absolute; @include S(left, 30px); - @include S(bottom, 30px); + @include S(top, 30px); color: #fff; display: flex; + grid-template-rows: 1fr auto; flex-direction: column; + strong { text-transform: uppercase; @include PlainText; + opacity: 0.5; } span { + @include S(margin-bottom, 25px); @include Heading; } } diff --git a/src/css/ingame_hud/shop.scss b/src/css/ingame_hud/shop.scss index d49e4a53..d27c98de 100644 --- a/src/css/ingame_hud/shop.scss +++ b/src/css/ingame_hud/shop.scss @@ -173,11 +173,13 @@ @include S(line-height, 13px); @include S(border-radius, $globalBorderRadius); - @include S(padding, 1px, 2px, 2px); + @include S(padding, 1px, 0px, 2px); position: relative; text-align: center; @include S(min-width, 50px); + // @include S(max-width, 100px); overflow: hidden; + width: 100%; @include DarkThemeOverride { background: #333438; diff --git a/src/css/main.scss b/src/css/main.scss index db586d65..ca97440f 100644 --- a/src/css/main.scss +++ b/src/css/main.scss @@ -40,6 +40,7 @@ @import "ingame_hud/notifications"; @import "ingame_hud/settings_menu"; @import "ingame_hud/debug_info"; +@import "ingame_hud/entity_debugger"; // prettier-ignore $elements: @@ -59,6 +60,7 @@ ingame_HUD_KeybindingOverlay, ingame_HUD_Notifications, ingame_HUD_MassSelector, ingame_HUD_DebugInfo, +ingame_HUD_EntityDebugger, // Overlays ingame_HUD_BetaOverlay, diff --git a/src/css/textual_game_state.scss b/src/css/textual_game_state.scss index 83c8d171..617b7c26 100644 --- a/src/css/textual_game_state.scss +++ b/src/css/textual_game_state.scss @@ -23,6 +23,7 @@ @include SuperHeading; text-transform: uppercase; color: #333438; + position: relative; @include IncreasedClickArea(10px); } diff --git a/src/html/index.html b/src/html/index.html index ff9c77f4..ffcab1d7 100644 --- a/src/html/index.html +++ b/src/html/index.html @@ -1,7 +1,7 @@ - shapez.io - Combine Shapes! + shapez.io - Build your own shape factory! diff --git a/src/js/core/config.js b/src/js/core/config.js index 687cb2d5..1b8bea2b 100644 --- a/src/js/core/config.js +++ b/src/js/core/config.js @@ -71,7 +71,7 @@ export const globalConfig = { debug: { /* dev:start */ - fastGameEnter: true, + // fastGameEnter: true, noArtificialDelays: true, // disableSavegameWrite: true, // showEntityBounds: true, @@ -88,6 +88,7 @@ export const globalConfig = { // testClipping: true, // framePausesBetweenTicks: 40, // testTranslations: true, + // enableEntityInspector: true, /* dev:end */ }, diff --git a/src/js/core/utils.js b/src/js/core/utils.js index b28d2959..f756a651 100644 --- a/src/js/core/utils.js +++ b/src/js/core/utils.js @@ -436,6 +436,9 @@ export function formatBigNumber(num, divider = ".") { if (num < 1000) { return sign + "" + num; } + if (num > 10000) { + return Math_floor(num / 1000.0) + "k"; + } let rest = num; let out = ""; @@ -455,7 +458,7 @@ export function formatBigNumber(num, divider = ".") { * @param {string=} divider THe divider for numbers like 50,000 (divider=',') * @returns {string} */ -export function formatBigNumberFull(num, divider = ",") { +export function formatBigNumberFull(num, divider = T.global.thousandsDivider) { if (num < 1000) { return num + ""; } diff --git a/src/js/game/components/underground_belt.js b/src/js/game/components/underground_belt.js index 7d727226..e581ebe9 100644 --- a/src/js/game/components/underground_belt.js +++ b/src/js/game/components/underground_belt.js @@ -19,6 +19,7 @@ export class UndergroundBeltComponent extends Component { return { mode: types.enum(enumUndergroundBeltMode), pendingItems: types.array(types.pair(types.obj(gItemRegistry), types.float)), + tier: types.uint, }; } diff --git a/src/js/game/entity.js b/src/js/game/entity.js index 89b7044a..a6db7400 100644 --- a/src/js/game/entity.js +++ b/src/js/game/entity.js @@ -25,11 +25,6 @@ export class Entity extends BasicSerializableObject { */ this.root = root; - /** - * The metaclass of the entity, should be set by subclasses - */ - this.meta = null; - /** * The components of the entity */ @@ -89,15 +84,6 @@ export class Entity extends BasicSerializableObject { return !this.destroyed && !this.queuedForDestroy; } - /** - * Returns the meta class of the entity. - * @returns {object} - */ - getMetaclass() { - assert(this.meta, "Entity has no metaclass"); - return this.meta; - } - /** * Internal destroy callback */ diff --git a/src/js/game/hud/hud.js b/src/js/game/hud/hud.js index 73091457..6551016e 100644 --- a/src/js/game/hud/hud.js +++ b/src/js/game/hud/hud.js @@ -12,7 +12,7 @@ import { HUDKeybindingOverlay } from "./parts/keybinding_overlay"; import { HUDUnlockNotification } from "./parts/unlock_notification"; import { HUDGameMenu } from "./parts/game_menu"; import { HUDShop } from "./parts/shop"; -import { IS_MOBILE } from "../../core/config"; +import { IS_MOBILE, globalConfig } from "../../core/config"; import { HUDMassSelector } from "./parts/mass_selector"; import { HUDVignetteOverlay } from "./parts/vignette_overlay"; import { HUDStatistics } from "./parts/statistics"; @@ -22,6 +22,7 @@ import { ShapeDefinition } from "../shape_definition"; import { HUDNotifications, enumNotificationType } from "./parts/notifications"; import { HUDSettingsMenu } from "./parts/settings_menu"; import { HUDDebugInfo } from "./parts/debug_info"; +import { HUDEntityDebugger } from "./parts/entity_debugger"; export class GameHUD { /** @@ -71,6 +72,10 @@ export class GameHUD { this.parts.keybindingOverlay = new HUDKeybindingOverlay(this.root); } + if (G_IS_DEV && globalConfig.debug.enableEntityInspector) { + this.parts.entityDebugger = new HUDEntityDebugger(this.root); + } + const frag = document.createDocumentFragment(); for (const key in this.parts) { this.parts[key].createElements(frag); diff --git a/src/js/game/hud/parts/entity_debugger.js b/src/js/game/hud/parts/entity_debugger.js new file mode 100644 index 00000000..816ce77c --- /dev/null +++ b/src/js/game/hud/parts/entity_debugger.js @@ -0,0 +1,68 @@ +import { BaseHUDPart } from "../base_hud_part"; +import { makeDiv, removeAllChildren } from "../../../core/utils"; +import { globalConfig } from "../../../core/config"; + +export class HUDEntityDebugger extends BaseHUDPart { + createElements(parent) { + this.element = makeDiv( + parent, + "ingame_HUD_EntityDebugger", + [], + ` + Tile below cursor:
+ Chunk below cursor:
+
+ ` + ); + + this.mousePosElem = this.element.querySelector(".mousePos"); + this.chunkPosElem = this.element.querySelector(".chunkPos"); + this.entityInfoElem = this.element.querySelector(".entityInfo"); + } + + initialize() { + this.root.camera.downPreHandler.add(this.onMouseDown, this); + } + + update() { + const mousePos = this.root.app.mousePosition; + const worldPos = this.root.camera.screenToWorld(mousePos); + const worldTile = worldPos.toTileSpace(); + + const chunk = worldTile.divideScalar(globalConfig.mapChunkSize).floor(); + this.mousePosElem.innerText = worldTile.x + " / " + worldTile.y; + this.chunkPosElem.innerText = chunk.x + " / " + chunk.y; + + const entity = this.root.map.getTileContent(worldTile); + if (entity) { + removeAllChildren(this.entityInfoElem); + let html = "Entity"; + + const flag = (name, val) => + `${name} ${val}`; + + html += "
"; + html += flag("registered", entity.registered); + html += flag("uid", entity.uid); + html += flag("destroyed", entity.destroyed); + html += "
"; + + html += "
"; + + for (const componentId in entity.components) { + const data = entity.components[componentId]; + html += "
"; + html += "" + componentId + ""; + html += ""; + + html += "
"; + } + + html += "
"; + + this.entityInfoElem.innerHTML = html; + } + } + + onMouseDown() {} +} diff --git a/src/js/game/hud/parts/settings_menu.js b/src/js/game/hud/parts/settings_menu.js index 8dbfee2f..9ea8abad 100644 --- a/src/js/game/hud/parts/settings_menu.js +++ b/src/js/game/hud/parts/settings_menu.js @@ -1,9 +1,12 @@ import { BaseHUDPart } from "../base_hud_part"; -import { makeDiv, formatSeconds } from "../../../core/utils"; +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 { T } from "../../../translations"; +import { StaticMapEntityComponent } from "../../components/static_map_entity"; +import { ItemProcessorComponent } from "../../components/item_processor"; +import { BeltComponent } from "../../components/belt"; export class HUDSettingsMenu extends BaseHUDPart { createElements(parent) { @@ -11,11 +14,16 @@ export class HUDSettingsMenu extends BaseHUDPart { this.menuElement = makeDiv(this.background, null, ["menuElement"]); - this.timePlayed = makeDiv( + this.statsElement = makeDiv( this.background, null, - ["timePlayed"], - `${T.ingame.settingsMenu.playtime}` + ["statsElement"], + ` + ${T.ingame.settingsMenu.beltsPlaced} + ${T.ingame.settingsMenu.buildingsPlaced} + ${T.ingame.settingsMenu.playtime} + + ` ); this.buttonContainer = makeDiv(this.menuElement, null, ["buttons"]); @@ -89,10 +97,18 @@ export class HUDSettingsMenu extends BaseHUDPart { this.root.app.inputMgr.makeSureAttachedAndOnTop(this.inputReciever); const totalMinutesPlayed = Math.ceil(this.root.time.now() / 60); - this.timePlayed.querySelector(".playtime").innerText = T.global.time.xMinutes.replace( + this.statsElement.querySelector(".playtime").innerText = T.global.time.xMinutes.replace( "", "" + totalMinutesPlayed ); + + this.statsElement.querySelector(".buildingsPlaced").innerText = formatBigNumberFull( + this.root.entityMgr.getAllWithComponent(StaticMapEntityComponent).length - + this.root.entityMgr.getAllWithComponent(BeltComponent).length + ); + this.statsElement.querySelector(".beltsPlaced").innerText = formatBigNumberFull( + this.root.entityMgr.getAllWithComponent(BeltComponent).length + ); } close() { diff --git a/src/js/platform/wrapper.js b/src/js/platform/wrapper.js index bda56fc2..a7b5c807 100644 --- a/src/js/platform/wrapper.js +++ b/src/js/platform/wrapper.js @@ -55,7 +55,7 @@ export class PlatformWrapperInterface { * @returns {number} */ getMinimumZoom() { - return 0.2 * this.getScreenScale(); + return 0.1 * this.getScreenScale(); } /** diff --git a/translations/base-en.yaml b/translations/base-en.yaml index 82ef29d6..a5b6aaf9 100644 --- a/translations/base-en.yaml +++ b/translations/base-en.yaml @@ -200,8 +200,8 @@ ingame: settingsMenu: playtime: Playtime - playtime1Minute: 1 minutes - playtimeXMinutes: minutes + buildingsPlaced: Buildings + beltsPlaced: Belts buttons: continue: Continue