// ═══════════════════════════════════════════════════════
// Placeholder Image Generator
// ═══════════════════════════════════════════════════════
function generatePlaceholder() {
  const w = parseInt(document.getElementById('phWidth').value) || 400;
  const h = parseInt(document.getElementById('phHeight').value) || 300;
  const text = document.getElementById('phText').value || `${w} × ${h}`;
  const bg = document.getElementById('phBg').value;
  const fg = document.getElementById('phFg').value;
  const fontSize = parseInt(document.getElementById('phFontSize').value) || 28;

  document.getElementById('phBgText').value = bg;
  document.getElementById('phFgText').value = fg;
  document.getElementById('phFontSizeVal').textContent = fontSize + 'px';

  const canvas = document.getElementById('phCanvas');
  canvas.width = w;
  canvas.height = h;
  const ctx = canvas.getContext('2d');

  // Background
  ctx.fillStyle = bg;
  ctx.fillRect(0, 0, w, h);

  // Cross lines
  ctx.strokeStyle = fg + '20';
  ctx.lineWidth = 1;
  ctx.beginPath();
  ctx.moveTo(0, 0); ctx.lineTo(w, h);
  ctx.moveTo(w, 0); ctx.lineTo(0, h);
  ctx.stroke();

  // Text
  ctx.fillStyle = fg;
  ctx.font = `${fontSize}px -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif`;
  ctx.textAlign = 'center';
  ctx.textBaseline = 'middle';
  ctx.fillText(text, w / 2, h / 2);
}

function downloadPlaceholder() {
  const canvas = document.getElementById('phCanvas');
  const link = document.createElement('a');
  const w = document.getElementById('phWidth').value || 400;
  const h = document.getElementById('phHeight').value || 300;
  link.download = `placeholder-${w}x${h}.png`;
  link.href = canvas.toDataURL('image/png');
  link.click();
  setStatus('phStatus', 'success', 'Downloaded ✓');
}

function copyPlaceholderDataUrl() {
  const canvas = document.getElementById('phCanvas');
  copyText(canvas.toDataURL('image/png'));
  setStatus('phStatus', 'success', 'Data URL copied ✓');
}

// Initialize on load
setTimeout(generatePlaceholder, 100);