190 lines
8.2 KiB
Handlebars
190 lines
8.2 KiB
Handlebars
{{!-- templates/speed-die-panel.hbs --}}
|
||
<div class="sotc-bsa-panel" data-token-id="{{tokenId}}" data-combatant-id="{{combatantId}}">
|
||
|
||
{{!-- HEADER : icône + nom du token --}}
|
||
<div class="bsa-header">
|
||
<div class="bsa-token-info">
|
||
<img class="bsa-token-img open-sheet" src="{{tokenImg}}" alt="{{tokenName}}" title="{{localize 'SOTC_BSA.Panel.OpenSheet'}}" data-actor-id="{{actorId}}" />
|
||
<div class="bsa-token-name">
|
||
<span>{{tokenName}}</span>
|
||
{{#if isClone}}
|
||
<span class="bsa-die-index">Dé {{dieNumber}}</span>
|
||
{{/if}}
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
{{!-- STATS --}}
|
||
<div class="bsa-stats">
|
||
{{!-- PV --}}
|
||
<div class="bsa-stat-row">
|
||
<img class="bsa-stat-icon" src="systems/sotc/assets/sheets/HPIcon.webp" alt="HP" title="{{localize 'SOTC_BSA.Panel.HP'}}" />
|
||
<span class="bsa-stat-label">{{localize 'SOTC_BSA.Panel.HP'}}</span>
|
||
<div class="bsa-bar-wrap">
|
||
<div class="bsa-bar bsa-bar-hp" style="width: {{hpPercent}}%"></div>
|
||
</div>
|
||
<span class="bsa-stat-value">{{hpValue}} / {{hpMax}}</span>
|
||
</div>
|
||
{{!-- STAGGER --}}
|
||
<div class="bsa-stat-row">
|
||
<img class="bsa-stat-icon" src="systems/sotc/assets/sheets/StaggerIcon.webp" alt="Stagger" title="{{localize 'SOTC_BSA.Panel.Stagger'}}" />
|
||
<span class="bsa-stat-label">{{localize 'SOTC_BSA.Panel.Stagger'}}</span>
|
||
<div class="bsa-bar-wrap">
|
||
<div class="bsa-bar bsa-bar-stagger" style="width: {{staggerPercent}}%"></div>
|
||
</div>
|
||
<span class="bsa-stat-value">{{staggerValue}} / {{staggerMax}}</span>
|
||
</div>
|
||
{{!-- LUMIERE --}}
|
||
<div class="bsa-stat-row bsa-stat-simple">
|
||
<img class="bsa-stat-icon" src="systems/sotc/assets/sheets/LightIcon.webp" alt="Light" title="{{localize 'SOTC_BSA.Panel.Light'}}" />
|
||
<span class="bsa-stat-label">{{localize 'SOTC_BSA.Panel.Light'}}</span>
|
||
<span class="bsa-stat-value bsa-light-value">{{lightValue}} / {{lightMax}}</span>
|
||
</div>
|
||
{{!-- EMOTION --}}
|
||
<div class="bsa-stat-row bsa-stat-simple">
|
||
<img class="bsa-stat-icon" src="systems/sotc/assets/sheets/EmotionIcon.webp" alt="Emotion" title="{{localize 'SOTC_BSA.Panel.Emotion'}}" />
|
||
<span class="bsa-stat-label">{{localize 'SOTC_BSA.Panel.Emotion'}}</span>
|
||
<span class="bsa-stat-value bsa-emotion-value">{{emotion}}</span>
|
||
</div>
|
||
</div>
|
||
|
||
{{!-- COMPÉTENCE ASSIGNÉE --}}
|
||
<div class="bsa-assigned-section">
|
||
<div class="bsa-section-title">{{localize 'SOTC_BSA.Panel.AssignedSkill'}}</div>
|
||
{{#if assignedSkill}}
|
||
<div class="bsa-assigned-skill">
|
||
<img class="bsa-assigned-img" src="{{assignedSkill.img}}" alt="{{assignedSkill.name}}" />
|
||
<span class="bsa-assigned-name">{{assignedSkill.name}}</span>
|
||
<button class="bsa-btn bsa-btn-unassign" data-action="unassign">✕</button>
|
||
</div>
|
||
{{else}}
|
||
<div class="bsa-assigned-none">— {{localize 'SOTC_BSA.Panel.None'}} —</div>
|
||
{{/if}}
|
||
{{#if hasArrows}}
|
||
<button class="bsa-btn bsa-btn-remove-arrows" title="{{localize 'SOTC_BSA.Panel.RemoveArrows'}}">
|
||
🗑 {{localize 'SOTC_BSA.Panel.RemoveArrows'}}
|
||
</button>
|
||
{{/if}}
|
||
</div>
|
||
|
||
{{!-- ONGLETS COMPÉTENCES --}}
|
||
<div class="bsa-tabs">
|
||
<button class="bsa-tab active" data-tab="skills">{{localize 'SOTC_BSA.Panel.SkillsTab'}}</button>
|
||
<button class="bsa-tab" data-tab="ego">{{localize 'SOTC_BSA.Panel.EgoTab'}}</button>
|
||
</div>
|
||
|
||
{{!-- LISTE DES COMPÉTENCES --}}
|
||
<div class="bsa-tab-content bsa-tab-skills active">
|
||
{{#if skills.length}}
|
||
{{#each skills}}
|
||
<div class="bsa-skill-row {{#if this.selected}}bsa-skill-selected{{/if}}" data-skill-id="{{this.id}}">
|
||
<img class="bsa-skill-img" src="{{this.img}}" alt="{{this.name}}" />
|
||
<div class="bsa-skill-info">
|
||
<span class="bsa-skill-name">{{this.name}}</span>
|
||
<div class="bsa-skill-costs">
|
||
{{#if this.lightCost}}
|
||
<span class="bsa-cost bsa-cost-light {{#unless this.canAffordLight}}bsa-cost-insufficient{{/unless}}">
|
||
✦ {{this.lightCost}}
|
||
</span>
|
||
{{/if}}
|
||
{{#if this.emotionCost}}
|
||
<span class="bsa-cost bsa-cost-emotion {{#unless this.canAffordEmotion}}bsa-cost-insufficient{{/unless}}">
|
||
◆ {{this.emotionCost}}
|
||
</span>
|
||
{{/if}}
|
||
{{#if (gt this.weight 1)}}
|
||
<span class="bsa-cost bsa-cost-weight" title="Attack Weight : {{this.weight}} cibles">
|
||
⚖ {{this.weight}}
|
||
</span>
|
||
{{/if}}
|
||
</div>
|
||
</div>
|
||
<button class="bsa-btn bsa-btn-assign" data-action="assign" data-skill-id="{{this.id}}" title="{{localize 'SOTC_BSA.Panel.Assign'}}">
|
||
＋
|
||
</button>
|
||
</div>
|
||
{{/each}}
|
||
{{else}}
|
||
<div class="bsa-empty">{{localize 'SOTC_BSA.Panel.NoSkills'}}</div>
|
||
{{/if}}
|
||
</div>
|
||
|
||
{{!-- LISTE EGO --}}
|
||
<div class="bsa-tab-content bsa-tab-ego">
|
||
{{#if egos.length}}
|
||
{{#each egos}}
|
||
<div class="bsa-skill-row {{#if this.selected}}bsa-skill-selected{{/if}}" data-skill-id="{{this.id}}">
|
||
<img class="bsa-skill-img" src="{{this.img}}" alt="{{this.name}}" />
|
||
<div class="bsa-skill-info">
|
||
<span class="bsa-skill-name">{{this.name}}</span>
|
||
<div class="bsa-skill-costs">
|
||
{{#if this.lightCost}}
|
||
<span class="bsa-cost bsa-cost-light {{#unless this.canAffordLight}}bsa-cost-insufficient{{/unless}}">
|
||
✦ {{this.lightCost}}
|
||
</span>
|
||
{{/if}}
|
||
{{#if this.emotionCost}}
|
||
<span class="bsa-cost bsa-cost-emotion {{#unless this.canAffordEmotion}}bsa-cost-insufficient{{/unless}}">
|
||
◆ {{this.emotionCost}}
|
||
</span>
|
||
{{/if}}
|
||
{{#if (gt this.weight 1)}}
|
||
<span class="bsa-cost bsa-cost-weight" title="Attack Weight : {{this.weight}} cibles">
|
||
⚖ {{this.weight}}
|
||
</span>
|
||
{{/if}}
|
||
</div>
|
||
</div>
|
||
<button class="bsa-btn bsa-btn-assign" data-action="assign" data-skill-id="{{this.id}}" title="{{localize 'SOTC_BSA.Panel.Assign'}}">
|
||
＋
|
||
</button>
|
||
</div>
|
||
{{/each}}
|
||
{{else}}
|
||
<div class="bsa-empty">{{localize 'SOTC_BSA.Panel.NoEgo'}}</div>
|
||
{{/if}}
|
||
</div>
|
||
|
||
{{!-- APERÇU DES DÉS DE LA COMPÉTENCE SÉLECTIONNÉE --}}
|
||
{{#if selectedSkillPreview}}
|
||
<div class="bsa-dice-preview">
|
||
<div class="bsa-section-title">{{localize 'SOTC_BSA.Panel.DicePreview'}}</div>
|
||
{{#if selectedSkillPreview.modules}}
|
||
<div class="bsa-skill-modules">{{selectedSkillPreview.modules}}</div>
|
||
{{/if}}
|
||
<div class="bsa-dice-list">
|
||
{{#each selectedSkillPreview.dice}}
|
||
<div class="bsa-die-entry">
|
||
<img class="bsa-die-type-img" src="systems/sotc/assets/dice types/{{this.type}}.png" alt="{{this.type}}" />
|
||
<span class="bsa-die-formula">{{this.formula}}</span>
|
||
{{#if this.mods.length}}
|
||
<span class="bsa-die-tags">
|
||
{{#each this.mods}}[{{this}}]{{/each}}
|
||
</span>
|
||
{{/if}}
|
||
</div>
|
||
{{/each}}
|
||
</div>
|
||
</div>
|
||
{{/if}}
|
||
|
||
{{!-- GESTION MANUELLE DE L'ÉTAT --}}
|
||
<div class="bsa-state-section">
|
||
<div class="bsa-section-title">{{localize 'SOTC_BSA.Panel.DieState'}}</div>
|
||
<div class="bsa-state-buttons">
|
||
<button class="bsa-state-btn {{#if (eq dieState 0)}}active{{/if}}" data-state="0" {{#if assignedSkill}}disabled{{/if}}>
|
||
{{localize 'SOTC_BSA.Panel.StateUnused'}}
|
||
</button>
|
||
<button class="bsa-state-btn {{#if (eq dieState 1)}}active{{/if}}" data-state="1" {{#if assignedSkill}}disabled{{/if}}>
|
||
{{localize 'SOTC_BSA.Panel.StateUsed'}}
|
||
</button>
|
||
<button class="bsa-state-btn {{#if (eq dieState 2)}}active{{/if}}" data-state="2" {{#if assignedSkill}}disabled{{/if}}>
|
||
{{localize 'SOTC_BSA.Panel.StateSaved'}}
|
||
</button>
|
||
<button class="bsa-state-btn {{#if (eq dieState 3)}}active{{/if}}" data-state="3" {{#if assignedSkill}}disabled{{/if}}>
|
||
{{localize 'SOTC_BSA.Panel.StateAssigned'}}
|
||
</button>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|