(FE) Start f sig conversion to use ResultProperties

Using the ResultProperties class will permit generation and UI
separation (eg in visibility toggling/grouping) of different dice
variants.

In practice, this means mostly changing

rollstats.xyz
 to
resultPorperties.rollstats.xyz

in the generation functions.

src/ts/frontend.ts

@@ -342,10 +342,11 @@ function describeRolls(rollstats: RollStats): string {
 /**
  * Set up results card that contains one set of RollStats results
  */
-function resultsCard(rollstats: RollStats): JQuery<HTMLElement>{
+function resultsCard(resultsProperties: ResultProperties): JQuery<HTMLElement>{
 	// <div id="results"> is the general results div to append results to
 	// TODO: include class shortname in id (?)
-	let cardId = `results-aspho-${rollstats.numDice}`;
+	let cardId = `results-${resultsProperties.itemId()}`;
+
 	$("#results").append(`<div class="card my-4" id="${cardId}">`);
 	let resultsCard = $("#results").find(`#${cardId}`);
 	resultsCard.append(`<div class="card-body">`);
@@ -397,12 +398,12 @@ function resultsBody(rollstats: RollStats): string {
 /**
  * Put the results together - card, head, body → fill charts and tables
  */
-function addResults(rollstats: RollStats): void {
-	let resultsCardBody = resultsCard(rollstats);
+function addResults(resultProperties: ResultProperties): void {
+	let resultsCardBody = resultsCard(resultProperties);
 
-	resultsCardBody.append(resultsHeader(rollstats));
+	resultsCardBody.append(resultsHeader(resultProperties.rollstats));
 
-	resultsCardBody.append(resultsBody(rollstats));
+	resultsCardBody.append(resultsBody(resultProperties.rollstats));
 
 	// Post-DOM-Construction generation
 	//
@@ -413,10 +414,10 @@ function addResults(rollstats: RollStats): void {
 	// <canvas> element
 
 	// Tables
-	generateTables(rollstats);
+	generateTables(resultProperties.rollstats);
 
 	// Charts
-	generateCharts(rollstats);
+	generateCharts(resultProperties.rollstats);
 }
 
 /**
@@ -463,7 +464,7 @@ function getResults():void {
 			numDice: i,
 		});
 		rollstats.doRolls();
-		addResults(rollstats);
+		addResults(resultProperties);
 		$("#resultsProgress").width(`${i/maxDice*100}%`);
 		$("#resultsProgress").text(`${i/maxDice*100}%`);
 	}