{% comment %}
Behaviour for run_settings.html: predefined-prompt picker sync, generation-config
normalisation and submit-time JSON validation.
{% endcomment %}
<script>
// System Prompt picker: one selectable prompt. Each prompt row has a radio on
// its name (= latest version) plus a "Versions ▾" expander with a radio per
// version. All radios share one name, so the browser keeps exactly one checked;
// picking any of them fills the box below. Typing your own text clears the
// selection so it can't be silently overridden.
(function() {
  const fieldset = document.querySelector('[data-axis="system_prompt_version"]');
  const ta = document.getElementById('system-prompt');
  if (!fieldset || !ta) return;

  const allRadios = () => [...fieldset.querySelectorAll('input[name="system_prompt_version"]')];

  function syncAll() {
    const checked = allRadios().find(r => r.checked);
    fieldset.querySelectorAll('[data-prompt-row]').forEach(row => {
      const rs = [...row.querySelectorAll('input[name="system_prompt_version"]')];
      const rowChecked = rs.find(r => r.checked);
      const summary = row.querySelector('[data-prompt-summary]');
      if (!summary) return;
      if (rowChecked) summary.textContent = `v${rowChecked.dataset.version}` + (rowChecked.hasAttribute('data-latest') ? ' · latest' : ' · older version');
      else {
        const latest = rs.find(r => 'latest' in r.dataset);
        summary.textContent = latest ? `v${latest.dataset.version} · latest` : '';
      }
    });
    if (checked && ta.value !== checked.dataset.content) ta.value = checked.dataset.content || '';
  }

  // Same name → the browser enforces single selection; we just refresh UI.
  allRadios().forEach(r => r.addEventListener('change', syncAll));

  // Versions ▾ / ▴ expand-collapse per row.
  fieldset.querySelectorAll('[data-prompt-row]').forEach(row => {
    const btn = row.querySelector('[data-version-toggle]');
    if (btn) btn.addEventListener('click', () => {
      const list = row.querySelector('[data-version-list]');
      const open = list.classList.toggle('hidden') === false;
      btn.setAttribute('aria-expanded', String(open));
      btn.textContent = open ? 'Versions ▴' : 'Versions ▾';
    });
  });

  // Typing your own prompt clears the picker so the frozen run uses your text.
  ta.addEventListener('input', () => {
    allRadios().forEach(r => { r.checked = false; });
    fieldset.querySelectorAll('[data-prompt-summary]').forEach(s => s.textContent = 'custom');
  });

  syncAll();
})();
// Keep only real overrides: drop empty/null entries and retry values equal to
// the engine defaults, so no-op keys aren't frozen into the manifest.
function cleanGenConfig(obj) {
  for (const [k, v] of Object.entries(obj)) {
    if (v === null || v === '' || (typeof v === 'object' && !Array.isArray(v) && Object.keys(v).length === 0)) delete obj[k];
  }
  if (obj.max_retries === 2) delete obj.max_retries;
  if (obj.retry_backoff === 0.5) delete obj.retry_backoff;
  return obj;
}

// Normalize a prefilled (cloned) generation-config textarea on page load: strip
// form-managed keys, drop empty/null entries and reformat.
// The blank-form template is left intact so every available key stays
// visible; empty entries are still dropped on submit below.
(function() {
  const ta = document.querySelector('[name="gen_config_json"]');
  if (!ta || !ta.dataset.prefilled || !ta.value.trim()) return;
  try {
    let obj = JSON.parse(ta.value);
    if (typeof obj !== 'object' || obj === null || Array.isArray(obj)) return;
    delete obj.max_turns; delete obj.n_repetitions; delete obj.language; delete obj.system_prompt;
    cleanGenConfig(obj);
    ta.value = Object.keys(obj).length ? JSON.stringify(obj, null, 2) : '{}';
  } catch (_) { /* leave as-is if not valid JSON yet */ }
})();

// Validate JSON on submit (tolerates Python-style single-quoted dicts) and
// disable the submit button while the form is in flight to prevent duplicate
// submissions. The button's data-busy-label is shown while submitting.
document.querySelector('[name="gen_config_json"]')?.form?.addEventListener('submit', function(e) {
  const ta = this.querySelector('[name="gen_config_json"]');
  const errEl = document.getElementById('gen-config-error');
  if (ta && ta.value.trim()) {
    let raw = ta.value.trim();
    // Auto-fix common Python-dict → JSON issues: single quotes, True/False/None
    let fixed = raw.replace(/'/g, '"').replace(/\bTrue\b/g, 'true').replace(/\bFalse\b/g, 'false').replace(/\bNone\b/g, 'null');
    try {
      const parsed = JSON.parse(fixed);
      if (typeof parsed !== 'object' || parsed === null || Array.isArray(parsed)) throw new Error('Must be a JSON object');
      cleanGenConfig(parsed);
      ta.value = Object.keys(parsed).length ? JSON.stringify(parsed, null, 2) : '';
    }
    catch (err) {
      e.preventDefault();
      errEl.textContent = 'Invalid JSON: ' + err.message + ' (use double quotes for keys/values)';
      errEl.classList.remove('hidden');
      return;
    }
  }
  errEl.classList.add('hidden');
  const btn = this.querySelector('button[type="submit"][data-busy-label]');
  if (btn) {
    btn.disabled = true;
    btn.textContent = btn.dataset.busyLabel;
  }
});
</script>