719 lines
42 KiB
HTML
719 lines
42 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
|
|
<link rel="stylesheet" type="text/css" href="css/styles.css">
|
|
<link rel="stylesheet" type="text/css" href="css/dark.css">
|
|
<link rel="stylesheet" type="text/css" href="css/colorblind.css">
|
|
<link rel="stylesheet" type="text/css" href="css/currencies.css">
|
|
<title>Progress Knight Quest</title>
|
|
<link rel="shortcut icon" href="img/logo.ico" />
|
|
</head>
|
|
<body id="body" class="dark" style="font-size: x-small">
|
|
<div class="w3-margin">
|
|
<div class="header">
|
|
<img src="img/logos.png" alt="logos" />
|
|
<h3>Progress Knight Quest</h3>
|
|
</div>
|
|
<div id="row" class="row">
|
|
<div id="info" class="panel w3-padding quick-bar" style="width:20em">
|
|
<div id="challengeTitle" class="challenge-title">
|
|
In challenge: <span id="challengeName"></span>
|
|
</div>
|
|
<div class="text-caption" id="errorInfo" hidden="true">
|
|
<div>⚠️ Oh no! It looks like something on the site broke.. If this issue persists, feel free to contact the developers.</div>
|
|
<br>
|
|
</div>
|
|
<div id="deathText" class="hidden">
|
|
<div class="text-caption" style="color: red">Age has caught up to you</div>
|
|
<div class="sidebar-element" style="color: gray">Your age has met your lifespan; use the amulet to rebirth before you pass away</div>
|
|
</div>
|
|
<div class="text-caption"><span id="ageDisplay">Age 14 Day 0</span></div>
|
|
<div class="sidebar-element" style="color: gray">
|
|
Lifespan: <span id="lifespanDisplay">70</span> years
|
|
<br>Real Time: <span id="realtimeDisplay">00:00:00</span>
|
|
</div>
|
|
<button id="pauseButton" class="w3-button button sidebar-element" onClick="togglePause()">Pause</button>
|
|
<div class="text-caption" id="coinDisplay">
|
|
<span></span>
|
|
<span></span>
|
|
<span></span>
|
|
<span></span>
|
|
<span></span>
|
|
</div>
|
|
<div style="color: gray">Balance</div>
|
|
<ul class="sidebar-element" style="padding-left: 1em;">
|
|
<li>
|
|
<span style="color: rgb(9, 160, 230)">Net: </span><b id="signDisplay"></b>
|
|
<div id="netDisplay" style="display: inline;">
|
|
<span></span>
|
|
<span></span>
|
|
<span></span>
|
|
<span></span>
|
|
<span></span>
|
|
</div>
|
|
</li>
|
|
<li>
|
|
<span style="color: green">Income: </span>
|
|
<div id="incomeDisplay" style="display: inline;">
|
|
<span></span>
|
|
<span></span>
|
|
<span></span>
|
|
<span></span>
|
|
<span></span>
|
|
</div>
|
|
</li>
|
|
<li>
|
|
<span style="color: red">Expense: </span>
|
|
<div id="expenseDisplay" style="display: inline;">
|
|
<span></span>
|
|
<span></span>
|
|
<span></span>
|
|
<span></span>
|
|
<span></span>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
<div id="quickTaskDisplay" class="hidden">
|
|
<div class="small-margin inline job progress-bar progressBar">
|
|
<div class="progress-fill progressFill current"></div>
|
|
<div class="progress-text name">Task</div>
|
|
</div>
|
|
</div>
|
|
<div class="text-caption" style="padding-top: 0.2em"><span style="color: rgb(15, 105, 207)">Happiness: </span><span id="happinessDisplay"></span></div>
|
|
<div style="color: gray" class="sidebar-element">Affects all XP gain</div>
|
|
<div id="evilInfo" class="hidden">
|
|
<div class="text-caption"><span style="color: rgb(200, 0, 0)">Evil: </span><span id="evilDisplay"></span></div>
|
|
<div style="color: gray" class="sidebar-element">Affects Dark Magic XP gain</div>
|
|
</div>
|
|
<div id="essenceInfo" class="hidden">
|
|
<div class="text-caption"><span style="color: rgb(24, 210, 217)">Essence: </span><span id="essenceDisplay"></span></div>
|
|
<div style="color: gray" class="sidebar-element">Affects Almightiness XP gain</div>
|
|
</div>
|
|
<div id="darkMatterInfo" class="hidden">
|
|
<div class="text-caption"><span style="color: rgb(114, 83, 182)">Dark Matter: </span><span id="darkMatterDisplay"></span></div>
|
|
<div style="color: gray" class="sidebar-element">Affects all XP gain</div>
|
|
</div>
|
|
<div id="darkOrbsInfo" class="hidden">
|
|
<div class="text-caption"><span style="color: rgb(143, 114, 207)">Dark Orbs: </span><span id="darkOrbsDisplay"></span></div>
|
|
<div style="color: gray" class="sidebar-element">Used to buy items in the Dark Matter shop</div>
|
|
</div>
|
|
<div id="timeWarping">
|
|
<div class="text-caption"><span style="color: rgb(204, 34, 219)">Time Warping: </span><span id="timeWarpingDisplay"></span></div>
|
|
<div style="color: gray" class="sidebar-element">Affects game speed</div>
|
|
</div>
|
|
<div id="rebirthButton1" class="hidden">
|
|
<div class="text-caption"><span style="color: rgb(102, 229, 71)">Rebirth</span></div>
|
|
<button class="w3-button button" style="margin-bottom: 0.1em; margin-top: 0.8em; width: 100%" onClick="rebirthOne()">Touch the eye</button>
|
|
</div>
|
|
<div id="rebirthButton2" class="hidden">
|
|
<button class="w3-button button" style="margin-bottom: 0.1em; margin-top: 0.8em; width: 100% " onClick="rebirthTwo()">Embrace evil: <span style="color: rgb(240, 0, 0)" id="evilGainButtonDisplay"></span></button>
|
|
</div>
|
|
<div id="rebirthButton3" class="hidden">
|
|
<button class="w3-button button" style="margin-bottom: 0.1em; margin-top: 0.8em; width: 100% " onClick="rebirthThree()">Transcend: <span style="color: rgb(24, 210, 217)" id="essenceGainButtonDisplay"></span></button>
|
|
</div>
|
|
<div id="rebirthButton4" class="hidden">
|
|
<button class="w3-button button" style="margin-bottom: 0.1em; margin-top: 0.8em; width: 100% " onClick="rebirthFour()">Collapse the universe: <span style="color: rgb(102, 229, 71)" id="darkMatterGainButtonDisplay"></span></button>
|
|
</div>
|
|
</div>
|
|
<div id="column" class="column">
|
|
<div id="tabcolumn" class="panel w3-margin-left tabs-tab-column">
|
|
<div class="w3-button w3-bar-item tabButton baritem" id="jobsTabButton" onClick="setTab('jobs')">Hero</div>
|
|
<div class="w3-button w3-bar-item tabButton baritem hidden" id="skillsTabButton" onClick="setTab('skills')">Skills</div>
|
|
<div class="w3-button w3-bar-item tabButton baritem hidden" id="shopTabButton" onClick="setTab('shop')">Shop</div>
|
|
<div class="w3-button w3-bar-item tabButton baritem" id="challengesTabButton" onClick="setTab('challenges')">Challenges</div>
|
|
<div class="w3-button w3-bar-item tabButton baritem" id="milestonesTabButton" onClick="setTab('milestones')">Milestones</div>
|
|
<div class="w3-button w3-bar-item tabButton baritem" id="rebirthTabButton" onClick="setTab('rebirth')">Amulet</div>
|
|
<div class="w3-button w3-bar-item tabButton baritem" id="darkMatterTabButton" onClick="setTab('darkMatter')">Dark Matter</div>
|
|
<div class="w3-button w3-bar-item tabButton baritem" id="settingsTabButton" onClick="setTab('settings')">Settings</div>
|
|
</div>
|
|
<div id="maincolumn" class="panel w3-margin-left w3-margin-top w3-padding tabs-main-column">
|
|
<template class="headerRowTaskTemplate">
|
|
<tr>
|
|
<th class="category" style="width: 20em">Job</th>
|
|
<th>Level</th>
|
|
<th class="valueType" style="width: 18em">Value type</th>
|
|
<th>Xp/day</th>
|
|
<th>Xp left</th>
|
|
<th class="maxLevel">Max</th>
|
|
</tr>
|
|
</template>
|
|
<template class="rowTaskTemplate">
|
|
<tr>
|
|
<td>
|
|
<div class="progress-bar progressBar tooltip">
|
|
<div class="progress-fill progressFill"></div>
|
|
<div class="progress-text name">Task</div>
|
|
<span class="tooltipText"></span>
|
|
</div>
|
|
</td>
|
|
<td class="level">Level</td>
|
|
<td class="value">
|
|
<div class="effect"></div>
|
|
<div class="income">
|
|
<span></span>
|
|
<span></span>
|
|
<span></span>
|
|
<span></span>
|
|
</div>
|
|
</td>
|
|
<td class="xpGain">Xp/day</td>
|
|
<td class="xpLeft">Xp left</td>
|
|
<td class="maxLevel">Max</td>
|
|
</tr>
|
|
</template>
|
|
<template class="headerRowItemTemplate">
|
|
<tr class="item-header-row" onclick="forceAutobuy()">
|
|
<th class="category" style="width: 20em">
|
|
<button class="button-no-button tooltip" style="background-color:transparent;" onclick="forceAutobuy()">
|
|
<span class="name">Item</span>
|
|
<span class="tooltipText">Click to activate auto-buy</span>
|
|
</button>
|
|
</th>
|
|
<th>Active</th>
|
|
<th style="width: 20em">Effect</th>
|
|
<th>Expense/day</th>
|
|
</tr>
|
|
</template>
|
|
<template class="rowItemTemplate">
|
|
<tr>
|
|
<td>
|
|
<button class="button item-button tooltip">
|
|
<span class="name"></span>
|
|
<span class="tooltipText">tooltip</span>
|
|
</button>
|
|
</td>
|
|
<td>
|
|
<div class="outer-circle center-g-inside">
|
|
<div class="active inner-circle"></div>
|
|
</div>
|
|
</td>
|
|
<td class="effect"></td>
|
|
<td class="expense">
|
|
<span></span>
|
|
<span></span>
|
|
<span></span>
|
|
<span></span>
|
|
</td>
|
|
</tr>
|
|
</template>
|
|
<template class="headerRowMilestoneTemplate">
|
|
<tr>
|
|
<th style="width: 6em">Goal</th>
|
|
<th style="width: 15em" class="category">Milestone Tier</th>
|
|
<th>Effect</th>
|
|
</tr>
|
|
</template>
|
|
<template class="rowMilestoneTemplate">
|
|
<tr>
|
|
<td style="color: rgb(24, 210, 217)" class="essence"></td>
|
|
<td>
|
|
<div class="progress-bar progressBar tooltip" style="width: 100%">
|
|
<div class="progress-fill progressFill" style="background-color: green"></div>
|
|
<span class="tooltipText"></span>
|
|
<div class="progress-text name">Milestone</div>
|
|
</div>
|
|
</td>
|
|
<td class="description"></td>
|
|
</tr>
|
|
</template>
|
|
<template class="requiredRowTemplate">
|
|
<td class="w3-text-gray" style="padding-left: 0.8em;" colspan=5>
|
|
Required:
|
|
<div class="value" colspan=5 style="display:inline">
|
|
<span class="levels"></span>
|
|
<div class="coins" style="display:inline">
|
|
<span></span>
|
|
<span></span>
|
|
<span></span>
|
|
<span></span>
|
|
</div>
|
|
<span style="color: rgb(200, 0, 0)" class="evil"></span>
|
|
<span style="color: rgb(24, 210, 217)" class="essence"></span>
|
|
<span style="color: rgb(114, 83, 182)" class="darkMatter"></span>
|
|
</div>
|
|
</td>
|
|
</template>
|
|
<div class="tab" id="jobs">
|
|
<div id="jobPage" style="flex: 1; margin-left: 0.5em;">
|
|
<table id="jobTable" class="w3-table w3-bordered">
|
|
</table>
|
|
</div>
|
|
<div id="skillPage" style="flex: 1; margin-left: 0.5em;">
|
|
<table id="skillTable" class="w3-table w3-bordered">
|
|
</table>
|
|
</div>
|
|
<div id="itemPage" style="flex: 1; margin-left: 0.5em;">
|
|
<table id="itemTable" class="w3-table w3-bordered">
|
|
</table>
|
|
</div>
|
|
</div>
|
|
<div class="tab hidden" id="skills">
|
|
</div>
|
|
<div class="tab hidden" id="shop">
|
|
</div>
|
|
<div class="tab" id="challenges">
|
|
<div class="panel w3-margin-left w3-margin-top w3-padding">
|
|
<div>
|
|
<div style="color:rgb(240, 0, 0)">Starting a challenge will <b>reset</b> your coins, levels and max levels.</div>
|
|
<div>The more you advance in the challenge, the higher the reward.</div>
|
|
<div>Challenge rewards are always active, even in challenges.</div>
|
|
</div>
|
|
<div id="exitChallengeDiv">
|
|
<p>Current challenge: <b><span id="activeChallengeName"></span></b></p>
|
|
<button class="w3-button button" onclick="exitChallenge()">Exit challenge</button>
|
|
<div id="currentChallengeReward1" class="an_unhappy_life hidden" style="display: inline; padding-left:1em">Current reward: Multiplies happiness by x<span id="currentChallengeHappinessBuff"></span></div>
|
|
<div id="currentChallengeReward2" class="rich_and_the_poor hidden" style="display: inline; padding-left:1em">Current reward: Multiplies income by x<span id="currentChallengeIncomeBuff"></span></div>
|
|
<div id="currentChallengeReward3" class="time_does_not_fly hidden" style="display: inline; padding-left:1em">Current reward: Multiplies time warping by x<span id="currentChallengeTimewarpingBuff"></span></div>
|
|
<div id="currentChallengeReward4" class="dance_with_the_devil hidden" style="display: inline; padding-left:1em">Current reward: Multiplies essence gain by x<span id="currentChallengeEssenceGainBuff"></span></div>
|
|
<div id="currentChallengeReward5" class="legends_never_die hidden" style="display: inline; padding-left:1em">Current reward: Multiplies evil gain by x<span id="currentChallengeEvilGainBuff"></span></div>
|
|
</div>
|
|
<div id="anUnhappyLifeChallenge" style="padding-top:2em">
|
|
<div class="text-caption challenge-title">1. An unhappy life</div>
|
|
<div style="color:gray; padding-bottom:0.3em">Reduces happiness by ^0.5</div>
|
|
<div style="color: gold; padding-bottom: 0.3em">Goal: Reach <span id="challengeGoal1">992.2M</span> Happiness</div>
|
|
<div id="challengeReward1" class="reward">Reward: Multiplies happiness by x<span id="challengeHappinessBuff">1</span></div>
|
|
<button id="challengeButton1" class="w3-button button" onclick="enterChallenge('an_unhappy_life')">Enter challenge</button>
|
|
</div>
|
|
<div id="theRichAndThePoorChallenge" style="padding-top:2em">
|
|
<div class="text-caption challenge-title">2. The rich and the poor</div>
|
|
<div style="color:gray; padding-bottom:0.3em">Reduces income by ^0.35</div>
|
|
<div style="color: gold; padding-bottom: 0.3em">Goal: Reach <div id="challengeGoal2" class="coins" style="display:inline">
|
|
<span></span>
|
|
<span></span>
|
|
<span></span>
|
|
<span></span>
|
|
</div> Gross Income</div>
|
|
<div id="challengeReward2" class="reward">Reward: Multiplies income by x<span id="challengeIncomeBuff">1</span></div>
|
|
<button id="challengeButton2" class="w3-button button" onclick="enterChallenge('rich_and_the_poor')">Enter challenge</button>
|
|
</div>
|
|
<div id="timeDoesNotFlyChallenge" style="padding-top:2em">
|
|
<div class="text-caption challenge-title">3. Time does not fly</div>
|
|
<div style="color: gray; padding-bottom: 0.3em">Reduces time warping by ^0.7</div>
|
|
<div style="color: gold; padding-bottom: 0.3em">Goal: Reach x<span id="challengeGoal3">1.0M</span> Time Warping</div>
|
|
<div id="challengeReward3" class="reward">Reward: Multiplies time warping by x<span id="challengeTimewarpingBuff">1</span></div>
|
|
<button id="challengeButton3" class="w3-button button" onclick="enterChallenge('time_does_not_fly')">Enter challenge</button>
|
|
</div>
|
|
<div id="danceWithTheDevilChallenge" style="padding-top:2em">
|
|
<div class="text-caption challenge-title">4. Dance with the devil</div>
|
|
<div style="color: gray; padding-bottom: 0.3em">Reduces Dark Magic and Almightiness XP effect enormously, max level reduces XP gain and happiness is reduced by ^0.075</div>
|
|
<div style="color: gold; padding-bottom: 0.3em">Goal: Reach <span id="challengeGoal4">5.8k</span> Evil Gain</div>
|
|
<div id="challengeReward4" class="reward">Reward: Multiplies essence gain by x<span id="challengeEssenceGainBuff">1</span></div>
|
|
<button id="challengeButton4" class="w3-button button" onclick="enterChallenge('dance_with_the_devil')">Enter challenge</button>
|
|
</div>
|
|
<div id="legendsNeverDieChallenge" style="padding-top:2em">
|
|
<div class="text-caption challenge-title">5. Legends never die</div>
|
|
<div style="color: gray; padding-bottom: 0.3em">Reduces your lifespan by ^0.72, happiness does nothing and Dark Magic XP effect is always 1x</div>
|
|
<div style="color: gold; padding-bottom: 0.3em">Goal: Reach Chairman lvl <span id="challengeGoal5">1227</span></div>
|
|
<div id="challengeReward5" class="reward">Reward: Multiplies evil gain by x<span id="challengeEvilGainBuff">1</span></div>
|
|
<button id="challengeButton5" class="w3-button button" onclick="enterChallenge('legends_never_die')">Enter challenge</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="tab" id="milestones">
|
|
<div id="milestonePage" style="flex: 1; margin-left: 0.5em;">
|
|
<table id="milestoneTable" class="w3-table w3-bordered">
|
|
</table>
|
|
</div>
|
|
<div id="dummyPage1" style="flex: 2; margin-left: 0.5em;">
|
|
</div>
|
|
</div>
|
|
<div class="tab" id="rebirth">
|
|
<div id="rebirthPage" style="flex: 1; margin-left: 0.5em;" >
|
|
<ul>
|
|
<li style="margin: 0.4em;">
|
|
You stumble across a strange looking amulet on your 25th birthday. It does not look like
|
|
it has any worth on the market given that it's made from cheap-looking copper. However, you
|
|
feel a weird urge to keep the amulet, so you slip it into your pocket for safekeeping.
|
|
</li>
|
|
<li style="margin: 0.4em;" id="rebirthNote1" class="hidden">
|
|
On your 45th birthday, you feel the amulet shiver uncontrollably in your pocket. You take it
|
|
out and the constant shivering suddenly stops. More to your bizarre surprise, you notice
|
|
a strange etching on the centre of the amulet.
|
|
</li>
|
|
<li style="margin: 0.4em;" id="rebirthNote2" class="hidden">
|
|
<div style="margin-bottom: 0.4em">
|
|
On your 65th birthday, you once again encounter the strange, unexplained shivering from your
|
|
amulet. But this time, a living eyeball emerges from the centre. Although terribly frightened,
|
|
you realise you do not have many years to live left anyway so you consider touching the eye
|
|
to see what happens.
|
|
</div>
|
|
<i style="color: grey">
|
|
By touching the eyeball, you will be reborn and have to restart life again, losing all your levels and coins.
|
|
However, you will gain <b>xp multipliers</b> for your classes and abilities equivalent to: <b>1 + the max level of the class or ability / 10.</b>
|
|
This means you will learn everything again much more quickly than you did in your previous life. <span style="color: rgb(200, 0, 0)">
|
|
Something tells you that the amulet might evolve after living for <b>2 whole centuries</b>...
|
|
</span>
|
|
</i>
|
|
<br>
|
|
<button class="w3-button button" style="margin-bottom: 0.4em; margin-top: 0.4em " onClick="rebirthOne()">Touch the eye</button>
|
|
<br>
|
|
</li>
|
|
<li style="margin: 0.4em;" id="rebirthNote3" class="hidden">
|
|
<div style="margin-bottom: 0.4em;">
|
|
Your gut instinct was right. The moment you hit the grand age of 200, you hear an ominous hum coming from the amulet.
|
|
A mouth emerges from its surface and begins to cackle, and proceeds to say: "So you've made it this far... Are you ready to embrace evil?"
|
|
<br><span style="color: rgb(200, 0, 0)">
|
|
The amulet might transform even further after living for a <b>millennium</b>.
|
|
</span>
|
|
</div>
|
|
<i style="color: rgb(200, 0, 0)">
|
|
If you decide to embrace evil, all of your levels, coins and even max levels will be reset.
|
|
You will be reborn as a fresh slate. However, you will unlock a new line of skills and gain
|
|
<b><span id="evilGainDisplay"></span> evil</b>, which will heavily impact your future lives.
|
|
</i>
|
|
<br>
|
|
<button class="w3-button button" style="margin-bottom: 0.4em; margin-top: 0.4em " onClick="rebirthTwo()">Embrace evil</button>
|
|
<br>
|
|
</li>
|
|
<li style="margin: 0.4em;" id="rebirthNote4" class="hidden">
|
|
<div style="margin-bottom: 0.4em;">
|
|
A thousand years have come and gone and yet, you still remain alive... somehow. You feel your amulet shivering again and to your surprise, you see small tendrils
|
|
full of eyeballs emergin from it. As you are about to drop the amulet, you hear frightening screech followed by whispers in your head... <b>"You have to embrace the Void..."</b>
|
|
<br>
|
|
<span style="color: rgb(200, 0, 0)">
|
|
The amulet will reach its final form after <b>ten millennia</b>!
|
|
</span>
|
|
</div>
|
|
<i style="color: rgb(204, 0, 255)">
|
|
You have unlocked <b>"The Void"</b> class category along with <b>"Void Manipulation"</b> abilities.
|
|
</i>
|
|
</li>
|
|
<li style="margin: 0.4em;" id="rebirthNote5" class="hidden">
|
|
<div style="margin-bottom: 0.4em;">
|
|
Ten millenia have passed... most of them spent serving the Void, yet there is still a glimpse of humanity inside of you. All of the sudden your amulet starts to glow in the distance,
|
|
illuminating darkness around you with the brightness of a thousand suns. With the very last remnant of your free will, you run to your amulet and touch it... <b>
|
|
"You are now part of something bigger than yourself..."
|
|
</b>
|
|
</div>
|
|
<i style="color: rgb(255, 204, 102)">
|
|
You have unlocked <b>"Galactic Council"</b> class category along with <b>"Celestial Powers"</b> abilities.
|
|
<i style="color: grey">
|
|
<br>
|
|
If you decide to <b>transcend</b>, you will be reborn once again, losing all your coins, <b>evil</b> and current levels.
|
|
However, your max levels won't be erased, but instead multiplied with the effect from the <b>Cosmic Recollection</b> ability and you will gain
|
|
<i style="color: rgb(24, 210, 217)">
|
|
<b><span id="essenceGainDisplay"></span> essence</b>,
|
|
</i>
|
|
along with new abilities that will boost you even further in your journey.
|
|
<br>
|
|
<i style="color: rgb(200, 0, 0)">
|
|
Transcend will only appear if you have the <b>Cosmic Recollection</b> ability unlocked!
|
|
</i>
|
|
</i>
|
|
<br>
|
|
</i>
|
|
<div style="margin-bottom: 0.4em;" id="rebirthNote6" class="hidden">
|
|
<button class="w3-button button" style="margin-bottom: 0.4em; margin-top: 0.4em" onClick="rebirthThree()">Transcend</button>
|
|
</div>
|
|
</li>
|
|
<li style="margin: 0.4em;" id="rebirthNote7" class="hidden">
|
|
<i style="color: rgb(114, 83, 182)">
|
|
You are starting to become way too powerful. The end of the universe may be near...
|
|
</i>
|
|
<i style="color: grey">
|
|
<br>
|
|
If you decide to <b>collapse the universe</b>, all of your levels, coins, max levels, evil, and <b>essence</b> will be reset. You will be reborn as a fresh slate in a new universe, with no memory of milestones and challenges from any of your past selves. In exchange, you will unlock a third new line of abilities and gain <i style="color: rgb(114, 83, 182)">
|
|
<b><span id="darkMatterGainDisplay"></span> Dark Matter</b>,
|
|
</i>
|
|
which will boost you much further in your journey across the multiverse.
|
|
</i>
|
|
<br>
|
|
<button class="w3-button button" style="margin-bottom: 0.4em; margin-top: 0.4em " onClick="rebirthFour()">Collapse the universe</button>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div id="dummyPage2" style="flex: 2; margin-left: 0.5em;">
|
|
</div>
|
|
</div>
|
|
<div class="tab" id="darkMatter">
|
|
<div class="column">
|
|
<div class="panel w3-margin-left">
|
|
<div class="w3-button w3-bar-item tabButtonDarkMatter baritem w3-blue-gray" id="shopTabTabButton" onClick="setTabDarkMatter('shopTab')">Shop</div>
|
|
<div class="w3-button w3-bar-item tabButtonDarkMatter baritem" id="skillTreeTabTabButton" onClick="setTabDarkMatter('skillTreeTab')">Skills</div>
|
|
</div>
|
|
<div id="maincolumnSettings" class="panel w3-margin-left w3-margin-top w3-padding settings-main-column">
|
|
<div id="shopTab" class="tabDarkMatter">
|
|
<div id="settingsPage" style="flex: 1; margin-left: 0.5em;">
|
|
<div class="panel w3-margin-left w3-margin-top w3-padding">
|
|
<div style="padding-top:2em">
|
|
<div class="text-caption dark-matter-title">Dark Orb Generator</div>
|
|
<div style="color:gray; padding-bottom:0.3em">Generates <b id="darkOrbGenerator"></b> <span style="color: rgb(143, 114, 207)">Dark Orb</span> per day</div>
|
|
<div style="color:gray; padding-bottom: 0.5em;">Cost: <b id="darkOrbGeneratorCost"></b> <span style="color: rgb(114, 83, 182)">Dark Matter</span></div>
|
|
<button class="w3-button button" id="darkOrbGeneratorBuyButton" onclick="buyDarkOrbGenerator()">Upgrade</button>
|
|
</div>
|
|
<div style="padding-top:2em">
|
|
<div class="text-caption dark-matter-title">A miracle</div>
|
|
<div style="color:gray; padding-bottom:0.3em">Keep <b>Magic Eye</b> when performing a Dark Matter reset</div>
|
|
<div style="color:gray; padding-bottom: 0.5em;">Cost: <b>10</b> <span style="color: rgb(114, 83, 182)">Dark Matter</span></div>
|
|
<button class="w3-button button" id="aMiracleBuyButton" onclick="buyAMiracle()">Buy</button>
|
|
</div>
|
|
<div style="padding-top:2em">
|
|
<div class="text-caption dark-matter-title">A deal with the Chairman</div>
|
|
<div style="color:gray; padding-bottom: 0.5em;">Reward: Multiply <span style="color: rgb(199, 21, 133);">T.A.A & Magic</span> XP gain by x<span id="aDealWithTheChairmanEffect"></span></div>
|
|
<div style="color:gray; padding-bottom: 0.5em;">Cost: <b id="aDealWithTheChairmanCost"></b> <span style="color: rgb(143, 114, 207)">Dark Orbs</span></div>
|
|
<button class="w3-button button" onclick="buyADealWithTheChairman()">Upgrade</button>
|
|
</div>
|
|
<div style="padding-top:2em">
|
|
<div class="text-caption dark-matter-title">A gift from god</div>
|
|
<div style="color:gray; padding-bottom: 0.5em;">Reward: Multiply <span style="color: rgb(24, 210, 217)">Essence</span> gain by x<span id="aGiftFromGodEffect"></span></div>
|
|
<div style="color:gray; padding-bottom: 0.5em;">Cost: <b id="aGiftFromGodCost"></b> <span style="color: rgb(143, 114, 207)">Dark Orbs</span></div>
|
|
<button class="w3-button button" onclick="buyAGiftFromGod()">Upgrade</button>
|
|
</div>
|
|
<div style="padding-top:2em">
|
|
<div class="text-caption dark-matter-title">Life coach</div>
|
|
<div style="color:gray; padding-bottom: 0.5em;">Reward: Multiply <span style="color: lightgreen;">Income</span> by x<span id="lifeCoachEffect"></span></div>
|
|
<div style="color:gray; padding-bottom: 0.5em;">Cost: <b id="lifeCoachCost"></b> <span style="color: rgb(143, 114, 207)">Dark Orbs</span></div>
|
|
<button class="w3-button button" onclick="buyLifeCoach()">Upgrade</button>
|
|
</div>
|
|
<div style="padding-top:2em">
|
|
<div class="text-caption dark-matter-title">Gotta be fast</div>
|
|
<div style="color:gray; padding-bottom: 0.5em;">Reward: Multiply <span style="color: rgb(204, 34, 219)">Time Warping</span> by x<span id="gottaBeFastEffect"></span></div>
|
|
<div style="color:gray; padding-bottom: 0.5em;">Cost: <b id="gottaBeFastCost"></b> <span style="color: rgb(143, 114, 207)">Dark Orbs</span></div>
|
|
<button class="w3-button button" onclick="buyGottaBeFast()">Upgrade</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="skillTreeTab" class="tabDarkMatter">
|
|
<div class="panel w3-margin-left w3-margin-top w3-padding">
|
|
<div style="padding-top:2em">
|
|
<div style="color:gray; padding-bottom:0.3em">
|
|
You can only choose 1 upgrade in each category; pick wisely. You can reset the skills, but you will <b>NOT</b> get your <span style="color: rgb(114, 83, 182)">Dark Matter</span> back!
|
|
</div>
|
|
<button class="w3-button button" onclick="resetSkillTree()">Reset Skills</button>
|
|
</div>
|
|
<div style="padding-top:2em">
|
|
<div class="text-caption dark-matter-title">Speed is life</div>
|
|
<div style="color:gray; padding-bottom:0.3em">
|
|
<button id="speedIsLife1" class="w3-button button" onclick="buySpeedOfLife(1)">Buy</button> -
|
|
Multiply <span style="color: rgb(204, 34, 219)">Time Warping</span> by <b>3x</b>,
|
|
but divide <span style="color: rgb(200, 0, 0)">Evil</span> gain by <b>2x</b>
|
|
</div>
|
|
<div style="color: rgb(255, 255, 255); padding: 0.6em">OR</div>
|
|
<div style="color:gray; padding-bottom:0.3em">
|
|
<button id="speedIsLife2" class="w3-button button" onclick="buySpeedOfLife(2)">Buy</button> -
|
|
Multiply <span style="color: rgb(204, 34, 219)">Time Warping</span> by <b>7x</b>,
|
|
but divide <span style="color: rgb(24, 210, 217)">Essence</span> gain by <b>2x</b>
|
|
</div>
|
|
<div style="color:gray; padding-bottom: 0.5em;">Cost: <b>100</b> <span style="color: rgb(114, 83, 182)">Dark Matter</span></div>
|
|
</div>
|
|
<div style="padding-top:2em">
|
|
<div class="text-caption dark-matter-title">Your greatest debt</div>
|
|
<div style="color:gray; padding-bottom:0.3em">
|
|
<button id="yourGreatestDebt1" class="w3-button button" onclick="buyYourGreatestDebt(1)">Buy</button> -
|
|
Multiply <span style="color:rgb(255, 204, 102)">all XP</span> gain by <b>500x</b>,
|
|
but divide <span style="color: lightgreen;">Income</span> by <b>10x</b>
|
|
</div>
|
|
<div style="color: rgb(255, 255, 255); padding: 0.6em">OR</div>
|
|
<div style="color:gray; padding-bottom:0.3em">
|
|
<button id="yourGreatestDebt2" class="w3-button button" onclick="buyYourGreatestDebt(2)">Buy</button> -
|
|
Multiply <span style="color: rgb(200, 0, 0)">Evil gain</span> by <b>100x</b>,
|
|
but divide <span style="color: lightgreen;">Income</span> by <b>2x</b>
|
|
</div>
|
|
<div style="color:gray; padding-bottom: 0.5em;">Cost: <b>1k</b> <span style="color: rgb(114, 83, 182)">Dark Matter</span></div>
|
|
</div>
|
|
<div style="padding-top:2em">
|
|
<div class="text-caption dark-matter-title">Essence collector</div>
|
|
<div style="color:gray; padding-bottom:0.3em">
|
|
<button id="essenceCollector1" class="w3-button button" onclick="buyEssenceCollector(1)">Buy</button> -
|
|
Multiply <span style="color: rgb(24, 210, 217)">Essence</span> gain by <b>500x</b>,
|
|
but divide <span style="color: rgb(200, 0, 0)">Evil</span> gain by <b>2x</b>
|
|
</div>
|
|
<div style="color: rgb(255, 255, 255); padding: 0.6em">OR</div>
|
|
<div style="color:gray; padding-bottom:0.3em">
|
|
<button id="essenceCollector2" class="w3-button button" onclick="buyEssenceCollector(2)">Buy</button> -
|
|
Multiply <span style="color: rgb(24, 210, 217)">Essence</span> gain by <b>1000x</b>,
|
|
but divide <span style="color: lightgreen;">Income</span> by <b>25x</b>
|
|
</div>
|
|
<div style="color:gray; padding-bottom: 0.5em;">Cost: <b>10k</b> <span style="color: rgb(114, 83, 182)">Dark Matter</span></div>
|
|
</div>
|
|
<div style="padding-top:2em">
|
|
<div class="text-caption dark-matter-title">Explosion of the universe</div>
|
|
<div style="color:gray; padding-bottom:0.3em">
|
|
<button id="explosionOfTheUniverse1" class="w3-button button" onclick="buyExplosionOfTheUniverse(1)">Buy</button> -
|
|
Multiply <span style="color:rgb(255, 204, 102)">all XP</span> gain by <b>1e100x</b>,
|
|
but divide <span style="color: rgb(24, 210, 217)">Essence</span> gain by <b>2x</b>
|
|
</div>
|
|
<div style="color: rgb(255, 255, 255); padding: 0.6em">OR</div>
|
|
<div style="color:gray; padding-bottom:0.3em">
|
|
<button id="explosionOfTheUniverse2" class="w3-button button" onclick="buyExplosionOfTheUniverse(2)">Buy</button> -
|
|
Multiply <span style="color:rgb(255, 204, 102)">all XP</span> gain by <b>1e150x</b>,
|
|
but divide <span style="color: lightgreen;">Income</span> by <b>1e6x</b>
|
|
</div>
|
|
<div style="color:gray; padding-bottom: 0.5em;">Cost: <b>100k</b> <span style="color: rgb(114, 83, 182)">Dark Matter</span></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="tab" id="settings">
|
|
<div id="columnSettings" class="column">
|
|
<div id="tabcolumnSettings" class="panel w3-margin-left settings-tab-column">
|
|
<div class="w3-button w3-bar-item tabButtonSettings baritem w3-blue-gray" id="settingsTabTabButton" onClick="setTabSettings('settingsTab')">Settings</div>
|
|
<div class="w3-button w3-bar-item tabButtonSettings baritem" id="statsTabTabButton" onClick="setTabSettings('statsTab')">Stats</div>
|
|
<div class="w3-button w3-bar-item tabButtonSettings baritem" id="changelogTabTabButton" onClick="setTabSettings('changelogTab')">Changelog</div>
|
|
</div>
|
|
<div id="maincolumnSettings" class="panel w3-margin-left w3-margin-top w3-padding settings-main-column">
|
|
<div id="settingsTab" class="tabSettings">
|
|
<div id="settingsPage" style="flex: 1; margin-left: 0.5em;">
|
|
<ul>
|
|
<li>
|
|
<div class="text-caption">
|
|
<button class="w3-button button" onClick="importGameData()">Import save</button>
|
|
<button class="w3-button button" onClick="exportGameData()" onmouseout="outExportButton()">Export save</button><span class="tooltiptext" id="exportTooltip"></span>
|
|
<form style="margin-top: 0.8em">
|
|
<input id="importExportBox" type="text" style="width:20em">
|
|
</form>
|
|
</div>
|
|
</li>
|
|
<li>
|
|
<div class="text-caption" style="margin-top: 0.4em;">Settings</div>
|
|
<table class="w3-table w3-bordered">
|
|
<tr>
|
|
<td style="padding: 0.4em; width:15em">Sticky sidebar</td>
|
|
<td><input id="settingsStickySidebar" type="checkbox" style="width:1.6em;height:1.6em" onclick="setStickySidebar(this.checked)" /></td>
|
|
</tr>
|
|
<tr>
|
|
<td>Currency notation</td>
|
|
<td style="padding: 0.4em">
|
|
<button class="w3-button button CurrencyNotation selected" onclick="setCurrency(0)">Medieval</button>
|
|
<button class="w3-button button CurrencyNotation" onclick="setCurrency(1)">Extended</button>
|
|
<button class="w3-button button CurrencyNotation" onclick="setCurrency(2)">British £sd</button>
|
|
<button class="w3-button button CurrencyNotation" onclick="setCurrency(3)">Modern $</button>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Number notation</td>
|
|
<td style="padding: 0.4em">
|
|
<button class="w3-button button Notation selected" onclick="setNotation(0)">Standard</button>
|
|
<button class="w3-button button Notation" onclick="setNotation(1)">Scientific</button>
|
|
<button class="w3-button button Notation" onclick="setNotation(2)">Engineering</button>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Layout</td>
|
|
<td style="padding: 0.4em">
|
|
<button class="w3-button button Layout" onclick="setLayout(1)">Standard</button>
|
|
<button class="w3-button button Layout" onclick="setLayout(0)">W I D E</button>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Font size</td>
|
|
<td style="padding: 0.4em">
|
|
<button class="w3-button button" onmouseover="onFontButtonHover()" onmouseout="onFontButtonStopHover()" onclick="setFontSize(gameData.settings.fontSize - 1)">Smaller</button>
|
|
<button class="w3-button button" onmouseover="onFontButtonHover()" onmouseout="onFontButtonStopHover()" onclick="setFontSize(gameData.settings.fontSize + 1)">Larger</button>
|
|
<span class="tooltiptext hidden" id="fontSizeTooltip" style="color: gray">Keep pressing to change more</span>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td> Color scheme</td>
|
|
<td style="padding: 0.4em">
|
|
<button class="w3-button button Theme" onClick="setTheme(0, true)">Light</button>
|
|
<button class="w3-button button Theme" onClick="setTheme(1, true)">Dark</button>
|
|
<button class="w3-button button Theme" onClick="setTheme(2, true)">Color Blind Friendly</button>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</li>
|
|
<li>
|
|
<div class="text-caption" style="margin-top: 0.4em;">Shortcuts</div>
|
|
<div style="margin-bottom: 8px;">
|
|
Arrow Keys - Menu navigation
|
|
<br>
|
|
Spacebar - Pause
|
|
</div>
|
|
</li>
|
|
<li>
|
|
<div class="text-caption" style="margin-top: 0.4em;">
|
|
<button class="w3-button button w3-red" onClick="resetGameData()">Hard reset game</button>
|
|
</div>
|
|
</li>
|
|
<li>
|
|
<div class="text-caption" style="margin-top: 0.4em;">Links</div>
|
|
<div style="margin-bottom: 8px;">
|
|
Based on a <a href="https://symb1.github.io/progress_knight_2/" target="_blank">Progress Knight 2.0</a> mod
|
|
<br>Original game: <a href="https://ihtasham42.github.io/progress-knight/" target="_blank">Progress Knight</a>
|
|
<br><a href="https://discord.gg/fTRS4pHGka" target="_blank">Join the discord community! <img src="img/discord_icon.png" style="width:3em; height:3em;"></a>
|
|
<br><a href="https://github.com/indomit/progress_knight_2" target="_blank">Github page</a>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
<span id="version" style="font-size:smaller; float:right" class="w3-text-gray">Version: 2.2.7</span>
|
|
</div>
|
|
</div>
|
|
<div id="statsTab" class="tabSettings">
|
|
<div id="statsPage" style="flex: 1; margin-left: 0.5em;">
|
|
<div>
|
|
<ul>
|
|
<li>You started playing the game on <span id="startDateDisplay"></span>.</li>
|
|
<li>You have played for <span id="playedDaysDisplay"></span> days (real time).</li>
|
|
<li>Your existance has spanned <span id="playedGameTimeDisplay"></span> days (game time).</li>
|
|
</ul>
|
|
</div>
|
|
<div id="statsRebirth1" class="hidden">
|
|
<ul>
|
|
<li>You have touched the eye <span id="rebirthOneCountDisplay"></span> times.</li>
|
|
<li>Your fastest touch is in <span id="rebirthOneFastestDisplay"></span>.</li>
|
|
</ul>
|
|
</div>
|
|
<div id="statsRebirth2" class="hidden">
|
|
<ul>
|
|
<li>You have embraced evil <span id="rebirthTwoCountDisplay"></span> times.</li>
|
|
<li>Your fastest embrace is in <span id="rebirthTwoFastestDisplay"></span>.</li>
|
|
<li id="statsEvilGain" class="hidden">You gain <span id="evilPerSecondDisplay"></span> evil/s. Maximum <span id="maxEvilPerSecondDisplay"></span> evil/s was at <span id="maxEvilPerSecondRtDisplay"></span>.</li>
|
|
</ul>
|
|
</div>
|
|
<div id="statsRebirth3" class="hidden">
|
|
<ul>
|
|
<li>You have transcended <span id="rebirthThreeCountDisplay"></span> times.</li>
|
|
<li>Your fastest transcend is in <span id="rebirthThreeFastestDisplay"></span>.</li>
|
|
<li id="statsEssenceGain" class="hidden">You gain <span id="essencePerSecondDisplay"></span> essence/s. Maximum <span id="maxEssencePerSecondDisplay"></span> essence/s was at <span id="maxEssencePerSecondRtDisplay"></span>.</li>
|
|
</ul>
|
|
</div>
|
|
<div id="statsRebirth4" class="hidden">
|
|
<ul>
|
|
<li>You have collapsed the universe <span id="rebirthFourCountDisplay"></span> times.</li>
|
|
<li>Your fastest collapse is in <span id="rebirthFourFastestDisplay"></span>.</li>
|
|
</ul>
|
|
</div>
|
|
<div id="statsChallenges">
|
|
<ul>
|
|
<li id="challengeStat1">Challenge 1 Reward: Multiplies happiness by x<span id="challengeHappinessBuffDisplay"></span>.</li>
|
|
<li id="challengeStat2">Challenge 2 Reward: Multiplies income by x<span id="challengeIncomeBuffDisplay"></span>.</li>
|
|
<li id="challengeStat3">Challenge 3 Reward: Multiplies time warping by x<span id="challengeTimewarpingBuffDisplay"></span>.</li>
|
|
<li id="challengeStat4">Challenge 4 Reward: Multiplies essence gain by x<span id="challengeEssenceGainBuffDisplay"></span>.</li>
|
|
<li id="challengeStat5">Challenge 5 Reward: Multiplies evil gain by x<span id="challengeEvilGainBuffDisplay"></span>.</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="changelogTab" class="tabSettings">
|
|
<div id="changelogPage" style="flex: 1; margin-left: 0.5em;">
|
|
<pre id="changelog">
|
|
|
|
</pre>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<script type="text/javascript" src="js/utils.js"></script>
|
|
<script type="text/javascript" src="js/ui.js"></script>
|
|
<script type="text/javascript" src="js/math.js"></script>
|
|
<script type="text/javascript" src="js/HackTimer.js"></script>
|
|
<script type="text/javascript" src="js/classes.js"></script>
|
|
<script type="text/javascript" src="js/challenges.js"></script>
|
|
<script type="text/javascript" src="js/dark_matter.js"></script>
|
|
<script type="text/javascript" src="js/tooltips.js"></script>
|
|
<script type="text/javascript" src="js/main.js"></script>
|
|
</body>
|
|
</html>
|