diff options
| -rw-r--r-- | CHANGELOG.md | 9 | ||||
| -rw-r--r-- | app/javascript/controllers/timer_controller.js | 12 | ||||
| -rw-r--r-- | app/javascript/packs/application.js | 3 | ||||
| -rw-r--r-- | public/timer_worker.js | 24 |
4 files changed, 40 insertions, 8 deletions
diff --git a/CHANGELOG.md b/CHANGELOG.md index 4480d77..83c8c33 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -4,6 +4,15 @@ All notable changes to this project will be documented in this file. ## [Unreleased] ### General +- Timer will now continue to run even if you're on another browser tab or if the game is minimized. This was done + using a technology called "web workers". I am new to this tech and it's possible that things are imperfect. Please + let me know if anything seems weird to you. + - It's possible that the use of web workers now means that your game will continue to run on mobile even if your + display is off, or even if you're in another app. This may vary from device to device. Again, totally new to this + technology. Please try it out on your phone and let me know. I am honestly _guessing_ that it's probably too good + to be true that things will just keep working even with your display off, but it's possible that technology has + gotten that far. If it doesn't work for you, you might be able to tweak some device/browser settings to get it + to work. Again, no idea. - You now receive an informative message when someone buys or sells items to you via one of your bazaar orders. ### Combat diff --git a/app/javascript/controllers/timer_controller.js b/app/javascript/controllers/timer_controller.js index 4888f6a..f6ba4f3 100644 --- a/app/javascript/controllers/timer_controller.js +++ b/app/javascript/controllers/timer_controller.js @@ -11,15 +11,12 @@ export default class extends Controller { } connect() { - if (!this.timerInterval) this.startUpdating(); + App.timerWorker.postMessage({ "run_flag": true }); this.timerTarget.textContent = Math.ceil(this.timeRemainingValue); this.postFailures = 0; - } - startUpdating() { let controller = this; - controller.timerInterval = setInterval(() => { - + App.timerWorker.onmessage = function() { if (controller.timeRemainingValue > 0) { controller.timeRemainingValue = controller.timeRemainingValue - 0.01; } @@ -28,11 +25,10 @@ export default class extends Controller { controller.timerTarget.textContent = Math.ceil(controller.timeRemainingValue).toString(); controller.progressBarTarget.style.width = `${(1 - (controller.timeRemainingValue / controller.activityDurationValue)) * 100}%`; } else { - clearInterval(controller.timerInterval); - controller.timerInterval = null; + App.timerWorker.postMessage({ "run_flag": false }); controller.finishActivity(); } - }, 10); + } } finishActivity() { diff --git a/app/javascript/packs/application.js b/app/javascript/packs/application.js index a18528e..65ab536 100644 --- a/app/javascript/packs/application.js +++ b/app/javascript/packs/application.js @@ -20,3 +20,6 @@ import { definitionsFromContext } from "stimulus/webpack-helpers" const application = Application.start() const context = require.context("../controllers", true, /\.js$/) application.load(definitionsFromContext(context)) + +window.App = {}; +App.timerWorker = new Worker("/timer_worker.js"); diff --git a/public/timer_worker.js b/public/timer_worker.js new file mode 100644 index 0000000..3d3e79a --- /dev/null +++ b/public/timer_worker.js @@ -0,0 +1,24 @@ +let timerInterval = null; + +function setTimerInterval() { + if (!timerInterval) { + timerInterval = setInterval(function() { + postMessage("timerTick"); + }, 10); + } +} + +function clearTimerInterval() { + clearInterval(timerInterval); + timerInterval = null; +} + +onmessage = function(event) { + if ("run_flag" in event.data) { + if (event.data["run_flag"]) { + setTimerInterval(); + } else { + clearTimerInterval(); + } + } +} |