1
0
Fork 0
mirror of https://github.com/Acamaeda/The-Modding-Tree.git synced 2024-11-24 17:31:50 +00:00
The-Modding-Tree/index.html
2020-10-03 15:45:47 -04:00

175 lines
No EOL
8.9 KiB
HTML

<!DOCTYPE html>
<head>
<script>
const modInfo = {
name: "The Modding Tree",
id: "modbase",
pointsName: "points",
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>
<script type="text/javascript" src="js/break_eternity.js"></script>
<script type="text/javascript" src="js/layerSupport.js"></script>
<script type="text/javascript" src="js/layers.js"></script>
<script type="text/javascript" src="js/temp.js"></script>
<script type="text/javascript" src="js/saves.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">
<div class="vl" v-if="player.tab!='tree'&&player.tab!='gameEnded'"></div>
<div v-if="player.tab=='gameEnded'" class="fullWidth">
<br>
<h2>{{modInfo.name}} {{VERSION.withoutName}}</h2><br><br>
<h3>Congratulations! You have reached the end and beaten this game, but for now...</h3><br>
<h3>Please check the Discord to see there are new content updates!</h3><br><br>
<div v-if="!player.timePlayedReset">It took you {{formatTime(player.timePlayed)}} to beat the game.</div>
<div v-if="player.timePlayedReset">Make sure that you record the time in your stream or else your speedrun won't count!</div>
<br>
<button class="longUpg can" onclick="hardReset(true)">Play Again</button>&nbsp;&nbsp;&nbsp;&nbsp;<button class="longUpg can" onclick="keepGoing()">Keep Going</button>
<br><br><br>
<a class="link" href="http://discord.gg/wwQfgPa" target="_blank">Main Prestige Tree Discord</a><br>
<br><br>
If you would like to speedrun this, press Play Again and record your attempt, then submit on the Discord Server in the channel #speedrun-submissions.
<br><br><br>
<h1>Oh, you are still reading this?</h1>
<br>
</div>
<div v-if="player.tab=='changelog'" class="col right">
<button class="back" onclick="showTab('tree')"></button><br>
<h3>v1.2: This Changes Everything!</h3>
<ul>
<li>Many layer features can now be static values or functions. (This made some notations change, which will break things)</li>
<li>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".</li>
<li>Fixed a big save issue. If you use a unique mod id, your save will never conflict with other mods.</li>
<li>Added a configurable offline time limit in modinfo at the top of index.html. (default 1 hour)</li>
<li>Added a few minor features, and updated the docs with new information.</li>
</ul><br>
<h3>v1.1.1</h3>
<ul>
<li>You can define hotkeys in layer config.</li>
</ul><br>
<h3>v1.1: Enhanced Edition</h3>
<ul>
<li>Added "Buyables", which can function like Space Buildings or Enhancers.</li>
<li>Custom CSS can now be used on any component! Make the third argument an object with the CSS parameters.</li>
<li>Lots of minor good things.</li>
</ul><br>
<div class="link" onclick="showTab('Old Stuff')">Alpha / Beta</div><br>
</div>
<div v-if="player.tab=='changelog_beta'" class="col right">
<button class="back" onclick="showTab('changelog')"></button><br>
<h3>v1.0 Something</h3>
<ul>
<li>The first numbered version.</li>
</ul><br>
</div>
<div v-if="player.tab=='info'" class="col right">
<button class="back" onclick="showTab('tree')"></button><br>
<h2>{{modInfo.name}}</h2>
<br>
<h3>{{VERSION.withName}}</h3>
<br>
The Modding Tree and code refactor by Acamaeda
<br>
The Prestige Tree made by Jacorb and Aarex
<br>
Original idea by papyrus (on discord)
<br><br>
<div class="link" onclick="showTab('changelog')">Changelog</div><br>
<a class="link" href="http://discord.gg/wwQfgPa" target="_blank">Main Prestige Tree server</a><br>
<br>
Note by Jacorb: If anyone wishes to make a mod of this game, that is perfectly fine with me, just make sure to name it something different (ex: Prestige Tree NG+) and to let me know on <a href="https://discord.gg/wwQfgPa" target="_blank">my discord</a>.
<br><br>
Time Played: {{ formatTime(player.timePlayed) }}<br><br>
<h3>Hotkeys</h3><br>
<span v-for="key in hotkeys" v-if="player[key.layer].unl"><br>{{key.desc}}</span>
</div>
<div v-if="player.tab=='options'" class="col right">
<button class="back" onclick="showTab('tree')"></button><br>
<table>
<tr>
<td><button class="opt" onclick="save()">Save</button></td>
<td><button class="opt" onclick="toggleOpt('autosave')">Autosave: {{ player.autosave?"ON":"OFF" }}</button></td>
<td><button class="opt" onclick="hardReset()">HARD RESET</button></td>
</tr>
<tr>
<td><button class="opt" onclick="exportSave()">Export to clipboard</button></td>
<td><button class="opt" onclick="importSave()">Import</button></td>
<td><button class="opt" onclick="toggleOpt('offlineProd')">Offline Prod: {{ player.offlineProd?"ON":"OFF" }}</button></td>
</tr>
<tr>
<td><button class="opt" onclick="switchTheme()">Theme: {{ getThemeName() }}</button></td>
<td><button class="opt" onclick="adjustMSDisp()">Show Milestones: {{ player.msDisplay.toUpperCase() }}</button></td>
<td><button class="opt" onclick="toggleOpt('hqTree')">High-Quality Tree: {{ player.hqTree?"ON":"OFF" }}</button></td>
</tr>
</table>
</div>
<div id="treeTab" v-if="player.tab!='gameEnded'" onscroll="resizeCanvas()" v-bind:class="{ fullWidth: player.tab == 'tree', col: player.tab != 'tree', left: player.tab != 'tree'}">
<div id="version" onclick="showTab('changelog')">{{VERSION.withoutName}}</div>
<img id="optionWheel" v-if="player.tab!='options'" src="options_wheel.png" onclick="showTab('options')"></img>
<div id="info" v-if="player.tab!='info'" onclick="showTab('info')"><br>i</div>
<img id="discord" onclick="window.open('https://discord.gg/wwQfgPa','mywindow')" src="discord.png" target="_blank"></img>
<span v-if="player.devSpeed && player.devSpeed != 1">
<br>Dev Speed: {{format(player.devSpeed)}}x<br>
</span>
<span v-if="player.offTime !== undefined">
<br>Offline Time: {{formatTime(player.offTime.remain)}}<br>
</span>
<span v-if="false && !player.keepGoing">
<br>Reach {{formatWhole(ENDGAME)}} to beat the game!<br>
</span>
<br>
<span v-if="player.points.lt('1e1000')">You have </span>
<h2 id="points">{{format(player.points)}}</h2>
<span v-if="player.points.lt('1e1e6')"> {{modInfo.pointsName}}</span>
<br><br><br><br><br>
<!-- *************************** Modify the tree in the table below! *************************** -->
<table>
<td><layer-node layer='c' abb='C'></layer-node></td>
</table><table>
<td><button class="treeNode hidden"></button></td>
</table><table>
<td v-if="player.tab=='tree'&&(player.c.unl||player.c.unl)" class="left"><br><br><img class="remove" src="remove.png" onclick="resetRow(1)"></img></td>
<td><layer-node layer='f' abb='F'></layer-node></td>
</table><table>
<td><button class="treeNode hidden"></button></td>
</table>
<canvas id="treeCanvas" class="canvas"></canvas>
</div>
<div v-for="layer in LAYERS">
<div v-if="player.tab==layer" v-bind:class="'col right'" v-bind:style="tmp.style[layer] ? tmp.style[layer] : {}">
<button class="back" onclick="showTab('tree')"></button><br><br><br>
<div v-if="!layers[layer].tabFormat">
<main-display :layer="layer"></main-display>
<prestige-button :layer="layer"></prestige-button>
<span v-if="layers[layer].type=='normal' && tmp.resetGain[layer].lt(100) && player[layer].points.lt(1e3)"><br>You have {{formatWhole(tmp.layerAmt[layer])}} {{layers[layer].baseResource}}</span>
<br><br>
<span v-if="player[layer].best != undefined">Your best {{layers[layer].resource}} is {{formatWhole(player[layer].best)}}<br></span>
<span v-if="player[layer].total != undefined">You have made a total of {{formatWhole(player[layer].total)}} {{layers[layer].resource}}<br></span>
<milestones :layer="layer"></milestones>
<buyables :layer="layer"></buyables>
<upgrades :layer="layer"></upgrades>
<challs :layer="layer"></challs>
<br><br>
</div>
<div v-if="layers[layer].tabFormat">
<div v-for="data in layers[layer].tabFormat">
<div v-if="!Array.isArray(data)" v-bind:is="data" :layer= "layer"></div>
<div v-else-if="data.length==3" v-bind:style="(data[2] ? data[2] : {})" v-bind:is="data[0]" :layer= "layer" :data= "data[1]"></div>
<div v-else-if="data.length==2" v-bind:is="data[0]" :layer= "layer" :data= "data[1]"></div>
</divs>
</div>
</div>
</div>
</body>