3 changed files with 50 additions and 11 deletions
Split View
Diff Options
-
+6 -9src/html/index.html
-
+42 -0src/ts/frontend.ts
-
+2 -2tsconfig.json
+ 6
- 9
src/html/index.html
View File
| @@ -7,16 +7,14 @@ | |||
| <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl" crossorigin="anonymous"> | |||
| <link rel="stylesheet" href="css/asphotheme.css"> | |||
| <link rel="stylesheet" href="css/dashboard.css"> | |||
| <script src="rollstats.js" type="text/javascript"></script> | |||
| <script src="https://code.jquery.com/jquery-3.5.1.min.js" type="text/javascript"></script> | |||
| <script src="bundle.js" type="text/javascript"></script> | |||
| </head> | |||
| <body> | |||
| <header class="navbar navbar-dark sticky-top bg-dark flex-md-nowrap p-0 shadow"> | |||
| <a class="navbar-brand col-md-3 col-lg-2 me-0 px-3" href="#">Dice Roller</a> | |||
| </header> | |||
| <div class="container"> | |||
| <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/js/bootstrap.bundle.min.js" integrity="sha384-b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0" crossorigin="anonymous"></script> | |||
| <h1>Asphodice Roller</h1> | |||
| <p>This lets you roll an arbitrary number of Asphodice!</p> | |||
| <h1 class="mt-3">Asphodice Roller</h1> | |||
| <p>This lets you roll an arbitrary number of Asphodice. Results will be shown below. Please be patient as the rolls take place in the browser.</p> | |||
| <form> | |||
| <label for="numRolls">Number of Rolls</label><br /> | |||
| @@ -25,10 +23,9 @@ | |||
| <input type="number" class="form-control" id="numRolls" placeholder="100000" aria-describedby="basic-addon3"> | |||
| <span class="input-group-text">times</span> | |||
| </div> | |||
| <label for="numDice" class="form-label">Number of Dice</label> | |||
| <input type="range" class="form-range" id="numDice" min="1" max="20"> | |||
| <button class="btn btn-primary">Roll!</button> | |||
| </form> | |||
| <button class="btn btn-primary" id="mainRoll">Roll!</button> | |||
| </div> | |||
| <div class="container" id="results"></div> | |||
| </body> | |||
| </html> | |||
+ 42
- 0
src/ts/frontend.ts
View File
| @@ -0,0 +1,42 @@ | |||
| import { RollStats } from "./rollstats" | |||
| import { Outcomes } from "./asphodice" | |||
| let rollstats = new RollStats(); | |||
| function getResults():void { | |||
| console.log("getting results"); | |||
| $("#results").empty(); | |||
| rollstats.doRolls(); | |||
| $("#results").append(`<div class="card my-4">`); | |||
| $("#results").append(`<div class="card-body">`); | |||
| $("#results").append(`<p> | |||
| <strong>Rerolled:</strong> ${rollstats.rerollCounts.true} <br/> | |||
| <strong>Not rerolled:</strong> ${rollstats.rerollCounts.false} | |||
| </p>`); | |||
| $("#results").append(`<table class="table" id="balanceTable"> | |||
| <thead><td>Balance</td> <td>Count</td> <td>Percentage</td></thead> | |||
| <tbody></tbody> | |||
| </table>`); | |||
| // | |||
| let bc = rollstats.balanceCounts; | |||
| let keys = Object.keys(bc); | |||
| keys.sort(function(a: string, b: string){return Number(a) - Number(b)}); | |||
| //for (let balance in rollstats.balanceCounts) { | |||
| for (var i = 0; i < keys.length; i++) { | |||
| let tb = $("#balanceTable").find("tbody"); | |||
| tb.append(`<tr> <td>${keys[i]}</td> | |||
| <td>${rollstats.balanceCounts[keys[i]]}</td> | |||
| <td>${(rollstats.balanceCounts[keys[i]] / rollstats.numRolls * 100).toFixed(2)}</td> | |||
| </tr>`); | |||
| } | |||
| $("#results").append(`</div>`); | |||
| $("#results").append(`</div>`); | |||
| } | |||
| function setupHandlers(): void { | |||
| console.log("adding event handler"); | |||
| $("#mainRoll").click(getResults); | |||
| } | |||
| document.addEventListener("DOMContentLoaded", setupHandlers); | |||
+ 2
- 2
tsconfig.json
View File
| @@ -47,7 +47,7 @@ | |||
| // "paths": {}, /* A series of entries which re-map imports to lookup locations relative to the 'baseUrl'. */ | |||
| // "rootDirs": [], /* List of root folders whose combined content represents the structure of the project at runtime. */ | |||
| // "typeRoots": [], /* List of folders to include type definitions from. */ | |||
| "types": [ "node" ], /* Type declaration files to be included in compilation. */ | |||
| "types": [ "node", "jquery" ], /* Type declaration files to be included in compilation. */ | |||
| // "allowSyntheticDefaultImports": true, /* Allow default imports from modules with no default export. This does not affect code emit, just typechecking. */ | |||
| "esModuleInterop": true, /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */ | |||
| // "preserveSymlinks": true, /* Do not resolve the real path of symlinks. */ | |||
| @@ -67,5 +67,5 @@ | |||
| "skipLibCheck": true, /* Skip type checking of declaration files. */ | |||
| "forceConsistentCasingInFileNames": true /* Disallow inconsistently-cased references to the same file. */ | |||
| }, | |||
| "include": [ "./src/ts/dice.ts", "./src/ts/rollstats.ts" ] | |||
| "include": [ "./src/ts/asphodice.ts", "./src/ts/dice.ts", "./src/ts/rollstats.ts" ] | |||
| } | |||