thepaperpilot/the_ascension_tree
1
0
Fork 0
mirror of https://github.com/thepaperpilot/the_ascension_tree.git synced 2025-01-31 07:31:36 +00:00
Code Issues Releases Activity Actions

Add more QoL

Browse source 
- layers which do not produce anything but can be prestiged are highlighted green;
- two QoL upgrades on all layers except the first, fully automating them.
This commit is contained in:
semenar 2021-04-03 00:22:20 +03:00
parent 8520f0ac96
commit 5c90cf9288
4 changed files with 88 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
css/layer.css
View file

@ -8,6 +8,13 @@
align-items: center;
}
#layer_info .layer-header {
display: grid;
grid-template-columns: 1fr 2fr 1fr;
gap: 0.5em;
align-self: stretch;
}
#layer_info .title {
font-size: 1.5em;
}
@ -82,7 +89,7 @@
flex-direction: column;
}
#layer_info .upgrade::before {
.upgrades-list .upgrade::before {
content: "";
padding-bottom: 100%;
display: inline-block;

3
css/tree.css
View file

@ -50,6 +50,9 @@
filter: none;
cursor: auto;
}
.tree-node.ascensionAvailable {
box-shadow: 0 0 10px 5px lime;
}
.tree-node.purchaseAvailable {
box-shadow: 0 0 10px 5px red;
}

30
index.html
View file

@ -84,12 +84,30 @@
<div class="tree" id="tree"></div>
</div>
<div id="layer_info">
<p class="title">The Ascension Tree</p>
<p class="type">&nbsp;</p>
<p class="points">You have <span class="point-amount big-number">0</span> <span class="point-name"></span></p>
<p class="point-gain">(+<span class="gain-amount"></span>/s)</p>
<p class="boost-from">&times;<span class="boost-from-value"></span> from lower layers</p>
<p class="boost-to">&times;<span class="boost-to-value"></span> to higher layers</p>
<div class="layer-header">
<button class="upgrade" id="qol_left" onclick="player.current_layer.buyLeft()">
<div class="content">
<p class="upgrade-desc">Upgrades on this layer are never reset</p>
<p class="divider"></p>
<p class="upgrade-cost">Cost: <span class="left-child-req"></span> <span class="left-child-name"></span></p>
</div>
</button>
<div>
<p class="title">The Ascension Tree</p>
<p class="type">&nbsp;</p>
<p class="points">You have <span class="point-amount big-number">0</span> <span class="point-name"></span></p>
<p class="point-gain">(+<span class="gain-amount"></span>/s)</p>
<p class="boost-from">&times;<span class="boost-from-value"></span> from lower layers</p>
<p class="boost-to">&times;<span class="boost-to-value"></span> to higher layers</p>
</div>
<button class="upgrade" id="qol_right" onclick="player.current_layer.buyRight()">
<div class="content">
<p class="upgrade-desc">Get 100% of gain on ascension per second</p>
<p class="divider"></p>
<p class="upgrade-cost">Cost: <span class="right-child-req"></span> <span class="right-child-name"></span></p>
</div>
</button>
</div>
<button class="prestige" disabled style="visibility: hidden;" onclick="player.current_layer.prestige()">
<p class="cannot-prestige">Ascend<br>Need <span class="prestige-need"></span> <span class="prev-point-name"></span></p>
<p class="can-prestige" style="display: none">Ascend for <span class="prestige-gain"></span> <span class="point-name"></span>

57
js/classes/layer.js
View file

@ -52,6 +52,9 @@ class Layer {
this.color = [19, 138, 54];
}
this.left_branch = false;
this.right_branch = false;
this.rng = sfc32(this.depth, this.coord, seed, 0xDEADBEEF);
for (let i = 0; i < 15; i++) this.rng();
@ -260,6 +263,7 @@ class Layer {
processTimedelta(delta) {
this.points = this.points.add(this.calculateProduction(this.depth == 0 ? 1 : 0).mul(delta / 1000));
if (this.right_branch) this.points = this.points.add(this.prestigeGain().mul(delta / 1000));
if ((this.child_left == undefined || this.child_right == undefined) && this.points.gt(this.final_goal)) {
player.layers.push(new Layer(player.seed, player.layers.length, this, true));
player.layers.push(new Layer(player.seed, player.layers.length, this, false));
@ -269,7 +273,8 @@ class Layer {
screenUpdate() {
this.unlockReq.style.visibility = this.child_left === undefined || this.child_right === undefined ? "" : "hidden";
let purchaseAvailable = Object.values(this.upgrades).some(upg => !upg.bought && upg.canBuy());
this.nodeEl.className = `tree-node${purchaseAvailable ? ' purchaseAvailable' : ''}`;
let ascensionAvailable = this.calculateProduction(0).eq(0) && this.prestigeGain().gt(0);
this.nodeEl.className = `tree-node${ascensionAvailable ? ' ascensionAvailable' : ''}${purchaseAvailable ? ' purchaseAvailable' : ''}`;
}
screenUpdateCurrent() {
@ -301,6 +306,26 @@ class Layer {
if (this.parent_layer == undefined) layer_container.getElementsByClassName('prestige')[0].style.visibility = "hidden";
else layer_container.getElementsByClassName('prestige')[0].style.visibility = "";
if (this.parent_layer == undefined || this.child_left == undefined) document.getElementById("qol_left").style.visibility = "hidden";
else {
document.getElementById("qol_left").style.visibility = "";
document.getElementById("qol_left").disabled = this.child_left.points.lt(this.child_left.final_goal);
if (this.left_branch) document.getElementById("qol_left").classList.add("complete");
else document.getElementById("qol_left").classList.remove("complete");
layer_container.getElementsByClassName('left-child-req')[0].textContent = formatNumber(this.child_left.final_goal, true);
layer_container.getElementsByClassName('left-child-name')[0].textContent = this.child_left.points_name + " points";
}
if (this.parent_layer == undefined || this.child_right == undefined) document.getElementById("qol_right").style.visibility = "hidden";
else {
document.getElementById("qol_right").style.visibility = "";
document.getElementById("qol_right").disabled = this.child_right.points.lt(this.child_right.final_goal);
if (this.right_branch) document.getElementById("qol_right").classList.add("complete");
else document.getElementById("qol_right").classList.remove("complete");
layer_container.getElementsByClassName('right-child-req')[0].textContent = formatNumber(this.child_right.final_goal, true);
layer_container.getElementsByClassName('right-child-name')[0].textContent = this.child_right.points_name + " points";
}
if (this.canPrestige()) {
layer_container.getElementsByClassName('prestige')[0].disabled = false;
layer_container.getElementsByClassName('cannot-prestige')[0].style.display = "none";
@ -313,7 +338,7 @@ class Layer {
}
for (let element of layer_container.getElementsByClassName('prestige-need')) {
element.textContent = formatNumber(this.prestigeNeed(), true, true);
element.textContent = formatNumber(this.prestigeNeed().add(1), true, true);
}
if (this.prestigeGain().gt(100)) layer_container.getElementsByClassName('next-at')[0].style.display = "none";
@ -378,13 +403,31 @@ class Layer {
}
reset() {
for (let key of Object.keys(this.upgrades)) {
this.upgrades[key].bought = false;
if (!this.left_branch) {
for (let key of Object.keys(this.upgrades)) {
this.upgrades[key].bought = false;
}
}
this.points = new Decimal(0);
//if (this.parent_layer != undefined) this.parent_layer.reset();
}
buyLeft() {
if (this.child_left == undefined) return;
if (this.child_left.points.lt(this.child_left.final_goal)) return;
if (this.left_branch) return;
this.left_branch = true;
this.child_left.points = this.child_left.points.sub(this.child_left.final_goal);
}
buyRight() {
if (this.child_right == undefined) return;
if (this.child_right.points.lt(this.child_right.final_goal)) return;
if (this.right_branch) return;
this.right_branch = true;
this.child_right.points = this.child_right.points.sub(this.child_right.final_goal);
}
save() {
let data = [];
data.push(this.id);
@ -403,6 +446,9 @@ class Layer {
for (let key of Object.keys(this.upgrades)) upgrade_data.push(this.upgrades[key].save());
data.push(upgrade_data);
data.push(this.left_branch);
data.push(this.right_branch);
return data;
}
@ -426,6 +472,9 @@ class Layer {
this.upgrades[upg[0]].load(this, upg);
}
if (data.length > 11) this.left_branch = data[11];
if (data.length > 12) this.right_branch = data[12];
this.child_left = undefined;
this.child_right = undefined;