Dice Stats

DND dice rolls and statistics (success chance).

• Documentation
• Quick start
  • Format
• Console DIY
• WIP

https://maz01001.github.io/dice_stats/

Documentation

Buttons at the bottom of the view box:

Button	Description
Add roll	Adds a new (dice roll) block; Currently 100 blocks maximum.
Click to remove	Switches between different modes for pointer action: Click to remove Click on dice to remove them; Double click on the empty dice area to remove the whole block. Click to rotate Click on dice to roll them (individually); Double click on the block or the dice area within it to roll all dice within that. Swipe to rotate Same as Click to rotate, but also moving the mouse over dice rolls them (individually); For touch start a swipe on a dice graphic and then moving over any dice on the screen rolls them (individually), to scroll the page by swiping over dice simply start swiping, then tap anywhere with a second finger, and it should cancel the "dice rolling" and revert back to normal swipe controls.
Source Code	Link to this Repository.
Permalink	Create a permalink with the current setup (see Quick start).
Roll all	Rolls all dice on the page at once.
--%	Shows the total chance of success for all blocks; is "--%" when not all blocks have dice and not all Value fields are filled in (see below) or there are no blocks to begin with.

Within each block:

Field	Description
Name	Custom name for this dice roll block (only visual change); Click to edit; Pressing Enter or navigating away from it while it's empty will remove the entire block without further asking.
Value	Number input field for comparing with dice roll result; When pressing Enter here, all dice within this block are rolled.
≥	Selection of comparison operator between Value and dice roll result; Currently these are ≥, ≤, >, <, and =.
	initially invisible, when two or more dice are present, shows the dice roll result (sum of dice values).
[Dice area]	Resizeable area; To revert back to automatic sizing, double-click on the bottom right corner.
--%	Shows the chance of success of the condition of this block; is "--%" when Value is not filled in or there are no dice.
Add	Adds a new (D20) dice to this block; Currently 48 dice maximum per block.
D20	Select the dice to add with Add; Currently supported dice are: Name Description Possible results C Two sided coin {1, 2} D4 Four sided dice {1, 2, 3, 4} D6 Six sided dice {1, 2, ..., 6} D8 Eight sided dice {1, 2, ..., 8} D10 Ten sided dice {1, 2, ..., 10} D12 Twelve sided dice {1, 2, ..., 12} D20 Twenty sided dice {1, 2, ..., 20} D100 Ten sided dice {10, 20, ..., 100}

When dice are rolled they are colored based on success (green ⇔ success, red ⇔ failure, and grey if the Value field of that block is not filled in) and so is the border of the viewing box (same colors but all blocks need to be successful for it to count as successful).

You can also navigate this page with keyboard-only, touch-only should also work just fine.

The layout changes to a column with rows instead of rows with blocks when the screen width is smaller than its height (usually mobile devices have this ratio).

Scroll UP | TOP

Quick start

Directly loading full dice roll setup from URL hash (#):

• https://maz01001.github.io/dice_stats/#D20

  empty >= { 1 * D20 }
  

• https://maz01001.github.io/dice_stats/#2=2C,13+2D6+D12,123%3C=3D100d100

  2 = { 2 * C }
  13 >= { 2 * D6 + 1 * D12 }
  123 <= { 4 * D100 }
  

• https://maz01001.github.io/dice_stats/#150%3E12d20,15+2d12,5gtd8,roll

  150 > { 12 * D20 }
  15 >= { 2 * D12 }
  5 > { 1 * D8 }
  
  roll all dice after loading
  

Format

The general format is:

"Name title" Value Operator Dice list

• "Name title" any text within double quotes where " is escaped as "" or \" and \ is escaped as \\ (can be empty: "")
• Value any positive (finite) integer (including 0)
• Operator one of GE >= LE <= GT > LT < EQ = == === (case insensitive)
• Dice list list of amount dice type with + as separator (and at the beginning)
  • Amount positive integer smaller than 2⁵³ (automatically caps at MAX_DICE)
  • Dice type one of C D4 D6 D8 D10 D12 D20 D100 (case insensitive) other dice like D404 are parsed but ignored

where each box is optional and the whole thing can be repeated with , as a separator (yes ,,, is valid and creates 3 empty boxes)

also, copy-pasting url/format directly on the page loads that setup

and for those that can read regular expressions:

/(?!$)(?:"((?:\\.|""|[^\\"])*)")?(?:(?:(\d*)([><]=?|==?=?|[GL][ET]|EQ))?(\+?\d*(?:C+\+?\d*|(?:D\d+)+(?:\+\d*)?)*(?:C+|(?:D\d+)+))?|(\d+)((?:\+\d*)?(?:C+\+?\d*|(?:D\d+)+(?:\+\d*)?)*(?:C+|(?:D\d+)+))?)(?:,|$)/giy

Scroll UP | TOP

Console DIY

Inside the browser dev console, some limits can be adjusted:

Variable	Description	Default	Limit
Dice.ANIM_TIME	Animation speed of dice rolls in milliseconds	1000	[0,∞[
Roll.PRINT_PRECISION	Number of decimal places for percentages (only visually)	5	[0..20]
Roll.MAX_DICE	Maximum amount of dice per block	48	[0..90071992547409]
Sheet.MAX_ROLLLS	Maximum amount of blocks	100	[0..253[

Also, you can generate a number based on a dice type like so:

// with supported dice
Dice.RNG(DiceType.C);    //=> random in {1, 2}
Dice.RNG(DiceType.D4);   //=> random in {1, 2, 3, 4}
Dice.RNG(DiceType.D6);   //=> random in {1, 2, ..., 6}
Dice.RNG(DiceType.D8);   //=> random in {1, 2, ..., 8}
Dice.RNG(DiceType.D10);  //=> random in {1, 2, ..., 10}
Dice.RNG(DiceType.D12);  //=> random in {1, 2, ..., 12}
Dice.RNG(DiceType.D20);  //=> random in {1, 2, ..., 20}
Dice.RNG(DiceType.D100); //=> random in {10, 20, ..., 100}
// with custom dice
Dice.RNG(33); //=> random in {1, 2, ..., 33}
Dice.RNG({max: 50, step: 5, faces: 10}); //=> random in {5, 10, 15, ..., 50}

The random number generator uses MurmurHash3 for seeding (on page load) and then sfc32 for generating random unsigned 32bit integers; Available by the global RNG class (see https://github.com/MAZ01001/Math-Js#rngjs for more information) or use the same instance the dice use with the global constant rng.

// (many features of my original RNG class have been removed here since they weren't needed)
rng.val32; // gives a random unsigned 32bit integer
// create a new RNG obj with seed "seed"
const random = new RNG("seed");
random.val32; // 2460423161

And access to the probability-calculation function via the Probability class:

const P = new Probability();

// setup probability for a dice throw with: C, D12, D20, D20, D100, C, D10
P.Setup([DiceType.C, DiceType.D12, DiceType.D20, DiceType.D20, DiceType.D100, DiceType.C, DiceType.D10]);
// or
P.Setup([2, 2, 10, 12, 20, 20, {max: 100, step: 10, faces: 10}]); // (slightly faster in ascending order)
// (creates internal table of length 167 = 1 + 2 + 2 + 10 + 12 + 20 + 20 + 100)

// check what is the chance of "80 >= sum of dice" for a random dice roll
const chance = P.Check(80, (value, diceSum) => value >= diceSum);
// 0.395 → 39.5% for 80 >= sum of dice when rolling given dice (simultaneously)

Scroll UP | TOP

WIP

• better documentation in JSDoc