Merge pull request #13251 from joshforisha/roll-for-shoes/show-dice

[Roll for Shoes] Update custom roll template to display dice rolls
Roll20 · Aug 29, 2024 · bd4d0ca · bd4d0ca
2 parents 0fa4dd7 + c4ad2b3
commit bd4d0ca
Show file tree

Hide file tree

Showing 2 changed files with 83 additions and 9 deletions.
diff --git a/Roll for Shoes/sheet.html b/Roll for Shoes/sheet.html
@@ -25,6 +25,25 @@ <h3>Statuses</h3>
   </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}}
+      </span>
+      <span class="sheet-template-result">{{computed::result}}</span>
+    </div>
+  </div>
+</rolltemplate>
+
 <script type="text/worker">
   function useAttr(key, cb) {
     useAttrs([key], (attrs) => {
@@ -43,12 +62,22 @@ <h3>Statuses</h3>
       const rating = parseInt(ratingString)
       if (rating === 0) return
 
-      const rollQuery = rating > 0
-        ? `${rating}d6`
-        : `${Math.abs(rating)}d6kl1`
+      let rollQuery = `&{template:action} {{name=${skillName} ${rating}}} {{result=[[0+(?{Modifier|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)
 
-      startRoll(`&{template:default} {{name=${skillName} ${rating}}} {{result=[[${rollQuery}+?{Modifier}]]}}`, ({ rollId }) => {
-        finishRoll(rollId)
+        const result = rating > 0
+          ? rollResults.reduce((total, x) => total + x, 0) + results.result.result
+          : rollResults.reduce((low, x) => low === null || x < low ? x : low, null) + results.result.result
+
+        finishRoll(rollId, { result })
       })
     })
   })
@@ -65,7 +94,3 @@ <h3>Statuses</h3>
     })
   })
 </script>
-
-
-
-
diff --git a/Roll for Shoes/styles.css b/Roll for Shoes/styles.css
@@ -51,3 +51,52 @@
     }
   }
 }
+
+.sheet-rolltemplate-action .sheet-template-container {
+  background-color: #323232;
+  border-radius: 5px;
+  display: flex;
+  flex-direction: column;
+}
+
+.sheet-rolltemplate-action .sheet-template-container .sheet-template-header {
+  background-color: #474787;
+  border-top-left-radius: 5px;
+  border-top-right-radius: 5px;
+  color: #fafafa;
+  font-weight: 700;
+  padding: 5px 10px;
+}
+
+.sheet-rolltemplate-action .sheet-template-container .sheet-template-results {
+  display: flex;
+  justify-content: space-between;
+  padding: 15px 10px;
+}
+
+.sheet-rolltemplate-action .sheet-template-container .sheet-template-results .sheet-template-rolls .inlinerollresult {
+  background-color: #cccced;
+  border-color: #cccced;
+  border-radius: 2px;
+
+  &.fullcrit {
+    background-color: #99cbe0;
+    border-color: #99cbe0;
+  }
+
+  &.fullfail {
+    border-color: #cccced;
+  }
+}
+
+.sheet-rolltemplate-action .sheet-template-container .sheet-template-results .sheet-template-result {
+  font-size: 1.5em;
+
+  .inlinerollresult {
+    background-color: #cccced;
+    border-color: #cccced;
+    border-radius: 2px;
+    padding-left: 8px;
+    padding-right: 8px;
+  }
+}