Merge pull request #50 from ben/ben/compact-character-sheet

Compact character sheet

CHANGELOG.md

@@ -3,6 +3,7 @@
 ## In progress
 
 - Fix the asset-sheet delete button ([#51](https://github.com/ben/foundry-ironsworn/pull/51))
+- Add a compact character sheet ([#50](https://github.com/ben/foundry-ironsworn/pull/50))
 
 ## 0.4.5
 

src/index.ts

@@ -5,6 +5,7 @@
 import { IRONSWORN } from './config'
 import { IronswornActor } from './module/actor/actor'
 import { IronswornCharacterSheet } from './module/actor/sheets/charactersheet'
+import { IronswornCompactCharacterSheet } from './module/actor/sheets/compactsheet'
 import { IronswornHandlebarsHelpers } from './module/helpers/handlebars'
 import { IronswornSettings } from './module/helpers/settings'
 import { TemplatePreloader } from './module/helpers/templatepreloader'
@@ -41,6 +42,9 @@ Hooks.once('init', async () => {
     types: ['character'],
     makeDefault: true,
   })
+  Actors.registerSheet('ironsworn', IronswornCompactCharacterSheet, {
+    types: ['character'],
+  })
 
   Items.registerSheet('ironsworn', AssetSheet, {
     types: ['asset'],

src/module/actor/actortypes.ts

@@ -34,7 +34,7 @@ interface CharacterActorData extends Actor.Data<IronswornCharacterData, Ironswor
 interface SharedData {}
 
 interface SharedActorData extends Actor.Data<SharedData, IronswornItemData> {
-  type: 'character'
+  type: 'shared'
 }
 
 export type IronswornActorData = CharacterActorData | SharedActorData

src/module/actor/sheets/compactsheet.ts

@@ -0,0 +1,133 @@
+import { ironswornMoveRoll } from '../../helpers/roll'
+import { IronswornSettings } from '../../helpers/settings'
+import { capitalize } from '../../helpers/util'
+import { IronswornActor } from '../actor'
+import { IronswornCharacterData } from '../actortypes'
+import { CharacterMoveSheet } from './charactermovesheet'
+import { CharacterSheetOptions } from './charactersheet'
+
+export interface CompactCharacterSheetOptions extends BaseEntitySheet.Options {
+  statRollBonus: number
+}
+
+
+export class IronswornCompactCharacterSheet extends ActorSheet<ActorSheet.Data<IronswornActor>, IronswornActor, CompactCharacterSheetOptions> {
+  constructor(actor, opts: CompactCharacterSheetOptions) {
+    opts.statRollBonus ||= 0
+    super(actor, opts)
+  }
+
+  static get defaultOptions() {
+    return mergeObject(super.defaultOptions, {
+      classes: ['ironsworn', 'sheet', 'actor', `theme-${IronswornSettings.theme}`],
+      width: 560,
+      height: 228,
+      template: 'systems/foundry-ironsworn/templates/actor/compact.hbs',
+      resizable: false,
+    } as CharacterSheetOptions)
+  }
+
+  activateListeners(html: JQuery) {
+    super.activateListeners(html)
+
+    html.find('.ironsworn__stat__roll').on('click', (e) => this._onStatRoll.call(this, e))
+    html.find('.ironsworn__stat__bonusadajust').on('click', (e) => this._bonusAdjust.call(this, e))
+    html.find('.ironsworn__resource__adjust').on('click', (e) => this._resourceAdjust.call(this, e))
+    html.find('.ironsworn__momentum__burn').on('click', (e) => this._momentumBurn.call(this, e))
+  }
+
+  getData() {
+    let data: any = super.getData()
+
+    // Allow every itemtype to add data to the actorsheet
+    for (const itemType of CONFIG.IRONSWORN.itemClasses) {
+      data = itemType.getActorSheetData(data, this)
+    }
+
+    return data
+  }
+
+  _getHeaderButtons() {
+    return [
+      {
+        class: 'ironsworn-open-move-sheet',
+        label: 'Moves',
+        icon: 'fas fa-directions',
+        onclick: (e) => this._openMoveSheet(e),
+      },
+      ...super._getHeaderButtons(),
+    ]
+  }
+
+  _openMoveSheet(e?: JQuery.ClickEvent) {
+    e?.preventDefault()
+
+    if (this.actor.moveSheet) {
+      this.actor.moveSheet.render(true, { focus: true } as any) // TODO: fix this cast
+    } else {
+      new CharacterMoveSheet(this.actor).render(true)
+    }
+  }
+
+  _onBurnMomentum(ev: JQuery.ClickEvent) {
+    ev.preventDefault()
+
+    const { momentum, momentumReset } = this.actor.data.data as IronswornCharacterData
+    if (momentum > momentumReset) {
+      this.actor.update({
+        data: { momentum: momentumReset },
+      })
+    }
+  }
+
+  _bonusAdjust(ev: JQuery.ClickEvent) {
+    ev.preventDefault()
+
+    const amt = parseInt(ev.currentTarget.dataset.amt || '0')
+    this.options.statRollBonus += amt
+    this.render(true)
+  }
+
+  async _onStatRoll(ev: JQuery.ClickEvent) {
+    ev.preventDefault()
+
+    const el = ev.currentTarget
+    const stat = el.dataset.stat
+    if (stat) {
+      const actorData = this.actor.data.data as IronswornCharacterData
+      const bonus = this.options.statRollBonus || 0
+      const rollText = game.i18n.localize('IRONSWORN.Roll')
+      const statText = game.i18n.localize(`IRONSWORN.${capitalize(stat)}`)
+      const title = `${rollText} +${statText}`
+      await ironswornMoveRoll(`@${stat}+${bonus}`, actorData, title)
+      this.options.statRollBonus = 0
+      this.render(true)
+    }
+  }
+
+  _resourceAdjust(ev: JQuery.ClickEvent) {
+    ev.preventDefault()
+
+    const amt = parseInt(ev.currentTarget.dataset.amt || '0')
+    const min = parseInt(ev.currentTarget.dataset.min || '-100')
+    const max = parseInt(ev.currentTarget.dataset.max || '100')
+    const { stat } = ev.currentTarget.dataset
+    const actorData = this.actor.data.data as IronswornCharacterData
+    let value = actorData[stat]
+    value += amt
+    if (value >= min && value <= max) {
+      this.actor.update({ data: { [stat]: value } })
+    }
+  }
+
+  _momentumBurn(ev: JQuery.ClickEvent) {
+    ev.preventDefault()
+
+    const { momentum, momentumReset } = this.actor.data.data as IronswornCharacterData
+    if (momentum > momentumReset) {
+      this.actor.update({
+        data: { momentum: momentumReset },
+      })
+    }
+  }
+}

src/styles/styles.less

@@ -256,6 +256,38 @@
     }
   }
 
+  .compact {
+    h3, h4, h5 {
+      margin: 3px 0;
+    }
+
+    .boxgroup {
+      border: 1px solid;
+      border-radius: 5px;
+
+      .boxrow {
+        border-top: 1px solid;
+        &:first-child {
+          border-top: none;
+        }
+
+        &.small {
+          flex-basis: 25px;
+          line-height: 25px;
+          flex-grow: 0;
+        }
+      }
+
+      .box {
+        text-align: center;
+        border-left: 1px solid;
+        &:first-child {
+          border-left: none;
+        }
+      }
+    }
+  }
+
   .inset {
     margin: 5px;
     padding: 5px;
@@ -387,7 +419,6 @@
 
 .ironsworn.sheet.actor {
   min-width: 560px;
-  min-height: 420px;
 }
 
 .ironsworn.sheet.item {

src/styles/themes/ironsworn.less

@@ -141,6 +141,12 @@
     }
   }
 
+  .compact {
+    .bordergroup {
+      border-color: black;
+    }
+  }
+
   .ironsworn-roll {
     .dice-formula,
     .dice-total {

src/styles/themes/starforged.less

@@ -132,6 +132,12 @@ body {
   }
 }
 
+.compact {
+  .bordergroup {
+    border-color: @light-color;
+  }
+}
+
 .ironsworn-roll .roll {
   background-image: url('systems/foundry-ironsworn/assets/d6.svg');
 }

system/lang/en.json

@@ -255,6 +255,7 @@
     "DeleteProgress": "Delete Progress",
     "DeleteAsset": "Delete Asset",
     "ConfirmDelete": "Are you sure? This cannot be undone.",
+    "StatBonusTooltip": "Bonus for the next stat roll",
     "Settings": {
       "Theme": {
         "Name": "Visual Theme",

system/templates/actor/compact.hbs

@@ -0,0 +1,72 @@
+<form class="{{cssClass}} flexcol compact" autocomplete="off">
+  {{!-- Stats --}}
+  <div class="flexcol boxgroup" style="margin: 5px;">
+    <div class="flexrow boxrow">
+      {{#*inline "stat"}}
+      <div class="box clickable block ironsworn__stat__roll" data-stat="{{stat}}">
+        <h4>{{localize (concat 'IRONSWORN.' (capitalize stat))}}</h4>
+        <h3>{{lookup data.data stat}}</h3>
+      </div>
+      {{/inline}}
+
+      {{>stat stat="edge"}}
+      {{>stat stat="heart"}}
+      {{>stat stat="iron"}}
+      {{>stat stat="shadow"}}
+      {{>stat stat="wits"}}
+    </div>
+    <div class="flexrow boxrow small">
+      <div class="box clickable block ironsworn__stat__bonusadajust" data-amt="-1">&minus;</div>
+      <div class="box" title="{{localize 'IRONSWORN.StatBonusTooltip'}}">
+        {{options.statRollBonus}}
+      </div>
+      <div class="box clickable block ironsworn__stat__bonusadajust" data-amt="1">&plus;</div>
+    </div>
+  </div>
+
+  {{!-- Resources --}}
+  <div class="flexcol boxgroup" style="margin: 5px;">
+    <div class="flexrow boxrow">
+      {{#*inline "resource"}}
+      <div class="box flexcol">
+        <div class="flexcol boxrow clickable block ironsworn__stat__roll" data-stat="{{stat}}">
+          <h5>{{localize (concat 'IRONSWORN.' (capitalize stat))}}</h5>
+          <h4>{{lookup data.data stat}}</h4>
+        </div>
+        <div class="flexrow boxrow small">
+          <div class="box clickable block ironsworn__resource__adjust" data-stat="{{stat}}" data-amt="-1"
+            data-min="{{min}}">&minus;</div>
+          {{#if burn}}
+          <div class="box clickable block ironsworn__momentum__burn" style="padding: 0 5px;">{{localize
+            'IRONSWORN.Burn'}}</div>
+          {{/if}}
+          <div class="box clickable block ironsworn__resource__adjust" data-stat="{{stat}}" data-amt="1"
+            data-max="{{max}}">&plus;</div>
+        </div>
+      </div>
+      {{/inline}}
+
+      {{>resource stat="momentum" min=-6 max=actor.data.data.momentumMax burn=true}}
+      {{>resource stat="health" min=0 max=5}}
+      {{>resource stat="spirit" min=0 max=5}}
+      {{>resource stat="supply" min=0 max=5}}
+    </div>
+  </div>
+
+  {{!-- Debilities --}}
+  <div class="flexcol">
+    {{#*inline "debility"}}
+    <label class="checkbox">
+      <input type="checkbox" name="data.debility.{{name}}" {{checked (lookup data.data.debility name)}}>
+      {{capitalize name}}
+    </label>
+    {{/inline}}
+
+    <div class="flexrow nogrow" style="padding: 0 1em;">
+      {{>debility name="wounded"}}
+      {{>debility name="unprepared"}}
+      {{>debility name="shaken"}}
+      {{>debility name="encumbered"}}
+    </div>
+  </div>
+</form>