roll actions

2021-01-05 00:04:10 -05:00
parent 7879b732c3
commit 3c19c01b5a
3 changed files with 169 additions and 18 deletions
@@ -649,6 +649,14 @@ select {
  height: revert;
 }

+button[type="roll"] {
+  padding: 0;
+  font: inherit;
+  border: 0;
+  background: transparent;
+  line-height: 1em;
+}
+
 .charsheet label input[type=checkbox], .charsheet label input[type=radio] {
  position: absolute;
 }
@@ -852,7 +860,7 @@ button.sheet-toggle {
  text-transform: none;
  border-style: none;
  padding: 0;
-  background: transparent;
+  background: white;
  cursor: pointer;
 }

@@ -951,6 +959,10 @@ button.sheet-diamond {
  /* scale down to match square's footprint */
 } 

+button.sheet-symbol, button.sheet-arrow {
+  background: transparent;
+}
+
 button.sheet-symbol > span {
  font-family: pictos;
  opacity: 0.35;
@@ -1629,4 +1641,57 @@ fieldset.repeating_projects ~ .repcontainer > .repitem .sheet-clock-container {

 .charsheet .repcontrol button.repcontrol_edit::after, .charsheet .repcontrol button.repcontrol_add::after {
  font-size: 12px;
+}
+
+.sheet-rolltemplate-basic {
+  font-family: 'bitter', var(--default-fonts);
+  /* border: 1px solid black; */
+  background: #f0f0f0;
+}
+
+.sheet-rolltemplate-basic div {
+  padding: 3px;
+}
+
+.sheet-rolltemplate-basic .sheet-character {
+  font-size: large;
+  background: darkgray;
+}
+
+.sheet-rolltemplate-basic .sheet-action {
+  background: lightgray;
+  font-style: italic;
+}
+
+.sheet-rolltemplate-basic .sheet-roll {
+  display: grid;
+  justify-content: center;
+  grid-template-columns: repeat(auto-fit, 2.1em);
+  grid-auto-rows: 2.1em;
+  gap: 5px;
+}
+
+.sheet-rolltemplate-basic .inlinerollresult {
+  font-size: 1.5em;
+  font-weight: normal;
+  text-align: center;
+  line-height: .5em;
+  background: #3D478A;
+  border-color: #3D478A;
+  color: #DFD6CA;
+  padding: 25% 0;
+}
+
+.sheet-rolltemplate-basic .inlinerollresult.fullfail {
+  background: #7A7A7A;
+  border-color: #7A7A7A;
+}
+
+.sheet-rolltemplate-basic .inlinerollresult.fullcrit {
+  background: #9F3727;
+  border-color: #9F3727;
+}
+
+.sheet-rolltemplate-basic .sheet-zero {
+  text-align: right;
 }
@@ -331,6 +331,7 @@
            <input type="hidden" name="attr_minion-action" value="0" class="action"/>
            <button type="action" name="act_minion-action1" class="square toggle action1"></button>
            <button type="action" name="act_minion-action2" class="square toggle action2"></button>
+            <input type="hidden" name="act_minion-action-roll"/>
            <select name="attr_minion-action-name">
              <option value="Scan" data-i18n="scan">Scan</option>
              <option value="Tinker" data-i18n="tinker">Tinker</option>
@@ -607,21 +608,30 @@
          <button type="action" name="act_scan1" class="practice square toggle action1"></button>
          <button type="action" name="act_scan2" class="square toggle action2"></button>
          <button type="action" name="act_scan3" class="square toggle action3"></button>
-          <span data-i18n="scan">Scan</span> &nbsp; <em class="normal" data-i18n="perceptively"> / perceptively</em>
+          <input type="hidden" name="attr_scan-roll"/>
+          <button type="roll" name="roll_scan" value="&{template:basic} {{character=@{character_name}}} {{action=^{scan}}} @{scan-roll}">
+            <span data-i18n="scan">Scan</span>
+          </button> &nbsp; <em class="normal" data-i18n="perceptively"> / perceptively</em>
        </div>
        <div class="header">
          <input type="hidden" name="attr_tinker" value="0" class="action"/>
          <button type="action" name="act_tinker1" class="practice square toggle action1"></button>
          <button type="action" name="act_tinker2" class="square toggle action2"></button>
          <button type="action" name="act_tinker3" class="square toggle action3"></button>
-          <span data-i18n="tinker">Tinker</span> &nbsp; <em class="normal" data-i18n="cleverly"> / cleverly</em>
+          <input type="hidden" name="attr_tinker-roll"/>
+          <button type="roll" name="roll_tinker" value="&{template:basic} {{character=@{character_name}}} {{action=^{tinker}}} @{tinker-roll}">
+            <span data-i18n="tinker">Tinker</span>
+          </button> &nbsp; <em class="normal" data-i18n="cleverly"> / cleverly</em>
        </div>
        <div class="header">
          <input type="hidden" name="attr_trick" value="0" class="action"/>
          <button type="action" name="act_trick1" class="practice square toggle action1"></button>
          <button type="action" name="act_trick2" class="square toggle action2"></button>
          <button type="action" name="act_trick3" class="square toggle action3"></button>
-          <span data-i18n="trick">Trick</span> &nbsp; <em class="normal" data-i18n="slyly"> / slyly</em>
+          <input type="hidden" name="attr_trick-roll"/>
+          <button type="roll" name="roll_trick" value="&{template:basic} {{character=@{character_name}}} {{action=^{trick}}} @{trick-roll}">
+            <span data-i18n="trick">Trick</span>
+          </button> &nbsp; <em class="normal" data-i18n="slyly"> / slyly</em>
        </div>
      </div>
      <div class="attribute">
@@ -636,21 +646,30 @@
          <button type="action" name="act_finesse1" class="practice square toggle action1"></button>
          <button type="action" name="act_finesse2" class="square toggle action2"></button>
          <button type="action" name="act_finesse3" class="square toggle action3"></button>
-          <span data-i18n="finesse">Finesse</span> &nbsp; <em class="normal" data-i18n="precisely"> / precisely</em>
+          <input type="hidden" name="attr_finesse-roll"/>
+          <button type="roll" name="roll_finesse" value="&{template:basic} {{character=@{character_name}}} {{action=^{finesse}}} @{finesse-roll}">
+            <span data-i18n="finesse">Finesse</span>
+          </button> &nbsp; <em class="normal" data-i18n="precisely"> / precisely</em>
        </div>
        <div class="header">
          <input type="hidden" name="attr_skulk" value="0" class="action"/>
          <button type="action" name="act_skulk1" class="practice square toggle action1"></button>
          <button type="action" name="act_skulk2" class="square toggle action2"></button>
          <button type="action" name="act_skulk3" class="square toggle action3"></button>
-          <span data-i18n="skulk">Skulk</span> &nbsp; <em class="normal" data-i18n="sneakily"> / sneakily</em>
+          <input type="hidden" name="attr_skulk-roll"/>
+          <button type="roll" name="roll_skulk" value="&{template:basic} {{character=@{character_name}}} {{action=^{skulk}}} @{skulk-roll}">
+            <span data-i18n="skulk">Skulk</span>
+          </button> &nbsp; <em class="normal" data-i18n="sneakily"> / sneakily</em>
        </div>
        <div class="header">
          <input type="hidden" name="attr_smash" value="0" class="action"/>
          <button type="action" name="act_smash1" class="practice square toggle action1"></button>
          <button type="action" name="act_smash2" class="square toggle action2"></button>
          <button type="action" name="act_smash3" class="square toggle action3"></button>
-          <span data-i18n="smash">Smash</span> &nbsp; <em class="normal" data-i18n="powerfully"> / powerfully</em>
+          <input type="hidden" name="attr_smash-roll"/>
+          <button type="roll" name="roll_smash" value="&{template:basic} {{character=@{character_name}}} {{action=^{smash}}} @{smash-roll}">
+            <span data-i18n="smash">Smash</span>
+          </button> &nbsp; <em class="normal" data-i18n="powerfully"> / powerfully</em>
        </div>
      </div>
      <div class="attribute">
@@ -665,21 +684,30 @@
          <button type="action" name="act_banter1" class="practice square toggle action1"></button>
          <button type="action" name="act_banter2" class="square toggle action2"></button>
          <button type="action" name="act_banter3" class="square toggle action3"></button>
-          <span data-i18n="banter">Banter</span> &nbsp; <em class="normal" data-i18n="affably"> / affably</em>
+          <input type="hidden" name="attr_banter-roll"/>
+          <button type="roll" name="roll_banter" value="&{template:basic} {{character=@{character_name}}} {{action=^{banter}}} @{banter-roll}">
+            <span data-i18n="banter">Banter</span>
+          </button> &nbsp; <em class="normal" data-i18n="affably"> / affably</em>
        </div>
        <div class="header">
          <input type="hidden" name="attr_invoke" value="0" class="action"/>
          <button type="action" name="act_invoke1" class="practice square toggle action1"></button>
          <button type="action" name="act_invoke2" class="square toggle action2"></button>
          <button type="action" name="act_invoke3" class="square toggle action3"></button>
-          <span data-i18n="invoke">Invoke</span> &nbsp; <em class="normal" data-i18n="magically"> / magically</em>
+          <input type="hidden" name="attr_invoke-roll"/>
+          <button type="roll" name="roll_invoke" value="&{template:basic} {{character=@{character_name}}} {{action=^{invoke}}} @{invoke-roll}">
+            <span data-i18n="invoke">Invoke</span>
+          </button> &nbsp; <em class="normal" data-i18n="magically"> / magically</em>
        </div>
        <div class="header">
          <input type="hidden" name="attr_threaten" value="0" class="action"/>
          <button type="action" name="act_threaten1" class="practice square toggle action1"></button>
          <button type="action" name="act_threaten2" class="square toggle action2"></button>
          <button type="action" name="act_threaten3" class="square toggle action3"></button>
-          <span data-i18n="threaten">Threaten</span> &nbsp; <em class="normal" data-i18n="forcefully"> / forcefully</em>
+          <input type="hidden" name="attr_threaten-roll"/>
+          <button type="roll" name="roll_threaten" value="&{template:basic} {{character=@{character_name}}} {{action=^{threaten}}} @{threaten-roll}">
+            <span data-i18n="threaten">Threaten</span>
+          </button> &nbsp; <em class="normal" data-i18n="forcefully"> / forcefully</em>
        </div>
      </div>
      <div class="small header box split">
@@ -811,6 +839,8 @@
  </div>
 </div>
 <script type="text/worker">
+
+
  on("sheet:opened", function(eventInfo) {
    getAttrs(["supply-slots", "gold-slots"], function(v){
      set = {};
@@ -818,8 +848,31 @@
      if (v["gold-slots"] === "") set["gold-slots"] = 3;
      setAttrs(set);
    });
+    updateRolls()
  });

+  function updateRolls(){
+    getAttrs(actions, function(v) {
+      var set = {}
+      for (a in v) {
+        set[a + "-roll"] = getRoll(v[a])
+      }
+      setAttrs(set);
+    });
+  }
+
+  function getRoll(dice){
+    dice = parseInt(dice) || 0;
+    var options = [0, 1, 2, 3, 4, 5, 6, -1, -2, -3]
+                .map(n => `${n},${expandDice(n + dice)}`).join("|")
+    return `?{Modifier|${options}}`
+  }
+
+  function expandDice(count){
+    return count <= 0 ? "{{roll=[[d6cf<3]] [[d6cf<3]]&#125;&#125; {{zero=^{zero-dice&#125;&#125;&#125;"
+           : "{{roll=" + [...Array(count).keys()].map(() => "[[d6cf<3]]").join(" ") + "&#125;&#125;"
+  }
+
  function getClickAttr(eventInfo, prefix){
    return eventInfo.triggerName.replace(new RegExp(`clicked:(repeating_.+?_)?.*${prefix}-`), "$1")
  }
@@ -906,19 +959,45 @@
    var match = eventInfo.triggerName.match(/clicked:(.+)(\d)/)
    var attr = match[1]
    var set = {}
+    var dice = 0;
    if (match[2] == "1"){
      getAttrs([attr], v => {
        switch(v[attr]){
-          case "0": set[attr] = attr.includes("minion") ? "1" : "0.1"; break;
-          case "0.1": set[attr] = "0.2"; break;
-          case "0.2": set[attr] = "1"; break;
-          case "1": set[attr] = "0"; break;
-          default: set[attr] = "1"; break;
+          case "0": 
+            if (attr.includes("minion")){
+              set[attr] = "1";
+              dice = 1;
+            } else {
+              set[attr] = "0.1"
+              dice = 0;
+            }
+            break;
+          case "0.1": 
+            set[attr] = "0.2"; 
+            dice = 0;
+            break;
+          case "0.2": 
+            set[attr] = "1"; 
+            dice = 1;
+            break;
+          case "1": 
+            set[attr] = "0";
+            dice = 0;
+            break;
+          default: 
+            set[attr] = "1";
+            dice = 1;
+            break;
        }
+        
+        set[attr + "-roll"] = getRoll(dice)
        setAttrs(set);
      });
    } else {
      set[attr] = match[2];
+      dice = match[2];
+      set[attr + "-roll"] = getRoll(dice)
+
      setAttrs(set);
    }
    //console.log(match)
@@ -974,7 +1053,7 @@


  var callings = ["brute", "conniver", "crafter", "hunter", "marauder", "shadow", "shaman", "warlock", "zealot"]
-
+  var actions = ["scan", "tinker", "trick", "finesse", "skulk", "smash", "banter", "invoke", "threaten"]
 </script>
 <div class="translation-holder">
  <span data-i18n="brute-desc">Powerful & Intimidating 
@@ -1148,4 +1227,11 @@
 <span data-i18n="zealot-ability-desc6">Designate a weapon as your unholy weapon. It's now your magic focus. On a success when attacking someone with it, you can spend stress to immediately affect the target with a tier 1 spell without rolling.</span>},
 <span data-i18n="zealot-ability-name7">Unholy Rituals</span>
 <span data-i18n="zealot-ability-desc7">You gain a downtime action which you can only use to incant rituals. On a success when incanting a ritual, you gain a dark heart.</span>}
-</div>
+<span data-i18n="zero-dice">0d, take worst result.</span>
+</div>
+<rolltemplate class="sheet-rolltemplate-basic">
+  {{#character}}<div class="character">{{character}}</div>{{/character}}
+  {{#action}}<div class="action">{{action}}</div>{{/action}}
+  {{#roll}}<div class="roll">{{roll}}</div>{{/roll}}
+  {{#zero}}<div class="zero">{{zero}}</div>{{/zero}}
+</rolltemplate>