From 4c5b505addda324f403ca021de69851ae4679d92 Mon Sep 17 00:00:00 2001
From: circle-gon <97845741+circle-gon@users.noreply.github.com>
Date: Thu, 22 Dec 2022 07:39:09 -0500
Subject: [PATCH 1/4] adds display buttons typescript

---
 src/data/layers/factory.tsx | 109 +++++++++++++++++++++++++++++++-----
 1 file changed, 96 insertions(+), 13 deletions(-)

diff --git a/src/data/layers/factory.tsx b/src/data/layers/factory.tsx
index de90859..8b31187 100644
--- a/src/data/layers/factory.tsx
+++ b/src/data/layers/factory.tsx
@@ -807,6 +807,22 @@ const factory = createLayer(id, () => {
         } as FactoryInternalProcessor;
         spriteContainer.addChild(sprite);
     }
+        
+    function removeFactoryComp(x: number, y: number) {
+        const data = compInternalData[x + "x" + y];
+        if (data === undefined) return;
+
+        if (data.type === "conveyor") {
+            const cData = data as FactoryInternalConveyor;
+            for (const p of cData.packages) {
+                p.sprite.destroy();
+            }
+        }
+
+        delete components.value[x + "x" + y];
+        delete compInternalData[x + "x" + y];
+        spriteContainer.removeChild(data.sprite);
+    }
 
     // draw graphics
     function updateGraphics() {
@@ -928,19 +944,7 @@ const factory = createLayer(id, () => {
                         compInternalData[x + "x" + y].sprite.rotation += Math.PI / 2;
                     }
                 } else if (compSelected.value === "delete") {
-                    const data = compInternalData[x + "x" + y];
-                    if (data === undefined) return;
-
-                    if (data.type === "conveyor") {
-                        const cData = data as FactoryInternalConveyor;
-                        for (const p of cData.packages) {
-                            p.sprite.destroy();
-                        }
-                    }
-
-                    delete components.value[x + "x" + y];
-                    delete compInternalData[x + "x" + y];
-                    spriteContainer.removeChild(data.sprite);
+                    removeFactoryComp(x, y);
                 } else if (compSelected.value !== "cursor") {
                     if (components.value[x + "x" + y] == null) {
                         addFactoryComp(x, y, { type: compSelected.value });
@@ -971,6 +975,46 @@ const factory = createLayer(id, () => {
     function onCompClick(name: FactoryCompNames) {
         compSelected.value = name;
     }
+        
+    function setTracks() {
+        for (const [key, comp] of Object.entries(compInternalData)) {
+            if (comp == null) continue;
+            if (comp.type === "conveyor") {
+                for (const pkg of [...comp.nextPackages, ...comp.packages]) {
+                    pkg.sprite.destroy();
+                    movingBlocks.removeChild(pkg.sprite);
+                }
+                comp.nextPackages = [];
+                comp.packages = [];
+            } else {
+                const producerComp = components.value[key] as FactoryComponentProducer;
+                if (producerComp.outputStock !== undefined) {
+                    for (const key in producerComp.outputStock) {
+                        delete producerComp.outputStock[key];
+                    }
+                }
+                if (producerComp.inputStock !== undefined) {
+                    for (const key in producerComp.inputStock) {
+                        delete producerComp.inputStock[key];
+                    }
+                }
+                producerComp.ticksDone = 0;
+            }
+        }
+    }
+        
+    function clearFactory() {
+        for (const key of Object.keys(compInternalData)) {
+            const [x, y] = key.split("x").map(i => +i);
+            removeFactoryComp(x, y);
+        }
+    }
+    function moveToCenter() {
+        mapOffset.x = 0;
+        mapOffset.y = 0;
+    }
+    function togglePaused() {
+        paused.value = !paused.value;
 
     // ------------------------------------------------------------------------------- Tabs
 
@@ -1013,6 +1057,45 @@ const factory = createLayer(id, () => {
                                     onPointerleave={onFactoryMouseLeave}
                                     onContextmenu={(e: MouseEvent) => e.preventDefault()}
                                 />
+                                <div class="controls-container">
+                    <button
+                        class="control-btn"
+                        style={{
+                            "border-color": "purple"
+                        }}
+                        onClick={setTracks}
+                    >
+                        Clear Tracks
+                    </button>
+                    <button
+                        class="control-btn"
+                        style={{
+                            "border-color": "red"
+                        }}
+                        onClick={clearFactory}
+                    >
+                        Clear Factory
+                    </button>
+                    <button
+                        class="control-btn"
+                        style={{
+                            "border-color": "green"
+                        }}
+                        onClick={moveToCenter}
+                    >
+                        Go to Center
+                    </button>
+                    <button
+                        class="control-btn"
+                        style={{
+                            "border-color": paused.value ? "green" : "red"
+                        }}
+                        onClick={togglePaused}
+                    >
+                        {paused.value ? "Unpause" : "Pause"} the Factory
+                    </button>
+                </div>
+                                
                                 <div class="comp-container">
                                     <div
                                         class={{

From 270829a75bf36624a570c28a735fad866a495567 Mon Sep 17 00:00:00 2001
From: circle-gon <97845741+circle-gon@users.noreply.github.com>
Date: Thu, 22 Dec 2022 07:40:23 -0500
Subject: [PATCH 2/4] adds button css

---
 src/data/layers/styles/factory.css | 19 +++++++++++++++++++
 1 file changed, 19 insertions(+)

diff --git a/src/data/layers/styles/factory.css b/src/data/layers/styles/factory.css
index 34600da..f25c3b8 100644
--- a/src/data/layers/styles/factory.css
+++ b/src/data/layers/styles/factory.css
@@ -56,6 +56,25 @@
 
     z-index: 2;
 }
+
+.controls-container {
+    position: absolute;
+    top: 0%;
+    right: 0%;
+    margin: 0;
+    padding: 10px;
+    height: max-content;
+    background: var(--background);
+    border-radius: 0 0 var(--border-radius) var(--border-radius);
+    box-shadow: 0 1px 5px #0007;
+    display: flex;
+}
+.control-btn {
+    border-radius: 5px;
+    border-width: 2px;
+    border-style: solid;
+}
+
 .comp-container {
     position: absolute;
     top: 0;

From 40f8fae0adfdfa3b2768a0f0a342ab2ab902fbe5 Mon Sep 17 00:00:00 2001
From: circle-gon <97845741+circle-gon@users.noreply.github.com>
Date: Thu, 22 Dec 2022 07:52:29 -0500
Subject: [PATCH 3/4] Oops

---
 src/data/layers/factory.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/data/layers/factory.tsx b/src/data/layers/factory.tsx
index 8b31187..c6d47b8 100644
--- a/src/data/layers/factory.tsx
+++ b/src/data/layers/factory.tsx
@@ -1015,7 +1015,7 @@ const factory = createLayer(id, () => {
     }
     function togglePaused() {
         paused.value = !paused.value;
-
+    }
     // ------------------------------------------------------------------------------- Tabs
 
     const tabs = createTabFamily(

From c2e3b8eab5b89c6845a437b927249f5e374f8c76 Mon Sep 17 00:00:00 2001
From: circle-gon <97845741+circle-gon@users.noreply.github.com>
Date: Thu, 22 Dec 2022 07:55:45 -0500
Subject: [PATCH 4/4] defines paused

---
 src/data/layers/factory.tsx | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/data/layers/factory.tsx b/src/data/layers/factory.tsx
index c6d47b8..324704b 100644
--- a/src/data/layers/factory.tsx
+++ b/src/data/layers/factory.tsx
@@ -860,7 +860,8 @@ const factory = createLayer(id, () => {
 
     const pointerDown = ref(false),
         pointerDrag = ref(false),
-        compHovered = ref<FactoryComponent | undefined>(undefined);
+        compHovered = ref<FactoryComponent | undefined>(undefined),
+        paused = ref(false);
 
     function onFactoryPointerMove(e: PointerEvent) {
         const { x, y } = getRelativeCoords(e);