mirror of
https://github.com/Acamaeda/The-Modding-Tree.git
synced 2025-02-16 09:41:41 +00:00
Updated docs, did some minor fixes
Updated documentation
This commit is contained in:
parent
29d9cec1fb
commit
0951051667
11 changed files with 107 additions and 25 deletions
14
changelog.md
14
changelog.md
|
@ -1,5 +1,19 @@
|
|||
#The Modding Tree changelog:
|
||||
|
||||
##v1.3: Tabception... ception! - 10/7/20
|
||||
|
||||
- Added subtabs! And also a Micro-tab component to let you make smaller subtab-esque areas anywhere.
|
||||
- Added a "custom" prestige formula type, and a number of features to support it.
|
||||
- Added points/sec display (can be disabled).
|
||||
- Added h-line, v-line and image-display components, plus components for individual upgrades, challenges, and milestones.
|
||||
- Added upgEffect, buyableEffect, and challEffect functions.
|
||||
- Added "hide completed challenges" setting.
|
||||
- Moved old changelogs to a separate place.
|
||||
- Fixed hasMilestone and incr_order.
|
||||
- Static layers now show the currency amount needed for the next one if you can buy max.
|
||||
|
||||
|
||||
|
||||
##v1.2.4 - 10/4/20
|
||||
|
||||
- Layers are now highlighted if you can buy an upgrade, and a new feature, shouldNotify,
|
||||
|
|
|
@ -25,5 +25,6 @@ plain number, and perform operations on them by calling functions. e.g, instead
|
|||
- [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.
|
||||
- [Customized Tab Layouts](custom-tab-layouts.md): An optional way to give your tabs a different layout.
|
||||
- [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.
|
||||
|
|
|
@ -1,5 +1,8 @@
|
|||
# Custom tab layouts
|
||||
|
||||
Note: If you are using subtabs, tabFormat is used differently, but you still use the same format within each subtabs.
|
||||
[See here for more on subtabs](subtabs-and-microtabs.md)
|
||||
|
||||
Custom tab layouts can be used to do basically anything in a tab window, especially combined with the "style" layer feature. The tabFormat feature is an array of things, like this:
|
||||
|
||||
```js
|
||||
|
@ -38,6 +41,8 @@ These are the existing components, but you can create more in v.js:
|
|||
- buyables: Display all of the buyables for this layer, as appropriate. The argument optional, and is the size of the
|
||||
boxes in pixels.
|
||||
|
||||
- microtabs: Display a set of subtabs for an area. The argument is the name of the set of microtabs in the "microtabs" feature.
|
||||
|
||||
- upgrade, milestone, chall, buyable: An individual upgrade, challenge, etc. The argument is the id.
|
||||
This can be used if you want to have upgrades split up across multiple subtabs, for example.
|
||||
|
||||
|
|
|
@ -75,7 +75,11 @@ Key:
|
|||
- buyables: Effectively upgrades that can be bought multiple times, and are optionally respeccable.
|
||||
[Explanations are in a separate file.](buyables.md)
|
||||
|
||||
- microtabs: An area that functions like a set of subtabs, with buttons at the top changing the content within. (Advanced)
|
||||
[Explanations are in a separate file.](subtabs-and-microtabs.md)
|
||||
|
||||
|
||||
(subtabs-and-microtabs.md):
|
||||
# Prestige formula features
|
||||
|
||||
- baseResource: The name of the resource that determines how much of the main currency you gain on reset.
|
||||
|
|
52
docs/subtabs-and-microtabs.md
Normal file
52
docs/subtabs-and-microtabs.md
Normal file
|
@ -0,0 +1,52 @@
|
|||
# Subtabs and Microtabs
|
||||
|
||||
Subtabs are separate sections of a tab that you can view by selecting one at the top of the tab. Microtabs are smaller areas that function in much the same way.
|
||||
|
||||
Subtabs are defined by using the tab format like this, where each element of tabFormat is given the name of that subtab:
|
||||
|
||||
```js
|
||||
tabFormat: {
|
||||
"Main tab": {
|
||||
*subtab features*
|
||||
},
|
||||
"Other tab": {
|
||||
*subtab features*
|
||||
},
|
||||
|
||||
etc
|
||||
},
|
||||
```
|
||||
|
||||
Microtabs are defined similarly, and use the same features, but are defined in the "microtabs" feature. Each entry is a
|
||||
group of tabs which will appear in a microtabs component. The first set, "stuff", has 2 tabs, and the second,
|
||||
"otherStuff", has none.
|
||||
|
||||
```js
|
||||
microtabs: {
|
||||
stuff: {
|
||||
first: {
|
||||
*subtab features*
|
||||
},
|
||||
second: {
|
||||
*subtab features*
|
||||
},
|
||||
},
|
||||
|
||||
otherStuff: {
|
||||
// There could be another set of microtabs here
|
||||
}
|
||||
},
|
||||
```
|
||||
|
||||
Normal subtabs and microtab subtabs both use the same features:
|
||||
|
||||
# Features:
|
||||
|
||||
- content: The tab layout code for the subtab, in [the tab layout format](custom-tab-layouts.md)
|
||||
|
||||
- style: **Optional**, A CSS object or function returning a CSS object, which affects the CSS when in that subtab.
|
||||
|
||||
- buttonStyle: **Optional**, A CSS object or function returning that CSS object, which affects the appearance of the button for that subtab.
|
||||
|
||||
- unl(): **Optional**, a function to determine if the button for this subtab should be visible. By default, a subtab is always unlocked.
|
||||
(You can't use the "this" keyword in this function.)
|
10
index.html
10
index.html
|
@ -49,11 +49,11 @@
|
|||
</div>
|
||||
<div v-if="player.tab=='changelog'" class="col right">
|
||||
<button class="back" onclick="showTab('tree')">←</button><br>
|
||||
<h3>v1.3: Tabbing out</h3>
|
||||
<h3>v1.3: Tabception... ception!</h3>
|
||||
<ul>
|
||||
<li>Added subtabs! And also a Micro-tab component to let you make smaller subtab-esque areas anywhere.</li>
|
||||
<li>Added a "custom" prestige formula type, and a number of features to support it.</li>
|
||||
<li>Added points/sec display (can be disabled).</li>
|
||||
<li>Added points/sec display (can be disabled, automatically disabled if getPointGen is 0).</li>
|
||||
<li>Added h-line, v-line and image-display components, plus components for individual upgrades, challenges, and milestones.</li>
|
||||
<li>Added upgEffect, buyableEffect, and challEffect functions.</li>
|
||||
<li>Added "hide completed challenges" setting.</li>
|
||||
|
@ -165,11 +165,11 @@
|
|||
<div v-if="Array.isArray(layers[layer].tabFormat)">
|
||||
<column :layer="layer" :data="layers[layer].tabFormat"></column>
|
||||
</div>
|
||||
<div v-else>
|
||||
<div class="upgTable" v-bind:style="{'margin-top': '-30px', 'margin-bottom': '24px'}">
|
||||
<div v-else v-bind:style="[{'margin-top': '-50px'}, readData(layers[layer].tabFormat[player.subtabs[layer].mainTabs].style)]">
|
||||
<div class="upgTable" v-bind:style="{'padding-top': '25px', 'margin-bottom': '24px'}">
|
||||
<tab-buttons :layer="layer" :data="layers[layer].tabFormat" :name="'mainTabs'"></tab-buttons>
|
||||
</div>
|
||||
<column v-bind:style="readData(layers[layer].tabFormat[player[layer].subtab.mainTabs].style)" :layer="layer" :data="layers[layer].tabFormat[player[layer].subtab.mainTabs].content"></column>
|
||||
<column :layer="layer" :data="layers[layer].tabFormat[player.subtabs[layer].mainTabs].content"></column>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
15
js/game.js
15
js/game.js
|
@ -6,11 +6,14 @@ var gameEnded = false;
|
|||
|
||||
let VERSION = {
|
||||
num: "1.3",
|
||||
name: "Tabbing Out"
|
||||
name: "Tabception... ception!"
|
||||
}
|
||||
|
||||
// Calculate points/sec!
|
||||
function getPointGen() {
|
||||
if(!hasUpg("c", 11))
|
||||
return new Decimal(0)
|
||||
|
||||
let gain = new Decimal(1)
|
||||
if (hasUpg("c", 12)) gain = gain.times(upgEffect("c", 12))
|
||||
return gain
|
||||
|
@ -18,7 +21,7 @@ function getPointGen() {
|
|||
|
||||
// Determines if it should show points/sec
|
||||
function showPointGen(){
|
||||
return (true)
|
||||
return (tmp.pointGen.neq(new Decimal(0)))
|
||||
}
|
||||
|
||||
// Function to determine if the player is in a challenge
|
||||
|
@ -128,14 +131,14 @@ function fullLayerReset(layer) {
|
|||
player[layer].milestones = []
|
||||
player[layer].challs = []
|
||||
if (layers[layer].tabFormat && !Array.isArray(layers[layer].tabFormat)) {
|
||||
if (player[layer].subtab == undefined) player[layer].subtab = {}
|
||||
if (player[layer].subtab.mainTabs == undefined) player[layer].subtab.mainTabs = Object.keys(layers[layer].tabFormat)[0]
|
||||
if (player.subtabs[layer] == undefined) player.subtabs[layer] = {}
|
||||
if (player.subtabs[layer].mainTabs == undefined) player.subtabs[layer].mainTabs = Object.keys(layers[layer].tabFormat)[0]
|
||||
}
|
||||
|
||||
if (layers[layer].microtabs) {
|
||||
if (player[layer].subtab == undefined) player[layer].subtab = {}
|
||||
if (player.subtabs[layer] == undefined) player.subtabs[layer] = {}
|
||||
for (item in layers[layer].microtabs)
|
||||
if (player[layer].subtab[item] == undefined) player[layer].subtab[item] = Object.keys(layers[layer].microtabs[item])[0]
|
||||
if (player.subtabs[layer][item] == undefined) player.subtabs[layer][item] = Object.keys(layers[layer].microtabs[item])[0]
|
||||
}
|
||||
resetBuyables(layer)
|
||||
}
|
||||
|
|
|
@ -191,7 +191,7 @@ addLayer("c", {
|
|||
|
||||
// Optional, lets you format the tab yourself by listing components. You can create your own components in v.js.
|
||||
tabFormat: {
|
||||
main: {
|
||||
"main tab": {
|
||||
buttonStyle: {'color': 'orange'},
|
||||
content:
|
||||
["main-display",
|
||||
|
|
|
@ -1,4 +1,6 @@
|
|||
function updateTemp() {
|
||||
if (tmp.genPoints == undefined) tmp.genPoints = false
|
||||
|
||||
if (!tmp.challActive) {tmp.challActive = {}}
|
||||
if (!tmp.challs) tmp.challs = {}
|
||||
for (layer in layers) {
|
||||
|
|
17
js/utils.js
17
js/utils.js
|
@ -80,6 +80,7 @@ function startPlayerBase() {
|
|||
hasNaN: false,
|
||||
hideChalls: false,
|
||||
points: new Decimal(10),
|
||||
subtabs: {},
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -93,13 +94,13 @@ function getStartPlayer() {
|
|||
playerdata[layer].milestones = []
|
||||
playerdata[layer].challs = []
|
||||
if (layers[layer].tabFormat && !Array.isArray(layers[layer].tabFormat)) {
|
||||
playerdata[layer].subtab = {}
|
||||
playerdata[layer].subtab.mainTabs = Object.keys(layers[layer].tabFormat)[0]
|
||||
playerdata.subtabs[layer] = {}
|
||||
playerdata.subtabs[layer].mainTabs = Object.keys(layers[layer].tabFormat)[0]
|
||||
}
|
||||
if (layers[layer].microtabs) {
|
||||
if (playerdata[layer].subtab == undefined) playerdata[layer].subtab = {}
|
||||
if (playerdata.subtabs[layer] == undefined) playerdata.subtabs[layer] = {}
|
||||
for (item in layers[layer].microtabs)
|
||||
playerdata[layer].subtab[item] = Object.keys(layers[layer].microtabs[item])[0]
|
||||
playerdata.subtabs[layer][item] = Object.keys(layers[layer].microtabs[item])[0]
|
||||
}
|
||||
}
|
||||
return playerdata
|
||||
|
@ -140,14 +141,14 @@ function fixSave() {
|
|||
}
|
||||
|
||||
if (layers[layer].tabFormat && !Array.isArray(layers[layer].tabFormat)) {
|
||||
if (player[layer].subtab == undefined) player[layer].subtab = {}
|
||||
if (player[layer].subtab.mainTabs == undefined) player[layer].subtab.mainTabs = Object.keys(layers[layer].tabFormat)[0]
|
||||
if (player.subtabs[layer] == undefined) player.subtabs[layer] = {}
|
||||
if (player.subtabs[layer].mainTabs == undefined) player.subtabs[layer].mainTabs = Object.keys(layers[layer].tabFormat)[0]
|
||||
}
|
||||
|
||||
if (layers[layer].microtabs) {
|
||||
if (player[layer].subtab == undefined) player[layer].subtab = {}
|
||||
if (player.subtabs[layer] == undefined) player.subtabs[layer] = {}
|
||||
for (item in layers[layer].microtabs)
|
||||
if (player[layer].subtab[item] == undefined) player[layer].subtab[item] = Object.keys(layers[layer].microtabs[item])[0]
|
||||
if (player.subtabs[layer][item] == undefined) player.subtabs[layer][item] = Object.keys(layers[layer].microtabs[item])[0]
|
||||
}
|
||||
|
||||
}
|
||||
|
|
8
js/v.js
8
js/v.js
|
@ -261,14 +261,14 @@ function loadVue() {
|
|||
Vue.component('microtabs', {
|
||||
props: ['layer', 'data'],
|
||||
computed: {
|
||||
currentTab() {return player[layer].subtab[data]}
|
||||
currentTab() {return player.subtabs[layer][data]}
|
||||
},
|
||||
template: `
|
||||
<div v-if="layers[layer].microtabs">
|
||||
<div v-if="layers[layer].microtabs" :style="{'border-style': 'solid'}">
|
||||
<div class="upgTable">
|
||||
<tab-buttons :layer="layer" :data="layers[layer].microtabs[data]" :name="data"></tab-buttons>
|
||||
</div>
|
||||
<column v-bind:style="readData(layers[layer].microtabs[data][player[layer].subtab[data]].style)" :layer="layer" :data="layers[layer].microtabs[data][player[layer].subtab[data]].content"></column>
|
||||
<column v-bind:style="readData(layers[layer].microtabs[data][player.subtabs[layer][data]].style)" :layer="layer" :data="layers[layer].microtabs[data][player.subtabs[layer][data]].content"></column>
|
||||
</div>
|
||||
`
|
||||
})
|
||||
|
@ -280,7 +280,7 @@ function loadVue() {
|
|||
template: `
|
||||
<div class="upgRow">
|
||||
<div v-for="tab in Object.keys(data)">
|
||||
<button v-if="!data[tab].unl || data[tab].unl()" class="tabButton" v-bind:style="[{'border-color': tmp.layerColor[layer]}, readData(data[tab].buttonStyle)]" v-on:click="player[layer].subtab[name] = tab">{{tab}}</button>
|
||||
<button v-if="!data[tab].unl || data[tab].unl()" class="tabButton" v-bind:style="[{'border-color': tmp.layerColor[layer]}, readData(data[tab].buttonStyle)]" v-on:click="player.subtabs[layer][name] = tab">{{tab}}</button>
|
||||
</div>
|
||||
</div>
|
||||
`
|
||||
|
|
Loading…
Add table
Reference in a new issue