Sample handbooks: one click starts the check

README.md

@@ -122,7 +122,7 @@ Whole rulebook: each state's questions were asked together, up to 25 per call, s
 ## Try it in 2 minutes
 
 1. **See a finished report:** open the sample report (one made-up handbook checked for Texas, North Carolina and Oregon) or any of the 8 sample reports, each with its answer key. They load instantly and cost nothing.
-2. **Run a live check, no code needed:** under "No handbook handy? Try a sample handbook", load one of the eight sample handbooks, change a sentence or two so they break a rule (for example "no more than four babies" to "up to six babies" in the Texas one), and press Check. Beam checks it against that state's rules in about 10 to 60 seconds. A planted Texas infant-ratio mistake took 10 seconds and about 1 cent.
+2. **Run a live check, no code needed:** under "No handbook handy? Try a sample handbook", load one of the eight sample handbooks, change a sentence or two so they break a rule (for example "no more than four babies" to "up to six babies" in the Texas one), and click "Check this handbook". Beam checks it against that state's rules in about 10 to 60 seconds. A planted Texas infant-ratio mistake took 10 seconds and about 1 cent.
 3. **Your own handbook** needs a free access code (one check a day, sent on request to hi@backpr.com). Checking the same file again is free.
 
 This Space is a static page: the handbook is read, the rule pages are chosen and every quote is checked in your browser. A small Cloudflare Worker keeps the Beam token, checks the code, accepts only CareRules prompts, enforces spending limits and caches replies. The same page runs at [care.backpr.com](https://care.backpr.com).

index.html

@@ -26,7 +26,7 @@
 <meta name="twitter:title" content="Does your parent handbook break your state's licensing rules?">
 <meta name="twitter:description" content="Sentences that break your state's child care licensing rules, missing policies and new wording. 22 states and DC. Free.">
 <meta name="twitter:image" content="https://care.backpr.com/static/media/og.jpg">
-<link rel="stylesheet" href="static/style.css?v=4936a0810c">
+<link rel="stylesheet" href="static/style.css?v=409b4b1ba2">
 <script type="application/ld+json">{"@context":"https://schema.org","@graph":[
 {"@type":"WebApplication","@id":"https://care.backpr.com/#app","name":"CareRules","alternateName":"CareRules Handbook Inspector","url":"https://care.backpr.com/",
 "description":"Checks a child care center's parent handbook against the official licensing rules of 22 states and DC, and lists conflicting sentences, missing required policies and suggested wording. Every quote is checked word for word. Not legal advice.",
@@ -234,9 +234,9 @@
           <p class="small">See how it works. These made-up handbooks were written to follow their state's rules. Load one, change a sentence or two to break a rule (a ratio, a nap rule, a medicine rule), and see if CareRules catches it. No code needed: up to 3 checks a day, each against that handbook's state.</p>
           <div class="access-row"><select id="test-states" aria-label="Sample handbook"></select><button type="button" class="btn btn-ghost" id="test-load">Load handbook</button></div>
           <div id="test-edit" hidden>
-            <label class="label" for="test-text">Edit the text below, then click "Use this handbook"</label>
+            <label class="label" for="test-text">Change a sentence or two below, then click "Check this handbook"</label>
             <textarea id="test-text" rows="12" spellcheck="false"></textarea>
-            <button type="button" class="btn btn-ghost" id="test-use">Use this handbook</button>
+            <button type="button" class="btn" id="test-use"><span>Check this handbook</span> <small>(no code needed)</small></button>
           </div>
         </details>
         <div class="field">
@@ -352,6 +352,6 @@
   </div>
 </footer>
 <script src="static/engine.js?v=ddf3462180"></script>
-<script src="static/app.js?v=3726d9ba70"></script>
+<script src="static/app.js?v=7626d1f43b"></script>
 </body>
 </html>

static/app.js

@@ -442,19 +442,23 @@ document.addEventListener("click", async (ev) => {
 /* "Plant your own mistake": a compliant test handbook to edit and check */
 $("#test-load").addEventListener("click", async () => {
   const code = $("#test-states").value;
+  if (!code) return;  // the list is still loading
   const text = await fetch(`samples/eval/${code}/clean.md`).then((r) => r.text());
   $("#test-text").value = text;
   $("#test-edit").hidden = false;
   state.chosen = new Set([code]);
   renderChips(); requestLink();
 });
-$("#test-use").addEventListener("click", () => {
+/* One click: read the edited sample handbook and start the live check at once (no code, its own state, Standard). */
+$("#test-use").addEventListener("click", async () => {
   if (state.running) return;  // a running check keeps its file
   const code = $("#test-states").value;
-  setFile(new File([$("#test-text").value], `sample-handbook-${code}.md`, { type: "text/markdown" }), code);
+  $("#test-use").disabled = true;
+  await setFile(new File([$("#test-text").value], `sample-handbook-${code}.md`, { type: "text/markdown" }), code);
+  $("#test-use").disabled = false;
   state.chosen = new Set([code]); renderChips(); requestLink();
-  help($("#code").value.trim() ? "" : `No code needed: this sample handbook will be checked against ${stateName(code)}'s rules at Standard.`, false);
-  $("#go").focus();
+  if (!state.pages) { help(state.fileError || "Couldn't read the edited handbook. Load it again and retry."); return; }
+  runCheck();
 });
 
 document.querySelectorAll(".choice").forEach((b) => b.addEventListener("click", () => {
@@ -483,11 +487,12 @@ drop.addEventListener("drop", (ev) => { if (ev.dataTransfer.files[0]) setFile(ev
 
 const help = (text, bad = true) => { $("#go-help").textContent = text; $("#go-help").classList.toggle("bad", !!text && bad); };
 
-$("#go").addEventListener("click", async () => {
+async function runCheck() {
+  if (state.running) return;
   if (!state.pages) { help(state.fileError || "Add your parent handbook first."); drop.classList.add("over"); setTimeout(() => drop.classList.remove("over"), 900); return; }
   if (!state.chosen.size) { help("Pick your state first."); return; }
   let code = $("#code").value.trim(), status;
-  const demo = !code && state.demo;  // a sample handbook: no code needed, its own state, Standard
+  const demo = !!state.demo;  // a sample handbook: no code needed (a typed code isn't spent on it), its own state, Standard
   if (!code && !demo) { $("#code").focus(); help(`Live checks need a free access code: email ${REQUEST_EMAIL}. Or try a sample handbook, no code needed.`); return; }
   if (demo) {
     code = "DEMO"; status = { max_states: 1 };
@@ -552,7 +557,8 @@ $("#go").addEventListener("click", async () => {
     $("#progress").hidden = true; $("#go").disabled = false;
     checkCode();
   }
-});
+}
+$("#go").addEventListener("click", runCheck);
 document.addEventListener("click", (ev) => { if (ev.target.id === "retry") $("#go").click(); });
 
 const save = (blob, name) => {

static/style.css

@@ -64,6 +64,9 @@ h2 { font-size: clamp(32px, 5vw, 56px); line-height: 1.08; margin: 0 0 18px; max
 .ctas.center { justify-content: center; }
 .btn { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 12px 24px; border-radius: 999px; border: 0; background: var(--grad); color: #16121f; font-weight: 700; font-size: 16px; text-decoration: none; cursor: pointer; font-family: var(--sans); }
 .btn:hover { filter: brightness(1.07); }
+.btn small { font-size: 13px; font-weight: 500; opacity: .75; }
+.btn:has(small) { flex-wrap: wrap; column-gap: 6px; text-align: center; }
+.btn:has(small) > * { white-space: nowrap; }
 .btn-ghost { background: rgba(255,255,255,.06); color: var(--text); border: 1px solid rgba(255,255,255,.25); }
 .btn-big { min-height: 54px; padding: 14px 30px; font-size: 17px; }
 .btn[disabled] { opacity: .55; cursor: wait; }