Smart problem generation

src/app.tsx

@@ -8,7 +8,41 @@ export function App() {
   // choose number between 2 and max inclusive
   const getRandomInt = (max : number) : number => Math.floor(Math.random() * (max - 1) + 2)
 
-  const chooseFactors = () : [number, number] => [ getRandomInt(200), getRandomInt(200) ]
+  const chooseFactorsRandom = () : [number, number] => [ getRandomInt(200), getRandomInt(200) ]
+
+  const _chooseMultiplesOf = (f : number) : [number, number] => {
+    const max = Math.floor(200 / f)
+    return [ f * getRandomInt(max), f * getRandomInt(max) ]
+  }
+
+  const chooseMultiplesOf = (f : number) : () => [ number, number ] => {
+    return () => _chooseMultiplesOf(f)
+  }
+
+  const chooseMultiples = () : [number, number] => {
+    const f = getRandomInt(50)
+    return _chooseMultiplesOf(f)
+  }
+
+  const chooseFactors = () : [number, number] => {
+    const probabilities : Array<[number, () => [number, number]]>= [
+      [ 0.2, chooseFactorsRandom ],
+      [ 0.2, chooseMultiples ],
+      [ 0.2, chooseMultiplesOf(3) ],
+      [ 0.2, chooseMultiplesOf(7) ],
+      [ 0.1, chooseMultiplesOf(11) ],
+      [ 0.1, chooseMultiplesOf(17) ],
+    ]
+    const r = Math.random()
+    var i = 0, accum = 0
+    for (i = 0; i < probabilities.length; i++) {
+      console.log([r, i, accum, probabilities[i]])
+      if ((r > accum) && (r <= accum + probabilities[i][0])) break
+      accum += probabilities[i][0]
+    }
+    if (i >= probabilities.length) i = probabilities.length - 1
+    return probabilities[i][1]()
+  }
 
   const gcd = (a : number, b : number) : number => {
     if (b > a) return gcd(b, a)
@@ -57,7 +91,11 @@ export function App() {
   const doSolution = (e : Event) : void => {
     e.preventDefault()
     if (solution === null) {
+      var answerBox = document.getElementById("inlineFormInputResponse") as HTMLInputElement
+      answerBox.value = String(gcd(factors[0], factors[1]))
       setSolution(<Solution rows={getSolution(factors[0], factors[1])} />)
+      setCorrect(true)
+      //setFeedback(true)
     } else {
       setSolution(null)
     }
@@ -82,9 +120,7 @@ export function App() {
           </div>
           <div className="col-12">
             <button type="submit" onClick={correct ? doNext : doCheck} className="btn btn-primary">{correct ? "Next" : "Check"}</button>
-          </div>
-          <div className="col-12">
-            <button type="submit" onClick={doSolution} className="btn btn-secondary">{solution !== null ? "Hide" : "Solve"}</button>
+            <button type="submit" onClick={doSolution} className="ms-2 btn btn-secondary">{solution !== null ? "Hide" : "Solve"}</button>
           </div>
         </form>
         <div className={feedback ? "visible" : "invisible"}>