import { buildPrintAttendanceStats, formatAttendanceDate } from '@/business/campus-attendance/selectors';
import { PRINT_DIALOG_OPEN_DELAY_MS } from '@/shared/constants/ui';
import type { CampusAttendancePrintInput } from '@/business/campus-attendance/types';

const escapeHtml = (value: string): string => (
  value
    .replace(/&/g, '&amp;')
    .replace(/</g, '&lt;')
    .replace(/>/g, '&gt;')
    .replace(/"/g, '&quot;')
    .replace(/'/g, '&#039;')
);

const percentageClass = (percentage: number | null): string => {
  if (percentage === null) {
    return '';
  }

  if (percentage >= 90) {
    return 'green';
  }

  if (percentage >= 80) {
    return 'amber';
  }

  return 'red';
};

const inlinePercentageClass = (percentage: number | null): string => {
  if (percentage === null) {
    return '';
  }

  if (percentage >= 90) {
    return 'pct-good';
  }

  if (percentage >= 80) {
    return 'pct-warn';
  }

  return 'pct-bad';
};

export type CampusAttendancePrintResult =
  | { readonly ok: true }
  | { readonly ok: false; readonly reason: 'popup-blocked' };

export interface CampusAttendancePrintWindow {
  readonly document: Pick<Document, 'write' | 'close'>;
  readonly focus: () => void;
  readonly print: () => void;
}

interface OpenCampusAttendancePrintReportOptions {
  readonly input: CampusAttendancePrintInput;
  readonly openWindow?: () => CampusAttendancePrintWindow | null;
  readonly schedulePrint?: (callback: () => void, delayMs: number) => void;
}

export const CAMPUS_ATTENDANCE_PRINT_POPUP_BLOCKED_MESSAGE =
  'The attendance report could not be opened. Please allow pop-ups for this site and try again.';

export function openCampusAttendancePrintReport({
  input,
  openWindow = () => window.open('', '_blank'),
  schedulePrint = (callback, delayMs) => {
    window.setTimeout(callback, delayMs);
  },
}: OpenCampusAttendancePrintReportOptions): CampusAttendancePrintResult {
  const printWindow = openWindow();

  if (!printWindow) {
    return { ok: false, reason: 'popup-blocked' };
  }

  printWindow.document.write(buildCampusAttendancePrintHtml(input));
  printWindow.document.close();
  printWindow.focus();
  schedulePrint(() => {
    printWindow.print();
  }, PRINT_DIALOG_OPEN_DELAY_MS);

  return { ok: true };
}

export function buildCampusAttendancePrintHtml(input: CampusAttendancePrintInput): string {
  const printStats = buildPrintAttendanceStats(input);
  const generatedAtDate = new Date().toLocaleDateString('en-US', {
    weekday: 'long',
    year: 'numeric',
    month: 'long',
    day: 'numeric',
  });
  const generatedAtTime = new Date().toLocaleTimeString('en-US', {
    hour: '2-digit',
    minute: '2-digit',
  });

  return `
    <!DOCTYPE html>
    <html>
    <head>
      <title>${escapeHtml(input.reportTitle)} - ${formatAttendanceDate(input.today)}</title>
      <style>
        * { margin: 0; padding: 0; box-sizing: border-box; }
        body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; padding: 32px; color: #1e293b; }
        .header { text-align: center; margin-bottom: 32px; border-bottom: 3px solid #7c3aed; padding-bottom: 16px; }
        .header h1 { font-size: 24px; color: #7c3aed; margin-bottom: 4px; }
        .header p { font-size: 13px; color: #64748b; }
        .summary-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 32px; }
        .summary-box { border: 2px solid #e2e8f0; border-radius: 12px; padding: 16px; text-align: center; }
        .summary-box .label { font-size: 11px; color: #64748b; text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 4px; }
        .summary-box .value { font-size: 28px; font-weight: 700; }
        .summary-box .value.green { color: #16a34a; }
        .summary-box .value.amber { color: #d97706; }
        .summary-box .value.red { color: #dc2626; }
        .campus-section { margin-bottom: 24px; page-break-inside: avoid; }
        .campus-header { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; padding: 8px 12px; background: #f8fafc; border-radius: 8px; border-left: 4px solid #7c3aed; }
        .campus-header h3 { font-size: 15px; font-weight: 600; }
        .campus-header .stats { margin-left: auto; display: flex; gap: 16px; font-size: 12px; }
        .campus-header .stats span { font-weight: 600; }
        table { width: 100%; border-collapse: collapse; font-size: 12px; margin-bottom: 8px; }
        th { background: #f1f5f9; text-align: left; padding: 8px 10px; font-weight: 600; color: #475569; border-bottom: 2px solid #e2e8f0; }
        td { padding: 6px 10px; border-bottom: 1px solid #f1f5f9; }
        tr:nth-child(even) { background: #fafafa; }
        .pct-good { color: #16a34a; font-weight: 600; }
        .pct-warn { color: #d97706; font-weight: 600; }
        .pct-bad { color: #dc2626; font-weight: 600; }
        .history-table { margin-top: 16px; }
        .history-table th { font-size: 11px; }
        .history-table td { font-size: 11px; }
        .footer { margin-top: 32px; padding-top: 16px; border-top: 2px solid #e2e8f0; text-align: center; font-size: 11px; color: #94a3b8; }
        @media print { body { padding: 16px; } .no-print { display: none; } }
      </style>
    </head>
    <body>
      <div class="header">
        <h1>FRAMEworks ${escapeHtml(input.reportTitle)}</h1>
        <p>Generated on ${generatedAtDate} at ${generatedAtTime}</p>
        <p style="margin-top:4px;font-size:12px;color:#7c3aed;">Printed by: ${escapeHtml(input.generatedByName)} (${escapeHtml(input.generatedByRole)})</p>
      </div>
      <div class="summary-grid">
        <div class="summary-box">
          <div class="label">Today's Attendance</div>
          <div class="value ${percentageClass(printStats.todayPct)}">${printStats.todayPct !== null ? `${printStats.todayPct}%` : 'No data'}</div>
          <div class="label" style="margin-top:4px">${formatAttendanceDate(input.today)}</div>
        </div>
        <div class="summary-box">
          <div class="label">This Week's Average Attendance</div>
          <div class="value ${percentageClass(printStats.weekPct)}">${printStats.weekPct !== null ? `${printStats.weekPct}%` : 'No data'}</div>
          <div class="label" style="margin-top:4px">Week of ${formatAttendanceDate(input.weekStart)}</div>
        </div>
      </div>
      ${input.campusesToPrint.map((campus) => `
        <div class="campus-section">
          <div class="campus-header">
            <h3>${escapeHtml(campus.fullName)}</h3>
            <div class="stats">
              <span>Today: <span class="${inlinePercentageClass(campus.todayPct)}">${campus.todayPct !== null ? `${campus.todayPct}%` : 'N/A'}</span></span>
              <span>Week Avg: <span class="${inlinePercentageClass(campus.weekAvg)}">${campus.weekAvg !== null ? `${campus.weekAvg}%` : 'N/A'}</span></span>
            </div>
          </div>
          ${campus.todayRecord ? `
            <table>
              <tr><td style="width:25%;font-weight:600">Enrolled</td><td>${campus.todayRecord.total_enrolled}</td><td style="width:25%;font-weight:600">Present</td><td>${campus.todayRecord.total_present}</td></tr>
              <tr><td style="font-weight:600">Absent</td><td>${campus.todayRecord.total_absent}</td><td style="font-weight:600">Tardy</td><td>${campus.todayRecord.total_tardy}</td></tr>
              ${campus.todayRecord.notes ? `<tr><td style="font-weight:600">Notes</td><td colspan="3">${escapeHtml(campus.todayRecord.notes)}</td></tr>` : ''}
            </table>
          ` : '<p style="font-size:12px;color:#94a3b8;padding:8px 0;">No attendance data recorded for today.</p>'}
          ${campus.recentData.length > 0 ? `
            <table class="history-table">
              <thead>
                <tr>
                  <th>Date</th><th>Enrolled</th><th>Present</th><th>Absent</th><th>Tardy</th><th>Attendance %</th><th>Notes</th>
                </tr>
              </thead>
              <tbody>
                ${campus.recentData.map((record) => `
                  <tr>
                    <td>${formatAttendanceDate(record.date)}</td>
                    <td>${record.total_enrolled}</td>
                    <td>${record.total_present}</td>
                    <td>${record.total_absent}</td>
                    <td>${record.total_tardy}</td>
                    <td class="${inlinePercentageClass(record.attendance_percentage)}">${record.attendance_percentage.toFixed(1)}%</td>
                    <td>${record.notes ? escapeHtml(record.notes) : '-'}</td>
                  </tr>
                `).join('')}
              </tbody>
            </table>
          ` : ''}
        </div>
      `).join('')}
      <div class="footer">
        <p>FRAMEworks Education Support Platform &bull; Confidential &bull; Printed by ${escapeHtml(input.generatedByName)}</p>
      </div>
    </body>
    </html>
  `;
}
