1
0
mirror of https://github.com/tobspr/shapez.io.git synced 2025-06-13 13:04:03 +00:00

entity debugger > css + infinite recursion fixes

This commit is contained in:
dengr1065 2020-09-17 11:10:57 +03:00
parent 49a9c595a5
commit 6177b3b58d
2 changed files with 38 additions and 12 deletions

View File

@ -25,11 +25,13 @@
pointer-events: all;
}
.propertyTable {
@include S(margin-top, 8px);
}
.propertyTable,
.entityComponents,
.entityComponents .object > div {
@include S(margin-top, 5px);
display: grid;
grid-template-columns: 1fr auto;
@include S(column-gap, 10px);
@ -37,13 +39,15 @@
.entityComponents {
grid-column: 1 / 3;
@include S(margin-top, 5px);
font-family: "Roboto Mono", "Fira Code", monospace;
font-size: 90%;
@include S(letter-spacing, -0.5px);
label,
span {
line-height: 140%;
line-height: 1.5em;
&:not(span) {
opacity: 0.5;
@ -52,7 +56,7 @@
.object {
grid-column: 1 / 3;
line-height: 140%;
line-height: 1.5em;
> div {
@include S(margin-left, 4px);

View File

@ -46,13 +46,12 @@ export class HUDEntityDebugger extends BaseHUDPart {
this.visible = !this.visible;
}
propertyToHTML(name, val, indent = 0) {
propertyToHTML(name, val, indent = 0, recursion = []) {
if (val !== null && typeof val === "object") {
if (indent > 10) {
return "";
}
// Array is displayed like object, with indexes
recursion.push(val);
// Get type class name (like Array, Object, Vector...)
const typeName = `(${val.constructor ? val.constructor.name : "unknown"})`;
const colorStyle = `color: hsl(${30 * indent}, 100%, 80%)`;
@ -62,8 +61,20 @@ export class HUDEntityDebugger extends BaseHUDPart {
for (const property in val) {
const isRoot = val[property] == this.root;
const isRecursive = recursion.includes(val[property]);
html += this.propertyToHTML(property, isRoot ? "<root>" : val[property], indent + 1);
let hiddenValue = isRoot ? "<root>" : null;
if (isRecursive) {
// Avoid recursion by not "expanding" object more than once
hiddenValue = "<recursion>";
}
html += this.propertyToHTML(
property,
hiddenValue ? hiddenValue : val[property],
indent + 1,
[...recursion] // still expand same value in other "branches"
);
}
html += "</div></details>";
@ -91,6 +102,7 @@ export class HUDEntityDebugger extends BaseHUDPart {
this.chunkPosElem.innerText = chunk.x + " / " + chunk.y;
const entity = this.root.map.getTileContent(worldTile, this.root.currentLayer);
if (entity) {
removeAllChildren(this.componentsElem);
let html = "";
@ -107,7 +119,8 @@ export class HUDEntityDebugger extends BaseHUDPart {
html += "<summary>" + componentId + "</summary><div>";
for (const property in data) {
html += this.propertyToHTML(property, data[property]);
// Put entity into recursion list, so it won't get "expanded"
html += this.propertyToHTML(property, data[property], 0, [entity]);
}
html += "</div></details>";
@ -119,5 +132,14 @@ export class HUDEntityDebugger extends BaseHUDPart {
this.domAttach.update(this.visible);
}
onMouseDown() {}
onMouseDown() {
// On click, update current entity
const mousePos = this.root.app.mousePosition;
if (!mousePos) {
return;
}
const worldPos = this.root.camera.screenToWorld(mousePos);
const worldTile = worldPos.toTileSpace();
}
}