mirror of
https://github.com/Foundryborne/daggerheart.git
synced 2026-01-12 19:51:08 +01:00
Fixed overflow layout and added confirmation on countdown removal
This commit is contained in:
WBHarry
parent
2299141442
commit
81cda222da
5 changed files with 107 additions and 41 deletions
|
|
@ -1054,6 +1054,8 @@
|
|||
},
|
||||
"NewCountdown": "New Countdown",
|
||||
"AddCountdown": "Add Countdown",
|
||||
"RemoveCountdownTitle": "Remove Countdown",
|
||||
"RemoveCountdownText": "Are you sure you want to remove the countdown: {name}?",
|
||||
"Title": "{type} Countdowns",
|
||||
"Types": {
|
||||
"narrative": "Narrative",
|
||||
|
|
|
|||
|
|
@ -18,6 +18,7 @@ class Countdowns extends HandlebarsApplicationMixin(ApplicationV2) {
|
|||
static DEFAULT_OPTIONS = {
|
||||
classes: ['daggerheart', 'dh-style', 'countdown'],
|
||||
tag: 'form',
|
||||
position: { width: 740, height: 700 },
|
||||
window: {
|
||||
frame: true,
|
||||
title: 'Countdowns',
|
||||
|
|
@ -34,7 +35,8 @@ class Countdowns extends HandlebarsApplicationMixin(ApplicationV2) {
|
|||
|
||||
static PARTS = {
|
||||
countdowns: {
|
||||
template: 'systems/daggerheart/templates/views/countdowns.hbs'
|
||||
template: 'systems/daggerheart/templates/views/countdowns.hbs',
|
||||
scrollable: ['.expanded-view']
|
||||
}
|
||||
};
|
||||
|
||||
|
|
@ -148,6 +150,16 @@ class Countdowns extends HandlebarsApplicationMixin(ApplicationV2) {
|
|||
|
||||
static async removeCountdown(_, target) {
|
||||
const countdownSetting = game.settings.get(SYSTEM.id, SYSTEM.SETTINGS.gameSettings.Countdowns);
|
||||
const countdownName = countdownSetting[this.basePath].countdowns[target.dataset.countdown].name;
|
||||
|
||||
const confirmed = await foundry.applications.api.DialogV2.confirm({
|
||||
window: {
|
||||
title: game.i18n.localize('DAGGERHEART.Countdown.RemoveCountdownTitle')
|
||||
},
|
||||
content: game.i18n.format('DAGGERHEART.Countdown.RemoveCountdownText', { name: countdownName })
|
||||
});
|
||||
if (!confirmed) return;
|
||||
|
||||
await countdownSetting.updateSource({ [`${this.basePath}.countdowns.-=${target.dataset.countdown}`]: null });
|
||||
|
||||
await game.settings.set(SYSTEM.id, SYSTEM.SETTINGS.gameSettings.Countdowns, countdownSetting.toObject());
|
||||
|
|
|
|||
|
|
@ -1,4 +1,6 @@
|
|||
.daggerheart.dh-style.countdown {
|
||||
overflow: hidden;
|
||||
|
||||
fieldset {
|
||||
align-items: center;
|
||||
margin-top: 5px;
|
||||
|
|
@ -19,7 +21,7 @@
|
|||
&.minimized {
|
||||
height: auto !important;
|
||||
max-height: unset !important;
|
||||
max-width: 600px !important;
|
||||
max-width: 740px !important;
|
||||
width: auto !important;
|
||||
|
||||
.window-content {
|
||||
|
|
@ -69,28 +71,53 @@
|
|||
display: none;
|
||||
}
|
||||
|
||||
.countdown-container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 16px;
|
||||
.window-content {
|
||||
> div {
|
||||
height: 100%;
|
||||
|
||||
img {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.countdown-inner-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 4px;
|
||||
|
||||
.countdown-value-container {
|
||||
.expanded-view {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
gap: 4px;
|
||||
flex-direction: column;
|
||||
|
||||
input {
|
||||
max-width: 80px;
|
||||
.countdowns-container {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
flex-wrap: wrap;
|
||||
overflow: auto;
|
||||
max-height: 100%;
|
||||
|
||||
.countdown-fieldset {
|
||||
width: 340px;
|
||||
height: min-content;
|
||||
|
||||
.countdown-container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 16px;
|
||||
|
||||
img {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.countdown-inner-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 4px;
|
||||
|
||||
.countdown-value-container {
|
||||
display: flex;
|
||||
gap: 4px;
|
||||
|
||||
input {
|
||||
max-width: 80px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -3191,6 +3191,9 @@ div.daggerheart.views.multiclass {
|
|||
#resources:has(.fear-bar) {
|
||||
min-width: 200px;
|
||||
}
|
||||
.daggerheart.dh-style.countdown {
|
||||
overflow: hidden;
|
||||
}
|
||||
.daggerheart.dh-style.countdown fieldset {
|
||||
align-items: center;
|
||||
margin-top: 5px;
|
||||
|
|
@ -3208,7 +3211,7 @@ div.daggerheart.views.multiclass {
|
|||
.daggerheart.dh-style.countdown.minimized {
|
||||
height: auto !important;
|
||||
max-height: unset !important;
|
||||
max-width: 600px !important;
|
||||
max-width: 740px !important;
|
||||
width: auto !important;
|
||||
}
|
||||
.daggerheart.dh-style.countdown.minimized .window-content {
|
||||
|
|
@ -3247,26 +3250,45 @@ div.daggerheart.views.multiclass {
|
|||
.daggerheart.dh-style.countdown .hidden {
|
||||
display: none;
|
||||
}
|
||||
.daggerheart.dh-style.countdown .countdown-container {
|
||||
.daggerheart.dh-style.countdown .window-content > div {
|
||||
height: 100%;
|
||||
}
|
||||
.daggerheart.dh-style.countdown .window-content > div .expanded-view {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.daggerheart.dh-style.countdown .window-content > div .expanded-view .countdowns-container {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
flex-wrap: wrap;
|
||||
overflow: auto;
|
||||
max-height: 100%;
|
||||
}
|
||||
.daggerheart.dh-style.countdown .window-content > div .expanded-view .countdowns-container .countdown-fieldset {
|
||||
width: 340px;
|
||||
height: min-content;
|
||||
}
|
||||
.daggerheart.dh-style.countdown .window-content > div .expanded-view .countdowns-container .countdown-fieldset .countdown-container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 16px;
|
||||
}
|
||||
.daggerheart.dh-style.countdown .countdown-container img {
|
||||
.daggerheart.dh-style.countdown .window-content > div .expanded-view .countdowns-container .countdown-fieldset .countdown-container img {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.daggerheart.dh-style.countdown .countdown-container .countdown-inner-container {
|
||||
.daggerheart.dh-style.countdown .window-content > div .expanded-view .countdowns-container .countdown-fieldset .countdown-container .countdown-inner-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 4px;
|
||||
}
|
||||
.daggerheart.dh-style.countdown .countdown-container .countdown-inner-container .countdown-value-container {
|
||||
.daggerheart.dh-style.countdown .window-content > div .expanded-view .countdowns-container .countdown-fieldset .countdown-container .countdown-inner-container .countdown-value-container {
|
||||
display: flex;
|
||||
gap: 4px;
|
||||
}
|
||||
.daggerheart.dh-style.countdown .countdown-container .countdown-inner-container .countdown-value-container input {
|
||||
.daggerheart.dh-style.countdown .window-content > div .expanded-view .countdowns-container .countdown-fieldset .countdown-container .countdown-inner-container .countdown-value-container input {
|
||||
max-width: 80px;
|
||||
}
|
||||
.daggerheart.dh-style.setting fieldset {
|
||||
|
|
|
|||
|
|
@ -1,23 +1,26 @@
|
|||
<div>
|
||||
<div class="expanded-view {{#if minimized}}hidden{{/if}}">
|
||||
<div class="flexrow"><button data-action="addCountdown">{{localize "DAGGERHEART.Countdown.AddCountdown"}}</button></div>
|
||||
{{#each source.countdowns}}
|
||||
<fieldset>
|
||||
<legend>{{this.name}} <a><i class="fa-solid fa-trash icon-button" data-action="removeCountdown" data-countdown="{{@key}}"></i></a></legend>
|
||||
|
||||
<div class="countdown-container">
|
||||
<img src="{{this.img}}" data-action='editImage' data-countdown="{{@key}}" />
|
||||
<div class="countdown-inner-container">
|
||||
{{formGroup @root.countdownFields.name name=(concat @root.base ".countdowns." @key ".name") value=this.name localize=true}}
|
||||
<div class="countdown-value-container">
|
||||
{{formGroup @root.countdownFields.progress.fields.current name=(concat @root.base ".countdowns." @key ".progress.current") value=this.progress.current localize=true}}
|
||||
{{formGroup @root.countdownFields.progress.fields.max name=(concat @root.base ".countdowns." @key ".progress.max") value=this.progress.max localize=true}}
|
||||
<div class="countdowns-container">
|
||||
{{#each source.countdowns}}
|
||||
<fieldset class="countdown-fieldset">
|
||||
<legend>{{this.name}} <a><i class="fa-solid fa-trash icon-button" data-action="removeCountdown" data-countdown="{{@key}}"></i></a></legend>
|
||||
|
||||
<div class="countdown-container">
|
||||
<img src="{{this.img}}" data-action='editImage' data-countdown="{{@key}}" />
|
||||
<div class="countdown-inner-container">
|
||||
{{formGroup @root.countdownFields.name name=(concat @root.base ".countdowns." @key ".name") value=this.name localize=true}}
|
||||
<div class="countdown-value-container">
|
||||
{{formGroup @root.countdownFields.progress.fields.current name=(concat @root.base ".countdowns." @key ".progress.current") value=this.progress.current localize=true}}
|
||||
{{formGroup @root.countdownFields.progress.fields.max name=(concat @root.base ".countdowns." @key ".progress.max") value=this.progress.max localize=true}}
|
||||
</div>
|
||||
{{formGroup @root.countdownFields.progress.fields.type.fields.value name=(concat @root.base ".countdowns." @key ".progress.type.value") value=this.progress.type.value localize=true localize=true}}
|
||||
</div>
|
||||
{{formGroup @root.countdownFields.progress.fields.type.fields.value name=(concat @root.base ".countdowns." @key ".progress.type.value") value=this.progress.type.value localize=true localize=true}}
|
||||
</div>
|
||||
</div>
|
||||
</fieldset>
|
||||
{{/each}}
|
||||
</fieldset>
|
||||
{{/each}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="minimized-view {{#if (not minimized)}}hidden{{/if}}">
|
||||
{{#each source.countdowns}}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue