Merge branch 'dev'

README.md

@@ -2,4 +2,6 @@
 
 A modified version of The Prestige Tree that is much easier to mod. It still requires programming knowledge, but it's mostly pretty easy things and copy/pasting.
 
-You can look in the [documentation](docs/!general-info.md) for more information on how it all works, or look at the code in layers.js and sampleLayers.js to see what it all looks like.
+[Look here for a tutorial on getting started with modding with TMT](docs/getting-started.md)
+
+You can look in the [documentation](docs/!general-info.md) for more information on how it all works, or look at the code in layers.js to see what it all looks like.

changelog.md

@@ -1,6 +1,13 @@
 #The Modding Tree changelog:
 
 
+##v1.3.5
+- Completely automated convertToDecimal, now you never have to worry about it again.
+- Branches can be defined without a color id. But they can also use hex values for color ids!
+- Created a tutorial for getting started with TMT and Github.
+- Page title is now automatically taken from mod name.
+
+
 ##v1.3.4: 10/8/20
 - Added "midsection" feature to add things to a tab's layout while still keeping the standard layout.
 - Fix for being able to buy more buyables than you should.

docs/!general-info.md

@@ -18,13 +18,15 @@ plain number, and perform operations on them by calling functions. e.g, instead
 
 ## Table of Contents:
 
+- [Getting Started](getting-started.md): Getting your own copy of the code set up with Github Desktop.
 - [Basic layer breakdown](basic-layer-breakdown.md): Breaking down the components of a layer with minimal features.
 - [Layer features](layer-features.md): Explanations of all of the different properties that you can give a layer.
 - [Upgrades](upgrades.md): How to create upgrades for a layer.
 - [Milestones](milestones.md): How to create milestones for a layer.
 - [Challenges](challenges.md): How to create challenges for a layer.
 - [Buyables](buyables.md): Create rebuyable upgrades for your layer (with the option to make them respec-able).
-                           Can be used to make Enhancers or Space Buildings.
+                           Can be used to make Enhancers or Space Buildings, but they're flexible enough to do anything.
 - [Custom Tab Layouts](custom-tab-layouts.md): An optional way to give your tabs a different layout.
                                                    You can even create entirely new components to use.
 - [Subtabs and Microtabs](subtabs-and-microtabs.md): Create subtabs for your tabs, as well as "microtab" components that you can put inside the tabs.
+- [Updating TMT](updating-tmt.md): Using Github Desktop to update your mod's version of TMT.

docs/buyables.md

@@ -1,8 +1,10 @@
 # Buyables
 
-Buyables are things that can be bought multiple times with scaling costs. If you set a respec function,
+Buyables are usually things that can be bought multiple times with scaling costs. If you set a respec function,
 the player can reset the purchases to get their currency back.
 
+However, if you're creative, you can use them for basically anything. "canAfford()" is effectively "canClick()" and "buy()" is effectively "onClick()".
+
 You can use buyableEffect(layer, id) to get the current effects of a buyable.
 
 Buyables should be formatted like this:

docs/getting-started.md

@@ -0,0 +1,62 @@
+# Getting started
+
+Welcome to The Modding Tree!
+
+Using the Modding Tree, at its simplest level, just requires getting a copy of it onto your computer.
+However, if you do it the right way, it will help in many ways.
+
+Don't let the word "Github" scare you away. It's actually much easier to use than most people think, 
+especially because most people use it the hard way. The key is Github Desktop, which lets you do
+everything you need to, without even touching the command line. 
+
+The benefits of using Github:
+- It makes it much, much easier to update The Modding Tree.
+- You can share your work without any extra effort using githack, or with a bit more effort,
+    set up a github.io site.
+- It lets you undo changes to your code, and to have multiple versions of it.
+- It lets you collaborate with other people, if you want to.
+
+
+# Getting set up with Github and The Modding Tree:
+
+1. Install [Github Desktop](https://desktop.github.com/) and [Visual Studio Code](https://code.visualstudio.com/).
+
+2. Make a Github account. You can handle this on your own.
+
+3. Log in on your browser, and go back to [The Modding Tree page](https://github.com/Acamaeda/The-Modding-Tree). At the top right,
+    there should be a button that says "fork". Click on it, and then on your username.
+    You now have your own fork, or copy, of The Modding Tree.
+
+4. Open Github Desktop and log in. Ignore everything else and choose "clone a repository".
+    A "repository" is basically a "Github project", like The Modding Tree. "Cloning" is
+    downloading a copy of the repository to your computer.
+
+5. Look for The Modding Tree in the list of repositiories (it should be the only one) and click "clone". 
+
+6. Select that you're using it for your own purposes, and click continue. It will download the files and handle everything.
+
+
+# Using your repository
+
+1. Click on "show in finder" to the right, and then open index.html. This will let you view and
+    test your project!
+
+2. To edit your project, click "open in VSCode" in Github Desktop.
+
+3. Open index.html, and look at the top part where it says "modInfo". On the lines below that, change
+    the mod's name to whatever you want, and change the id as well. (The id is important, it determines where the game looks for your saves. It should be different from other mods, and shouldn't be changed once set.) 
+
+4. Reload index.html. The title on the tab, as well as on the info page, will now be the new ones!
+
+5. Go back to Github Desktop. It's time to save your changes into the git system by making a "commit".
+
+6. At the bottom right corner, add a summary of your changes, and then click "commit to master".
+
+7. Finally, at the top middle, click "push origin" to push your changes out onto the online repository.
+
+8. You can view your project on line, or share it with others, by going to
+https://raw.githack.com/[YOUR-GITHUB-USERNAME]/The-Modding-Tree/master/index.html
+
+
+And now, you have successfully used Github! You can look at the [documentation](!general-info.md) to
+see how The Modding Tree's system works and to make your mod a reality.

docs/layer-features.md

@@ -113,10 +113,9 @@ Key:
 
 # Tree/node features
 
-- branches: **optional**, determines what lines should appear on the tree when this layer is visible.
+- branches: **optional**, an array of layer ids. On a tree, a line will appear from this layer to all of the layers
-            An array of pairs consisting of a layer name and a number from 1 to 3.
+            in the list. Alternatively, an entry in the array can be a pair consisting of the layer id and a color
-            A branch will appear connecting this layer to the correspodnding layer, with the color based on the number.
+            value. The color value can either be a string with a hex color code, or a number from 1-3 (theme-affected colors)
-            You should add the branch value to the layer that is unlocked second.
 
 - nodeStyle(): **optional**, a function returning a CSS object, styles this layer's node on the tree
 
@@ -131,11 +130,6 @@ Key:
                            Without it, the default is to reset everything on the row, but only 
                            if it was triggered by a layer in a higher row.
 
-- convertToDecimal(): **sometimes required**, required if you add non-standard Decimals to startData. 
-                        This function converts those values from a string to a Decimal (used when loading).
-                        Convert a value to Decimal with `value = new Decimal(value)`
-
-
 - update(diff): **optional**, this function is called every game tick. Use it for any passive resource production or
                 time-based things. diff is the time since the last tick.
                 Suggestion: use addPoints(layer, gain) when generating points to automatically

docs/updating-tmt.md

@@ -0,0 +1,28 @@
+# Updating The Modding Tree
+
+This tutorial assumes that you have used [the Getting Started Tutorial](getting-started.md), and are using Github Desktop and VSCode for your mod.
+
+Here's what you have to do when there's a TMT update:
+
+1. Look at the changelog. It will warn you if the update will break anything or require any changes.
+    Decide if you want to try to update.
+
+2. Open Github Desktop, and at the top middle, click "fetch origin". This will make Github Desktop get
+    information about the update. 
+
+3. Click where it says "current branch: master" at the top middle, and at the bottom of the thing
+that appears, click "choose a branch to merge into master.
+
+4. Select upstream/master. It will likely say there are conflicts, but you have tools to resolve them. 
+    Click "Merge upstream/master into master".
+
+5. A conflict happens when the things you're trying to merge have both made changes in the same place.
+    Click "open in Visual Studio Code" next to the first file. 
+
+6. Scroll down through the file, and look for the parts highlighted in red and green. One of these is
+    your code, and the other is some code that will be modified by the update. Do your best to try to
+    edit things to keep the updated changes, but keep your content.
+
+7. Continue to do this for all remaining challenges.
+
+8. Do any other changes required by the update, run the game, fix issues, etc.

index.html

@@ -8,7 +8,6 @@
 			offlineLimit: 1  // In hours
 		}
 	</script>
-	<title>The Modding Tree</title>
 	<link rel="stylesheet" type="text/css" href="style.css" />
 	<link href="https://fonts.googleapis.com/css?family=Inconsolata" rel="stylesheet">
 	<script src="https://cdn.jsdelivr.net/npm/vue@2.6.12"></script>
@@ -49,6 +48,19 @@
 		</div>
 		<div v-if="player.tab=='changelog'" class="col right">
 			<button class="back" onclick="showTab('tree')">←</button><br><br><br>
+			<h3>v1.3.5</h3>
+			<ul>
+				<li>The system now handles convertToDecimal for everything automatically!</li>
+				<li>Created a tutorial for getting started with TMT and Github.</li>
+				<li>Branches can be defined without a color id. But they can also use hex values for color ids!</li>
+				<li>Page title is now automatically taken from mod name.</li>
+
+			</ul>
+			<h3>v1.3.4</h3>
+			<ul>
+				<li>Added "midsection" feature to add things to a tab's layout while still keeping the standard layout.</li>
+				<li>Fix for being able to buy more buyables than you should.</li>
+			</ul><br>
 			<h3>v1.3.3</h3>
 			<ul>
 				<li>Fix for the "order of operations" issue in temp.</li>

js/canvas.js

@@ -50,8 +50,16 @@ function drawTree() {
 }
 
 function drawTreeBranch(num1, data) { // taken from Antimatter Dimensions & adjusted slightly
-	let num2 = data[0]
+	let num2 = data
-	let color_id = data[1]
+	let color_id = 1
+
+	if (Array.isArray(data)){
+		num2 = data[0]
+		color_id = data[1]
+	}
+
+	if(typeof(color_id) == "number")
+		color_id = colors_theme[color_id]
 
 	if (document.getElementById(num1) == null || document.getElementById(num2) == null)
 		return
@@ -64,7 +72,7 @@ function drawTreeBranch(num1, data) { // taken from Antimatter Dimensions & adju
     let y2 = end.top + (end.height / 2) + (document.getElementById("treeTab").scrollTop || document.body.scrollTop);
     ctx.lineWidth = 15;
     ctx.beginPath();
-    ctx.strokeStyle = colors_theme[color_id]
+    ctx.strokeStyle = color_id
     ctx.moveTo(x1, y1);
     ctx.lineTo(x2, y2);
     ctx.stroke();

js/game.js

@@ -5,7 +5,7 @@ var NaNalert = false;
 var gameEnded = false;
 
 let VERSION = {
-	num: "1.3.4",
+	num: "1.3.5",
 	name: "Tabception... ception!"
 }
 
@@ -35,24 +35,6 @@ function inChallenge(layer, id){
 		return layers[layer].challs[id].countsAs.includes(id)
 }
 
-function convertToDecimal() {
-	player.points = new Decimal(player.points)
-	for (layer in layers) {
-		player[layer].points = new Decimal(player[layer].points)
-		if (player[layer].best != undefined) player[layer].best = new Decimal(player[layer].best)
-		if (player[layer].total !== undefined) player[layer].total = new Decimal(player[layer].total)
-		player[layer].spentOnBuyables = new Decimal(player[layer].spentOnBuyables)
-
-		if (player[layer].buyables != undefined) {
-			for (id in player[layer].buyables)
-				player[layer].buyables[id] = new Decimal(player[layer].buyables[id])
-		}
-		player[layer].best = new Decimal(player[layer].best)
-
-		if (layers[layer].convertToDecimal) layers[layer].convertToDecimal();
-	}
-}
-
 function getResetGain(layer, useType = null) {
 	let type = useType
 	if (!useType) type = layers[layer].type
@@ -219,7 +201,6 @@ function doReset(layer, force=false) {
 	for (let x = row; x >= 0; x--) rowReset(x, layer)
 	prevOnReset = undefined
 
-	setupTemp();
 	updateTemp()
 	updateTemp()
 }

js/layers.js

@@ -167,9 +167,6 @@ addLayer("c", {
         doReset(resettingLayer){ // Triggers when this layer is being reset, along with the layer doing the resetting. Not triggered by lower layers resetting, but is by layers on the same row.
             if(layers[resettingLayer].row > this.row) fullLayerReset(this.layer) // This is actually the default behavior
         },
-        convertToDecimal() {
-            // Convert any layer-specific Decimal values (besides points, total, and best) from String to Decimal (used when loading save)
-        },
         layerShown() {return true}, // Condition for when layer appears on the tree
         update(diff) {
             if (player[this.layer].upgrades.includes(11)) player.points = player.points.add(tmp.pointGen.times(diff)).max(0)
@@ -292,7 +289,7 @@ addLayer("f", {
         },
         row: 1,
         layerShown() {return true}, 
-        branches: [["c", 1]], // Each pair corresponds to a line added to the tree when this node is unlocked. The letter is the other end of the line, and the number affects the color, 1 is default
+        branches: ["c"], // When this layer appears, a branch will appear from this layer to any layers here. Each entry can be a pair consisting of a layer id and a color.
 
         tooltipLocked() { // Optional, tooltip displays when the layer is locked
             return ("This weird farmer dinosaur will only see you if you have at least " + this.requires() + " candies. You only have " + formatWhole(player.points))

js/utils.js

@@ -107,50 +107,44 @@ function getStartPlayer() {
 }
 
 function fixSave() {
-	defaultData = startPlayerBase()
+	defaultData = getStartPlayer()
-	for (datum in defaultData){
+	fixData(defaultData, player)
-		if (player[datum] == undefined){
-			player[datum] = defaultData[datum]
-		}
-	}
-	for (layer in layers) {
-		defaultData = layers[layer].startData()
-		if (player[layer].upgrades == undefined)
-			player[layer].upgrades = []
-		if (player[layer].milestones == undefined)
-			player[layer].milestones = []
-		if (player[layer].challs == undefined)
-			player[layer].challs = []
 
-		for (datum in defaultData){
+	for(layer in layers)
-			if (player[layer][datum] == undefined){
+	{
-				player[layer][datum] = defaultData[datum]
+		if (player[layer].best !== undefined) player[layer].best = new Decimal (player[layer].best)
+		if (player[layer].total !== undefined) player[layer].total = new Decimal (player[layer].total)
 	}
+}
+
+function fixData(defaultData, newData) {
+	for (item in defaultData){
+		if (defaultData[item] == null) {
+			if (newData[item] === undefined)
+				newData[item] = null
 		}
-
+		else if (Array.isArray(defaultData[item])) {
-		if (player[layer].spentOnBuyables == undefined)
+			if (newData[item] === undefined)
-			player[layer].spentOnBuyables = new Decimal(0)
+				newData[item] = defaultData[item]
-
+			else
-		if (layers[layer].buyables) {
+				fixData(defaultData[item], newData[item])
-			if (player[layer].buyables == undefined) player[layer].buyables = {}
-
-			for (id in layers[layer].buyables){
-				if (player[layer].buyables[id] == undefined && !isNaN(id))
-					player[layer].buyables[id] = new Decimal(0)
 		}
+		else if (defaultData[item] instanceof Decimal) { // Convert to Decimal
+			if (newData[item] === undefined)
+				newData[item] = defaultData[item]
+			else
+				newData[item] = new Decimal(newData[item])
 		}
-		
+		else if ((!!defaultData[item]) && (defaultData[item].constructor === Object)) {
-		if (layers[layer].tabFormat && !Array.isArray(layers[layer].tabFormat)) {
+			if (newData[item] === undefined)
-			if (player.subtabs[layer] == undefined) player.subtabs[layer] = {}
+				newData[item] = defaultData[item]
-			if (player.subtabs[layer].mainTabs == undefined) player.subtabs[layer].mainTabs = Object.keys(layers[layer].tabFormat)[0]
+			else
+				fixData(defaultData[item], newData[item])
 		}
-
+		else {
-		if (layers[layer].microtabs) {
+			if (newData[item] === undefined)
-			if (player.subtabs[layer] == undefined) player.subtabs[layer] = {}
+				newData[item] = defaultData[item]
-			for (item in layers[layer].microtabs)
-				if (player.subtabs[layer][item] == undefined) player.subtabs[layer][item] = Object.keys(layers[layer].microtabs[item])[0]
 		}
-	
 	}	
 }
 
@@ -166,7 +160,6 @@ function load() {
 		player.offTime.remain += (Date.now() - player.time) / 1000
 	}
 	player.time = Date.now();
-	convertToDecimal();
 	versionCheck();
 	changeTheme();
 	changeTreeQuality();
@@ -414,3 +407,5 @@ var onFocused = false
 function focused(x) {
 	onFocused = x
 }
+
+document.title = modInfo.name

js/v.js

@@ -311,3 +311,5 @@ function loadVue() {
 		},
 	})
 }
+
+