daggerheart/templates/ui/countdown-edit.hbs

<div>
    <div class="edit-container">
        <header class="dialog-header">
            <h1>{{localize "DAGGERHEART.APPLICATIONS.CountdownEdit.editTitle"}}</h1>
        </header>

        <div class="header-tools">
            <button class="header-main-button" data-action="addCountdown"><i class="fa-solid fa-plus"></i> {{localize "DAGGERHEART.APPLICATIONS.CountdownEdit.newCountdown"}}</button>
            <div class="hide-tools">
                <label>{{localize "DAGGERHEART.APPLICATIONS.CountdownEdit.hideNewCountdowns"}}</label>
                <input type="checkbox" name="hideNewCountdowns" {{checked hideNewCountdowns}} />
            </div>
            {{#if isGM}}
                <div class="default-ownership-tools">
                    <i class="fa-solid fa-eye" data-tooltip="{{localize "DAGGERHEART.APPLICATIONS.CountdownEdit.defaultOwnershipTooltip"}}"></i>
                    <select name="defaultOwnership">
                        {{selectOptions ownershipDefaultOptions selected=defaultOwnership labelAttr="label" valueAttr="value" localize=true}}
                    </select>
                </div>
            {{/if}}
        </div>

        <div class="edit-content">
            {{#each countdowns as | countdown id | }}
            <fieldset class="countdown-edit-outer-container">
                <div class="countdown-edit-container {{#unless countdown.editing}}viewing{{/unless}}" data-id="{{id}}">
                    <a data-action="editCountdownImage" id="{{id}}"><img src="{{countdown.img}}" /></a>
                    {{#unless countdown.editing}} 
                        <div class="countdown-edit-text">
                            <h4>{{countdown.name}}</h4>
                            <div class="countdown-edit-subtext">
                                <div class="countdown-edit-sub-tag">{{localize "DAGGERHEART.APPLICATIONS.CountdownEdit.currentCountdownCurrent" value=countdown.progress.current}}</div>
                                <div class="countdown-edit-sub-tag">{{localize "DAGGERHEART.APPLICATIONS.CountdownEdit.currentCountdownStart" value=countdown.progress.start}}</div>
                                <div class="countdown-edit-sub-tag">{{countdown.typeName}}</div>
                                <div class="countdown-edit-sub-tag">{{countdown.progress.typeName}}</div>

                                {{#unless (eq countdown.progress.looping "noLooping")}}
                                    <div class="countdown-edit-loop" data-tooltip="{{countdown.loopTooltip}}">
                                        <i class="fa-solid fa-repeat"></i>
                                        {{#if (eq countdown.progress.looping "increasing")}}
                                            <i class="loop-marker fa-solid fa-angles-up"></i>
                                        {{else if (eq countdown.progress.looping "decreasing")}}
                                            <i class="loop-marker fa-solid fa-angles-down"></i>
                                        {{/if}}
                                    </div>
                                {{/unless}}
                            </div>
                        </div>
                    {{else}}
                        <div class="countdown-edit-input">
                            <label>{{localize "Name"}}</label>
                            <input type="text" name="{{concat "countdowns." id ".name"}}" value="{{countdown.name}}" />
                        </div>
                    {{/unless}}
                    <div class="countdown-edit-tools {{#if countdown.editing}}same-row{{/if}}">
                        <a data-action="toggleCountdownEdit" data-countdown-id="{{id}}"><i class="fa-solid {{#unless countdown.editing}}fa-pen-to-square{{else}}fa-check{{/unless}}"></i></a>
                        <a data-action="editCountdownOwnership" data-countdown-id="{{id}}"><i class="fa-solid fa-users"></i></a>
                        <a data-action="removeCountdown" data-countdown-id="{{id}}"><i class="fa-solid fa-trash"></i></a>
                    </div>
                </div>
                {{#if countdown.editing}}
                    <div class="countdown-edit-row-container">
                        <div class="countdown-edit-subrow">
                            <div class="countdown-edit-input tiny">
                                <label>{{localize "DAGGERHEART.APPLICATIONS.CountdownEdit.current"}}</label>
                                <input type="number" name="{{concat "countdowns." id ".progress.current"}}" value="{{countdown.progress.current}}" />
                            </div>
                            <div class="countdown-edit-input tiny">
                                <label>{{localize "DAGGERHEART.APPLICATIONS.CountdownEdit.start"}}</label>
                                <input type="number" name="{{concat "countdowns." id ".progress.start"}}" value="{{countdown.progress.start}}" />
                            </div>
                            <div class="countdown-edit-input">
                                <label>{{localize "DAGGERHEART.APPLICATIONS.CountdownEdit.startFormula"}}</label>
                                <input class="countdown-random-input" type="text" name="{{concat "countdowns." id ".progress.startFormula"}}" value="{{countdown.progress.startFormula}}" />
                                <a class="countdown-random-button" data-action="randomiseCountdownStart" data-countdown-id="{{id}}" {{#unless countdown.randomizeValid}}disabled{{/unless}}><i class="fa-solid fa-dice fa-fw"></i></a>
                            </div>
                            
                        </div>
                        <div class="countdown-edit-subrow">
                            <div class="countdown-edit-input tiny type-input">
                                <label>{{localize "DAGGERHEART.APPLICATIONS.CountdownEdit.category"}}</label>
                                <select name="{{concat "countdowns." id ".type"}}">
                                    {{selectOptions ../countdownBaseTypes selected=countdown.type localize=true}}
                                </select>
                            </div>
                            <div class="countdown-edit-input">
                                <label>{{localize "DAGGERHEART.APPLICATIONS.CountdownEdit.progressionType"}}</label>
                                <select name="{{concat "countdowns." id ".progress.type"}}">
                                    {{selectOptions ../countdownProgressionTypes selected=countdown.progress.type localize=true}}
                                </select>
                            </div>
                            <div class="countdown-edit-input looping-input tiny">
                                <label>{{localize "DAGGERHEART.APPLICATIONS.CountdownEdit.looping"}}</label>
                                <select name="{{concat "countdowns." id ".progress.looping"}}">
                                    {{selectOptions ../countdownLoopingTypes selected=countdown.progress.looping localize=true}}
                                </select>
                            </div>
                        </div>
                    </div>
                {{/if}}
                </fieldset>
            {{/each}}
        </div>
    </div>
</div>