From b7b1d409cab34ed90c4588942cbde6e8ced953a2 Mon Sep 17 00:00:00 2001
From: Fen Dweller <chemicalcrux@gmail.com>
Date: Mon, 2 Mar 2020 15:12:52 -0500
Subject: [PATCH] Allow for the ordering of entities to be overridden

---
 macrovision.css  |  4 ++++
 macrovision.html |  8 ++++++++
 macrovision.js   | 32 ++++++++++++++++++++++++++++++--
 3 files changed, 42 insertions(+), 2 deletions(-)

diff --git a/macrovision.css b/macrovision.css
index 6112bc58..1a24a924 100644
--- a/macrovision.css
+++ b/macrovision.css
@@ -126,6 +126,10 @@ body.toggle-entity-name .entity-name {
     background: transparent;
 }
 
+.options-two-buttons {
+    display: flex;
+    justify-content: space-evenly;
+}
 .options-row {
     display: flex;
     text-align: center;
diff --git a/macrovision.html b/macrovision.html
index 8696d781..71284b1f 100644
--- a/macrovision.html
+++ b/macrovision.html
@@ -116,6 +116,14 @@
         </div>
       </span>
       <div class="options-header">Entity options</div>
+      <div class="options-label">
+        Ordering
+      </div>
+      <div class="options-two-buttons" id="options-ordering">
+        <button id="options-order-back">Toward back</button>
+        <div id="options-order-display"></div>
+        <button id="options-order-forward">Toward front</button>
+      </div>
       <div class="options-label">
         Active view
       </div>
diff --git a/macrovision.js b/macrovision.js
index 22e813c3..2d7e9cfe 100644
--- a/macrovision.js
+++ b/macrovision.js
@@ -133,7 +133,12 @@ function updateSizes() {
     let ordered = Object.entries(entities);
 
     ordered.sort((e1, e2) => {
-        return e1[1].views[e1[1].view].height.toNumber("meters") - e2[1].views[e2[1].view].height.toNumber("meters")
+        if (e1[1].priority != e2[1].priority) {
+            return e1[1].priority - e2[1].priority;
+        } else {
+            return e1[1].views[e1[1].view].height.toNumber("meters") - e2[1].views[e2[1].view].height.toNumber("meters")
+        }
+        
     });
 
     let zIndex = ordered.length;
@@ -494,11 +499,16 @@ function configEntityOptions(entity, view) {
 
         defaultHolder.appendChild(button);
     });
+
+    document.querySelector("#options-order-display").innerText = entity.priority;
+    document.querySelector("#options-ordering").style.display = "flex";
 }
 
 function updateEntityOptions(entity, view) {
     const scaleInput = document.querySelector("#options-entity-scale");
     scaleInput.value = entity.scale;
+
+    document.querySelector("#options-order-display").innerText = entity.priority;
 }
 
 function clearEntityOptions() {
@@ -507,6 +517,7 @@ function clearEntityOptions() {
     holder.innerHTML = "";
 
     document.querySelector("#options-entity-defaults").innerHTML = "";
+    document.querySelector("#options-ordering").style.display = "none";
 }
 
 function configViewOptions(entity, view) {
@@ -833,7 +844,8 @@ function displayEntity(entity, view, x, y) {
     box.id = "entity-" + entityIndex;
     box.dataset.key = entityIndex;
     entity.view = view;
-
+    
+    entity.priority = 0;
     entities[entityIndex] = entity;
     entity.index = entityIndex;
 
@@ -886,6 +898,22 @@ function doSliderEntityScale() {
 document.addEventListener("DOMContentLoaded", () => {
     prepareEntities();
 
+    document.querySelector("#options-order-forward").addEventListener("click", e => {
+        if (selected) {
+            entities[selected.dataset.key].priority -= 1;
+        }
+        document.querySelector("#options-order-display").innerText = entities[selected.dataset.key].priority;
+        updateSizes();
+    });
+
+    document.querySelector("#options-order-back").addEventListener("click", e => {
+        if (selected) {
+            entities[selected.dataset.key].priority += 1;
+        }
+        document.querySelector("#options-order-display").innerText = entities[selected.dataset.key].priority;
+        updateSizes();
+    });
+
     document.querySelector("#slider-scale").addEventListener("mousedown", e => {
         dragScaleHandle = setInterval(doSliderScale, 50);
         e.stopPropagation();