// ================================================================
// Command Form Component
// ================================================================

window.onCmdTypeChange = function() {
  const type = document.getElementById('cmd-type').value;
  document.getElementById('build-options').style.display   = type === 'build'   ? '' : 'none';
  document.getElementById('recruit-options').style.display = type === 'recruit' ? '' : 'none';
  document.getElementById('amount-group').style.display    = type === 'recruit' ? '' : 'none';
};

window.renderBuildingDropdown = function() {
  const town = window.getSelectedTown();
  if (!town) return;
  const bSelect = document.getElementById('building-select');
  const bLevels = town.buildings || {};
  const bData   = town.build_data || {};
  
  const currentVal = bSelect.value;
  bSelect.innerHTML = '';
  
  for (const [key, nameGr] of Object.entries(window.BUILDING_NAMES_GR)) {
    const level = bLevels[key] !== undefined ? bLevels[key] : "?";
    const data = bData[key];
    
    let text = `${nameGr} [Επίπεδο ${level}]`;

    if (data && data.dependencies) {
      const w  = window.fmt(data.wood || 0);
      const st = window.fmt(data.stone || 0);
      const i  = window.fmt(data.iron || 0);
      let t    = data.build_time || '';
      if (t.startsWith('00:')) t = t.substring(3); // make '00:06:00' cleaner as '06:00'

      // Only show costs if the prerequisites are fulfilled
      text += ` — Ξ:${w} Π:${st} Α:${i} · ⏱ ${t}`;
    }

    const option = document.createElement('option');
    option.value = key;
    option.textContent = text;
    
    bSelect.appendChild(option);
  }
  
  if (currentVal && Array.from(bSelect.options).some(o => o.value === currentVal)) {
    bSelect.value = currentVal;
  }
};

window.renderBuildQueuePreview = function() {
  const town = window.getSelectedTown();
  const el = document.getElementById('build-queue-preview');
  if (!town || !town.build_queue || !town.build_queue.length) {
    el.innerHTML = '<span style="color:#444">Build queue: empty</span>';
    return;
  }
  const items = town.build_queue.map(o =>
    `<span>${o.building_type || o.name || JSON.stringify(o)}</span>`
  ).join('');
  el.innerHTML = `<div style="margin-top:6px;color:#888;font-size:0.72rem;text-transform:uppercase;letter-spacing:0.5px;margin-bottom:4px;">Current queue</div>${items}`;
};