Smart MOOC – Pengumuman Peserta Batch 1<\/title>\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@400;500;600;700;800;900&display=swap\" rel=\"stylesheet\">\n <style>\n * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n }\n\n body {\n font-family: 'Inter', sans-serif;\n background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n min-height: 100vh;\n padding: 20px;\n }\n\n .container {\n max-width: 1200px;\n margin: 0 auto;\n }\n\n \/* Header Section *\/\n .header {\n background: white;\n border-radius: 24px;\n padding: 3rem;\n margin-bottom: 2rem;\n box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2);\n text-align: center;\n position: relative;\n overflow: hidden;\n }\n\n .header::before {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n height: 6px;\n background: linear-gradient(90deg, #667eea 0%, #764ba2 100%);\n }\n\n .badge {\n display: inline-block;\n background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n color: white;\n padding: 10px 24px;\n border-radius: 50px;\n font-size: 0.9rem;\n font-weight: 600;\n margin-bottom: 1.5rem;\n box-shadow: 0 4px 15px rgba(102, 126, 234, 0.4);\n }\n\n .header h1 {\n font-size: 2.5rem;\n font-weight: 800;\n color: #1a1a1a;\n margin-bottom: 1rem;\n line-height: 1.2;\n }\n\n .header .subtitle {\n font-size: 1.3rem;\n color: #666;\n font-weight: 500;\n margin-bottom: 2rem;\n }\n\n .info-box {\n background: linear-gradient(135deg, #f8f9ff 0%, #f0f2ff 100%);\n border-radius: 16px;\n padding: 1.5rem;\n border-left: 5px solid #667eea;\n }\n\n .info-box .date {\n font-size: 1.1rem;\n font-weight: 700;\n color: #667eea;\n margin-bottom: 0.5rem;\n }\n\n .info-box .description {\n font-size: 1rem;\n color: #555;\n line-height: 1.6;\n }\n\n \/* Search & Stats Section *\/\n .controls {\n background: white;\n border-radius: 20px;\n padding: 2rem;\n margin-bottom: 2rem;\n box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);\n }\n\n .search-container {\n position: relative;\n margin-bottom: 1.5rem;\n }\n\n .search-input {\n width: 100%;\n padding: 1rem 1rem 1rem 3rem;\n font-size: 1rem;\n border: 2px solid #e0e0e0;\n border-radius: 12px;\n font-family: 'Inter', sans-serif;\n transition: all 0.3s ease;\n }\n\n .search-input:focus {\n outline: none;\n border-color: #667eea;\n box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);\n }\n\n .search-icon {\n position: absolute;\n left: 1rem;\n top: 50%;\n transform: translateY(-50%);\n font-size: 1.2rem;\n color: #999;\n }\n\n .stats {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n gap: 1.5rem;\n }\n\n .stat-card {\n background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n padding: 1.5rem;\n border-radius: 16px;\n color: white;\n text-align: center;\n box-shadow: 0 4px 15px rgba(102, 126, 234, 0.3);\n }\n\n .stat-card .number {\n font-size: 2.5rem;\n font-weight: 800;\n margin-bottom: 0.5rem;\n }\n\n .stat-card .label {\n font-size: 0.95rem;\n opacity: 0.95;\n font-weight: 500;\n }\n\n \/* Table Section *\/\n .table-container {\n background: white;\n border-radius: 20px;\n padding: 2rem;\n box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);\n overflow: hidden;\n }\n\n .table-header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 1.5rem;\n }\n\n .table-title {\n font-size: 1.8rem;\n font-weight: 700;\n color: #1a1a1a;\n }\n\n .filter-buttons {\n display: flex;\n gap: 0.5rem;\n flex-wrap: wrap;\n }\n\n .filter-btn {\n padding: 0.5rem 1rem;\n border: 2px solid #e0e0e0;\n background: white;\n border-radius: 8px;\n font-size: 0.9rem;\n font-weight: 600;\n cursor: pointer;\n transition: all 0.3s ease;\n color: #666;\n }\n\n .filter-btn:hover {\n border-color: #667eea;\n color: #667eea;\n }\n\n .filter-btn.active {\n background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n color: white;\n border-color: transparent;\n }\n\n .table-wrapper {\n overflow-x: auto;\n border-radius: 12px;\n border: 1px solid #f0f0f0;\n }\n\n table {\n width: 100%;\n border-collapse: collapse;\n }\n\n thead {\n background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n color: white;\n }\n\n thead th {\n padding: 1.2rem;\n text-align: left;\n font-weight: 700;\n font-size: 0.95rem;\n letter-spacing: 0.5px;\n }\n\n tbody tr {\n border-bottom: 1px solid #f0f0f0;\n transition: all 0.2s ease;\n }\n\n tbody tr:hover {\n background: linear-gradient(135deg, #f8f9ff 0%, #f0f2ff 100%);\n transform: scale(1.01);\n }\n\n tbody td {\n padding: 1.2rem;\n color: #333;\n font-size: 0.95rem;\n }\n\n tbody tr.highlight {\n background: linear-gradient(135deg, #fff9e6 0%, #fff3cc 100%);\n font-weight: 600;\n }\n\n .no-results {\n text-align: center;\n padding: 3rem;\n color: #999;\n font-size: 1.1rem;\n }\n\n .no-results-icon {\n font-size: 3rem;\n margin-bottom: 1rem;\n }\n\n \/* Footer Notice *\/\n .footer-notice {\n background: white;\n border-radius: 20px;\n padding: 2rem;\n margin-top: 2rem;\n box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);\n text-align: center;\n }\n\n .footer-notice h3 {\n font-size: 1.5rem;\n font-weight: 700;\n color: #1a1a1a;\n margin-bottom: 1rem;\n }\n\n .footer-notice p {\n font-size: 1.1rem;\n color: #666;\n line-height: 1.6;\n margin-bottom: 1.5rem;\n }\n\n .cta-button {\n display: inline-block;\n background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n color: white;\n padding: 1rem 2.5rem;\n border-radius: 12px;\n font-weight: 700;\n font-size: 1.1rem;\n text-decoration: none;\n transition: all 0.3s ease;\n box-shadow: 0 4px 15px rgba(102, 126, 234, 0.4);\n }\n\n .cta-button:hover {\n transform: translateY(-2px);\n box-shadow: 0 6px 25px rgba(102, 126, 234, 0.5);\n }\n\n \/* Animations *\/\n @keyframes fadeIn {\n from {\n opacity: 0;\n transform: translateY(20px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n }\n\n .header, .controls, .table-container, .footer-notice {\n animation: fadeIn 0.6s ease-out;\n }\n\n \/* Responsive *\/\n @media (max-width: 768px) {\n .header {\n padding: 2rem 1.5rem;\n }\n\n .header h1 {\n font-size: 1.8rem;\n }\n\n .header .subtitle {\n font-size: 1rem;\n }\n\n .stats {\n grid-template-columns: 1fr;\n }\n\n .table-header {\n flex-direction: column;\n align-items: flex-start;\n gap: 1rem;\n }\n\n .filter-buttons {\n width: 100%;\n }\n\n .filter-btn {\n flex: 1;\n }\n\n thead th, tbody td {\n padding: 0.8rem;\n font-size: 0.85rem;\n }\n }\n\n \/* Loading Animation *\/\n .loading {\n display: none;\n text-align: center;\n padding: 2rem;\n }\n\n .loading.active {\n display: block;\n }\n\n .spinner {\n width: 50px;\n height: 50px;\n border: 4px solid #f0f0f0;\n border-top-color: #667eea;\n border-radius: 50%;\n animation: spin 1s linear infinite;\n margin: 0 auto;\n }\n\n @keyframes spin {\n to { transform: rotate(360deg); }\n }\n <\/style>\n<\/head>\n\n \n <div class=\"footer-notice\">\n <h3>\ud83d\udce2 Informasi Penting<\/h3>\n <p>\n Bagi pendaftar Batch 1 yang belum diterima, dapat mencoba mendaftar kembali pada \n <strong>Pelatihan Pemanfaatan Kecerdasan Artifisial untuk Guru Jenjang SD Batch 2<\/strong>.\n <\/p>\n <div style=\"max-width:320px;width:100%;margin:0 auto;\">\n <iframe src=\"https:\/\/elearningcentergtk.id\/public\/pelatihan\/embed\/ID0A01F9\" width=\"100%\" height=\"430\" style=\"border:0;border-radius:12px;overflow:hidden;box-shadow:0 4px 20px rgba(0,0,0,0.15);\" loading=\"lazy\"><\/iframe>\n <\/div>\n <\/div>\n <\/div>\n\n<body>\n <div class=\"container\">\n \n <div class=\"header\">\n <div class=\"badge\">\u2728 Pengumuman Resmi<\/div>\n <h1>Pengumuman Peserta Smart MOOC<\/h1>\n <p class=\"subtitle\">Pelatihan Pemanfaatan Kecerdasan Artifisial untuk Guru Jenjang SD<\/p>\n <div class=\"info-box\">\n <div class=\"date\">\ud83d\udcc5 Batch 1: 25 Mei – 12 Juni 2026<\/div>\n <p class=\"description\">\n Selamat kepada seluruh peserta yang telah terpilih untuk mengikuti pelatihan Smart MOOC Batch 1. \n Silakan cek nama Anda pada daftar di bawah ini.\n <\/p>\n <\/div>\n <\/div>\n\n \n <div class=\"controls\">\n <div class=\"search-container\">\n <span class=\"search-icon\">\ud83d\udd0d<\/span>\n <input \n type=\"text\" \n id=\"searchInput\" \n class=\"search-input\" \n placeholder=\"Cari nama, instansi, atau kabupaten...\"\n autocomplete=\"off\"\n >\n <\/div>\n \n <div class=\"stats\">\n <div class=\"stat-card\">\n <div class=\"number\" id=\"totalPeserta\">50<\/div>\n <div class=\"label\">Total Peserta<\/div>\n <\/div>\n <div class=\"stat-card\">\n <div class=\"number\" id=\"filteredCount\">50<\/div>\n <div class=\"label\">Hasil Pencarian<\/div>\n <\/div>\n <div class=\"stat-card\">\n <div class=\"number\" id=\"kabupatenCount\">5<\/div>\n <div class=\"label\">Kabupaten\/Kota<\/div>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div class=\"table-container\">\n <div class=\"table-header\">\n <h2 class=\"table-title\">Daftar Peserta Terpilih<\/h2>\n <div class=\"filter-buttons\">\n <button class=\"filter-btn active\" onclick=\"filterByRegion('all')\">Semua<\/button>\n <button class=\"filter-btn\" onclick=\"filterByRegion('Bantul')\">Bantul<\/button>\n <button class=\"filter-btn\" onclick=\"filterByRegion('Sleman')\">Sleman<\/button>\n <button class=\"filter-btn\" onclick=\"filterByRegion('Kulon Progo')\">Kulon Progo<\/button>\n <button class=\"filter-btn\" onclick=\"filterByRegion('Yogyakarta')\">Yogyakarta<\/button>\n <button class=\"filter-btn\" onclick=\"filterByRegion('Gunung Kidul')\">Gunung Kidul<\/button>\n <\/div>\n <\/div>\n\n <div class=\"loading\" id=\"loading\">\n <div class=\"spinner\"><\/div>\n <p style=\"margin-top: 1rem; color: #666;\">Memuat data…<\/p>\n <\/div>\n\n <div class=\"table-wrapper\" id=\"tableWrapper\">\n <table id=\"participantTable\">\n <thead>\n <tr>\n <th>No<\/th>\n <th>Nama Lengkap<\/th>\n <th>Nama Instansi<\/th>\n <th>Kabupaten\/Kota<\/th>\n <\/tr>\n <\/thead>\n <tbody id=\"tableBody\">\n \n <\/tbody>\n <\/table>\n <\/div>\n <\/div>\n\n \n <div class=\"footer-notice\">\n <h3>\ud83d\udce2 Informasi Penting<\/h3>\n <p>\n Bagi pendaftar Batch 1 yang belum diterima, dapat mencoba mendaftar kembali pada \n <strong>Pelatihan Pemanfaatan Kecerdasan Artifisial untuk Guru Jenjang SD Batch 2<\/strong>.\n <\/p>\n <div style=\"max-width:320px;width:100%;margin:0 auto;\">\n <iframe src=\"https:\/\/elearningcentergtk.id\/public\/pelatihan\/embed\/ID0A01F9\" width=\"100%\" height=\"430\" style=\"border:0;border-radius:12px;overflow:hidden;box-shadow:0 4px 20px rgba(0,0,0,0.15);\" loading=\"lazy\"><\/iframe>\n <\/div>\n <\/div>\n <\/div>\n\n <script>\n const participants = [\n { nama: \"Agung Pratama Putra\", instansi: \"SD NEGERI KEPUHARJO\", kabupaten: \"Kabupaten Sleman\" },\n { nama: \"Agustina Dwi Rahayu\", instansi: \"SD NEGERI SOROGENEN 1\", kabupaten: \"Kabupaten Sleman\" },\n { nama: \"Alifah Amrinada\", instansi: \"SD MUHAMMADIYAH KARANGBENDO\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"Anisatul Hidayah\", instansi: \"SD MUHAMMADIYAH KARANGBENDO\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"Antonius Himawan Jayanto,S.Pd.,Gr\", instansi: \"SD NEGERI 1 SUMBERAGUNG\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"ari wijanarko\", instansi: \"SD NEGERI 1 PANJANGREJO\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"ARY WINDARSIH, S.Pd\", instansi: \"SD NEGERI GUWOSARI\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"DEFITA FRESTIYANTI\", instansi: \"SD NEGERI 3 SEDAYU\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"DINI ANNISA NURBAETY ELSOLA\", instansi: \"SD NEGERI SELO\", kabupaten: \"Kabupaten Kulon Progo\" },\n { nama: \"DWI BUDI HENDARTO\", instansi: \"SD NEGERI KALIURANG 2\", kabupaten: \"Kabupaten Sleman\" },\n { nama: \"Eka Putra Ferliansyah\", instansi: \"SD NEGERI KOTAGEDE 4\", kabupaten: \"Kota Yogyakarta\" },\n { nama: \"Esthin Kisniawati, S.Pd\", instansi: \"SD NEGERI JURUG\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"Fatikha Wijayanti\", instansi: \"SDN Segoroyoso\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"Firra Ayu Novitasari\", instansi: \"SD MUHAMMADIYAH KARANGBENDO\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"Fitri Yuli Astuti\", instansi: \"SD NEGERI SIDOMULYO\", kabupaten: \"Kabupaten Kulon Progo\" },\n { nama: \"Fitria Hidayatu Attoyibah\", instansi: \"SD MUHAMMADIYAH KARANGBENDO\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"HELMY ZULFIKAR ULYA\", instansi: \"MI Sananul Ula Daraman\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"ika wijayanti\", instansi: \"SD NEGERI KREBET\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"Irma Yulianti Budi Safitri\", instansi: \"SD NEGERI MINGGIRAN\", kabupaten: \"Kota Yogyakarta\" },\n { nama: \"Ismi Julia Pertiwi\", instansi: \"SD NEGERI KREBET\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"Iswari Widya Prayitno\", instansi: \"SD ISLAM TERPADU BINA INSAN MULIA\", kabupaten: \"Kabupaten Kulon Progo\" },\n { nama: \"JOKO KISWANTO\", instansi: \"SD MUHAMMADIYAH AL MUJAHIDIN WONOSARI\", kabupaten: \"Kabupaten Gunung Kidul\" },\n { nama: \"Kabul Cahyo Nugroho\", instansi: \"SD Negeri Tambran I Semin\", kabupaten: \"Kabupaten Gunung Kidul\" },\n { nama: \"Khoiry Nuria Widyaningrum\", instansi: \"SD NEGERI KARANGMLOKO 1\", kabupaten: \"Kabupaten Sleman\" },\n { nama: \"LADY WAHYU HAPSARI\", instansi: \"SD NEGERI SENDANGSARI\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"Ning Arum Fitriana\", instansi: \"SD NEGERI SRUMBUNG\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"Nita Lestiana\", instansi: \"SD NEGERI KALIKUTUK\", kabupaten: \"Kabupaten Kulon Progo\" },\n { nama: \"Nunung Sulaiman\", instansi: \"SD NEGERI SEMARANGAN 2\", kabupaten: \"Kabupaten Sleman\" },\n { nama: \"NUR KHOLIS\", instansi: \"SD NEGERI KLEGUNG 3\", kabupaten: \"Kabupaten Sleman\" },\n { nama: \"Nurbayyinah Diana Sari\", instansi: \"SD NEGERI 2 JONGGRANGAN\", kabupaten: \"Kabupaten Kulon Progo\" },\n { nama: \"Pramesthi Ningrum\", instansi: \"SD MUHAMMADIYAH KARANGBENDO\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"Puji Astutiningsih\", instansi: \"SD NEGERI KARANGMLOKO 2\", kabupaten: \"Kabupaten Sleman\" },\n { nama: \"Rika Emelyawati\", instansi: \"SD NEGERI TRUCUK\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"Rina Suci Wulandari, S.Si.\", instansi: \"SD MUHAMMADIYAH PAKEL\", kabupaten: \"Kota Yogyakarta\" },\n { nama: \"Rita Hidayati\", instansi: \"SD ISLAM TERPADU LUQMAN AL HAKIM 2 YOGYAKARTA\", kabupaten: \"Kota Yogyakarta\" },\n { nama: \"Rutin Buntoro,S.Pd.Kor.\", instansi: \"SD NEGERI TEGALREJO I\", kabupaten: \"Kota Yogyakarta\" },\n { nama: \"Samhaji\", instansi: \"SD NEGERI 1 KADIPIRO\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"Siti chomariah\", instansi: \"SD NEGERI KARANGWUNI\", kabupaten: \"Kabupaten Kulon Progo\" },\n { nama: \"Sri Wahyuni\", instansi: \"SD Negeri Plakaran\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"Sulistianto\", instansi: \"SD MUHAMMADIYAH AMBARKETAWANG 3\", kabupaten: \"Kabupaten Sleman\" },\n { nama: \"SUMANDITA NOVIANI\", instansi: \"SD Negeri Priyan\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"Susanto\", instansi: \"SDN KERDONMIRI I RONGKOP\", kabupaten: \"Kabupaten Gunung Kidul\" },\n { nama: \"Sutriyani\", instansi: \"SD NEGERI NGRANCAH\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"Valentina vivian oktavika\", instansi: \"SD NEGERI TRUCUK\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"WAHID AHMAD NURHUDA\", instansi: \"SD N Jatiroto\", kabupaten: \"Kabupaten Kulon Progo\" },\n { nama: \"Wahyu Hidayati\", instansi: \"SD NEGERI KALIGINTUNG\", kabupaten: \"Kabupaten Kulon Progo\" },\n { nama: \"Yesi Elindia\", instansi: \"SD NEGERI SENDANGSARI\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"YOTO PURNOMO\", instansi: \"SD NEGERI KALIAJIR\", kabupaten: \"Kabupaten Sleman\" },\n { nama: \"Yuliawati\", instansi: \"SDN CANDI GEDANGSARI\", kabupaten: \"Kabupaten Gunung Kidul\" },\n { nama: \"Yunik Indriyawati\", instansi: \"SD NEGERI KREBET\", kabupaten: \"Kabupaten Bantul\" }\n ];\n\n let filteredData = [...participants];\n let currentFilter = 'all';\n\n function renderTable(data) {\n const tbody = document.getElementById('tableBody');\n tbody.innerHTML = '';\n\n if (data.length === 0) {\n tbody.innerHTML = `\n <tr>\n <td colspan=\"4\" class=\"no-results\">\n <div class=\"no-results-icon\">\ud83d\udd0d<\/div>\n <div>Tidak ada data yang ditemukan<\/div>\n <\/td>\n <\/tr>\n `;\n return;\n }\n\n data.forEach((participant, index) => {\n const row = document.createElement('tr');\n row.innerHTML = `\n <td>${index + 1}<\/td>\n <td>${participant.nama}<\/td>\n <td>${participant.instansi}<\/td>\n <td>${participant.kabupaten}<\/td>\n `;\n tbody.appendChild(row);\n });\n\n updateStats(data);\n }\n\n function updateStats(data) {\n document.getElementById('filteredCount').textContent = data.length;\n const uniqueKabupaten = [...new Set(data.map(p => p.kabupaten))].length;\n document.getElementById('kabupatenCount').textContent = uniqueKabupaten;\n }\n\n function filterByRegion(region) {\n currentFilter = region;\n \n \/\/ Update button states\n document.querySelectorAll('.filter-btn').forEach(btn => {\n btn.classList.remove('active');\n });\n event.target.classList.add('active');\n\n \/\/ Filter data\n if (region === 'all') {\n filteredData = [...participants];\n } else {\n filteredData = participants.filter(p => p.kabupaten.includes(region));\n }\n\n \/\/ Apply search if active\n const searchTerm = document.getElementById('searchInput').value.toLowerCase();\n if (searchTerm) {\n filteredData = filteredData.filter(p => \n p.nama.toLowerCase().includes(searchTerm) ||\n p.instansi.toLowerCase().includes(searchTerm) ||\n p.kabupaten.toLowerCase().includes(searchTerm)\n );\n }\n\n renderTable(filteredData);\n }\n\n function setupSearch() {\n const searchInput = document.getElementById('searchInput');\n \n searchInput.addEventListener('input', (e) => {\n const searchTerm = e.target.value.toLowerCase();\n \n \/\/ Start with current filter\n let baseData = currentFilter === 'all' \n ? [...participants] \n : participants.filter(p => p.kabupaten.includes(currentFilter));\n\n \/\/ Apply search\n if (searchTerm) {\n filteredData = baseData.filter(p => \n p.nama.toLowerCase().includes(searchTerm) ||\n p.instansi.toLowerCase().includes(searchTerm) ||\n p.kabupaten.toLowerCase().includes(searchTerm)\n );\n } else {\n filteredData = baseData;\n }\n\n renderTable(filteredData);\n });\n }\n\n \/\/ Initialize\n document.addEventListener('DOMContentLoaded', () => {\n setTimeout(() => {\n renderTable(participants);\n setupSearch();\n }, 500);\n });\n <\/script>\n<\/body>\n\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>Smart MOOC – Pengumuman Peserta Batch 1 \ud83d\udce2 Informasi Penting Bagi pendaftar Batch 1 yang belum diterima, dapat mencoba mendaftar kembali pada Pelatihan Pemanfaatan Kecerdasan Artifisial untuk Guru Jenjang SD Batch 2. \u2728 Pengumuman Resmi Pengumuman Peserta Smart MOOC Pelatihan Pemanfaatan Kecerdasan Artifisial untuk Guru Jenjang SD \ud83d\udcc5 Batch 1: 25 Mei – 12 Juni […]<\/p>\n","protected":false},"author":1,"featured_media":1955,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_eb_attr":"","footnotes":""},"categories":[9,10],"tags":[],"class_list":["post-1942","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-pengumuman","category-umum"],"blocksy_meta":[],"_links":{"self":[{"href":"https:\/\/bbgtkdiy.kemendikdasmen.go.id\/berita\/wp-json\/wp\/v2\/posts\/1942","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/bbgtkdiy.kemendikdasmen.go.id\/berita\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/bbgtkdiy.kemendikdasmen.go.id\/berita\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/bbgtkdiy.kemendikdasmen.go.id\/berita\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/bbgtkdiy.kemendikdasmen.go.id\/berita\/wp-json\/wp\/v2\/comments?post=1942"}],"version-history":[{"count":3,"href":"https:\/\/bbgtkdiy.kemendikdasmen.go.id\/berita\/wp-json\/wp\/v2\/posts\/1942\/revisions"}],"predecessor-version":[{"id":1954,"href":"https:\/\/bbgtkdiy.kemendikdasmen.go.id\/berita\/wp-json\/wp\/v2\/posts\/1942\/revisions\/1954"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/bbgtkdiy.kemendikdasmen.go.id\/berita\/wp-json\/wp\/v2\/media\/1955"}],"wp:attachment":[{"href":"https:\/\/bbgtkdiy.kemendikdasmen.go.id\/berita\/wp-json\/wp\/v2\/media?parent=1942"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/bbgtkdiy.kemendikdasmen.go.id\/berita\/wp-json\/wp\/v2\/categories?post=1942"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/bbgtkdiy.kemendikdasmen.go.id\/berita\/wp-json\/wp\/v2\/tags?post=1942"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":1942,"date":"2026-05-21T05:02:04","date_gmt":"2026-05-21T05:02:04","guid":{"rendered":"https:\/\/bbgtkdiy.kemendikdasmen.go.id\/berita\/?p=1942"},"modified":"2026-05-25T01:48:30","modified_gmt":"2026-05-25T01:48:30","slug":"pengumuman-peserta-smart-mooc-pelatihan-pemanfaatan-kecerdasan-artifisial-untuk-guru-jenjang-sd-batch-1","status":"publish","type":"post","link":"https:\/\/bbgtkdiy.kemendikdasmen.go.id\/berita\/2026\/05\/21\/pengumuman-peserta-smart-mooc-pelatihan-pemanfaatan-kecerdasan-artifisial-untuk-guru-jenjang-sd-batch-1\/","title":{"rendered":"Pengumuman Peserta Smart MOOC –\u00a0 Pelatihan Pemanfaatan Kecerdasan Artifisial untuk Guru Jenjang SD Batch 1"},"content":{"rendered":"\n\n\n\n \n \n Smart MOOC – Pengumuman Peserta Batch 1<\/title>\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@400;500;600;700;800;900&display=swap\" rel=\"stylesheet\">\n <style>\n * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n }\n\n body {\n font-family: 'Inter', sans-serif;\n background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n min-height: 100vh;\n padding: 20px;\n }\n\n .container {\n max-width: 1200px;\n margin: 0 auto;\n }\n\n \/* Header Section *\/\n .header {\n background: white;\n border-radius: 24px;\n padding: 3rem;\n margin-bottom: 2rem;\n box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2);\n text-align: center;\n position: relative;\n overflow: hidden;\n }\n\n .header::before {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n height: 6px;\n background: linear-gradient(90deg, #667eea 0%, #764ba2 100%);\n }\n\n .badge {\n display: inline-block;\n background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n color: white;\n padding: 10px 24px;\n border-radius: 50px;\n font-size: 0.9rem;\n font-weight: 600;\n margin-bottom: 1.5rem;\n box-shadow: 0 4px 15px rgba(102, 126, 234, 0.4);\n }\n\n .header h1 {\n font-size: 2.5rem;\n font-weight: 800;\n color: #1a1a1a;\n margin-bottom: 1rem;\n line-height: 1.2;\n }\n\n .header .subtitle {\n font-size: 1.3rem;\n color: #666;\n font-weight: 500;\n margin-bottom: 2rem;\n }\n\n .info-box {\n background: linear-gradient(135deg, #f8f9ff 0%, #f0f2ff 100%);\n border-radius: 16px;\n padding: 1.5rem;\n border-left: 5px solid #667eea;\n }\n\n .info-box .date {\n font-size: 1.1rem;\n font-weight: 700;\n color: #667eea;\n margin-bottom: 0.5rem;\n }\n\n .info-box .description {\n font-size: 1rem;\n color: #555;\n line-height: 1.6;\n }\n\n \/* Search & Stats Section *\/\n .controls {\n background: white;\n border-radius: 20px;\n padding: 2rem;\n margin-bottom: 2rem;\n box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);\n }\n\n .search-container {\n position: relative;\n margin-bottom: 1.5rem;\n }\n\n .search-input {\n width: 100%;\n padding: 1rem 1rem 1rem 3rem;\n font-size: 1rem;\n border: 2px solid #e0e0e0;\n border-radius: 12px;\n font-family: 'Inter', sans-serif;\n transition: all 0.3s ease;\n }\n\n .search-input:focus {\n outline: none;\n border-color: #667eea;\n box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);\n }\n\n .search-icon {\n position: absolute;\n left: 1rem;\n top: 50%;\n transform: translateY(-50%);\n font-size: 1.2rem;\n color: #999;\n }\n\n .stats {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n gap: 1.5rem;\n }\n\n .stat-card {\n background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n padding: 1.5rem;\n border-radius: 16px;\n color: white;\n text-align: center;\n box-shadow: 0 4px 15px rgba(102, 126, 234, 0.3);\n }\n\n .stat-card .number {\n font-size: 2.5rem;\n font-weight: 800;\n margin-bottom: 0.5rem;\n }\n\n .stat-card .label {\n font-size: 0.95rem;\n opacity: 0.95;\n font-weight: 500;\n }\n\n \/* Table Section *\/\n .table-container {\n background: white;\n border-radius: 20px;\n padding: 2rem;\n box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);\n overflow: hidden;\n }\n\n .table-header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 1.5rem;\n }\n\n .table-title {\n font-size: 1.8rem;\n font-weight: 700;\n color: #1a1a1a;\n }\n\n .filter-buttons {\n display: flex;\n gap: 0.5rem;\n flex-wrap: wrap;\n }\n\n .filter-btn {\n padding: 0.5rem 1rem;\n border: 2px solid #e0e0e0;\n background: white;\n border-radius: 8px;\n font-size: 0.9rem;\n font-weight: 600;\n cursor: pointer;\n transition: all 0.3s ease;\n color: #666;\n }\n\n .filter-btn:hover {\n border-color: #667eea;\n color: #667eea;\n }\n\n .filter-btn.active {\n background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n color: white;\n border-color: transparent;\n }\n\n .table-wrapper {\n overflow-x: auto;\n border-radius: 12px;\n border: 1px solid #f0f0f0;\n }\n\n table {\n width: 100%;\n border-collapse: collapse;\n }\n\n thead {\n background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n color: white;\n }\n\n thead th {\n padding: 1.2rem;\n text-align: left;\n font-weight: 700;\n font-size: 0.95rem;\n letter-spacing: 0.5px;\n }\n\n tbody tr {\n border-bottom: 1px solid #f0f0f0;\n transition: all 0.2s ease;\n }\n\n tbody tr:hover {\n background: linear-gradient(135deg, #f8f9ff 0%, #f0f2ff 100%);\n transform: scale(1.01);\n }\n\n tbody td {\n padding: 1.2rem;\n color: #333;\n font-size: 0.95rem;\n }\n\n tbody tr.highlight {\n background: linear-gradient(135deg, #fff9e6 0%, #fff3cc 100%);\n font-weight: 600;\n }\n\n .no-results {\n text-align: center;\n padding: 3rem;\n color: #999;\n font-size: 1.1rem;\n }\n\n .no-results-icon {\n font-size: 3rem;\n margin-bottom: 1rem;\n }\n\n \/* Footer Notice *\/\n .footer-notice {\n background: white;\n border-radius: 20px;\n padding: 2rem;\n margin-top: 2rem;\n box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);\n text-align: center;\n }\n\n .footer-notice h3 {\n font-size: 1.5rem;\n font-weight: 700;\n color: #1a1a1a;\n margin-bottom: 1rem;\n }\n\n .footer-notice p {\n font-size: 1.1rem;\n color: #666;\n line-height: 1.6;\n margin-bottom: 1.5rem;\n }\n\n .cta-button {\n display: inline-block;\n background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\n color: white;\n padding: 1rem 2.5rem;\n border-radius: 12px;\n font-weight: 700;\n font-size: 1.1rem;\n text-decoration: none;\n transition: all 0.3s ease;\n box-shadow: 0 4px 15px rgba(102, 126, 234, 0.4);\n }\n\n .cta-button:hover {\n transform: translateY(-2px);\n box-shadow: 0 6px 25px rgba(102, 126, 234, 0.5);\n }\n\n \/* Animations *\/\n @keyframes fadeIn {\n from {\n opacity: 0;\n transform: translateY(20px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n }\n\n .header, .controls, .table-container, .footer-notice {\n animation: fadeIn 0.6s ease-out;\n }\n\n \/* Responsive *\/\n @media (max-width: 768px) {\n .header {\n padding: 2rem 1.5rem;\n }\n\n .header h1 {\n font-size: 1.8rem;\n }\n\n .header .subtitle {\n font-size: 1rem;\n }\n\n .stats {\n grid-template-columns: 1fr;\n }\n\n .table-header {\n flex-direction: column;\n align-items: flex-start;\n gap: 1rem;\n }\n\n .filter-buttons {\n width: 100%;\n }\n\n .filter-btn {\n flex: 1;\n }\n\n thead th, tbody td {\n padding: 0.8rem;\n font-size: 0.85rem;\n }\n }\n\n \/* Loading Animation *\/\n .loading {\n display: none;\n text-align: center;\n padding: 2rem;\n }\n\n .loading.active {\n display: block;\n }\n\n .spinner {\n width: 50px;\n height: 50px;\n border: 4px solid #f0f0f0;\n border-top-color: #667eea;\n border-radius: 50%;\n animation: spin 1s linear infinite;\n margin: 0 auto;\n }\n\n @keyframes spin {\n to { transform: rotate(360deg); }\n }\n <\/style>\n<\/head>\n\n \n <div class=\"footer-notice\">\n <h3>\ud83d\udce2 Informasi Penting<\/h3>\n <p>\n Bagi pendaftar Batch 1 yang belum diterima, dapat mencoba mendaftar kembali pada \n <strong>Pelatihan Pemanfaatan Kecerdasan Artifisial untuk Guru Jenjang SD Batch 2<\/strong>.\n <\/p>\n <div style=\"max-width:320px;width:100%;margin:0 auto;\">\n <iframe src=\"https:\/\/elearningcentergtk.id\/public\/pelatihan\/embed\/ID0A01F9\" width=\"100%\" height=\"430\" style=\"border:0;border-radius:12px;overflow:hidden;box-shadow:0 4px 20px rgba(0,0,0,0.15);\" loading=\"lazy\"><\/iframe>\n <\/div>\n <\/div>\n <\/div>\n\n<body>\n <div class=\"container\">\n \n <div class=\"header\">\n <div class=\"badge\">\u2728 Pengumuman Resmi<\/div>\n <h1>Pengumuman Peserta Smart MOOC<\/h1>\n <p class=\"subtitle\">Pelatihan Pemanfaatan Kecerdasan Artifisial untuk Guru Jenjang SD<\/p>\n <div class=\"info-box\">\n <div class=\"date\">\ud83d\udcc5 Batch 1: 25 Mei – 12 Juni 2026<\/div>\n <p class=\"description\">\n Selamat kepada seluruh peserta yang telah terpilih untuk mengikuti pelatihan Smart MOOC Batch 1. \n Silakan cek nama Anda pada daftar di bawah ini.\n <\/p>\n <\/div>\n <\/div>\n\n \n <div class=\"controls\">\n <div class=\"search-container\">\n <span class=\"search-icon\">\ud83d\udd0d<\/span>\n <input \n type=\"text\" \n id=\"searchInput\" \n class=\"search-input\" \n placeholder=\"Cari nama, instansi, atau kabupaten...\"\n autocomplete=\"off\"\n >\n <\/div>\n \n <div class=\"stats\">\n <div class=\"stat-card\">\n <div class=\"number\" id=\"totalPeserta\">50<\/div>\n <div class=\"label\">Total Peserta<\/div>\n <\/div>\n <div class=\"stat-card\">\n <div class=\"number\" id=\"filteredCount\">50<\/div>\n <div class=\"label\">Hasil Pencarian<\/div>\n <\/div>\n <div class=\"stat-card\">\n <div class=\"number\" id=\"kabupatenCount\">5<\/div>\n <div class=\"label\">Kabupaten\/Kota<\/div>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div class=\"table-container\">\n <div class=\"table-header\">\n <h2 class=\"table-title\">Daftar Peserta Terpilih<\/h2>\n <div class=\"filter-buttons\">\n <button class=\"filter-btn active\" onclick=\"filterByRegion('all')\">Semua<\/button>\n <button class=\"filter-btn\" onclick=\"filterByRegion('Bantul')\">Bantul<\/button>\n <button class=\"filter-btn\" onclick=\"filterByRegion('Sleman')\">Sleman<\/button>\n <button class=\"filter-btn\" onclick=\"filterByRegion('Kulon Progo')\">Kulon Progo<\/button>\n <button class=\"filter-btn\" onclick=\"filterByRegion('Yogyakarta')\">Yogyakarta<\/button>\n <button class=\"filter-btn\" onclick=\"filterByRegion('Gunung Kidul')\">Gunung Kidul<\/button>\n <\/div>\n <\/div>\n\n <div class=\"loading\" id=\"loading\">\n <div class=\"spinner\"><\/div>\n <p style=\"margin-top: 1rem; color: #666;\">Memuat data…<\/p>\n <\/div>\n\n <div class=\"table-wrapper\" id=\"tableWrapper\">\n <table id=\"participantTable\">\n <thead>\n <tr>\n <th>No<\/th>\n <th>Nama Lengkap<\/th>\n <th>Nama Instansi<\/th>\n <th>Kabupaten\/Kota<\/th>\n <\/tr>\n <\/thead>\n <tbody id=\"tableBody\">\n \n <\/tbody>\n <\/table>\n <\/div>\n <\/div>\n\n \n <div class=\"footer-notice\">\n <h3>\ud83d\udce2 Informasi Penting<\/h3>\n <p>\n Bagi pendaftar Batch 1 yang belum diterima, dapat mencoba mendaftar kembali pada \n <strong>Pelatihan Pemanfaatan Kecerdasan Artifisial untuk Guru Jenjang SD Batch 2<\/strong>.\n <\/p>\n <div style=\"max-width:320px;width:100%;margin:0 auto;\">\n <iframe src=\"https:\/\/elearningcentergtk.id\/public\/pelatihan\/embed\/ID0A01F9\" width=\"100%\" height=\"430\" style=\"border:0;border-radius:12px;overflow:hidden;box-shadow:0 4px 20px rgba(0,0,0,0.15);\" loading=\"lazy\"><\/iframe>\n <\/div>\n <\/div>\n <\/div>\n\n <script>\n const participants = [\n { nama: \"Agung Pratama Putra\", instansi: \"SD NEGERI KEPUHARJO\", kabupaten: \"Kabupaten Sleman\" },\n { nama: \"Agustina Dwi Rahayu\", instansi: \"SD NEGERI SOROGENEN 1\", kabupaten: \"Kabupaten Sleman\" },\n { nama: \"Alifah Amrinada\", instansi: \"SD MUHAMMADIYAH KARANGBENDO\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"Anisatul Hidayah\", instansi: \"SD MUHAMMADIYAH KARANGBENDO\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"Antonius Himawan Jayanto,S.Pd.,Gr\", instansi: \"SD NEGERI 1 SUMBERAGUNG\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"ari wijanarko\", instansi: \"SD NEGERI 1 PANJANGREJO\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"ARY WINDARSIH, S.Pd\", instansi: \"SD NEGERI GUWOSARI\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"DEFITA FRESTIYANTI\", instansi: \"SD NEGERI 3 SEDAYU\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"DINI ANNISA NURBAETY ELSOLA\", instansi: \"SD NEGERI SELO\", kabupaten: \"Kabupaten Kulon Progo\" },\n { nama: \"DWI BUDI HENDARTO\", instansi: \"SD NEGERI KALIURANG 2\", kabupaten: \"Kabupaten Sleman\" },\n { nama: \"Eka Putra Ferliansyah\", instansi: \"SD NEGERI KOTAGEDE 4\", kabupaten: \"Kota Yogyakarta\" },\n { nama: \"Esthin Kisniawati, S.Pd\", instansi: \"SD NEGERI JURUG\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"Fatikha Wijayanti\", instansi: \"SDN Segoroyoso\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"Firra Ayu Novitasari\", instansi: \"SD MUHAMMADIYAH KARANGBENDO\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"Fitri Yuli Astuti\", instansi: \"SD NEGERI SIDOMULYO\", kabupaten: \"Kabupaten Kulon Progo\" },\n { nama: \"Fitria Hidayatu Attoyibah\", instansi: \"SD MUHAMMADIYAH KARANGBENDO\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"HELMY ZULFIKAR ULYA\", instansi: \"MI Sananul Ula Daraman\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"ika wijayanti\", instansi: \"SD NEGERI KREBET\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"Irma Yulianti Budi Safitri\", instansi: \"SD NEGERI MINGGIRAN\", kabupaten: \"Kota Yogyakarta\" },\n { nama: \"Ismi Julia Pertiwi\", instansi: \"SD NEGERI KREBET\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"Iswari Widya Prayitno\", instansi: \"SD ISLAM TERPADU BINA INSAN MULIA\", kabupaten: \"Kabupaten Kulon Progo\" },\n { nama: \"JOKO KISWANTO\", instansi: \"SD MUHAMMADIYAH AL MUJAHIDIN WONOSARI\", kabupaten: \"Kabupaten Gunung Kidul\" },\n { nama: \"Kabul Cahyo Nugroho\", instansi: \"SD Negeri Tambran I Semin\", kabupaten: \"Kabupaten Gunung Kidul\" },\n { nama: \"Khoiry Nuria Widyaningrum\", instansi: \"SD NEGERI KARANGMLOKO 1\", kabupaten: \"Kabupaten Sleman\" },\n { nama: \"LADY WAHYU HAPSARI\", instansi: \"SD NEGERI SENDANGSARI\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"Ning Arum Fitriana\", instansi: \"SD NEGERI SRUMBUNG\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"Nita Lestiana\", instansi: \"SD NEGERI KALIKUTUK\", kabupaten: \"Kabupaten Kulon Progo\" },\n { nama: \"Nunung Sulaiman\", instansi: \"SD NEGERI SEMARANGAN 2\", kabupaten: \"Kabupaten Sleman\" },\n { nama: \"NUR KHOLIS\", instansi: \"SD NEGERI KLEGUNG 3\", kabupaten: \"Kabupaten Sleman\" },\n { nama: \"Nurbayyinah Diana Sari\", instansi: \"SD NEGERI 2 JONGGRANGAN\", kabupaten: \"Kabupaten Kulon Progo\" },\n { nama: \"Pramesthi Ningrum\", instansi: \"SD MUHAMMADIYAH KARANGBENDO\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"Puji Astutiningsih\", instansi: \"SD NEGERI KARANGMLOKO 2\", kabupaten: \"Kabupaten Sleman\" },\n { nama: \"Rika Emelyawati\", instansi: \"SD NEGERI TRUCUK\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"Rina Suci Wulandari, S.Si.\", instansi: \"SD MUHAMMADIYAH PAKEL\", kabupaten: \"Kota Yogyakarta\" },\n { nama: \"Rita Hidayati\", instansi: \"SD ISLAM TERPADU LUQMAN AL HAKIM 2 YOGYAKARTA\", kabupaten: \"Kota Yogyakarta\" },\n { nama: \"Rutin Buntoro,S.Pd.Kor.\", instansi: \"SD NEGERI TEGALREJO I\", kabupaten: \"Kota Yogyakarta\" },\n { nama: \"Samhaji\", instansi: \"SD NEGERI 1 KADIPIRO\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"Siti chomariah\", instansi: \"SD NEGERI KARANGWUNI\", kabupaten: \"Kabupaten Kulon Progo\" },\n { nama: \"Sri Wahyuni\", instansi: \"SD Negeri Plakaran\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"Sulistianto\", instansi: \"SD MUHAMMADIYAH AMBARKETAWANG 3\", kabupaten: \"Kabupaten Sleman\" },\n { nama: \"SUMANDITA NOVIANI\", instansi: \"SD Negeri Priyan\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"Susanto\", instansi: \"SDN KERDONMIRI I RONGKOP\", kabupaten: \"Kabupaten Gunung Kidul\" },\n { nama: \"Sutriyani\", instansi: \"SD NEGERI NGRANCAH\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"Valentina vivian oktavika\", instansi: \"SD NEGERI TRUCUK\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"WAHID AHMAD NURHUDA\", instansi: \"SD N Jatiroto\", kabupaten: \"Kabupaten Kulon Progo\" },\n { nama: \"Wahyu Hidayati\", instansi: \"SD NEGERI KALIGINTUNG\", kabupaten: \"Kabupaten Kulon Progo\" },\n { nama: \"Yesi Elindia\", instansi: \"SD NEGERI SENDANGSARI\", kabupaten: \"Kabupaten Bantul\" },\n { nama: \"YOTO PURNOMO\", instansi: \"SD NEGERI KALIAJIR\", kabupaten: \"Kabupaten Sleman\" },\n { nama: \"Yuliawati\", instansi: \"SDN CANDI GEDANGSARI\", kabupaten: \"Kabupaten Gunung Kidul\" },\n { nama: \"Yunik Indriyawati\", instansi: \"SD NEGERI KREBET\", kabupaten: \"Kabupaten Bantul\" }\n ];\n\n let filteredData = [...participants];\n let currentFilter = 'all';\n\n function renderTable(data) {\n const tbody = document.getElementById('tableBody');\n tbody.innerHTML = '';\n\n if (data.length === 0) {\n tbody.innerHTML = `\n <tr>\n <td colspan=\"4\" class=\"no-results\">\n <div class=\"no-results-icon\">\ud83d\udd0d<\/div>\n <div>Tidak ada data yang ditemukan<\/div>\n <\/td>\n <\/tr>\n `;\n return;\n }\n\n data.forEach((participant, index) => {\n const row = document.createElement('tr');\n row.innerHTML = `\n <td>${index + 1}<\/td>\n <td>${participant.nama}<\/td>\n <td>${participant.instansi}<\/td>\n <td>${participant.kabupaten}<\/td>\n `;\n tbody.appendChild(row);\n });\n\n updateStats(data);\n }\n\n function updateStats(data) {\n document.getElementById('filteredCount').textContent = data.length;\n const uniqueKabupaten = [...new Set(data.map(p => p.kabupaten))].length;\n document.getElementById('kabupatenCount').textContent = uniqueKabupaten;\n }\n\n function filterByRegion(region) {\n currentFilter = region;\n \n \/\/ Update button states\n document.querySelectorAll('.filter-btn').forEach(btn => {\n btn.classList.remove('active');\n });\n event.target.classList.add('active');\n\n \/\/ Filter data\n if (region === 'all') {\n filteredData = [...participants];\n } else {\n filteredData = participants.filter(p => p.kabupaten.includes(region));\n }\n\n \/\/ Apply search if active\n const searchTerm = document.getElementById('searchInput').value.toLowerCase();\n if (searchTerm) {\n filteredData = filteredData.filter(p => \n p.nama.toLowerCase().includes(searchTerm) ||\n p.instansi.toLowerCase().includes(searchTerm) ||\n p.kabupaten.toLowerCase().includes(searchTerm)\n );\n }\n\n renderTable(filteredData);\n }\n\n function setupSearch() {\n const searchInput = document.getElementById('searchInput');\n \n searchInput.addEventListener('input', (e) => {\n const searchTerm = e.target.value.toLowerCase();\n \n \/\/ Start with current filter\n let baseData = currentFilter === 'all' \n ? [...participants] \n : participants.filter(p => p.kabupaten.includes(currentFilter));\n\n \/\/ Apply search\n if (searchTerm) {\n filteredData = baseData.filter(p => \n p.nama.toLowerCase().includes(searchTerm) ||\n p.instansi.toLowerCase().includes(searchTerm) ||\n p.kabupaten.toLowerCase().includes(searchTerm)\n );\n } else {\n filteredData = baseData;\n }\n\n renderTable(filteredData);\n });\n }\n\n \/\/ Initialize\n document.addEventListener('DOMContentLoaded', () => {\n setTimeout(() => {\n renderTable(participants);\n setupSearch();\n }, 500);\n });\n <\/script>\n<\/body>\n\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>Smart MOOC – Pengumuman Peserta Batch 1 \ud83d\udce2 Informasi Penting Bagi pendaftar Batch 1 yang belum diterima, dapat mencoba mendaftar kembali pada Pelatihan Pemanfaatan Kecerdasan Artifisial untuk Guru Jenjang SD Batch 2. \u2728 Pengumuman Resmi Pengumuman Peserta Smart MOOC Pelatihan Pemanfaatan Kecerdasan Artifisial untuk Guru Jenjang SD \ud83d\udcc5 Batch 1: 25 Mei – 12 Juni […]<\/p>\n","protected":false},"author":1,"featured_media":1955,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_eb_attr":"","footnotes":""},"categories":[9,10],"tags":[],"class_list":["post-1942","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-pengumuman","category-umum"],"blocksy_meta":[],"_links":{"self":[{"href":"https:\/\/bbgtkdiy.kemendikdasmen.go.id\/berita\/wp-json\/wp\/v2\/posts\/1942","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/bbgtkdiy.kemendikdasmen.go.id\/berita\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/bbgtkdiy.kemendikdasmen.go.id\/berita\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/bbgtkdiy.kemendikdasmen.go.id\/berita\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/bbgtkdiy.kemendikdasmen.go.id\/berita\/wp-json\/wp\/v2\/comments?post=1942"}],"version-history":[{"count":3,"href":"https:\/\/bbgtkdiy.kemendikdasmen.go.id\/berita\/wp-json\/wp\/v2\/posts\/1942\/revisions"}],"predecessor-version":[{"id":1954,"href":"https:\/\/bbgtkdiy.kemendikdasmen.go.id\/berita\/wp-json\/wp\/v2\/posts\/1942\/revisions\/1954"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/bbgtkdiy.kemendikdasmen.go.id\/berita\/wp-json\/wp\/v2\/media\/1955"}],"wp:attachment":[{"href":"https:\/\/bbgtkdiy.kemendikdasmen.go.id\/berita\/wp-json\/wp\/v2\/media?parent=1942"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/bbgtkdiy.kemendikdasmen.go.id\/berita\/wp-json\/wp\/v2\/categories?post=1942"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/bbgtkdiy.kemendikdasmen.go.id\/berita\/wp-json\/wp\/v2\/tags?post=1942"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}