new: language auto-detect - /api/guess-language, refresh button, guess on paste

web/templates/new.html

@@ -11,6 +11,7 @@
         <option>bash</option><option>sql</option><option>yaml</option><option>json</option>
         <option>markdown</option><option>text</option>
       </select>
+      <button class="btn btn-icon" id="reguess" title="Re-detect language" type="button">⟳</button>
     </div>
     <div class="editor-wrap">
       <div class="gutter" id="gutter">1</div>
@@ -67,6 +68,30 @@ updateGutter();
 
 $('haspw').addEventListener('change', e => { $('password').style.display = e.target.checked ? 'block' : 'none'; });
 
+let guessed = ''; // last auto-detected language, '' = user override
+
+async function guessLang() {
+  if (!content.value.trim()) return;
+  try {
+    const res = await fetch('/api/guess-language', {
+      method: 'POST',
+      headers: {'Content-Type': 'application/json'},
+      body: JSON.stringify({content: content.value}),
+    });
+    const data = await res.json();
+    if (res.ok && data.language) {
+      guessed = data.language;
+      $('language').value = data.language;
+    }
+  } catch(e) {}
+}
+
+// refresh button: always re-detect, even if user picked something
+$('reguess').addEventListener('click', guessLang);
+
+// auto-guess when pasting into the editor
+content.addEventListener('paste', () => setTimeout(guessLang, 0));
+
 async function create() {
   const body = {
     content: content.value,