From 7c895952bfd2b0f4c23b8ba0d7005d6183175e59 Mon Sep 17 00:00:00 2001
From: Acamaeda <acamaeda@gmail.com>
Date: Thu, 29 Oct 2020 14:57:42 -0400
Subject: [PATCH] More treeless work

---
 changelog.md                  |  1 +
 demo.html                     |  4 ++--
 docs/subtabs-and-microtabs.md |  4 ++++
 index.html                    | 17 +++++++----------
 js/mod.js                     |  2 --
 js/tree.js                    | 15 +++++++++++++++
 js/utils.js                   | 11 +++++++----
 7 files changed, 36 insertions(+), 18 deletions(-)
 create mode 100644 js/tree.js

diff --git a/changelog.md b/changelog.md
index 6224a2e..1190593 100644
--- a/changelog.md
+++ b/changelog.md
@@ -3,6 +3,7 @@
 - You can now embed a layer inside of a subtab or microtab!
 - Added support for hiding the tree tab (although some aspects are still lazy and WIP)
 - Added shouldNotify to subtab/microtab buttons. (You can make them highlighted)
+- Added commas to large exponents.
 - NaN is now handled more intelligently.
 - Thank you to thepaperpilot for fixing errors in docs and the infobox appearance!
 
diff --git a/demo.html b/demo.html
index b35a124..4fce880 100644
--- a/demo.html
+++ b/demo.html
@@ -98,7 +98,7 @@
 				</tr> 
 			</table>
 		</div>
-		<div id="treeOverlay" class="treeOverlay" v-if="player.tab!='gameEnded'" onscroll="resizeCanvas()" v-bind:class="{ fullWidth: (player.tab == 'none' || player.navTab == 'none'), col: (player.tab !== 'none' && player.navTab !== 'none'), left: (player.tab !== 'none' && player.navTab !== 'none')}">
+		<div id="treeOverlay" class="treeOverlay" onscroll="resizeCanvas()" v-bind:class="{ fullWidth: (player.tab == 'none' || player.navTab == 'none'), col: (player.tab !== 'none' && player.navTab !== 'none'), left: (player.tab !== 'none' && player.navTab !== 'none')}">
 			<div id="version" class="overlayThing" style="margin-right: 13px">{{VERSION.withoutName}}</div>
 			<img id="optionWheel"  class="overlayThing" v-if="player.tab!='options'" src="options_wheel.png" onclick="showTab('options')"></img>
 			<div id="info" v-if="player.tab!='info'"  class="overlayThing" onclick="showTab('info')"><br>i</div>
@@ -110,7 +110,7 @@
 					<li><a class="link" href="http://discord.gg/wwQfgPa" target="_blank" v-bind:style="{'font-size': '16px'}">Main Prestige Tree server</a></li>
 				</ul>
 			</div>
-			<div class="overlayThing" style="padding-bottom:7px; width: 90%">
+			<div class="overlayThing" v-if="player.tab!='gameEnded' && !(player.navTab == 'none' && (player.tab=='options' || player.tab=='info'))" style="padding-bottom:7px; width: 90%">
 				<span v-if="player.devSpeed && player.devSpeed != 1" class="overlayThing">
 					<br>Dev Speed: {{format(player.devSpeed)}}x<br>
 				</span>
diff --git a/docs/subtabs-and-microtabs.md b/docs/subtabs-and-microtabs.md
index e7e489b..14233b4 100644
--- a/docs/subtabs-and-microtabs.md
+++ b/docs/subtabs-and-microtabs.md
@@ -7,9 +7,11 @@ Subtabs are defined by using the tab format like this, where each element of tab
 ```js
 tabFormat: {
     "Main tab": {
+        content: [tab format things],
         *subtab features*
     },
     "Other tab": {
+        content: [tab format things],
         *subtab features*
     },
     etc
@@ -22,9 +24,11 @@ Microtabs are defined similarly, and use the same features, but are defined in t
 microtabs: {
     stuff: {
         first: {
+            content: [tab format things],
             *subtab features*
         },
         second: {
+            content: [tab format things],
             *subtab features*
         }
     },
diff --git a/index.html b/index.html
index a0724f7..7efde63 100644
--- a/index.html
+++ b/index.html
@@ -6,6 +6,7 @@
 	<script src="https://cdn.jsdelivr.net/npm/vue@2.6.12"></script>
 	<script type="text/javascript" src="js/break_eternity.js"></script>
 	<script type="text/javascript" src="js/layerSupport.js"></script>
+	<script type="text/javascript" src="js/tree.js"></script>
 	<script type="text/javascript" src="js/layers.js"></script>
 	<script type="text/javascript" src="js/mod.js"></script>
 	<script type="text/javascript" src="js/temp.js"></script>
@@ -17,6 +18,8 @@
 </head>
 <body onload="load()">
 	<div id="app">
+		<canvas id="treeCanvas" class="canvas"></canvas>
+
 		<div v-if="false" id="loadingSection" class="fullWidth">
 			<h1>Loading... (If this takes too long it means there was a serious error!)</h1>
 		</div>
@@ -95,7 +98,7 @@
 				</tr> 
 			</table>
 		</div>
-		<div id="treeOverlay" class="treeOverlay" v-if="player.tab!='gameEnded'" onscroll="resizeCanvas()" v-bind:class="{ fullWidth: (player.tab == 'none' || player.navTab == 'none'), col: (player.tab !== 'none' && player.navTab !== 'none'), left: (player.tab !== 'none' && player.navTab !== 'none')}">
+		<div id="treeOverlay" class="treeOverlay" onscroll="resizeCanvas()" v-bind:class="{ fullWidth: (player.tab == 'none' || player.navTab == 'none'), col: (player.tab !== 'none' && player.navTab !== 'none'), left: (player.tab !== 'none' && player.navTab !== 'none')}">
 			<div id="version" class="overlayThing" style="margin-right: 13px">{{VERSION.withoutName}}</div>
 			<img id="optionWheel"  class="overlayThing" v-if="player.tab!='options'" src="options_wheel.png" onclick="showTab('options')"></img>
 			<div id="info" v-if="player.tab!='info'"  class="overlayThing" onclick="showTab('info')"><br>i</div>
@@ -107,7 +110,7 @@
 					<li><a class="link" href="http://discord.gg/wwQfgPa" target="_blank" v-bind:style="{'font-size': '16px'}">Main Prestige Tree server</a></li>
 				</ul>
 			</div>
-			<div class="overlayThing" style="padding-bottom:7px; width: 90%">
+			<div class="overlayThing" v-if="player.tab!='gameEnded' && !(player.navTab == 'none' && (player.tab=='options' || player.tab=='info'))" style="padding-bottom:7px; width: 90%">
 				<span v-if="player.devSpeed && player.devSpeed != 1" class="overlayThing">
 					<br>Dev Speed: {{format(player.devSpeed)}}x<br>
 				</span>
@@ -126,7 +129,7 @@
 				<div v-for="thing in tmp.displayThings" class="overlayThing"><span v-if="thing" v-html="thing"></span></div>
 			</div>
 			<div class="sideLayers" >
-				<div v-for="node in OTHER_LAYERS['side']"><layer-node :layer='node.layer' :abb='tmp[node.layer].symbol' :size="'small'"></layer-node></div>
+				<div v-for="node in OTHER_LAYERS['side']"><layer-node :layer='node' :abb='tmp[node].symbol' :size="'small'"></layer-node></div>
 			</div>
 		</div>
 
@@ -151,13 +154,7 @@
 				<span v-if="canGenPoints()"  class="overlayThing">({{format(getPointGen())}}/sec)</span>
 				<div v-for="thing in tmp.displayThings" class="overlayThing"><span v-if="thing" v-html="thing"></span></div>
 			</div>
-			<span v-for="(n, row) in (maxRow + 1)"><table>
-				<td v-for="node in TREE_LAYERS[row]">
-					<layer-node :layer='node.layer' :abb='tmp[node.layer].symbol'></layer-node>
-				</td>
-				<table><button class="treeNode hidden"></button></table>
-			</span>
-			<canvas id="treeCanvas" class="canvas"></canvas>
+			<tree :data="(layoutInfo.treeLayout ? layoutInfo.treeLayout : TREE_LAYERS)"></tree>
 		</div>
 		<div v-for="layer in LAYERS" >
 			<div v-if="player.navTab == 'none'" id="fakeHead" style="visibility: hidden;">
diff --git a/js/mod.js b/js/mod.js
index f7d62f7..39cef6b 100644
--- a/js/mod.js
+++ b/js/mod.js
@@ -9,8 +9,6 @@ let modInfo = {
 	initialStartPoints: new Decimal (10), // Used for hard resets and new players
 	
 	offlineLimit: 1,  // In hours
-	startTab: "none",
-	startNavTab: "tree",
 }
 
 // Set your version in num and name
diff --git a/js/tree.js b/js/tree.js
new file mode 100644
index 0000000..82a5db4
--- /dev/null
+++ b/js/tree.js
@@ -0,0 +1,15 @@
+var layoutInfo = {
+    startTab: "none",
+	showTree: true,
+
+    treeLayout: ""
+
+    
+}
+
+
+// A "ghost" layer which offsets other layers in the tree
+addNode("spook", {
+    layerShown: "ghost",
+}, 
+)
diff --git a/js/utils.js b/js/utils.js
index 58f7bd4..8371970 100644
--- a/js/utils.js
+++ b/js/utils.js
@@ -7,7 +7,8 @@ function exponentialFormat(num, precision) {
 		m = new Decimal(1)
 		e = e.add(1)
 	}
-	return m.toStringWithDecimalPlaces(precision)+"e"+e.toStringWithDecimalPlaces(0)
+	e = (e.gte(10000) ? commaFormat(e, 0) : e.toStringWithDecimalPlaces(0))
+	return m.toStringWithDecimalPlaces(precision)+"e"+e
 }
 
 function commaFormat(num, precision) {
@@ -61,7 +62,9 @@ function formatWhole(decimal) {
 function formatTime(s) {
 	if (s<60) return format(s)+"s"
 	else if (s<3600) return formatWhole(Math.floor(s/60))+"m "+format(s%60)+"s"
-	else return formatWhole(Math.floor(s/3600))+"h "+formatWhole(Math.floor(s/60)%60)+"m "+format(s%60)+"s"
+	else if (s<86400) return formatWhole(Math.floor(s/3600))+"h "+formatWhole(Math.floor(s/60)%60)+"m "+format(s%60)+"s"
+	else if (s<31536000) return formatWhole(Math.floor(s/84600)%365)+"d " + formatWhole(Math.floor(s/3600)%24)+"h "+formatWhole(Math.floor(s/60)%60)+"m "+format(s%60)+"s"
+	else return formatWhole(Math.floor(s/31536000))+"y "+formatWhole(Math.floor(s/84600)%365)+"d " + formatWhole(Math.floor(s/3600)%24)+"h "+formatWhole(Math.floor(s/60)%60)+"m "+format(s%60)+"s"
 }
 
 function toPlaces(x, precision, maxAccepted) {
@@ -80,8 +83,8 @@ function save() {
 
 function startPlayerBase() {
 	return {
-		tab: modInfo.startTab,
-		navTab: modInfo.startNavTab,
+		tab: layoutInfo.startTab,
+		navTab: (layoutInfo.showTree ? "tree" : "none"),
 		time: Date.now(),
 		autosave: true,
 		notify: {},