roll20-character-sheets/Roll for Shoes/sheet.html

<div class="main">
  <section>
    <label>
      <span>Name:</span>
      <input name="attr_name" type="text" />
    </label>
    <label>
      <span>XP:</span>
      <input min="0" name="attr_xp" type="number" />
    </label>
    <h3>Skills</h3>
    <fieldset class="repeating_skills">
      <input name="attr_name" placeholder="Enter skill name" type="text" />
      <input max="10" min="-10" name="attr_rating" type="number" value="2" />
      <button class="btn" name="act_skillcheck" type="action"></button>
    </fieldset>
  </section>
  <section>
    <textarea name="attr_notes" placeholder="Enter notes" rows="2"></textarea>
    <h3>Statuses</h3>
    <fieldset class="repeating_statuses">
      <input max="10" min="-10" name="attr_rating" type="number" value="0" />
      <input name="attr_name" placeholder="Enter status name" type="text" />
    </fieldset>
  </section>
</div>

<rolltemplate class="sheet-rolltemplate-action">
  <div class="sheet-template-container">
    <div class="sheet-template-header">{{name}}</div>
    <div class="sheet-template-results">
      <span class="sheet-template-rolls">
        {{roll1}}
        {{roll2}}
        {{roll3}}
        {{roll4}}
        {{roll5}}
        {{roll6}}
        {{roll7}}
        {{roll8}}
        {{#rollLess() modifier 0}}
          <span class="sheet-template-action-modifier-bad">{{modifier}}</span>
        {{/rollLess() modifier 0}}
        {{#rollGreater() modifier 0}}
          <span class="sheet-template-action-modifier-good">{{modifier}}</span>
        {{/rollGreater() modifier 0}}
      </span>
      <span class="sheet-template-result">{{computed::result}}</span>
    </div>
  </div>
</rolltemplate>

<script type="text/worker">
  function useAttr(key, cb) {
    useAttrs([key], (attrs) => {
      cb(attrs.at(0))
    })
  }

  function useAttrs(keys, cb) {
    getAttrs(keys, (attrs) => {
      cb(Object.values(attrs))
    })
  }

  on('clicked:repeating_skills:skillcheck', () => {
    useAttrs(['repeating_skills_name', 'repeating_skills_rating'], ([skillName, ratingString]) => {
      const rating = parseInt(ratingString)
      if (rating === 0) return

      let rollQuery = `&{template:action} {{name=${skillName} ${rating}}} {{modifier=[[0+(?{Modifier|0})]]}} {{result=[[0]]}}`
      const numDice = Math.abs(rating)
      for (let i = 1; i <= numDice; i++) {
        rollQuery += ` {{roll${i}=[[1d6]]}}`
      }

      startRoll(rollQuery, ({ results, rollId }) => {
        const rollResults = Object.entries(results)
          .filter(([key]) => key.startsWith('roll'))
          .map(([, { result }]) => result)

        const result = rating > 0
          ? rollResults.reduce((total, x) => total + x, 0) + results.modifier.result
          : rollResults.reduce((low, x) => low === null || x < low ? x : low, null) + results.modifier.result

        finishRoll(rollId, { result })
      })
    })
  })

  on('sheet:opened', () => {
    useAttr('initialized', (initialized) => {
      if (initialized) return

      const attrs = { initialized: true, xp: 0 }
      const id = generateRowID()
      attrs[`repeating_skills_${id}_name`] = 'Do Anything'
      attrs[`repeating_skills_${id}_rating`] = 1
      setAttrs(attrs)
    })
  })
</script>