From baaa0ed7b71b57c70055213b622d4e3800cabde0 Mon Sep 17 00:00:00 2001
From: Max Stevenson <maxstevenson@msn.com>
Date: Thu, 12 Nov 2020 22:06:51 -0600
Subject: [PATCH] Bottom Screen Progress.

- Continued working on changing bottom screen content.
---
 index.html            |  4 +---
 public/scripts/app.js | 20 ++++++++++----------
 2 files changed, 11 insertions(+), 13 deletions(-)

diff --git a/index.html b/index.html
index 23f8d6e..3fbf3c4 100644
--- a/index.html
+++ b/index.html
@@ -683,9 +683,7 @@
                   <div class="control-panel__button-display">
                     <div class="buttons button__depressed">
                       <div class="">
-                        <p class="button-text__embossed small-button">
-                          glitches
-                        </p>
+                        <p class="button-text__embossed small-button">glitches</p>
                       </div>
                     </div>
                     <div class="outer-edge__light-buttons buttons">
diff --git a/public/scripts/app.js b/public/scripts/app.js
index 3a81bb7..5e1367e 100644
--- a/public/scripts/app.js
+++ b/public/scripts/app.js
@@ -338,18 +338,10 @@ const changeBottomScreenContent = event => {
   let selectedTab = event.currentTarget.lastElementChild.firstElementChild.innerHTML.toLowerCase();
 
   const mainDisplayElements = document.getElementsByClassName("main-display");
-  const tabContentElements = document.getElementsByClassName(
-    "ouput-display__wrapper"
+  const outputScreenElements = document.getElementsByClassName(
+    "output-display__wrapper"
   );
 
-  for (let i = 0; i < tabContentElements.length; i++) {
-    if (tabContentElements[i].id === `video-screen__${selectedTab}`) {
-      tabContentElements[i].style.display = "flex";
-    } else {
-      tabContentElements[i].style.display = "none";
-    }
-  }
-
   for (let i = 0; i < mainDisplayElements.length; i++) {
     if (mainDisplayElements[i].id === `${selectedTab}-display__inner`) {
       mainDisplayElements[i].style.display = "flex";
@@ -357,6 +349,14 @@ const changeBottomScreenContent = event => {
       mainDisplayElements[i].style.display = "none";
     }
   }
+  
+  for (let i = 0; i < outputScreenElements.length; i++) {
+    if (outputScreenElements[i].id === `output-display__${selectedTab}`) {
+      outputScreenElements[i].style.display = "flex";
+    } else {
+      outputScreenElements[i].style.display = "none";
+    }
+  }
 };
 ////////////////////////