Move auto-submit checkbox to settings and hide submit button when it's enabled.

www/bagels/index.html

@@ -232,6 +232,10 @@
     <input type="checkbox" id="settings_toggle"></input>
     <div id="settings">
       <h1>Settings</h1>
+        <label>
+          <input type="checkbox" id="auto_submit" checked />
+          Auto-Submit
+        </label><br />
         <a href="#" target="_blank" id="permalink">Permalink</a>
         to current puzzle:
         <input contenteditable id="permalink_input" />
@@ -328,10 +332,6 @@
       <button id="clear">Clear All</button>
       <button id="clear_nonlocked">Clear Non-Frozen</button>
       <button id="submit">Submit Word</button>
-      <label>
-        <input type="checkbox" id="auto_submit" checked />
-        Auto-Submit
-      </label>
     </div>
     <div id="endgame">
         <button id="newgame">Next Game</button>

www/crossword/index.html

@@ -16,7 +16,6 @@
     <script >
       class CrosswordUI extends AnagramEntryUI {
         submitWord(word) {
-          if (this.won) return;
           let guess;
           if (word) {
             guess = word;
@@ -69,8 +68,6 @@
 
           if (this.game.won) {
             this.won = true;
-            document.getElementById('letters_entry').style.display = 'none';
-            document.getElementById('submit_buttons').style.display = 'none';
             document.getElementById('endgame').style.display = '';
           }
         }
@@ -317,6 +314,11 @@
     <input type="checkbox" id="settings_toggle"></input>
     <div id="settings">
       <h1>Settings</h1>
+        <label>
+          <input type="checkbox" id="auto_submit" checked />
+          Auto-Submit (otherwise submit word only by clicking
+          the "Submit" button)
+        </label><br />
         <a href="#" target="_blank" id="permalink">Permalink</a>
         to current puzzle:
         <input contenteditable id="permalink_input" />
@@ -352,7 +354,21 @@
         as clues.
       </p>
       <p>
-        TODO: More complete explanation.
+        The available letters are the anagram of a secret word which is
+        in the crossword. The other words in the crossword use some or
+        all of those letters. If a letter is only listed once, then you
+        can only use it once in your guesses.
+      </p>
+      <p>
+        You win by guessing all of the <span class="solved">clues</span>
+        in the crossword. If you guess a word that is not in the
+        crossword, it will be listed in your guesses and categorized
+        as either a <span class="top_word">common word</span> (in the
+        50,000 most common English words according to the word list) or
+        a <span class="bonus">bonus word</span> (any other correctly
+        spelled English word). After winning, you can continue trying
+        to guess more common/bonus words or click the "Next Game" button
+        to move onto the next crossword.
       </p>
 
       <h2>Interface</h2>
@@ -369,6 +385,22 @@
         leaving spaces blank. Note that empty spaces can be frozen to make
         this easier.
       </p>
+      <p>
+        All of your guesses are listed at the bottom, most recent at the top.
+      </p>
+
+      <h2>Credits</h2>
+      <ul>
+        <li>Game design cloned from iOS game <a href="https://itunes.apple.com/us/app/wordscapes/id1207472156">Wordscapes</a></li>
+        <li>Common words list from <a href="https://github.com/hermitdave/FrequencyWords">FrequencyWords</a> (see its credits and license at that link)</li>
+        <li>Valid word checks (spellchecking) using <a href="https://github.com/cfinke/Typo.js">Typo.js</a> (see its credits and license at that link)</li>
+        <li>Programming by <a href="https://aweirdimagination.net/~perelman/">Daniel Perelman</a>, licensed <a href="https://www.gnu.org/licenses/agpl-3.0.en.html">AGPLv3+</a></li>
+        <ul>
+          <li><a href="https://git.aweirdimagination.net/perelman/anagram-games/src/branch/master">Source code git repository</a></li>
+          <li>See also: <a href="https://aweirdimagination.net/tag/anagram-crossword/">blog posts about this game</a></li>
+        </ul>
+      </ul>
+
     </div>
     <table id="crossword">
     </table>
@@ -379,10 +411,6 @@
       <button id="clear">Clear All</button>
       <button id="clear_nonlocked">Clear Non-Frozen</button>
       <button id="submit">Submit Word</button>
-      <label>
-        <input type="checkbox" id="auto_submit" checked />
-        Auto-Submit
-      </label>
     </div>
     <div id="endgame">
         <button id="newgame">Next Game</button>

www/entryui.js

@@ -10,10 +10,18 @@ function clearElement(element) {
 
 class AnagramEntryUI {
     constructor() {
+        this.autoSubmit = document.getElementById('auto_submit');
+        this.submit = document.getElementById('submit');
+
         this.loadSettings();
         let ui = this;
-        document.getElementById('submit')
+
+        this.submit
             .addEventListener('click', _ => ui.submitWord());
+        this.autoSubmit.addEventListener('change', _ => {
+            ui.saveSettings();
+            ui.submit.style.display = ui.autoSubmit.checked ? 'none' : '';
+        });
         document.getElementById('clear')
             .addEventListener('click', _ => ui.clearAll());
         document.getElementById('clear_nonlocked')
@@ -98,9 +106,6 @@ class AnagramEntryUI {
             ui.shuffleAvailableLetters();
         });
 
-        this.autoSubmit = document.getElementById('auto_submit');
-        this.autoSubmit.addEventListener('change', _ => ui.saveSettings());
-
         let entry = document.getElementById('letters_entry');
         clearElement(entry);
         this.textboxes = new Array(len);
@@ -421,7 +426,9 @@ class AnagramEntryUI {
                 }
             }
             if ('auto_submit' in obj) {
-                document.getElementById('auto_submit').checked = obj.auto_submit;
+                this.autoSubmit.checked = obj.auto_submit;
+
+                this.submit.style.display = this.autoSubmit.checked ? 'none' : '';
             }
             if ('saved_games' in obj) {
                 this.updateSavedGamesMenu(obj);