cosmo/daggerheart
1
0
Fork 0
mirror of https://github.com/Foundryborne/daggerheart.git synced 2026-07-22 02:19:54 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

[Review] Move visible countdown types to getter (#1999)

Browse source 
* Move visible countdown types to getter

* Punchier shimmer animation
This commit is contained in:
Carlos Fernandez 2026-06-14 13:15:01 -04:00 • committed by GitHub
parent 919e872f68
commit ec56e1812c
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 29 additions and 19 deletions
Download patch file Download diff file Expand all files Collapse all files

41
module/applications/ui/countdowns.mjs
View file

@ -13,14 +13,14 @@ const { shortterm, longterm } = SYSTEM.GENERAL.countdownType;
*/
export default class DhCountdowns extends HandlebarsApplicationMixin(ApplicationV2) {
previusCountdownData = null;
previousCountdownData = null;
changedCountdownsForAnimation = new Set();
countdownChangeAnimationTimeout = null;
constructor(options = {}) {
super(options);
this.previusCountdownData =
this.previousCountdownData =
game.settings.get(CONFIG.DH.id, CONFIG.DH.SETTINGS.gameSettings.Countdowns).countdowns;
this.setupHooks();
}
@ -61,6 +61,16 @@ export default class DhCountdowns extends HandlebarsApplicationMixin(Application
}
};
/**
* Returns all visible countdown types
* @returns {string[]}
*/
get visibleCountdownTypes() {
const { shortterm, longterm } = SYSTEM.GENERAL.countdownType;
return game.user.getFlag(CONFIG.DH.id, CONFIG.DH.FLAGS.userFlags.countdownTypeModes)
?? [shortterm.id, longterm.id];
}
async _renderFrame(options) {
const frame = await super._renderFrame(options);
@ -83,7 +93,7 @@ export default class DhCountdowns extends HandlebarsApplicationMixin(Application
document.getElementById('ui-right-column-1')?.appendChild(this.element);
}
this.previusCountdownData = game.settings.get(CONFIG.DH.id, CONFIG.DH.SETTINGS.gameSettings.Countdowns)
this.previousCountdownData = game.settings.get(CONFIG.DH.id, CONFIG.DH.SETTINGS.gameSettings.Countdowns)
.countdowns;
/* Handle animations to draw attention to countdown values changing */
@ -93,20 +103,15 @@ export default class DhCountdowns extends HandlebarsApplicationMixin(Application
this.countdownChangeAnimationTimeout = setTimeout(() => {
this.changedCountdownsForAnimation.clear();
for (const element of this.element.querySelectorAll('.countdown-container')) {
const selector = '.countdown-container, .header-type-toggles .header-type';
for (const element of this.element.querySelectorAll(selector)) {
element.classList.remove('change-glow');
}
for (const element of this.element.querySelectorAll('.header-type-toggles .header-type')) {
element.classList.remove('change-glow');
}
}, 3000);
/* If the countdown is not currently visible, add a glow to the CountdownType pill */
const visibleTypes = this.visibleCountdownTypes;
for (const countdownKey of this.changedCountdownsForAnimation) {
/* If the countdown is not currently visible, add a glow to the CountdownType pill */
const visibleTypes = game.user.getFlag(CONFIG.DH.id, CONFIG.DH.FLAGS.userFlags.countdownTypeModes)
?? [shortterm.id, longterm.id]
const countdown = game.settings.get(CONFIG.DH.id, CONFIG.DH.SETTINGS.gameSettings.Countdowns)
.countdowns[countdownKey];
if (!visibleTypes.includes(countdown?.type)) {
@ -114,7 +119,7 @@ export default class DhCountdowns extends HandlebarsApplicationMixin(Application
.classList.add('change-glow');
}
/* If the countdown element is not rendered the user doesn't have permissiosn to it. No animation needed on the elment itself */
/* If the countdown element is not rendered the user doesn't have permissions to it. No animation needed on the elment itself */
const countdownElement = this.element.querySelector(`.countdown-container[data-countdown="${countdownKey}"]`);
if (!countdownElement) continue;
@ -184,8 +189,7 @@ export default class DhCountdowns extends HandlebarsApplicationMixin(Application
game.user.getFlag(CONFIG.DH.id, CONFIG.DH.FLAGS.userFlags.countdownMode)
=== CONFIG.DH.GENERAL.countdownAppMode.iconOnly;
context.userCountdownTypes = game.user.getFlag(CONFIG.DH.id, CONFIG.DH.FLAGS.userFlags.countdownTypeModes)
?? [shortterm.id, longterm.id];
context.userCountdownTypes = this.visibleCountdownTypes;
context.typeToggles =
Object.values(CONFIG.DH.GENERAL.countdownType).map(type => ({
@ -231,6 +235,7 @@ export default class DhCountdowns extends HandlebarsApplicationMixin(Application
return true;
}
/** @this {DhCountdowns} */
static async #onToggleViewMode() {
const currentMode = game.user.getFlag(CONFIG.DH.id, CONFIG.DH.FLAGS.userFlags.countdownMode);
const appMode = CONFIG.DH.GENERAL.countdownAppMode;
@ -242,9 +247,9 @@ export default class DhCountdowns extends HandlebarsApplicationMixin(Application
this.render();
}
/** @this {DhCountdowns} */
static async #onToggleCountdownTypes(event, target) {
const currentTypes = game.user.getFlag(CONFIG.DH.id, CONFIG.DH.FLAGS.userFlags.countdownTypeModes)
?? [shortterm.id, longterm.id];
const currentTypes = this.visibleCountdownTypes;
const { type } = target.dataset;
const newTypes = event.shiftKey ?
[type] :
@ -254,10 +259,12 @@ export default class DhCountdowns extends HandlebarsApplicationMixin(Application
this.render();
}
/** @this {DhCountdowns} */
static async #onEditCountdowns() {
new game.system.api.applications.ui.CountdownEdit().render(true);
}
/** @this {DhCountdowns} */
static async #onLoopCountdown(_, target) {
if (!DhCountdowns.canPerformEdit()) return;

2
module/data/countdowns.mjs
View file

@ -15,7 +15,7 @@ export default class DhCountdowns extends foundry.abstract.DataModel {
}
handleChange() {
const previousCountdowns = foundry.ui.countdowns.previusCountdownData;
const previousCountdowns = foundry.ui.countdowns.previousCountdownData;
const changedCountdowns = Object.entries(this.countdowns).reduce((acc, [key, countdown]) => {
const previousCountdown = previousCountdowns[key];
if (!previousCountdown || (previousCountdown.progress.current !== countdown.progress.current)) {

5
styles/less/ui/countdown/countdown.less
View file

@ -120,7 +120,7 @@
border-radius: 6px;
&.change-glow {
animation: shimmer 1s ease-in-out;
animation: shimmer 1s ease-out;
background: linear-gradient(-45deg, transparent 30%, light-dark(@dark-blue-40, @golden-40) 35%, transparent 40%);
background-size: 300%;
background-position-x: 100%
@ -237,6 +237,9 @@
}
@keyframes shimmer {
from {
background-position-x: 98%;
}
to {
background-position-x: 0%
}