From 2ce5c535bb0c7ed3acc40b5019094fd9b759fed1 Mon Sep 17 00:00:00 2001 From: Fen Dweller Date: Fri, 13 Mar 2020 10:42:11 -0400 Subject: [PATCH] Add toggleable height bars for each entity --- macrovision.css | 15 +++++++++++++++ macrovision.html | 6 +++++- macrovision.js | 10 ++++++++++ 3 files changed, 30 insertions(+), 1 deletion(-) diff --git a/macrovision.css b/macrovision.css index 825c51fb..39f24e86 100644 --- a/macrovision.css +++ b/macrovision.css @@ -451,4 +451,19 @@ input[type=checkbox] { input ~ label { user-select: none; +} + +body.toggle-height-bars .height-bar { + display: block; +} + +.height-bar { + display: none; + min-width: 120vw; + min-height: 3px; + height: 3px; + position: absolute; + background: repeating-linear-gradient(90deg, #aaaaaaff, #aaaaaaff 20px, #aaaaaa00 20px, #aaaaaa00 40px); + top: calc(-100% + var(--extra)); + left: calc(-120vw + 24px); } \ No newline at end of file diff --git a/macrovision.html b/macrovision.html index 19027dbb..383323b1 100644 --- a/macrovision.html +++ b/macrovision.html @@ -26,7 +26,7 @@ - +

Discord

@@ -112,6 +112,10 @@

+
+ + +
Auto-sizing mode diff --git a/macrovision.js b/macrovision.js index ec00ff91..709c2370 100644 --- a/macrovision.js +++ b/macrovision.js @@ -843,6 +843,7 @@ function displayEntity(entity, view, x, y) { img.addEventListener("dragstart", e => { e.preventDefault(); }); + const nameTag = document.createElement("div"); nameTag.classList.add("entity-name"); nameTag.innerText = entity.name; @@ -873,6 +874,11 @@ function displayEntity(entity, view, x, y) { testClick(fakeEvent); }); + const heightBar = document.createElement("div"); + heightBar.classList.add("height-bar"); + + box.appendChild(heightBar); + box.id = "entity-" + entityIndex; box.dataset.key = entityIndex; entity.view = view; @@ -938,6 +944,10 @@ document.addEventListener("DOMContentLoaded", () => { document.body.classList[e.target.checked ? "add" : "remove"]("toggle-bottom-name"); }); + document.querySelector("#options-world-show-height-bars").addEventListener("input", e => { + document.body.classList[e.target.checked ? "add" : "remove"]("toggle-height-bars"); + }); + document.querySelector("#options-order-forward").addEventListener("click", e => { if (selected) { entities[selected.dataset.key].priority += 1;