1078 lines
48 KiB
PHP
1078 lines
48 KiB
PHP
<?= $this->extend('layout/management_layout') ?>
|
|
<?= $this->section('content') ?>
|
|
|
|
<?php
|
|
$classResults = $classResults ?? [];
|
|
$selectedYear = $selectedYear ?? '';
|
|
$selectedPercentile = $selectedPercentile ?? 75;
|
|
$years = $years ?? [];
|
|
|
|
$totalStudents = array_sum(array_column($classResults, 'student_count'));
|
|
$totalPredicted = array_sum(array_column($classResults, 'predicted_count'));
|
|
$totalActual = array_sum(array_column($classResults, 'actual_count'));
|
|
$totalConfirmed = array_sum(array_column($classResults, 'confirmed'));
|
|
$totalSurprise = array_sum(array_column($classResults, 'surprises'));
|
|
$totalMissed = array_sum(array_column($classResults, 'missed'));
|
|
$overallAccuracy = $totalPredicted > 0 ? round($totalConfirmed / $totalPredicted * 100) : ($totalActual === 0 ? 100 : 0);
|
|
|
|
$pct = static function (int $count, int $total): string {
|
|
return $total > 0 ? number_format(($count / $total) * 100, 1) . '%' : '0.0%';
|
|
};
|
|
|
|
$genderKey = static function (?string $gender): string {
|
|
$value = strtolower(trim((string)$gender));
|
|
|
|
return match (true) {
|
|
in_array($value, ['male', 'm', 'boy', 'boys'], true) => 'boys',
|
|
in_array($value, ['female', 'f', 'girl', 'girls'], true) => 'girls',
|
|
default => 'other',
|
|
};
|
|
};
|
|
|
|
$genderStats = static function (array $items) use ($genderKey): array {
|
|
$stats = ['boys' => 0, 'girls' => 0, 'other' => 0];
|
|
|
|
foreach ($items as $item) {
|
|
$stats[$genderKey($item['gender'] ?? '')]++;
|
|
}
|
|
|
|
return $stats;
|
|
};
|
|
|
|
// Winner gender breakdown.
|
|
// "Winner" means actual year-end trophy winner.
|
|
$totalWinnerBoys = 0;
|
|
$totalWinnerGirls = 0;
|
|
$totalWinnerOther = 0;
|
|
$allStudentsFlat = [];
|
|
$passStudents = [];
|
|
$trophyStudents = [];
|
|
|
|
// Sticker names.
|
|
// 2 columns x 7 rows = 14 stickers per page.
|
|
// Stickers print name and class section.
|
|
$stickerColumns = 2;
|
|
$stickerRows = 7;
|
|
$stickerWidthInches = 4.0;
|
|
$stickerHeightInches = 1.33;
|
|
$stickerPrintablePageWidthInches = 8.0;
|
|
$stickerPrintablePageHeightInches = 10.5;
|
|
$stickersPerPage = $stickerColumns * $stickerRows;
|
|
$winnerStickers = [];
|
|
|
|
foreach ($classResults as $cls) {
|
|
foreach (($cls['students'] ?? []) as $s) {
|
|
$allStudentsFlat[] = $s;
|
|
|
|
if (isset($s['year_score']) && is_numeric($s['year_score']) && (float)$s['year_score'] >= 60) {
|
|
$passStudents[] = $s;
|
|
}
|
|
|
|
if (empty($s['actual'])) {
|
|
continue;
|
|
}
|
|
|
|
$trophyStudents[] = $s;
|
|
|
|
$gender = strtolower(trim((string)($s['gender'] ?? '')));
|
|
|
|
if (in_array($gender, ['male', 'm', 'boy', 'boys'], true)) {
|
|
$totalWinnerBoys++;
|
|
} elseif (in_array($gender, ['female', 'f', 'girl', 'girls'], true)) {
|
|
$totalWinnerGirls++;
|
|
} else {
|
|
$totalWinnerOther++;
|
|
}
|
|
|
|
$name = trim((string)($s['name'] ?? ''));
|
|
$sectionName = trim((string)($cls['section_name'] ?? ''));
|
|
|
|
if ($name !== '') {
|
|
$winnerStickers[] = [
|
|
'name' => $name,
|
|
'section' => $sectionName,
|
|
];
|
|
}
|
|
}
|
|
}
|
|
|
|
$totalWinners = $totalWinnerBoys + $totalWinnerGirls + $totalWinnerOther;
|
|
|
|
$winnerBoysPct = $totalWinners > 0 ? round(($totalWinnerBoys / $totalWinners) * 100, 1) : 0;
|
|
$winnerGirlsPct = $totalWinners > 0 ? round(($totalWinnerGirls / $totalWinners) * 100, 1) : 0;
|
|
$winnerOtherPct = $totalWinners > 0 ? round(($totalWinnerOther / $totalWinners) * 100, 1) : 0;
|
|
$allGenderStats = $genderStats($allStudentsFlat);
|
|
$passGenderStats = $genderStats($passStudents);
|
|
$trophyGenderStats = $genderStats($trophyStudents);
|
|
$totalPass = count($passStudents);
|
|
?>
|
|
|
|
<style>
|
|
.status-confirmed { color:#198754; font-weight:600; }
|
|
.status-surprise { color:#0d6efd; font-weight:600; }
|
|
.status-missed { color:#fd7e14; font-weight:600; }
|
|
.status-none { color:#adb5bd; }
|
|
|
|
.print-only { display: none !important; }
|
|
.winner-sticker-print-area { display: none; }
|
|
|
|
@page {
|
|
size: Letter portrait;
|
|
margin: 0.25in;
|
|
}
|
|
|
|
@media print {
|
|
.no-print { display: none !important; }
|
|
.print-only { display: block !important; }
|
|
.screen-only { display: none !important; }
|
|
|
|
body { font-size: 11px; }
|
|
.container-fluid { padding: 0 !important; }
|
|
h2, h3 { font-size: 13px; margin-bottom: .3rem; }
|
|
.print-page-break { break-before: page; }
|
|
|
|
table { width: 100%; border-collapse: collapse; font-size: 10px; }
|
|
table th, table td { border: 1px solid #bbb; padding: 3px 5px; }
|
|
table thead {
|
|
background: #333 !important;
|
|
color: #fff !important;
|
|
-webkit-print-color-adjust: exact;
|
|
print-color-adjust: exact;
|
|
}
|
|
table thead th {
|
|
position: static !important;
|
|
top: auto !important;
|
|
box-shadow: none !important;
|
|
}
|
|
|
|
.s-confirmed { color: #198754; font-weight: bold; }
|
|
.s-surprise { color: #0d6efd; font-weight: bold; }
|
|
.s-missed { color: #fd7e14; font-weight: bold; }
|
|
|
|
body.print-stickers-mode {
|
|
margin: 0 !important;
|
|
padding: 0 !important;
|
|
background: #fff !important;
|
|
}
|
|
|
|
body.print-stickers-mode * {
|
|
box-shadow: none !important;
|
|
}
|
|
|
|
body.print-stickers-mode header,
|
|
body.print-stickers-mode nav,
|
|
body.print-stickers-mode aside,
|
|
body.print-stickers-mode footer,
|
|
body.print-stickers-mode .navbar,
|
|
body.print-stickers-mode .sidebar,
|
|
body.print-stickers-mode .topbar,
|
|
body.print-stickers-mode .app-header,
|
|
body.print-stickers-mode .main-header,
|
|
body.print-stickers-mode .layout-header,
|
|
body.print-stickers-mode .management-header,
|
|
body.print-stickers-mode .page-header,
|
|
body.print-stickers-mode .breadcrumb,
|
|
body.print-stickers-mode .brand,
|
|
body.print-stickers-mode .logo,
|
|
body.print-stickers-mode .header,
|
|
body.print-stickers-mode .no-print,
|
|
body.print-stickers-mode .screen-only,
|
|
body.print-stickers-mode .print-only {
|
|
display: none !important;
|
|
}
|
|
|
|
body.print-stickers-mode .container-fluid > *:not(#winnerStickerPrintArea) {
|
|
display: none !important;
|
|
}
|
|
|
|
body.print-stickers-mode .container-fluid {
|
|
display: block !important;
|
|
visibility: visible !important;
|
|
padding: 0 !important;
|
|
margin: 0 !important;
|
|
width: 100% !important;
|
|
max-width: none !important;
|
|
}
|
|
|
|
body.print-stickers-mode #winnerStickerPrintArea {
|
|
display: block !important;
|
|
visibility: visible !important;
|
|
position: static !important;
|
|
width: 100% !important;
|
|
height: auto !important;
|
|
margin: 0 !important;
|
|
padding: 0 !important;
|
|
overflow: visible !important;
|
|
}
|
|
|
|
body.print-stickers-mode #winnerStickerPrintArea,
|
|
body.print-stickers-mode #winnerStickerPrintArea * {
|
|
visibility: visible !important;
|
|
}
|
|
|
|
body.print-stickers-mode .sticker-page {
|
|
display: grid !important;
|
|
grid-template-columns: repeat(<?= $stickerColumns ?>, <?= rtrim(rtrim(number_format($stickerWidthInches, 2, '.', ''), '0'), '.') ?>in);
|
|
grid-template-rows: repeat(<?= $stickerRows ?>, <?= rtrim(rtrim(number_format($stickerHeightInches, 2, '.', ''), '0'), '.') ?>in);
|
|
gap: 0;
|
|
width: <?= rtrim(rtrim(number_format($stickerPrintablePageWidthInches, 2, '.', ''), '0'), '.') ?>in;
|
|
height: <?= rtrim(rtrim(number_format($stickerPrintablePageHeightInches, 2, '.', ''), '0'), '.') ?>in;
|
|
margin: 0 auto;
|
|
padding: 0;
|
|
box-sizing: border-box;
|
|
align-content: start;
|
|
justify-content: center;
|
|
page-break-inside: avoid;
|
|
break-inside: avoid-page;
|
|
page-break-after: always;
|
|
break-after: page;
|
|
}
|
|
|
|
body.print-stickers-mode .sticker-page:last-child {
|
|
page-break-after: auto;
|
|
break-after: auto;
|
|
}
|
|
|
|
body.print-stickers-mode .sticker-cell {
|
|
display: flex !important;
|
|
justify-content: center;
|
|
align-items: center;
|
|
text-align: center;
|
|
border: none;
|
|
padding: 0;
|
|
overflow: hidden;
|
|
min-height: 0;
|
|
box-sizing: border-box;
|
|
width: <?= rtrim(rtrim(number_format($stickerWidthInches, 2, '.', ''), '0'), '.') ?>in;
|
|
height: <?= rtrim(rtrim(number_format($stickerHeightInches, 2, '.', ''), '0'), '.') ?>in;
|
|
}
|
|
|
|
body.print-stickers-mode .sticker-name {
|
|
display: block !important;
|
|
font-size: 18pt;
|
|
font-weight: 700;
|
|
line-height: 1.1;
|
|
color: #000 !important;
|
|
}
|
|
|
|
body.print-stickers-mode .sticker-content {
|
|
display: flex !important;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
width: 100%;
|
|
transform: translateY(0.22in);
|
|
}
|
|
|
|
body.print-stickers-mode .sticker-section {
|
|
display: block !important;
|
|
margin-top: 0.08in;
|
|
font-size: 10pt;
|
|
font-weight: 600;
|
|
line-height: 1.1;
|
|
color: #000 !important;
|
|
}
|
|
|
|
body.print-stickers-mode .sticker-empty {
|
|
visibility: hidden !important;
|
|
}
|
|
}
|
|
</style>
|
|
|
|
<div class="container-fluid">
|
|
|
|
<!-- Header -->
|
|
<div class="d-flex flex-wrap align-items-center justify-content-between mb-3 gap-2 no-print">
|
|
<div>
|
|
<h2 class="mb-1">
|
|
<i class="bi bi-trophy-fill text-warning me-1"></i>
|
|
Final vs Predicted — <?= esc($selectedYear) ?>
|
|
</h2>
|
|
<p class="text-muted mb-0">
|
|
Compares the <strong>Fall-score prediction</strong> (<?= (int)$selectedPercentile ?>th percentile)
|
|
with the <strong>year-end result</strong> based on the average of Fall & Spring scores.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="d-flex gap-2 flex-wrap">
|
|
<button onclick="printWithCharts()" class="btn btn-outline-secondary btn-sm">
|
|
<i class="bi bi-printer-fill me-1"></i>Print Stats
|
|
</button>
|
|
|
|
<button onclick="printWinnerStickers()" class="btn btn-warning btn-sm">
|
|
<i class="bi bi-tags-fill me-1"></i>Print Winner Stickers
|
|
</button>
|
|
|
|
<a href="<?= site_url('administrator/trophy?' . http_build_query(['school_year' => $selectedYear, 'percentile' => $selectedPercentile])) ?>"
|
|
class="btn btn-outline-secondary btn-sm">
|
|
<i class="bi bi-arrow-left me-1"></i>Back
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Filter -->
|
|
<form method="get" action="<?= site_url('administrator/trophy/final') ?>"
|
|
class="row g-2 align-items-end mb-4 no-print">
|
|
<div class="col-auto">
|
|
<label class="form-label mb-1 small fw-semibold">School Year</label>
|
|
<select name="school_year" class="form-select form-select-sm" style="min-width:130px;">
|
|
<?php foreach ($years as $yr): ?>
|
|
<option value="<?= esc($yr) ?>" <?= $yr === $selectedYear ? 'selected' : '' ?>>
|
|
<?= esc($yr) ?>
|
|
</option>
|
|
<?php endforeach; ?>
|
|
</select>
|
|
</div>
|
|
|
|
<div class="col-auto">
|
|
<label class="form-label mb-1 small fw-semibold">Percentile</label>
|
|
<div class="input-group input-group-sm" style="width:110px;">
|
|
<input type="number"
|
|
name="percentile"
|
|
class="form-control"
|
|
min="1"
|
|
max="99"
|
|
step="1"
|
|
value="<?= (int)$selectedPercentile ?>">
|
|
<span class="input-group-text">%</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-auto">
|
|
<button type="submit" class="btn btn-primary btn-sm">Apply</button>
|
|
</div>
|
|
</form>
|
|
|
|
<?php if (empty($classResults)): ?>
|
|
<div class="alert alert-info no-print">No data found for the selected school year.</div>
|
|
<?php else: ?>
|
|
|
|
<!-- ══ SCREEN VIEW ═══════════════════════════════════════════════════════ -->
|
|
<div class="screen-only">
|
|
|
|
<!-- Legend -->
|
|
<div class="d-flex flex-wrap gap-3 mb-3 small">
|
|
<span><span class="badge bg-success me-1">✓ Confirmed</span> Predicted AND got a year-end trophy</span>
|
|
<span><span class="badge bg-primary me-1">↑ Surprise</span> NOT predicted, but earned a trophy</span>
|
|
<span><span class="badge bg-warning text-dark me-1">↓ Missed</span> Predicted, but fell short year-end</span>
|
|
<span><span class="badge bg-light text-muted border me-1">— None</span> No trophy either way</span>
|
|
</div>
|
|
|
|
<!-- Global stat tiles -->
|
|
<div class="row g-3 mb-4">
|
|
<?php foreach ([
|
|
[$totalPredicted, 'Predicted (Fall)', 'primary', null, $totalStudents > 0 ? round($totalPredicted / $totalStudents * 100) . '% of students' : '—'],
|
|
[$totalActual, 'Actual (Year)', 'warning', 'dark', $totalStudents > 0 ? round($totalActual / $totalStudents * 100) . '% of students' : '—'],
|
|
[$totalConfirmed, 'Confirmed', 'success', null, $totalPredicted > 0 ? round($totalConfirmed / $totalPredicted * 100) . '% of predicted' : '—'],
|
|
[$totalSurprise, 'Surprises', 'info', 'dark', 'Not in prediction'],
|
|
[$totalMissed, 'Missed', 'orange', null, 'Were predicted'],
|
|
[$overallAccuracy,'Accuracy', 'dark', null, 'prediction rate'],
|
|
] as [$val, $label, $color, $textClass, $sub]):
|
|
$isOrange = $color === 'orange';
|
|
$bgClass = $isOrange ? '' : 'bg-' . $color;
|
|
$txClass = $textClass ? 'text-' . $textClass : 'text-white';
|
|
?>
|
|
<div class="col-6 col-sm-4 col-lg-2">
|
|
<div class="card text-center shadow-sm h-100 <?= $isOrange ? 'border-warning' : '' ?>">
|
|
<div class="card-body py-3">
|
|
<div class="fs-3 fw-bold <?= $isOrange ? 'text-warning' : 'text-' . $color ?>">
|
|
<?= $val ?><?= $label === 'Accuracy' ? '%' : '' ?>
|
|
</div>
|
|
<div class="text-muted small"><?= $label ?></div>
|
|
<span class="badge mt-1 <?= $bgClass . ' ' . $txClass ?>"
|
|
<?= $isOrange ? 'style="background:#fd7e14"' : '' ?>>
|
|
<?= $sub ?>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<?php endforeach; ?>
|
|
</div>
|
|
|
|
<!-- Per-class breakdown -->
|
|
<?php foreach ($classResults as $cls): ?>
|
|
<div class="card shadow-sm mb-4">
|
|
<div class="card-header d-flex flex-wrap align-items-center justify-content-between gap-2 py-2"
|
|
style="background:#f8f9fa;">
|
|
<div class="d-flex align-items-center gap-2 flex-wrap">
|
|
<span class="fw-bold fs-6"><?= esc($cls['section_name']) ?></span>
|
|
<span class="badge bg-primary"><?= $cls['predicted_count'] ?> predicted</span>
|
|
<span class="badge bg-warning text-dark"><?= $cls['actual_count'] ?> actual</span>
|
|
|
|
<?php if ($cls['confirmed'] > 0): ?>
|
|
<span class="badge bg-success"><?= $cls['confirmed'] ?> confirmed</span>
|
|
<?php endif; ?>
|
|
|
|
<?php if ($cls['surprises'] > 0): ?>
|
|
<span class="badge bg-info text-dark"><?= $cls['surprises'] ?> surprise<?= $cls['surprises'] > 1 ? 's' : '' ?></span>
|
|
<?php endif; ?>
|
|
|
|
<?php if ($cls['missed'] > 0): ?>
|
|
<span class="badge" style="background:#fd7e14"><?= $cls['missed'] ?> missed</span>
|
|
<?php endif; ?>
|
|
</div>
|
|
|
|
<div class="d-flex gap-3 small align-items-center">
|
|
<span class="text-muted">
|
|
Fall ≥
|
|
<strong><?= $cls['fall_threshold'] !== null ? number_format((float)$cls['fall_threshold'], 1) : '—' ?></strong>
|
|
</span>
|
|
<span class="text-muted">
|
|
Year ≥
|
|
<strong><?= $cls['year_threshold'] !== null ? number_format((float)$cls['year_threshold'], 1) : '—' ?></strong>
|
|
</span>
|
|
<span class="fw-semibold">
|
|
Accuracy:
|
|
<span class="<?= $cls['accuracy'] >= 80 ? 'text-success' : ($cls['accuracy'] >= 50 ? 'text-warning' : 'text-danger') ?>">
|
|
<?= $cls['accuracy'] ?>%
|
|
</span>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card-body p-0">
|
|
<table class="table table-sm table-hover mb-0 align-middle" data-no-mgmt-sticky>
|
|
<thead class="table-light">
|
|
<tr>
|
|
<th class="ps-3" style="width:2rem;">#</th>
|
|
<th>Name</th>
|
|
<th class="text-center" style="width:3rem;">Gender</th>
|
|
<th class="text-end">Fall</th>
|
|
<th class="text-end">Spring</th>
|
|
<th class="text-end">Year Avg</th>
|
|
<th class="text-center">Predicted</th>
|
|
<th class="text-center">Actual</th>
|
|
<th class="text-center">Status</th>
|
|
</tr>
|
|
</thead>
|
|
|
|
<tbody>
|
|
<?php $rank = 0; foreach ($cls['students'] as $s):
|
|
if ($s['status'] === 'none') continue;
|
|
$rank++;
|
|
|
|
$genderNorm = strtolower(trim((string)($s['gender'] ?? '')));
|
|
$isMale = in_array($genderNorm, ['male', 'm', 'boy'], true);
|
|
|
|
$rowBg = match ($s['status']) {
|
|
'confirmed' => 'table-success',
|
|
'surprise' => 'table-primary',
|
|
'missed' => 'table-warning',
|
|
default => '',
|
|
};
|
|
?>
|
|
<tr class="<?= $rowBg ?>">
|
|
<td class="ps-3 text-muted small"><?= $rank ?></td>
|
|
<td class="fw-semibold small"><?= esc($s['name']) ?></td>
|
|
<td class="text-center">
|
|
<span class="badge" style="background:<?= $isMale ? '#4A90E2' : '#E47AB0' ?>;font-size:.65rem;">
|
|
<?= $isMale ? 'M' : 'F' ?>
|
|
</span>
|
|
</td>
|
|
<td class="text-end small"><?= $s['fall_score'] !== null ? number_format($s['fall_score'], 1) : '<span class="text-muted">—</span>' ?></td>
|
|
<td class="text-end small"><?= $s['spring_score'] !== null ? number_format($s['spring_score'], 1) : '<span class="text-muted">—</span>' ?></td>
|
|
<td class="text-end small fw-semibold"><?= $s['year_score'] !== null ? number_format($s['year_score'], 1) : '<span class="text-muted">—</span>' ?></td>
|
|
<td class="text-center small">
|
|
<?= $s['predicted']
|
|
? '<span class="badge bg-primary">Yes</span>'
|
|
: '<span class="badge bg-light text-muted border">No</span>' ?>
|
|
</td>
|
|
<td class="text-center small">
|
|
<?= $s['actual']
|
|
? '<span class="badge bg-warning text-dark">Yes</span>'
|
|
: '<span class="badge bg-light text-muted border">No</span>' ?>
|
|
</td>
|
|
<td class="text-center small">
|
|
<?php match ($s['status']) {
|
|
'confirmed' => print '<span class="badge bg-success">✓ Confirmed</span>',
|
|
'surprise' => print '<span class="badge bg-info text-dark">↑ Surprise</span>',
|
|
'missed' => print '<span class="badge" style="background:#fd7e14;color:#fff;">↓ Missed</span>',
|
|
default => print '<span class="text-muted small">—</span>',
|
|
}; ?>
|
|
</td>
|
|
</tr>
|
|
<?php endforeach; ?>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
<?php endforeach; ?>
|
|
|
|
<!-- Overall accuracy summary table -->
|
|
<div class="card shadow-sm mt-2 mb-4">
|
|
<div class="card-header bg-dark text-white fw-semibold py-2">
|
|
<i class="bi bi-bar-chart-fill me-2"></i>Prediction Accuracy Summary — <?= esc($selectedYear) ?>
|
|
</div>
|
|
|
|
<div class="card-body p-0">
|
|
<table class="table table-sm table-bordered mb-0 align-middle" data-no-mgmt-sticky>
|
|
<thead class="table-dark">
|
|
<tr>
|
|
<th class="ps-2">Class</th>
|
|
<th class="text-center">Students</th>
|
|
<th class="text-center text-primary-emphasis">Predicted</th>
|
|
<th class="text-center text-warning-emphasis">Actual</th>
|
|
<th class="text-center text-success-emphasis">✓ Confirmed</th>
|
|
<th class="text-center" style="color:#6ea8fe">↑ Surprises</th>
|
|
<th class="text-center" style="color:#ffda6a">↓ Missed</th>
|
|
<th class="text-center">Accuracy</th>
|
|
<th class="text-end pe-2">Fall ≥</th>
|
|
<th class="text-end pe-2">Year ≥</th>
|
|
</tr>
|
|
</thead>
|
|
|
|
<tbody>
|
|
<?php foreach ($classResults as $cls): ?>
|
|
<tr>
|
|
<td class="ps-2 fw-semibold small"><?= esc($cls['section_name']) ?></td>
|
|
<td class="text-center small"><?= $cls['student_count'] ?></td>
|
|
<td class="text-center small"><span class="badge bg-primary"><?= $cls['predicted_count'] ?></span></td>
|
|
<td class="text-center small"><span class="badge bg-warning text-dark"><?= $cls['actual_count'] ?></span></td>
|
|
<td class="text-center small"><span class="badge bg-success"><?= $cls['confirmed'] ?></span></td>
|
|
<td class="text-center small"><span class="badge bg-info text-dark"><?= $cls['surprises'] ?></span></td>
|
|
<td class="text-center small"><span class="badge" style="background:#fd7e14"><?= $cls['missed'] ?></span></td>
|
|
<td class="text-center small fw-semibold <?= $cls['accuracy'] >= 80 ? 'text-success' : ($cls['accuracy'] >= 50 ? 'text-warning' : 'text-danger') ?>">
|
|
<?= $cls['accuracy'] ?>%
|
|
</td>
|
|
<td class="text-end pe-2 small text-muted"><?= $cls['fall_threshold'] !== null ? number_format((float)$cls['fall_threshold'], 1) : '—' ?></td>
|
|
<td class="text-end pe-2 small text-muted"><?= $cls['year_threshold'] !== null ? number_format((float)$cls['year_threshold'], 1) : '—' ?></td>
|
|
</tr>
|
|
<?php endforeach; ?>
|
|
</tbody>
|
|
|
|
<tfoot class="table-secondary fw-semibold">
|
|
<tr>
|
|
<td class="ps-2">Total</td>
|
|
<td class="text-center"><?= $totalStudents ?></td>
|
|
<td class="text-center"><span class="badge bg-primary"><?= $totalPredicted ?></span></td>
|
|
<td class="text-center"><span class="badge bg-warning text-dark"><?= $totalActual ?></span></td>
|
|
<td class="text-center"><span class="badge bg-success"><?= $totalConfirmed ?></span></td>
|
|
<td class="text-center"><span class="badge bg-info text-dark"><?= $totalSurprise ?></span></td>
|
|
<td class="text-center"><span class="badge" style="background:#fd7e14"><?= $totalMissed ?></span></td>
|
|
<td class="text-center fw-semibold <?= $overallAccuracy >= 80 ? 'text-success' : ($overallAccuracy >= 50 ? 'text-warning' : 'text-danger') ?>">
|
|
<?= $overallAccuracy ?>%
|
|
</td>
|
|
<td colspan="2"></td>
|
|
</tr>
|
|
</tfoot>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Charts -->
|
|
<div class="row g-4 mt-1 mb-4">
|
|
<div class="col-12 col-lg-8">
|
|
<div class="border rounded p-3 h-100">
|
|
<div class="small fw-semibold text-muted mb-2">
|
|
<i class="bi bi-bar-chart-fill me-1"></i>Trophy Counts per Class
|
|
</div>
|
|
<canvas id="chart-counts" style="max-height:280px;"></canvas>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-12 col-lg-4">
|
|
<div class="row g-3 h-100">
|
|
<div class="col-12">
|
|
<div class="border rounded p-3">
|
|
<div class="small fw-semibold text-muted mb-2">
|
|
<i class="bi bi-bullseye me-1"></i>Prediction Accuracy per Class
|
|
</div>
|
|
<canvas id="chart-accuracy" style="max-height:130px;"></canvas>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-12">
|
|
<div class="border rounded p-3">
|
|
<div class="small fw-semibold text-muted mb-2">
|
|
<i class="bi bi-pie-chart-fill me-1"></i>Overall Outcome Breakdown
|
|
</div>
|
|
<canvas id="chart-breakdown" style="max-height:130px;"></canvas>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Winner gender summary -->
|
|
<div class="card shadow-sm mt-2 mb-4">
|
|
<div class="card-header bg-dark text-white fw-semibold py-2">
|
|
<i class="bi bi-gender-ambiguous me-2"></i>Winner Gender Breakdown
|
|
</div>
|
|
|
|
<div class="card-body">
|
|
<div class="row g-3 align-items-stretch">
|
|
<div class="col-12 col-lg-3">
|
|
<div class="border rounded p-3 text-center h-100">
|
|
<div class="text-muted small mb-1">Total Winners</div>
|
|
<div class="display-6 fw-bold"><?= (int)$totalWinners ?></div>
|
|
<div class="small text-muted">Actual year-end trophy winners</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-6 col-lg-3">
|
|
<div class="border rounded p-3 text-center h-100">
|
|
<div class="text-muted small mb-1">Boys</div>
|
|
<div class="display-6 fw-bold text-primary"><?= (int)$totalWinnerBoys ?></div>
|
|
<div class="fw-semibold"><?= number_format($winnerBoysPct, 1) ?>%</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-6 col-lg-3">
|
|
<div class="border rounded p-3 text-center h-100">
|
|
<div class="text-muted small mb-1">Girls</div>
|
|
<div class="display-6 fw-bold" style="color:#E47AB0;"><?= (int)$totalWinnerGirls ?></div>
|
|
<div class="fw-semibold"><?= number_format($winnerGirlsPct, 1) ?>%</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="mt-3">
|
|
<div class="progress" style="height:26px;">
|
|
<?php if ($totalWinners > 0): ?>
|
|
<div class="progress-bar bg-primary"
|
|
role="progressbar"
|
|
style="width: <?= $winnerBoysPct ?>%;"
|
|
aria-valuenow="<?= $winnerBoysPct ?>"
|
|
aria-valuemin="0"
|
|
aria-valuemax="100">
|
|
Boys <?= number_format($winnerBoysPct, 1) ?>%
|
|
</div>
|
|
|
|
<div class="progress-bar"
|
|
role="progressbar"
|
|
style="width: <?= $winnerGirlsPct ?>%; background:#E47AB0;"
|
|
aria-valuenow="<?= $winnerGirlsPct ?>"
|
|
aria-valuemin="0"
|
|
aria-valuemax="100">
|
|
Girls <?= number_format($winnerGirlsPct, 1) ?>%
|
|
</div>
|
|
<?php else: ?>
|
|
<div class="progress-bar bg-secondary"
|
|
role="progressbar"
|
|
style="width: 100%;"
|
|
aria-valuenow="0"
|
|
aria-valuemin="0"
|
|
aria-valuemax="100">
|
|
No winners
|
|
</div>
|
|
<?php endif; ?>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div><!-- /screen-only -->
|
|
|
|
<!-- ══ PRINT VIEW ════════════════════════════════════════════════════════ -->
|
|
<div class="print-only">
|
|
|
|
<div style="text-align:center;margin-bottom:10px;border-bottom:2px solid #333;padding-bottom:6px;">
|
|
<h2 style="margin:0;">Final vs Predicted — <?= esc($selectedYear) ?></h2>
|
|
<p style="margin:3px 0 0;font-size:10px;color:#555;">
|
|
<?= (int)$selectedPercentile ?>th percentile —
|
|
Predicted: <?= $totalPredicted ?> —
|
|
Actual: <?= $totalActual ?> —
|
|
Confirmed: <?= $totalConfirmed ?> —
|
|
Accuracy: <?= $overallAccuracy ?>%
|
|
</p>
|
|
</div>
|
|
|
|
<h3 style="margin-bottom:6px;">Print Stats</h3>
|
|
<table data-no-mgmt-sticky style="margin-bottom:12px;">
|
|
<thead>
|
|
<tr>
|
|
<th>Metric</th>
|
|
<th style="text-align:center;">Count</th>
|
|
<th style="text-align:center;">Percent</th>
|
|
<th style="text-align:center;">Boys</th>
|
|
<th style="text-align:center;">Boys %</th>
|
|
<th style="text-align:center;">Girls</th>
|
|
<th style="text-align:center;">Girls %</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td>Total Students</td>
|
|
<td style="text-align:center;"><?= $totalStudents ?></td>
|
|
<td style="text-align:center;">100.0%</td>
|
|
<td style="text-align:center;"><?= $allGenderStats['boys'] ?></td>
|
|
<td style="text-align:center;"><?= $pct($allGenderStats['boys'], $totalStudents) ?></td>
|
|
<td style="text-align:center;"><?= $allGenderStats['girls'] ?></td>
|
|
<td style="text-align:center;"><?= $pct($allGenderStats['girls'], $totalStudents) ?></td>
|
|
</tr>
|
|
<tr>
|
|
<td>Pass</td>
|
|
<td style="text-align:center;"><?= $totalPass ?></td>
|
|
<td style="text-align:center;"><?= $pct($totalPass, $totalStudents) ?></td>
|
|
<td style="text-align:center;"><?= $passGenderStats['boys'] ?></td>
|
|
<td style="text-align:center;"><?= $pct($passGenderStats['boys'], $totalPass) ?></td>
|
|
<td style="text-align:center;"><?= $passGenderStats['girls'] ?></td>
|
|
<td style="text-align:center;"><?= $pct($passGenderStats['girls'], $totalPass) ?></td>
|
|
</tr>
|
|
<tr>
|
|
<td>Trophies</td>
|
|
<td style="text-align:center;"><?= $totalWinners ?></td>
|
|
<td style="text-align:center;"><?= $pct($totalWinners, $totalStudents) ?></td>
|
|
<td style="text-align:center;"><?= $trophyGenderStats['boys'] ?></td>
|
|
<td style="text-align:center;"><?= $pct($trophyGenderStats['boys'], $totalWinners) ?></td>
|
|
<td style="text-align:center;"><?= $trophyGenderStats['girls'] ?></td>
|
|
<td style="text-align:center;"><?= $pct($trophyGenderStats['girls'], $totalWinners) ?></td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
|
|
<h3 style="margin-bottom:4px;">Student Detail</h3>
|
|
<table data-no-mgmt-sticky>
|
|
<thead>
|
|
<tr>
|
|
<th>#</th>
|
|
<th>Class</th>
|
|
<th>Name</th>
|
|
<th style="text-align:center;">G</th>
|
|
<th style="text-align:right;">Fall</th>
|
|
<th style="text-align:right;">Spring</th>
|
|
<th style="text-align:right;">Year Avg</th>
|
|
<th style="text-align:center;">Predicted</th>
|
|
<th style="text-align:center;">Actual</th>
|
|
<th style="text-align:center;">Status</th>
|
|
</tr>
|
|
</thead>
|
|
|
|
<tbody>
|
|
<?php
|
|
foreach ($classResults as $cls):
|
|
$classPrintRows = array_values(array_filter(
|
|
$cls['students'],
|
|
static fn (array $student): bool => in_array($student['status'], ['confirmed', 'surprise'], true)
|
|
));
|
|
$classPrintRows = array_reverse($classPrintRows);
|
|
|
|
foreach ($classPrintRows as $idx => $s):
|
|
$rank = count($classPrintRows) - $idx;
|
|
$genderNorm = strtolower(trim((string)($s['gender'] ?? '')));
|
|
$isMale = in_array($genderNorm, ['male', 'm', 'boy'], true);
|
|
$statusLabel = match ($s['status']) {
|
|
'confirmed' => '✓ Confirmed',
|
|
'surprise' => '↑ Surprise',
|
|
'missed' => '↓ Missed',
|
|
default => '—',
|
|
};
|
|
$statusClass = 's-' . $s['status'];
|
|
?>
|
|
<tr>
|
|
<td style="text-align:center;"><?= $rank ?></td>
|
|
<td><?= esc($cls['section_name']) ?></td>
|
|
<td><strong><?= esc($s['name']) ?></strong></td>
|
|
<td style="text-align:center;"><?= $isMale ? 'M' : 'F' ?></td>
|
|
<td style="text-align:right;"><?= $s['fall_score'] !== null ? number_format($s['fall_score'], 1) : '—' ?></td>
|
|
<td style="text-align:right;"><?= $s['spring_score'] !== null ? number_format($s['spring_score'], 1) : '—' ?></td>
|
|
<td style="text-align:right;font-weight:bold;"><?= $s['year_score'] !== null ? number_format($s['year_score'], 1) : '—' ?></td>
|
|
<td style="text-align:center;"><?= $s['predicted'] ? 'Yes' : 'No' ?></td>
|
|
<td style="text-align:center;"><?= $s['actual'] ? 'Yes' : 'No' ?></td>
|
|
<td style="text-align:center;" class="<?= $statusClass ?>"><?= $statusLabel ?></td>
|
|
</tr>
|
|
<?php endforeach; endforeach; ?>
|
|
</tbody>
|
|
</table>
|
|
|
|
<div class="print-page-break"></div>
|
|
<h3 style="margin-bottom:4px;">Prediction Accuracy Summary</h3>
|
|
<table data-no-mgmt-sticky style="margin-bottom:14px;">
|
|
<thead>
|
|
<tr>
|
|
<th>Class</th>
|
|
<th style="text-align:center;">Students</th>
|
|
<th style="text-align:center;">Predicted</th>
|
|
<th style="text-align:center;">Actual</th>
|
|
<th style="text-align:center;">✓ Confirmed</th>
|
|
<th style="text-align:center;">↑ Surprises</th>
|
|
<th style="text-align:center;">↓ Missed</th>
|
|
<th style="text-align:center;">Accuracy</th>
|
|
<th style="text-align:right;">Fall ≥</th>
|
|
<th style="text-align:right;">Year ≥</th>
|
|
</tr>
|
|
</thead>
|
|
|
|
<tbody>
|
|
<?php foreach ($classResults as $cls): ?>
|
|
<tr>
|
|
<td><?= esc($cls['section_name']) ?></td>
|
|
<td style="text-align:center;"><?= $cls['student_count'] ?></td>
|
|
<td style="text-align:center;"><?= $cls['predicted_count'] ?></td>
|
|
<td style="text-align:center;"><?= $cls['actual_count'] ?></td>
|
|
<td style="text-align:center;" class="s-confirmed"><?= $cls['confirmed'] ?></td>
|
|
<td style="text-align:center;" class="s-surprise"><?= $cls['surprises'] ?></td>
|
|
<td style="text-align:center;" class="s-missed"><?= $cls['missed'] ?></td>
|
|
<td style="text-align:center;font-weight:bold;"><?= $cls['accuracy'] ?>%</td>
|
|
<td style="text-align:right;"><?= $cls['fall_threshold'] !== null ? number_format((float)$cls['fall_threshold'], 1) : '—' ?></td>
|
|
<td style="text-align:right;"><?= $cls['year_threshold'] !== null ? number_format((float)$cls['year_threshold'], 1) : '—' ?></td>
|
|
</tr>
|
|
<?php endforeach; ?>
|
|
</tbody>
|
|
|
|
<tfoot>
|
|
<tr>
|
|
<td style="font-weight:bold;">Total</td>
|
|
<td style="text-align:center;font-weight:bold;"><?= $totalStudents ?></td>
|
|
<td style="text-align:center;font-weight:bold;"><?= $totalPredicted ?></td>
|
|
<td style="text-align:center;font-weight:bold;"><?= $totalActual ?></td>
|
|
<td style="text-align:center;font-weight:bold;" class="s-confirmed"><?= $totalConfirmed ?></td>
|
|
<td style="text-align:center;font-weight:bold;" class="s-surprise"><?= $totalSurprise ?></td>
|
|
<td style="text-align:center;font-weight:bold;" class="s-missed"><?= $totalMissed ?></td>
|
|
<td style="text-align:center;font-weight:bold;"><?= $overallAccuracy ?>%</td>
|
|
<td colspan="2"></td>
|
|
</tr>
|
|
</tfoot>
|
|
</table>
|
|
|
|
<div class="print-page-break"></div>
|
|
<h3 style="margin-bottom:6px;">Charts</h3>
|
|
|
|
<div style="margin-bottom:14px;">
|
|
<p style="font-size:10px;font-weight:bold;margin:0 0 4px;">Trophy Counts per Class</p>
|
|
<img id="print-chart-counts" style="width:100%;max-height:220px;object-fit:contain;" src="" alt="">
|
|
</div>
|
|
|
|
<div style="display:flex;gap:16px;margin-bottom:14px;">
|
|
<div style="flex:1;">
|
|
<p style="font-size:10px;font-weight:bold;margin:0 0 4px;">Prediction Accuracy per Class</p>
|
|
<img id="print-chart-accuracy" style="width:100%;max-height:160px;object-fit:contain;" src="" alt="">
|
|
</div>
|
|
<div style="flex:1;">
|
|
<p style="font-size:10px;font-weight:bold;margin:0 0 4px;">Overall Outcome Breakdown</p>
|
|
<img id="print-chart-breakdown" style="width:100%;max-height:160px;object-fit:contain;" src="" alt="">
|
|
</div>
|
|
</div>
|
|
|
|
<div style="margin-top:10px;border:1px solid #bbb;padding:8px;">
|
|
<p style="font-size:11px;font-weight:bold;margin:0 0 6px;">Winner Gender Breakdown</p>
|
|
|
|
<table data-no-mgmt-sticky>
|
|
<thead>
|
|
<tr>
|
|
<th>Group</th>
|
|
<th style="text-align:center;">Winners</th>
|
|
<th style="text-align:center;">Percentage</th>
|
|
</tr>
|
|
</thead>
|
|
|
|
<tbody>
|
|
<tr>
|
|
<td>Boys</td>
|
|
<td style="text-align:center;"><?= (int)$totalWinnerBoys ?></td>
|
|
<td style="text-align:center;"><?= number_format($winnerBoysPct, 1) ?>%</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Girls</td>
|
|
<td style="text-align:center;"><?= (int)$totalWinnerGirls ?></td>
|
|
<td style="text-align:center;"><?= number_format($winnerGirlsPct, 1) ?>%</td>
|
|
</tr>
|
|
</tbody>
|
|
|
|
<tfoot>
|
|
<tr>
|
|
<td style="font-weight:bold;">Total Winners</td>
|
|
<td style="text-align:center;font-weight:bold;"><?= (int)$totalWinners ?></td>
|
|
<td style="text-align:center;font-weight:bold;"><?= $totalWinners > 0 ? '100.0%' : '0.0%' ?></td>
|
|
</tr>
|
|
</tfoot>
|
|
</table>
|
|
</div>
|
|
|
|
</div><!-- /print-only -->
|
|
|
|
<!-- Winner sticker print area: names only, no header, no score, no class -->
|
|
<div id="winnerStickerPrintArea" class="winner-sticker-print-area">
|
|
<?php if (!empty($winnerStickers)): ?>
|
|
<?php foreach (array_chunk($winnerStickers, $stickersPerPage) as $chunk): ?>
|
|
<div class="sticker-page">
|
|
<?php foreach ($chunk as $winnerSticker): ?>
|
|
<div class="sticker-cell">
|
|
<div class="sticker-content">
|
|
<div class="sticker-name"><?= esc($winnerSticker['name']) ?></div>
|
|
<div class="sticker-section"><?= esc($winnerSticker['section']) ?></div>
|
|
</div>
|
|
</div>
|
|
<?php endforeach; ?>
|
|
|
|
<?php for ($i = 0, $remaining = $stickersPerPage - count($chunk); $i < $remaining; $i++): ?>
|
|
<div class="sticker-cell sticker-empty"></div>
|
|
<?php endfor; ?>
|
|
</div>
|
|
<?php endforeach; ?>
|
|
<?php endif; ?>
|
|
</div>
|
|
|
|
<?php endif; ?>
|
|
</div>
|
|
|
|
<?= $this->section('scripts') ?>
|
|
<script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.3/dist/chart.umd.min.js"></script>
|
|
<script>
|
|
(function () {
|
|
<?php
|
|
$cLabels = [];
|
|
$cPredicted = [];
|
|
$cActual = [];
|
|
$cConfirmed = [];
|
|
$cSurprise = [];
|
|
$cMissed = [];
|
|
$cAccuracy = [];
|
|
|
|
foreach ($classResults as $cls) {
|
|
$cLabels[] = $cls['section_name'];
|
|
$cPredicted[] = $cls['predicted_count'];
|
|
$cActual[] = $cls['actual_count'];
|
|
$cConfirmed[] = $cls['confirmed'];
|
|
$cSurprise[] = $cls['surprises'];
|
|
$cMissed[] = $cls['missed'];
|
|
$cAccuracy[] = $cls['accuracy'];
|
|
}
|
|
?>
|
|
|
|
var labels = <?= json_encode($cLabels) ?>;
|
|
var predicted = <?= json_encode($cPredicted) ?>;
|
|
var actual = <?= json_encode($cActual) ?>;
|
|
var confirmed = <?= json_encode($cConfirmed) ?>;
|
|
var surprises = <?= json_encode($cSurprise) ?>;
|
|
var missed = <?= json_encode($cMissed) ?>;
|
|
var accuracy = <?= json_encode($cAccuracy) ?>;
|
|
|
|
if (document.getElementById('chart-counts')) {
|
|
new Chart(document.getElementById('chart-counts'), {
|
|
type: 'bar',
|
|
data: {
|
|
labels: labels,
|
|
datasets: [
|
|
{ label: 'Predicted', data: predicted, backgroundColor: '#4A90E2', borderRadius: 3 },
|
|
{ label: 'Actual', data: actual, backgroundColor: '#f0a500', borderRadius: 3 },
|
|
{ label: 'Confirmed', data: confirmed, backgroundColor: '#28a745', borderRadius: 3 },
|
|
{ label: 'Surprises', data: surprises, backgroundColor: '#17a2b8', borderRadius: 3 },
|
|
{ label: 'Missed', data: missed, backgroundColor: '#fd7e14', borderRadius: 3 },
|
|
]
|
|
},
|
|
options: {
|
|
responsive: true,
|
|
maintainAspectRatio: true,
|
|
plugins: { legend: { position: 'bottom' } },
|
|
scales: {
|
|
x: { grid: { color: '#f0f0f0' } },
|
|
y: { beginAtZero: true, ticks: { stepSize: 1 }, grid: { color: '#f0f0f0' } }
|
|
}
|
|
}
|
|
});
|
|
}
|
|
|
|
if (document.getElementById('chart-accuracy')) {
|
|
new Chart(document.getElementById('chart-accuracy'), {
|
|
type: 'bar',
|
|
data: {
|
|
labels: labels,
|
|
datasets: [{
|
|
label: 'Accuracy %',
|
|
data: accuracy,
|
|
backgroundColor: accuracy.map(function(a) {
|
|
return a >= 80 ? '#28a745' : a >= 50 ? '#f0a500' : '#dc3545';
|
|
}),
|
|
borderRadius: 3
|
|
}]
|
|
},
|
|
options: {
|
|
responsive: true,
|
|
maintainAspectRatio: true,
|
|
plugins: { legend: { display: false } },
|
|
scales: {
|
|
y: {
|
|
beginAtZero: true,
|
|
max: 100,
|
|
ticks: {
|
|
callback: function(v) {
|
|
return v + '%';
|
|
}
|
|
},
|
|
grid: { color: '#f0f0f0' }
|
|
}
|
|
}
|
|
}
|
|
});
|
|
}
|
|
|
|
if (document.getElementById('chart-breakdown')) {
|
|
new Chart(document.getElementById('chart-breakdown'), {
|
|
type: 'doughnut',
|
|
data: {
|
|
labels: ['Confirmed', 'Surprises', 'Missed'],
|
|
datasets: [{
|
|
data: [<?= $totalConfirmed ?>, <?= $totalSurprise ?>, <?= $totalMissed ?>],
|
|
backgroundColor: ['#28a745', '#17a2b8', '#fd7e14'],
|
|
borderWidth: 2
|
|
}]
|
|
},
|
|
options: {
|
|
responsive: true,
|
|
maintainAspectRatio: true,
|
|
plugins: {
|
|
legend: { position: 'bottom' },
|
|
tooltip: {
|
|
callbacks: {
|
|
label: function(ctx) {
|
|
var total = ctx.dataset.data.reduce(function(a, b) {
|
|
return a + b;
|
|
}, 0);
|
|
var pct = total > 0 ? Math.round(ctx.parsed / total * 100) : 0;
|
|
return ctx.label + ': ' + ctx.parsed + ' (' + pct + '%)';
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
});
|
|
}
|
|
})();
|
|
|
|
function captureCharts() {
|
|
var map = {
|
|
'chart-counts': 'print-chart-counts',
|
|
'chart-accuracy': 'print-chart-accuracy',
|
|
'chart-breakdown': 'print-chart-breakdown',
|
|
};
|
|
|
|
Object.keys(map).forEach(function(canvasId) {
|
|
var canvas = document.getElementById(canvasId);
|
|
var img = document.getElementById(map[canvasId]);
|
|
|
|
if (canvas && img) {
|
|
img.src = canvas.toDataURL('image/png');
|
|
}
|
|
});
|
|
}
|
|
|
|
function printWithCharts() {
|
|
document.body.classList.remove('print-stickers-mode');
|
|
captureCharts();
|
|
window.print();
|
|
}
|
|
|
|
function printWinnerStickers() {
|
|
document.body.classList.add('print-stickers-mode');
|
|
|
|
setTimeout(function () {
|
|
window.print();
|
|
|
|
setTimeout(function () {
|
|
document.body.classList.remove('print-stickers-mode');
|
|
}, 1000);
|
|
}, 250);
|
|
}
|
|
|
|
window.addEventListener('beforeprint', function () {
|
|
if (!document.body.classList.contains('print-stickers-mode')) {
|
|
captureCharts();
|
|
}
|
|
});
|
|
</script>
|
|
<?= $this->endSection() ?>
|
|
|
|
<?= $this->endSection() ?>
|