Added drop-down

changelog.md

@@ -1,7 +1,9 @@
 # The Modding Tree changelog:
 
-### v2.5.12 - 6/2/21
+### v2.6 - 6/2/21
 - Fixed issues with NaN checking. Saves should never break now unless something really unusual happens.
+- Added a drop-down menu component!
+- Options are now saved separately, and not affected by hard resetting or importing saves.
 - Fixed demo.html
 - Fixed branches not working on the right tab.
 - Fixed background color not working on the left tab.
@@ -13,6 +15,7 @@
 - resetsNothing now works immediately on a reset that enables it.
 - Made the star on maxed challenges larger.
 
+- diff can no longer be negative.
 - Fixed challenges with no currencyDisplayName using "points" instead of the mod's pointsName.
 - inChallenge no longer can return undefined.
 - Fixed certain things skipping negative rows (now they are treated like non-numeric rows, and don't appear in the tree still).

demo.html

@@ -126,6 +126,5 @@
 			<bg :layer="player.tab" ></bg>
 
 		</div>
-		<div class="bg2"></div>
 	</div>
 </body>

docs/custom-tab-layouts.md

@@ -45,9 +45,12 @@ These are the existing components, but you can create more in [components.js](/j
     (Works with strings, numbers, and Decimals!)
 
 - slider: Lets the user input a value with a slider. The argument a 3-element array: [name, min, max].
-    The name is the name of the variable in player[layer] that the input that the input is for, and min and max are the limits of the slider.
+    The name is the name of the variable in player[layer] that the input  is for, and min and max are the limits of the slider.
     (Does not work for Decimal values)
 
+- drop-down: Lets the user input a value with a dropdown menu. The argument a 2-element array: [name, options].
+    The name is the name of the variable in player[layer] that the input is for, and options is an array of strings for options you can use.
+
 - upgrades: The layer's upgrades. The argument is optional, and is a the list of rows this component should include, if it doesn't have all of them.
 
 - milestones, challenges, achievements: Display the upgrades, milestones, and challenges for a layer, as appropriate.

docs/grids.md

@@ -2,7 +2,7 @@
 
 Grids are an easier way of making a group of similar clickables. They all have the same behavior, but are different based on their data.
 
-**NOTE: Gridables are similar to clickables in some respects, but are fundamentally different from normal TMT components in quite a few ways. Be sure to keep these in mind:**
+**NOTE: Gridables are similar to clickables in some respects, but are fundamentally different from normal TMT Big Features in quite a few ways. Be sure to keep these in mind:**
   - Gridable ids use base 100 instead of base 10, so you can have more than 10 tiles in a row. This means that a grid might look like this:
     101  102
     201  202

index.html

@@ -98,7 +98,7 @@
 			<overlay-head id="fakeHead" style="visibility: hidden;">
 			</overlay-head>
 			<layer-tab :layer="player.navTab == 'none' ? player.tab : player.navTab" :key="'left'"></layer-tab>
-
+			<bg :layer="player.navTab == 'none' ? player.tab : player.navTab" ></bg>
 		</div>
 
 		<!-- Popups -->
@@ -117,12 +117,14 @@
 				</div>
 		</div>
 
-		<div v-if="player.navTab !== 'none' && player.tab !== 'none' && !(gameEnded && !player.keepGoing)" onscroll="resizeCanvas()" style="background-color:var(--background)" v-bind:class="{ fullWidth: player.navTab == 'none' || !tmp.other.splitScreen || !readData(layoutInfo.showTree), col: player.navTab != 'none', right: player.navTab != 'none', fast: true, tab: true}">
+		<div v-if="player.navTab !== 'none' && player.tab !== 'none' && !(gameEnded && !player.keepGoing)" onscroll="resizeCanvas()" v-bind:class="{ fullWidth: player.navTab == 'none' || !tmp.other.splitScreen || !readData(layoutInfo.showTree), col: player.navTab != 'none', right: player.navTab != 'none', fast: true, tab: true}">
 			<div v-for="layer in LAYERS">
 				<div v-if="player.tab==layer">
 					<layer-tab :layer="layer" :back="'none'" :spacing="'50px'" :key="'left'"></layer-tab>
 				</div>
 			</div>
+			<bg :layer="player.tab" ></bg>
+
 		</div>
 	</div>
 </body>

js/Demo/demoLayers.js

@@ -15,6 +15,7 @@ addLayer("c", {
             beep: false,
             thingy: "pointy",
             otherThingy: 10,
+            drop: "drip",
         }},
         color: "#4BDC13",
         requires: new Decimal(10), // Can be a function that takes requirement increases into account
@@ -221,7 +222,7 @@ addLayer("c", {
         microtabs: {
             stuff: {
                 first: {
-                    content: ["upgrades", ["display-text", function() {return "confirmed"}]]
+                    content: ["upgrades", ["display-text", function() {return "confirmed<br>" + player.c.drop}], ["drop-down", ["drop", ["drip", "drop"]]]]
                 },
                 second: {
                     embedLayer: "f",

js/Demo/demoMod.js

@@ -11,7 +11,7 @@ let modInfo = {
 
 // Set your version in num and name
 let VERSION = {
-	num: "2.5.12",
+	num: "2.6",
 	name: "Dreams Really Do Come True",
 }
 

js/components.js

@@ -515,7 +515,7 @@ function loadVue() {
 		`
 	})
 
-// Updates the value in player[layer][data]
+	// Updates the value in player[layer][data][0]
 	Vue.component('slider', {
 		props: ['layer', 'data'],
 		template: `
@@ -524,6 +524,15 @@ function loadVue() {
 		`
 	})
 
+	// Updates the value in player[layer][data[0]], options are an array in data[1]
+	Vue.component('drop-down', {
+		props: ['layer', 'data'],
+		template: `
+			<select v-model="player[layer][data[0]]">
+				<option v-for="item in data[1]" v-bind:value="item">{{item}}</option>
+			</select>
+		`
+	})
 	// These are for buyables, data is the id of the corresponding buyable
 	Vue.component('sell-one', {
 		props: ['layer', 'data'],
@@ -599,6 +608,8 @@ function loadVue() {
 			mouseY,
 			shiftDown,
 			ctrlDown,
+			run,
+			gridRun,
 		},
 	})
 }

js/game.js

@@ -4,7 +4,7 @@ var gameEnded = false;
 
 // Don't change this
 const TMT_VERSION = {
-	tmtNum: "2.5.12",
+	tmtNum: "2.6",
 	tmtName: "Dreams Really Do Come True"
 }
 
@@ -333,7 +333,7 @@ function gameLoop(diff) {
 		clearParticles()
 	}
 
-	if (isNaN(diff)) diff = 0
+	if (isNaN(diff) || diff < 0) diff = 0
 	if (gameEnded && !player.keepGoing) {
 		diff = 0
 		//player.tab = "gameEnded"