Control the speed of stepping

index.html

@@ -302,9 +302,9 @@
 			    <button id="fast-back-button" class="w3-bar-item w3-button"><span class="material-icons">fast_rewind</span></button>
 			    <button id="step-back-button" class="w3-bar-item w3-button"><span class="material-icons">skip_previous</span></button>
 			    <button id="stop-button" class="w3-bar-item w3-button"><span class="material-icons">stop</span></button>
+			    <span class="w3-bar-item">speed ×
+                            <input style="width: 5em;" type="number" id="ff-speed-input" value="1"></input></span>
 			    <button id="step-forward-button" class="w3-bar-item w3-button" style="margin-right: 0;"><span class="material-icons">skip_next</span></button>
-                            <span class="w3-bar-item">speed ×
-                            <input style="width: 10em;" type="number" id="ff-speed"></input></span>
 			    <button id="fast-forward-button" class="w3-bar-item w3-button"><span class="material-icons">fast_forward</span></button>
 
 			    <div class="w3-bar-item bar-divider"></div>

src/simulator.mjs

@@ -21,12 +21,13 @@ const ALL_TEXT_CUTOFF = 25;
 const OUTLINE_CUTOFF = 5;
 
 export class Simulator {
-	constructor() {
+    constructor() {
 		this.fastBackButton = document.getElementById('fast-back-button');
 		this.stepBackButton = document.getElementById('step-back-button');
 		this.stopButton = document.getElementById('stop-button');
 		this.stepForwardButton = document.getElementById('step-forward-button');
-		this.fastForwardButton = document.getElementById('fast-forward-button');
+	        this.ffSpeedInput = document.getElementById('ff-speed-input');
+	        this.fastForwardButton = document.getElementById('fast-forward-button');
 		this.selectModeButton = document.getElementById('select-mode-button');
 		this.placeModeButton = document.getElementById('place-mode-button');
 		this.zoomInButton = document.getElementById('zoom-in-button');
@@ -297,7 +298,9 @@ export class Simulator {
 	}
 
 	stepForward() {
-		this.tileWorker.postMessage({ msg: "step-forward" });
+	    let speed = this.ffSpeedInput.value;
+	    console.log(speed);
+	    this.tileWorker.postMessage({ msg: "step-forward", repeat: speed });
 	}
 
 	stepBackward() {

src/tileworker.js

@@ -59,19 +59,22 @@ onmessage = function(e) {
 			precomputeSignatures();
 		}
     } else if (e.data.msg === "step-forward") {
-		const added_list = stepForward();
-		if (added_list === null) {
-		    postMessage({ msg: "frontier-empty" });
-		} else {
-			for (let i=0; i<added_list.length; i++) {
-				postMessage({
-					msg: "tile-added",
-					tid: added_list[i][0],
-					x: added_list[i][1],
-					y: added_list[i][2]
-				});
-			}
+	let n_tiles = e.data.repeat || 1;
+	for (i = 0; i < n_tiles; i++) {
+	    const added_list = stepForward();
+	    if (added_list === null) {
+		postMessage({ msg: "frontier-empty" });
+	    } else {
+		for (let i=0; i<added_list.length; i++) {
+		    postMessage({
+			msg: "tile-added",
+			tid: added_list[i][0],
+			x: added_list[i][1],
+			y: added_list[i][2]
+		    });
 		}
+	    }
+	}
     } else if (e.data.msg === "step-backward") {
     	const removed = stepBackward();
     	if (removed !== null) {