From 751d59691917c2001e9c620119b780a3304a42ad Mon Sep 17 00:00:00 2001 From: Acamaeda Date: Sun, 4 Oct 2020 13:10:04 -0400 Subject: [PATCH] Added subtabs, fixed some issues --- changelog.md | 41 ++++++++++++++++++++++++++++++++++++ index.html | 59 ++++++++++++++++------------------------------------ js/game.js | 35 ++----------------------------- js/layers.js | 39 +++++++++++++++++++--------------- js/utils.js | 41 ++++++++++++++++++++++++++++++++++-- style.css | 14 +++++++++++++ 6 files changed, 136 insertions(+), 93 deletions(-) create mode 100644 changelog.md diff --git a/changelog.md b/changelog.md new file mode 100644 index 0000000..09f0736 --- /dev/null +++ b/changelog.md @@ -0,0 +1,41 @@ +#The Modding Tree changelog: + +##v1.2.4 - 10/4/20 + +- Layers are now highlighted if you can buy an upgrade, and a new feature, shouldNotify, +lets you make it highlight other ways. +- Fixed bugs with hasUpg, hasChall, hasMilestone, and inChallenge. +- Changed the sample code to use the above functions for convenience. + +##v1.2.3 - 10/3/20 + +- Added a row component, which displays a list of objects in a row. +- Added a column component, which displays a list of objects in a column (useful within a row). +- Changed blanks to have a customizable width and height. + +#v1.2: This Changes Everything! - 10/3/20 + +- Many layer features can now be static values or functions. (This made some formats change, +which will break old things) +- You can now use the "this" keyword, to make code easier to transfer when making new layers. +- Also added "this.layer", which is the current layer's name, and works on existing subfeatures +(e.g. individual upgrades) as well! Subfeatures also have "this.id". +- Fixed a big save issue. If you use a unique mod id, your save will never conflict with other mods. +- Added a configurable offline time limit in modinfo at the top of index.html. (default 1 hour) +- Added a few minor features, and updated the docs with new information. + + + +##v1.1.1 + +- You can define hotkeys directly from layer config. + +#v1.1: Enhanced Edition + +- Added "Buyables", which can function like Space Buildings or Enhancers. +- Custom CSS can now be used on any component! Make the third argument an object with CSS +parameters. +- Lots of minor good things. + +#v1.0: +- First release. \ No newline at end of file diff --git a/index.html b/index.html index 5f26a27..47d8e14 100644 --- a/index.html +++ b/index.html @@ -45,46 +45,13 @@

-

v1.2.4

-
-

v1.2.3

-
-

v1.2: This Changes Everything!

+

v1.3: Finally some real progress!


-
Alpha / Beta

-
-
-
-

v1.1.1

-
-

v1.1: Enhanced Edition

-
-

v1.0: Technically Something

-
- + Full history
+

{{modInfo.name}}

@@ -175,12 +142,22 @@

-
-
-
-
+
+
- +
+
+
+
+ +
+
+
+
+ +
+
+
diff --git a/js/game.js b/js/game.js index 2cf2447..0a98de7 100644 --- a/js/game.js +++ b/js/game.js @@ -5,39 +5,8 @@ var NaNalert = false; var gameEnded = false; let VERSION = { - num: "1.2.4", - name: "This changes everything!" -} - -function startPlayerBase() { - return { - tab: "tree", - time: Date.now(), - autosave: true, - notify: {}, - msDisplay: "always", - offlineProd: true, - versionType: "Modding", - version: VERSION.num, - beta: VERSION.beta, - timePlayed: 0, - keepGoing: false, - hasNaN: false, - points: new Decimal(10), - } -} - -function getStartPlayer() { - playerdata = startPlayerBase() - for (layer in layers){ - playerdata[layer] = layers[layer].startData() - playerdata[layer].buyables = getStartBuyables(layer) - playerdata[layer].spentOnBuyables = new Decimal(0) - playerdata[layer].upgrades = [] - playerdata[layer].milestones = [] - playerdata[layer].challs = [] - } - return playerdata + num: "1.3", + name: "Finally some real progress!" } function getPointGen() { diff --git a/js/layers.js b/js/layers.js index 5ce48d7..c3dd3f7 100644 --- a/js/layers.js +++ b/js/layers.js @@ -172,23 +172,28 @@ addLayer("c", { incr_order: [], // Array of layer names to have their order increased when this one is first unlocked // Optional, lets you format the tab yourself by listing components. You can create your own components in v.js. - tabFormat: ["main-display", - ["prestige-button", function() {return "Melt your points into "}], - ["blank", "5px"], // Height - ["raw-html", function() {return ""}], - ["display-text", - function() {return 'I have ' + format(player.points) + ' pointy points!'}, - {"color": "red", "font-size": "32px", "font-family": "Comic Sans MS"}], - ["buyables", "150px"], - ["row", [ - ["toggle", ["c", "beep"]], ["blank", ["30px", "10px"]], // Width, height - ["display-text", function() {return "Beep"}], "blank", - ["column", [ - ["prestige-button", function() {return "Be redundant for "}, {'width': '150px', 'height': '30px'}], - ["prestige-button", function() {return "Be redundant for "}, {'width': '150px', 'height': '30px'}], - ]], - ]], - "milestones", "blank", "upgrades", "challs"], + tabFormat: { + main: + ["main-display", + ["prestige-button", function() {return "Melt your points into "}], + ["blank", "5px"], // Height + ["raw-html", function() {return ""}], + ["display-text", + function() {return 'I have ' + format(player.points) + ' pointy points!'}, + {"color": "red", "font-size": "32px", "font-family": "Comic Sans MS"}], + "milestones", "blank", "upgrades", "challs"], + thingies: [ + ["buyables", "150px"], "blank", + ["row", [ + ["toggle", ["c", "beep"]], ["blank", ["30px", "10px"]], // Width, height + ["display-text", function() {return "Beep"}], "blank", + ["column", [ + ["prestige-button", function() {return "Be redundant for "}, {'width': '150px', 'height': '30px'}], + ["prestige-button", function() {return "Be redundant for "}, {'width': '150px', 'height': '30px'}], + ]], + ]], +], + }, style() {return { 'background-color': '#3325CC' }}, diff --git a/js/utils.js b/js/utils.js index 166f599..9fc324f 100644 --- a/js/utils.js +++ b/js/utils.js @@ -56,6 +56,40 @@ function save() { localStorage.setItem(modInfo.id, btoa(JSON.stringify(player))) } +function startPlayerBase() { + return { + tab: "tree", + time: Date.now(), + autosave: true, + notify: {}, + msDisplay: "always", + offlineProd: true, + versionType: "Modding", + version: VERSION.num, + beta: VERSION.beta, + timePlayed: 0, + keepGoing: false, + hasNaN: false, + points: new Decimal(10), + } +} + +function getStartPlayer() { + playerdata = startPlayerBase() + for (layer in layers){ + playerdata[layer] = layers[layer].startData() + playerdata[layer].buyables = getStartBuyables(layer) + playerdata[layer].spentOnBuyables = new Decimal(0) + playerdata[layer].upgrades = [] + playerdata[layer].milestones = [] + playerdata[layer].challs = [] + if (layers[layer].tabFormat && !Array.isArray(layers[layer].tabFormat)) + playerdata[layer].subtab = Object.keys(layers[layer].tabFormat)[0] + + } + return playerdata +} + function fixSave() { defaultData = startPlayerBase() for (datum in defaultData){ @@ -89,6 +123,9 @@ function fixSave() { player[layer].buyables[id] = new Decimal(0) } } + + if (player[layer].subtab == undefined && layers[layer].tabFormat && !Array.isArray(layers[layer].tabFormat)) + player[layer].subtab = Object.keys(layers[layer].tabFormat)[0] } } @@ -145,12 +182,12 @@ function versionCheck() { let setVersion = true if (player.versionType===undefined||player.version===undefined) { - player.versionType = "Modding" + player.versionType = modInfo.id player.version = 0 } if (setVersion) { - if (player.versionType == "Modding" && VERSION.num > player.version) player.keepGoing = false + if (player.versionType == modInfo.id && VERSION.num > player.version) player.keepGoing = false player.versionType = getStartPlayer().versionType player.version = VERSION.num player.beta = VERSION.beta diff --git a/style.css b/style.css index 8633e35..b6ed0f7 100644 --- a/style.css +++ b/style.css @@ -124,6 +124,20 @@ h1, h2, h3, b, input { text-shadow: 0px 0px 7px var(--color); } +.tabButton { + background-color: transparent; + border: none; + color: var(--color); + font-size: 24px; + cursor: pointer; + padding: 10px 50px 10px 50px +} + +.tabButton:hover { + transform: scale(1.1, 1.1); + text-shadow: 0px 0px 7px var(--color); +} + .reset { height: 120px; width: 180px;