Change CSS for crosswords so they scale better.

www/crossword/crossword.js

@@ -138,6 +138,24 @@ class CrosswordPuzzle {
                                         clue.horizontal));
         }
     }
+
+    get width() {
+        let colOffset = -Math.min(...this.clues.map(clue => clue.col));
+
+        let numCols = colOffset+Math.max(...this.clues.map(clue => clue.afterCol));
+        return numCols;
+    }
+
+    get height() {
+        let rowOffset = -Math.min(...this.clues.map(clue => clue.row));
+
+        let numRows = rowOffset+Math.max(...this.clues.map(clue => clue.afterRow));
+        return numRows;
+    }
+
+    get largestDimension() {
+        return Math.max(this.width, this.height);
+    }
 }
 class Crossword {
     constructor(letters, clues, minGuessLength, allTopWords) {
@@ -310,6 +328,22 @@ class Crossword {
             return {'maxIntersections': maxIntersections,
                     'options': possibleCluesForWord};
         }
+        function selectRandomCrossword(crosswords) {
+            let best = [];
+            let smallestSize = null;
+
+            crosswords.forEach(crossword => {
+                let size = crossword.largestDimension;
+                if (smallestSize == null || size < smallestSize) {
+                    best = [crossword];
+                    smallestSize = size;
+                } else if(size == smallestSize) {
+                    best.push(crossword);
+                }
+            });
+
+            return best[getRandomInt(best.length)];
+        }
         function tryAugmentCrosswords(crosswords) {
             let defaultResult = null;
             for (let topWordsIdx in matchingTopWords) {
@@ -333,8 +367,7 @@ class Crossword {
                        }).filter(possibleClue => possibleClue.newClue.intersections
                                         == maxIntersections));
                     // TODO Other considerations for selecting best crossword?
-                    let selectedClue = possibleClues[getRandomInt(possibleClues.length)];
+                    return selectRandomCrossword(possibleClues.map(selectedClue => selectedClue.baseCrossword.withClue(selectedClue.newClue)));
-                    return selectedClue.baseCrossword.withClue(selectedClue.newClue);
                 } else if (defaultResult === null && possibleClues.some(crosswordOptions => crosswordOptions.possibleClues.options.length > 0)) {
                     defaultResult = possibleClues;
                 }
@@ -358,7 +391,7 @@ class Crossword {
                                                   .withClue(newClue)));
                 }
             }
-            return crosswords[getRandomInt(crosswords.length)];
+            return selectRandomCrossword(crosswords);
         }
 
         let crossword = new CrosswordPuzzle()

www/crossword/main.css

@@ -4,11 +4,11 @@
   background-color: black;
 }
 #crossword td {
-  width: 5vw;
+  width: 4ex;
-  height: 5vw;
+  height: 4ex;
   border-collapse: collapse;
   text-align: center;
-  font-size: 5vw;
+  font-size: 4ex;
 }
 #crossword td.blank {
   background-color: white;