Skip to content

Add pause function #39

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
murapix wants to merge 4 commits into
base: master
Choose a base branch
from
Open

Add pause function #39

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
49ff498
Add layer and global pausing
murapix Jul 19, 2021
7e67fd4
Add pause buttons to demo
murapix Jul 19, 2021
5ed5b3f
Add pause documentation
murapix Jul 19, 2021
078c4e2
Stop update and automate calls while paused
murapix Jul 22, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions docs/layer-features.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -179,6 +179,8 @@ componentStyles: {

- deactivated: **optional**, if this is true, hasUpgrade, hasChallenge, hasAchievement, and hasMilestone will return false for things in the layer, and you will be unable to buy or click things, or gain achievements/milestones on the layer. You will have to disable effects of buyables, the innate layer effect, and possibly other things yourself.

- paused: **optional**, if this is true, all layer functionality will be frozen, and you will be unable to buy or sell things, or gain achievements/milestones on the layer. All data, upgrades, and effects will remain unchanged, and any functions other than "paused" will not be called as part of the update loop. Visual components, however, will still be updated as long as the layer is being viewed, and any toggles or miscellaneous buttons will remain active.

## Custom Prestige type
(All of these can also be used by other prestige types)

Expand Down
8 changes: 8 additions & 0 deletions js/Demo/demoTree.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -46,6 +46,14 @@ addNode("h", {
},
)

addNode("p", {
layerShown: true,
tooltip() { return player.paused ? "Unpause the game" : "Pause the game" },
row: "side",
canClick: true,
onClick() { if (player.paused) { delete player.paused } else player.paused = true }
})

addLayer("tree-tab", {
tabFormat: [["tree", function() {return (layoutInfo.treeLayout ? layoutInfo.treeLayout : TREE_LAYERS)}]],
previousTab: "",
Expand Down
9 changes: 8 additions & 1 deletion js/Demo/layers/c.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -51,6 +51,9 @@ addLayer("c", {
eff.waffleBoost = eff.waffleBoost.times(buyableEffect(this.layer, 11).first)
return "which are boosting waffles by "+format(eff.waffleBoost)+" and increasing the Ice Cream cap by "+format(eff.icecreamCap)
},
paused() { // Optional, controlls if the layer is updated every game tick or not
return player.c.paused
},
infoboxes:{
coolInfo: {
title: "Lore",
Expand Down Expand Up @@ -353,7 +356,11 @@ addLayer("c", {
["raw-html", function() {return "<h1> C O N F I R M E D </h1>"}], "blank",
["microtabs", "stuff", {'width': '600px', 'height': '350px', 'background-color': 'brown', 'border-style': 'solid'}],
["display-text", "Adjust how many points H gives you!"],
["slider", ["otherThingy", 1, 30]], "blank", ["upgrade-tree", [[11],
["slider", ["otherThingy", 1, 30]],
["row", [
["display-text", "Stop the candy flows"], ["toggle", ["c", "paused"]]
]],
"blank", ["upgrade-tree", [[11],
[12, 22, 22, 11]]]
]
}
Expand Down
20 changes: 10 additions & 10 deletions js/components.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -140,7 +140,7 @@ function loadVue() {
<div v-if="tmp[layer].challenges && tmp[layer].challenges[data]!== undefined && tmp[layer].challenges[data].unlocked && !(options.hideChallenges && maxedChallenge(layer, [data]) && !inChallenge(layer, [data]))"
v-bind:class="['challenge', challengeStyle(layer, data), player[layer].activeChallenge === data ? 'resetNotify' : '']" v-bind:style="tmp[layer].challenges[data].style">
<br><h3 v-html="tmp[layer].challenges[data].name"></h3><br><br>
<button v-bind:class="{ longUpg: true, can: true, [layer]: true }" v-bind:style="{'background-color': tmp[layer].color}" v-on:click="startChallenge(layer, data)">{{challengeButtonText(layer, data)}}</button><br><br>
<button v-bind:class="{ longUpg: true, can: true, [layer]: true }" v-bind:style="{'background-color': tmp[layer].color}" v-on:click="if (!paused && !player.paused && !tmp[layer].paused) startChallenge(layer, data)">{{challengeButtonText(layer, data)}}</button><br><br>
<span v-if="layers[layer].challenges[data].fullDisplay" v-html="run(layers[layer].challenges[data].fullDisplay, layers[layer].challenges[data])"></span>
<span v-else>
<span v-html="tmp[layer].challenges[data].challengeDescription"></span><br>
Expand Down Expand Up @@ -172,7 +172,7 @@ function loadVue() {
Vue.component('upgrade', {
props: ['layer', 'data'],
template: `
<button v-if="tmp[layer].upgrades && tmp[layer].upgrades[data]!== undefined && tmp[layer].upgrades[data].unlocked" :id='"upgrade-" + layer + "-" + data' v-on:click="buyUpg(layer, data)" v-bind:class="{ [layer]: true, tooltipBox: true, upg: true, bought: hasUpgrade(layer, data), locked: (!(canAffordUpgrade(layer, data))&&!hasUpgrade(layer, data)), can: (canAffordUpgrade(layer, data)&&!hasUpgrade(layer, data))}"
<button v-if="tmp[layer].upgrades && tmp[layer].upgrades[data]!== undefined && tmp[layer].upgrades[data].unlocked" :id='"upgrade-" + layer + "-" + data' v-on:click="if (!paused && !player.paused && !tmp[layer].paused) buyUpg(layer, data)" v-bind:class="{ [layer]: true, tooltipBox: true, upg: true, bought: hasUpgrade(layer, data), locked: (!(canAffordUpgrade(layer, data))&&!hasUpgrade(layer, data)), can: (canAffordUpgrade(layer, data)&&!hasUpgrade(layer, data))}"
v-bind:style="[((!hasUpgrade(layer, data) && canAffordUpgrade(layer, data)) ? {'background-color': tmp[layer].color} : {}), tmp[layer].upgrades[data].style]">
<span v-if="layers[layer].upgrades[data].fullDisplay" v-html="run(layers[layer].upgrades[data].fullDisplay, layers[layer].upgrades[data])"></span>
<span v-else>
Expand Down Expand Up @@ -226,7 +226,7 @@ function loadVue() {
template: `
<button v-if="(tmp[layer].type !== 'none')" v-bind:class="{ [layer]: true, reset: true, locked: !tmp[layer].canReset, can: tmp[layer].canReset}"
v-bind:style="[tmp[layer].canReset ? {'background-color': tmp[layer].color} : {}, tmp[layer].componentStyles['prestige-button']]"
v-html="prestigeButtonText(layer)" v-on:click="doReset(layer)">
v-html="prestigeButtonText(layer)" v-on:click="if (!paused && !player.paused && !tmp[layer].paused) doReset(layer)">
</button>
`

Expand Down Expand Up @@ -276,7 +276,7 @@ function loadVue() {
<div v-if="tmp[layer].buyables && tmp[layer].buyables[data]!== undefined && tmp[layer].buyables[data].unlocked" style="display: grid">
<button v-bind:class="{ buyable: true, tooltipBox: true, can: tmp[layer].buyables[data].canBuy, locked: !tmp[layer].buyables[data].canBuy, bought: player[layer].buyables[data].gte(tmp[layer].buyables[data].purchaseLimit)}"
v-bind:style="[tmp[layer].buyables[data].canBuy ? {'background-color': tmp[layer].color} : {}, size ? {'height': size, 'width': size} : {}, tmp[layer].componentStyles.buyable, tmp[layer].buyables[data].style]"
v-on:click="if(!interval) buyBuyable(layer, data)" :id='"buyable-" + layer + "-" + data' @mousedown="start" @mouseleave="stop" @mouseup="stop" @touchstart="start" @touchend="stop" @touchcancel="stop">
v-on:click="if(!interval && !paused && !player.paused && !tmp[layer].paused) buyBuyable(layer, data)" :id='"buyable-" + layer + "-" + data' @mousedown="start" @mouseleave="stop" @mouseup="stop" @touchstart="start" @touchend="stop" @touchcancel="stop">
<span v-if= "tmp[layer].buyables[data].title"><h2 v-html="tmp[layer].buyables[data].title"></h2><br></span>
<span v-bind:style="{'white-space': 'pre-line'}" v-html="run(layers[layer].buyables[data].display, layers[layer].buyables[data])"></span>
<node-mark :layer='layer' :data='tmp[layer].buyables[data].marked'></node-mark>
Expand Down Expand Up @@ -311,7 +311,7 @@ function loadVue() {
template: `
<div v-if="tmp[layer].buyables && tmp[layer].buyables.respec && !(tmp[layer].buyables.showRespec !== undefined && tmp[layer].buyables.showRespec == false)">
<div class="tooltipBox respecCheckbox"><input type="checkbox" v-model="player[layer].noRespecConfirm" ><tooltip v-bind:text="'Disable respec confirmation'"></tooltip></div>
<button v-on:click="respecBuyables(layer)" v-bind:class="{ longUpg: true, can: player[layer].unlocked, locked: !player[layer].unlocked }" style="margin-right: 18px">{{tmp[layer].buyables.respecText ? tmp[layer].buyables.respecText : "Respec"}}</button>
<button v-on:click="if (!paused && !player.paused && !tmp[layer].paused) respecBuyables(layer)" v-bind:class="{ longUpg: true, can: player[layer].unlocked, locked: !player[layer].unlocked }" style="margin-right: 18px">{{tmp[layer].buyables.respecText ? tmp[layer].buyables.respecText : "Respec"}}</button>
</div>
`
})
Expand Down Expand Up @@ -339,7 +339,7 @@ function loadVue() {
v-if="tmp[layer].clickables && tmp[layer].clickables[data]!== undefined && tmp[layer].clickables[data].unlocked"
v-bind:class="{ upg: true, tooltipBox: true, can: tmp[layer].clickables[data].canClick, locked: !tmp[layer].clickables[data].canClick}"
v-bind:style="[tmp[layer].clickables[data].canClick ? {'background-color': tmp[layer].color} : {}, size ? {'height': size, 'width': size} : {}, tmp[layer].clickables[data].style]"
v-on:click="if(!interval) clickClickable(layer, data)" :id='"clickable-" + layer + "-" + data' @mousedown="start" @mouseleave="stop" @mouseup="stop" @touchstart="start" @touchend="stop" @touchcancel="stop">
v-on:click="if(!interval && !paused && !player.paused && !tmp[layer].paused) clickClickable(layer, data)" :id='"clickable-" + layer + "-" + data' @mousedown="start" @mouseleave="stop" @mouseup="stop" @touchstart="start" @touchend="stop" @touchcancel="stop">
<span v-if= "tmp[layer].clickables[data].title"><h2 v-html="tmp[layer].clickables[data].title"></h2><br></span>
<span v-bind:style="{'white-space': 'pre-line'}" v-html="run(layers[layer].clickables[data].display, layers[layer].clickables[data])"></span>
<node-mark :layer='layer' :data='tmp[layer].clickables[data].marked'></node-mark>
Expand Down Expand Up @@ -371,7 +371,7 @@ function loadVue() {
props: ['layer', 'data'],
template: `
<button v-if="tmp[layer].clickables && tmp[layer].clickables.masterButtonPress && !(tmp[layer].clickables.showMasterButton !== undefined && tmp[layer].clickables.showMasterButton == false)"
v-on:click="run(tmp[layer].clickables.masterButtonPress, tmp[layer].clickables)" v-bind:class="{ longUpg: true, can: player[layer].unlocked, locked: !player[layer].unlocked }">{{tmp[layer].clickables.masterButtonText ? tmp[layer].clickables.masterButtonText : "Click me!"}}</button>
v-on:click="if (!paused && !player.paused && !tmp[layer].paused) run(tmp[layer].clickables.masterButtonPress, tmp[layer].clickables)" v-bind:class="{ longUpg: true, can: player[layer].unlocked, locked: !player[layer].unlocked }">{{tmp[layer].clickables.masterButtonText ? tmp[layer].clickables.masterButtonText : "Click me!"}}</button>
`
})

Expand Down Expand Up @@ -399,7 +399,7 @@ function loadVue() {
v-if="tmp[layer].grid && player[layer].grid[data]!== undefined && run(layers[layer].grid.getUnlocked, layers[layer].grid, data)"
v-bind:class="{ tile: true, can: canClick, locked: !canClick, tooltipBox: true,}"
v-bind:style="[canClick ? {'background-color': tmp[layer].color} : {}, gridRun(layer, 'getStyle', player[this.layer].grid[this.data], this.data)]"
v-on:click="clickGrid(layer, data)" @mousedown="start" @mouseleave="stop" @mouseup="stop" @touchstart="start" @touchend="stop" @touchcancel="stop">
v-on:click="if (!paused && !player.paused && !tmp[layer].paused) clickGrid(layer, data)" @mousedown="start" @mouseleave="stop" @mouseup="stop" @touchstart="start" @touchend="stop" @touchcancel="stop">
<span v-if= "layers[layer].grid.getTitle"><h3 v-html="gridRun(this.layer, 'getTitle', player[this.layer].grid[this.data], this.data)"></h3><br></span>
<span v-bind:style="{'white-space': 'pre-line'}" v-html="gridRun(this.layer, 'getDisplay', player[this.layer].grid[this.data], this.data)"></span>
<tooltip v-if="layers[layer].grid.getTooltip" :text="gridRun(this.layer, 'getTooltip', player[this.layer].grid[this.data], this.data)"></tooltip>
Expand Down Expand Up @@ -586,14 +586,14 @@ function loadVue() {
Vue.component('sell-one', {
props: ['layer', 'data'],
template: `
<button v-if="tmp[layer].buyables && tmp[layer].buyables[data].sellOne && !(tmp[layer].buyables[data].canSellOne !== undefined && tmp[layer].buyables[data].canSellOne == false)" v-on:click="run(tmp[layer].buyables[data].sellOne, tmp[layer].buyables[data])"
<button v-if="tmp[layer].buyables && tmp[layer].buyables[data].sellOne && !(tmp[layer].buyables[data].canSellOne !== undefined && tmp[layer].buyables[data].canSellOne == false)" v-on:click="if (!paused && !player.paused && !tmp[layer].paused) run(tmp[layer].buyables[data].sellOne, tmp[layer].buyables[data])"
v-bind:class="{ longUpg: true, can: player[layer].unlocked, locked: !player[layer].unlocked }">{{tmp[layer].buyables.sellOneText ? tmp[layer].buyables.sellOneText : "Sell One"}}</button>
`
})
Vue.component('sell-all', {
props: ['layer', 'data'],
template: `
<button v-if="tmp[layer].buyables && tmp[layer].buyables[data].sellAll && !(tmp[layer].buyables[data].canSellAll !== undefined && tmp[layer].buyables[data].canSellAll == false)" v-on:click="run(tmp[layer].buyables[data].sellAll, tmp[layer].buyables[data])"
<button v-if="tmp[layer].buyables && tmp[layer].buyables[data].sellAll && !(tmp[layer].buyables[data].canSellAll !== undefined && tmp[layer].buyables[data].canSellAll == false)" v-on:click="if (!paused && !player.paused && !tmp[layer].paused) run(tmp[layer].buyables[data].sellAll, tmp[layer].buyables[data])"
v-bind:class="{ longUpg: true, can: player[layer].unlocked, locked: !player[layer].unlocked }">{{tmp[layer].buyables.sellAllText ? tmp[layer].buyables.sellAllText : "Sell All"}}</button>
`
})
Expand Down
30 changes: 20 additions & 10 deletions js/game.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -128,6 +128,7 @@ function canReset(layer)

function rowReset(row, layer) {
for (lr in ROW_LAYERS[row]){
if(tmp[lr].paused) continue
if(layers[lr].doReset) {
if (!isNaN(row)) Vue.set(player[lr], "activeChallenge", null) // Exit challenges on any row reset on an equal or higher row
run(layers[lr].doReset, layers[lr], layer)
Expand Down Expand Up @@ -342,6 +343,7 @@ function gameLoop(diff) {
for (let x = 0; x <= maxRow; x++){
for (item in TREE_LAYERS[x]) {
let layer = TREE_LAYERS[x][item]
if (tmp[layer].paused) continue
player[layer].resetTime += diff
if (tmp[layer].passiveGeneration) generatePoints(layer, diff*tmp[layer].passiveGeneration);
if (layers[layer].update) layers[layer].update(diff);
Expand All @@ -351,6 +353,7 @@ function gameLoop(diff) {
for (row in OTHER_LAYERS){
for (item in OTHER_LAYERS[row]) {
let layer = OTHER_LAYERS[row][item]
if (tmp[layer].paused) continue
player[layer].resetTime += diff
if (tmp[layer].passiveGeneration) generatePoints(layer, diff*tmp[layer].passiveGeneration);
if (layers[layer].update) layers[layer].update(diff);
Expand All @@ -360,6 +363,7 @@ function gameLoop(diff) {
for (let x = maxRow; x >= 0; x--){
for (item in TREE_LAYERS[x]) {
let layer = TREE_LAYERS[x][item]
if (tmp[layer].paused) continue
if (tmp[layer].autoPrestige && tmp[layer].canReset) doReset(layer);
if (layers[layer].automate) layers[layer].automate();
if (tmp[layer].autoUpgrade) autobuyUpgrades(layer)
Expand All @@ -369,6 +373,7 @@ function gameLoop(diff) {
for (row in OTHER_LAYERS){
for (item in OTHER_LAYERS[row]) {
let layer = OTHER_LAYERS[row][item]
if (tmp[layer].paused) continue
if (tmp[layer].autoPrestige && tmp[layer].canReset) doReset(layer);
if (layers[layer].automate) layers[layer].automate();
player[layer].best = player[layer].best.max(player[layer].points)
Expand All @@ -377,6 +382,7 @@ function gameLoop(diff) {
}

for (layer in layers){
if (tmp[layer].paused) continue
if (layers[layer].milestones) updateMilestones(layer);
if (layers[layer].achievements) updateAchievements(layer)
}
Expand All @@ -392,6 +398,7 @@ function hardReset(resetOptions) {
}

var ticking = false
var paused = false

var interval = setInterval(function() {
if (player===undefined||tmp===undefined) return;
Expand All @@ -401,16 +408,19 @@ var interval = setInterval(function() {
let now = Date.now()
let diff = (now - player.time) / 1e3
let trueDiff = diff
if (player.offTime !== undefined) {
if (player.offTime.remain > modInfo.offlineLimit * 3600) player.offTime.remain = modInfo.offlineLimit * 3600
if (player.offTime.remain > 0) {
let offlineDiff = Math.max(player.offTime.remain / 10, diff)
player.offTime.remain -= offlineDiff
diff += offlineDiff
if (!paused && !player.paused) {
if (player.offTime !== undefined) {
if (player.offTime.remain > modInfo.offlineLimit * 3600) player.offTime.remain = modInfo.offlineLimit * 3600
if (player.offTime.remain > 0) {
let offlineDiff = Math.max(player.offTime.remain / 10, diff)
player.offTime.remain -= offlineDiff
diff += offlineDiff
}
if (!options.offlineProd || player.offTime.remain <= 0) player.offTime = undefined
}
if (!options.offlineProd || player.offTime.remain <= 0) player.offTime = undefined
}
if (player.devSpeed) diff *= player.devSpeed
if (player.devSpeed) diff *= player.devSpeed
} else diff = 0

player.time = now
if (needCanvasUpdate){ resizeCanvas();
needCanvasUpdate = false;
Expand All @@ -420,7 +430,7 @@ var interval = setInterval(function() {
updateOomps(diff);
updateWidth()
updateTabFormats()
gameLoop(diff)
if (!paused && !player.paused) gameLoop(diff)
fixNaNs()
adjustPopupTime(trueDiff)
updateParticles(trueDiff)
Expand Down
31 changes: 29 additions & 2 deletions js/technical/temp.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -96,9 +96,11 @@ function updateTemp() {
if (tmp === undefined)
setupTemp()

updateTempData(layers, tmp, funcs)
updateTempData(layers, tmp, funcs, undefined, true)
updatePaused(layers, tmp, funcs)

for (layer in layers){
if (tmp[layer].paused) continue
tmp[layer].resetGain = getResetGain(layer)
tmp[layer].nextAt = getNextAt(layer)
tmp[layer].nextAtDisp = getNextAt(layer, true)
Expand All @@ -121,8 +123,33 @@ function updateTemp() {
}
}

function updateTempData(layerData, tmpData, funcsData, useThis) {
function updatePaused(layerData, tmpData, funcsData, useThis) {
for (item in funcsData){
if (tmpData[item].paused !== true) continue
if ((!!layerData[item]) && (layerData[item].constructor === Object) || (typeof layerData[item] === "object") && traversableClasses.includes(layerData[item].constructor.name)) {
if (isFunction(layerData[item].paused) && !isFunction(tmpData[item].paused)) {
let value

if (useThis !== undefined) value = layerData[item].paused.bind(useThis)()
else value = layerData[item].paused()
Vue.set(tmpData[item], "paused", value)
}
}
}
}

function updateTempData(layerData, tmpData, funcsData, useThis, firstStep = false) {
for (item in funcsData){
if (firstStep) {
if (tmpData[item].paused === true) continue
if (isFunction(layerData[item].paused) && !isFunction(tmpData[item].paused)) {
let value

if (useThis !== undefined) value = layerData[item].paused.bind(useThis)()
else value = layerData[item].paused()
Vue.set(tmpData[item], "paused", value)
}
}
if (Array.isArray(layerData[item])) {
if (item !== "tabFormat" && item !== "content") // These are only updated when needed
updateTempData(layerData[item], tmpData[item], funcsData[item], useThis)
Expand Down