mirror of
https://github.com/Acamaeda/The-Modding-Tree.git
synced 2024-11-21 16:13:55 +00:00
125 lines
No EOL
11 KiB
HTML
125 lines
No EOL
11 KiB
HTML
<!DOCTYPE html>
|
|
<head>
|
|
<title>The Prestige Tree</title>
|
|
<link rel="stylesheet" type="text/css" href="style.css" />
|
|
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
|
|
<script type="text/javascript" src="js/break_eternity.min.js"></script>
|
|
<script type="text/javascript" src="js/game.js"></script>
|
|
<script type="text/javascript" src="js/v.js"></script>
|
|
<script type="text/javascript" src="js/canvas.js"></script>
|
|
</head>
|
|
<body onload="load()">
|
|
<div id="app">
|
|
<img id="optionWheel" v-if="player.tab!='options'" src="options_wheel.png" onclick="showTab('options')"></img>
|
|
<div id="info" v-if="player.tab=='tree'" onclick="showTab('info')"><br>i</div>
|
|
<div class="vl"></div>
|
|
<br><br>
|
|
<div v-if="player.tab=='info'" class="col right">
|
|
<button class="back" onclick="showTab('tree')">←</button><br><br><br><br><br>
|
|
<h3>Hotkeys</h3><br><br>
|
|
P: Prestige reset<br>
|
|
<span v-if="player.b.unl">B: Booster reset</span><br>
|
|
<span v-if="player.g.unl">G: Generator reset</span><br>
|
|
<span v-if="player.t.unl">T: Time reset</span><br>
|
|
<span v-if="player.e.unl">E: Enhance reset</span><br>
|
|
<span v-if="player.s.unl">S: Space reset</span><br>
|
|
</div>
|
|
<div v-if="player.tab=='options'" class="col right">
|
|
<button class="back" onclick="showTab('tree')">←</button><br><br><br><br><br>
|
|
<table>
|
|
<tr>
|
|
<td><button class="opt" onclick="save()">Save</button></td>
|
|
<td><button class="opt" onclick="hardReset()">HARD RESET</button></td>
|
|
</tr>
|
|
<tr>
|
|
<td><button class="opt" onclick="exportSave()">Export</button></td>
|
|
<td><button class="opt" onclick="importSave()">Import</button></td>
|
|
</tr>
|
|
<tr>
|
|
<td><button class="opt" onclick="toggleOpt('autosave')">Autosave: {{ player.autosave?"ON":"OFF" }}</button></td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
<div class="col left">
|
|
You have <h2>{{format(player.points)}}</h2> Points
|
|
<br><br><br><br><br>
|
|
<table>
|
|
<tr>
|
|
<td id="p"><button onclick="showTab('p')" v-bind:tooltip="(player.points.gte(getLayerReq('p'))||player.p.unl) ? (formatWhole(player.p.points)+' prestige points') : ('Reach '+format(getLayerReq('p'))+' points to unlock')" v-bind:class="{ treeNode: true, p: true, locked: (player.points.lt(getLayerReq('p'))&&!player.p.unl), can: (player.points.gte(getLayerReq('p'))||player.p.unl) }">P</button></td>
|
|
</tr>
|
|
</table><table>
|
|
<tr>
|
|
<td><button class="treeNode hidden"></button></td>
|
|
</tr>
|
|
</table><table>
|
|
<tr>
|
|
<td v-if="player.b.unl||player.g.unl" class="left"><br><br><img class="remove" src="remove.png" onclick="resetRow(1)"></img></td>
|
|
<td id="b" v-if="layerUnl('b')"><button onclick="showTab('b')" v-bind:tooltip="((player.points.gte(getLayerReq('b'))||player.b.unl)&&layerUnl('b')) ? (formatWhole(player.b.points)+' boosters') : ('Reach '+format(getLayerReq('b'))+' points to unlock')" v-bind:class="{ treeNode: true, b: true, locked: (player.points.lt(getLayerReq('b'))&&!player.b.unl), can: (player.points.gte(getLayerReq('b'))||player.b.unl) }">B</button></td>
|
|
<td id="g" v-if="layerUnl('g')"><button onclick="showTab('g')" v-bind:tooltip="((player.points.gte(getLayerReq('g'))||player.g.unl)&&layerUnl('g')) ? (formatWhole(player.g.points)+' generators') : ('Reach '+format(getLayerReq('g'))+' points to unlock')" v-bind:class="{ treeNode: true, g: true, locked: (player.points.lt(getLayerReq('g'))&&!player.g.unl), can: (player.points.gte(getLayerReq('g'))||player.g.unl) }">G</button></td>
|
|
</tr>
|
|
</table><table>
|
|
<tr>
|
|
<td><button class="treeNode hidden"></button></td>
|
|
</tr>
|
|
</table><table>
|
|
<tr>
|
|
<td v-if="player.e.unl||player.t.unl||player.s.unl" class="left"><br><br><img class="remove" src="remove.png" onclick="resetRow(2)"></img></td>
|
|
<td id="t" v-if="layerUnl('t')"><button onclick="showTab('t')" v-bind:tooltip="((player.points.gte(getLayerReq('t'))||player.t.unl)&&layerUnl('t')) ? (formatWhole(player.t.points)+' time capsules') : ('Reach '+format(getLayerReq('t'))+' points to unlock')" v-bind:class="{ treeNode: true, t: true, locked: (player.points.lt(getLayerReq('t'))&&!player.t.unl), can: (player.points.gte(getLayerReq('t'))||player.t.unl) }">T</button></td>
|
|
<td id="e" v-if="layerUnl('e')"><button onclick="showTab('e')" v-bind:tooltip="((player.points.gte(getLayerReq('e'))||player.e.unl)&&layerUnl('e')) ? (formatWhole(player.e.points)+' enhance points') : ('Reach '+format(getLayerReq('e'))+' points to unlock')" v-bind:class="{ treeNode: true, e: true, locked: (player.points.lt(getLayerReq('e'))&&!player.e.unl), can: (player.points.gte(getLayerReq('e'))||player.e.unl) }">E</button></td>
|
|
<td id="s" v-if="layerUnl('s')"><button onclick="showTab('s')" v-bind:tooltip="((player.points.gte(getLayerReq('s'))||player.s.unl)&&layerUnl('s')) ? (formatWhole(player.s.points)+' space energy') : ('Reach '+format(getLayerReq('s'))+' points to unlock')" v-bind:class="{ treeNode: true, s: true, locked: (player.points.lt(getLayerReq('s'))&&!player.s.unl), can: (player.points.gte(getLayerReq('s'))||player.s.unl) }">S</button></td>
|
|
</tr>
|
|
</table>
|
|
<canvas id="treeCanvas" class="canvas"></canvas>
|
|
</div>
|
|
<div v-for="layer in LAYERS">
|
|
<div v-if="player.tab==layer" class="col right">
|
|
<button class="back" onclick="showTab('tree')">←</button><br><br><br>
|
|
You have <h2 v-bind:class="{ [layer+'_txt']: true }">{{formatWhole(player[layer].points)}}</h2> {{LAYER_RES[layer]}}<span v-if="Object.keys(LAYER_EFFS).includes(layer)">, {{getLayerEffDesc(layer)}}</span>
|
|
<br><br>
|
|
<div v-if="layer=='b'">
|
|
<table><tr><td v-bind:class="{ milestone: player.b.best.lt(8), milestoneDone: player.b.best.gte(8) }">8 Boosters<br>Keep Prestige Upgrades on reset</td></tr><tr><td v-bind:class="{ milestone: player.b.best.lt(15), milestoneDone: player.b.best.gte(15) }">15 Boosters<br>You can buy max Boosters</td></tr></table>
|
|
</div>
|
|
<div v-if="layer=='g'">
|
|
You have {{format(player.g.power)}} Generator Power, which multiplies Point gain by {{format(getGenPowerEff())}}<br><br>
|
|
<table><tr><td v-bind:class="{ milestone: player.g.best.lt(8), milestoneDone: player.g.best.gte(8) }">8 Generators<br>Keep Prestige Upgrades on reset</td></tr><tr><td v-bind:class="{ milestone: player.g.best.lt(10), milestoneDone: player.g.best.gte(10) }">10 Generators<br>Gain 100% of Prestige Point gain every second</td></tr><tr><td v-bind:class="{ milestone: player.g.best.lt(15), milestoneDone: player.g.best.gte(15) }">15 Generators<br>You can buy max Generators</td></tr></table>
|
|
</div>
|
|
<div v-if="layer=='e'">
|
|
<table><tr><td v-bind:class="{ milestone: player.e.best.lt(2), milestoneDone: player.e.best.gte(2) }">2 enhance points<br>Keep Booster/Generator milestones on reset</td></tr>
|
|
<tr><td v-bind:class="{ milestone: player.e.best.lt(10), milestoneDone: player.e.best.gte(10) }">10 enhance points<br>Keep Prestige Upgrades on reset</td></tr></table><br><br>
|
|
<button v-bind:class="{ upgBig: true, can: player.e.points.gte(getEnhancerCost()), locked: player.e.points.lt(getEnhancerCost()), e: true }" onclick="buyEnhancer()">Buy an Enhancer<br>Cost: {{formatWhole(getEnhancerCost())}} Enhance Points<br>Amount: {{formatWhole(player.e.enhancers)}}<br>Multiplies Prestige Point gain by {{format(getEnhancerEff())}}<br>Adds to base of Booster/Generator effects by {{format(getEnhancerEff2())}}</button>
|
|
</div>
|
|
<div v-if="layer=='t'">
|
|
You have {{format(player.t.energy)}} Time Energy, which multiplies Point gain & Prestige Point gain by {{format(getTimeEnergyEff())}}<br><br>
|
|
<table><tr><td v-bind:class="{ milestone: player.t.best.lt(2), milestoneDone: player.t.best.gte(2) }">2 time capsules<br>Keep Booster/Generator milestones on reset</td></tr>
|
|
<tr><td v-bind:class="{ milestone: player.t.best.lt(3), milestoneDone: player.t.best.gte(3) }">3 time capsules<br>Keep Prestige Upgrades on reset</td></tr>
|
|
<tr><td v-bind:class="{ milestone: player.t.best.lt(4), milestoneDone: player.t.best.gte(4) }">4 time capsules<br>Keep Booster Upgrades on all row 3 resets</td></tr>
|
|
</table><br><br>
|
|
<button v-bind:class="{ upgBig: true, can: (player.b.points.gte(getExtCapsuleCost())&&player.t.unl), locked: (player.b.points.lt(getExtCapsuleCost())||!player.t.unl), t: true }" onclick="buyExtCapsule()">Buy an extra Time Capsule<br>Cost: {{formatWhole(getExtCapsuleCost())}} Boosters<br>Amount: {{formatWhole(player.t.extCapsules)}}</button>
|
|
</div>
|
|
<div v-if="layer=='s'">
|
|
You have {{formatWhole(getSpace())}} Space.<br><br>
|
|
<table><tr><td v-bind:class="{ milestone: player.s.best.lt(2), milestoneDone: player.s.best.gte(2) }">2 space energy<br>Keep Booster/Generator milestones on reset</td></tr>
|
|
<tr><td v-bind:class="{ milestone: player.s.best.lt(3), milestoneDone: player.s.best.gte(3) }">3 space energy<br>Keep Prestige Upgrades on reset</td></tr>
|
|
<tr><td v-bind:class="{ milestone: player.s.best.lt(4), milestoneDone: player.s.best.gte(4) }">4 space energy<br>Keep Generator Upgrades on all row 3 resets</td></tr>
|
|
</table><br><br>
|
|
<button onclick="respecSpaceBuildings()" v-bind:class="{ longUpg: true, can: player.s.unl, locked: !player.s.unl }">Respec Space Buildings</button><br>
|
|
<table><tr>
|
|
<td v-for="id in 4">
|
|
<button v-if="getSpaceBuildingsUnl()>=id" v-bind:class="{ upg: true, can: (player.g.power.gte(getSpaceBuildingCost(id))&&player.s.unl&&getSpace().gte(1)), locked: (!(player.g.power.gte(getSpaceBuildingCost(id))&&player.s.unl&&getSpace().gte(1))), s: true }" v-on:click="buyBuilding(id)">Building {{id}}<br>Level: {{formatWhole(player.s.buildings[id])}}<br>Cost: {{format(getSpaceBuildingCost(id))}} Generator Power<br>Effect: {{getSpaceBuildingEffDesc(id)}}</button>
|
|
</td>
|
|
</tr></table>
|
|
</div>
|
|
<br><br><br>
|
|
<button v-if="LAYER_TYPE[layer]=='normal'" v-bind:class="{ [layer]: true, reset: true, locked: player.points.lt(getLayerReq(layer)), can: player.points.gte(getLayerReq(layer)) }" v-on:click="doReset(layer)">+{{formatWhole(getResetGain(layer))}} {{LAYER_RES[layer]}}<br>Next at {{ format(getNextAt(layer)) }} points</button>
|
|
<button v-if="LAYER_TYPE[layer]=='static'" v-bind:class="{ [layer]: true, reset: true, locked: player.points.lt(getNextAt(layer)), can: player.points.gte(getNextAt(layer)) }" v-on:click="doReset(layer)">+{{formatWhole(getResetGain(layer))}} {{LAYER_RES[layer]}}<br>Req: {{format(getNextAt(layer))}} points</button>
|
|
<br><br><br>
|
|
<table>
|
|
<tr v-for="row in LAYER_UPGS[layer].rows">
|
|
<td v-for="col in LAYER_UPGS[layer].cols"><button v-if="LAYER_UPGS[layer][row*10+col].unl()" v-on:click="buyUpg(layer, row*10+col)" v-bind:class="{ [layer]: true, upg: true, bought: player[layer].upgrades.includes(row*10+col), locked: (player[layer].points.lt(LAYER_UPGS[layer][row*10+col].cost)&&!player[layer].upgrades.includes(row*10+col)), can: (player[layer].points.gte(LAYER_UPGS[layer][row*10+col].cost)&&!player[layer].upgrades.includes(row*10+col)) }">{{ LAYER_UPGS[layer][row*10+col].desc }}<br>Cost: {{ formatWhole(LAYER_UPGS[layer][row*10+col].cost) }} {{LAYER_RES[layer]}}<span v-if="LAYER_UPGS[layer][row*10+col].currently"><br>Currently: {{LAYER_UPGS[layer][row*10+col].effDisp(LAYER_UPGS[layer][row*10+col].currently())}}</span></button></td>
|
|
</tr>
|
|
</table>
|
|
<br><br><br><br>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</body> |