{"id":9848,"date":"2025-12-11T10:29:33","date_gmt":"2025-12-11T03:29:33","guid":{"rendered":"https:\/\/elearning-imeri.fk.ui.ac.id\/?p=9848"},"modified":"2025-12-11T10:42:02","modified_gmt":"2025-12-11T03:42:02","slug":"e-learning-awards-fkui-2025","status":"publish","type":"post","link":"https:\/\/elearning-imeri.fk.ui.ac.id\/?p=9848","title":{"rendered":"E-Learning Awards FKUI 2025"},"content":{"rendered":"\t\t
\n\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t
\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\r\n\r\n\r\n \r\n \r\n E-Learning Awards FKUI 2025<\/title>\r\n <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\r\n <style>\r\n :root {\r\n --primary-blue: #0047ab;\r\n --dark-blue: #002d62;\r\n --accent-gold: #FFD700;\r\n --light-bg: #f8f9fa;\r\n --white: #ffffff;\r\n --shadow: rgba(0, 0, 0, 0.08);\r\n }\r\n \r\n * {\r\n margin: 0;\r\n padding: 0;\r\n box-sizing: border-box;\r\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\r\n }\r\n \r\n body {\r\n background-color: var(--light-bg);\r\n color: #333;\r\n line-height: 1.6;\r\n width: 100%;\r\n overflow-x: hidden;\r\n }\r\n \r\n .container {\r\n background: var(--white);\r\n width: 100%;\r\n margin: 0 auto;\r\n overflow: hidden;\r\n }\r\n \r\n .header {\r\n background: linear-gradient(135deg, var(--primary-blue) 0%, var(--dark-blue) 100%);\r\n color: var(--white);\r\n padding: 40px 20px 30px;\r\n text-align: center;\r\n position: relative;\r\n width: 100%;\r\n }\r\n \r\n .header::after {\r\n content: \"\";\r\n position: absolute;\r\n bottom: 0;\r\n left: 0;\r\n width: 100%;\r\n height: 20px;\r\n background: url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' viewBox='0 0 1200 120' preserveAspectRatio='none'%3E%3Cpath d='M1200 120L0 16.48 0 0 1200 0 1200 120z' fill='%23ffffff'\/%3E%3C\/svg%3E\");\r\n background-size: cover;\r\n }\r\n \r\n .trophy-icon {\r\n font-size: 3.5rem;\r\n color: var(--accent-gold);\r\n margin-bottom: 15px;\r\n }\r\n \r\n h1 {\r\n font-size: clamp(1.8rem, 5vw, 2.5rem);\r\n margin-bottom: 10px;\r\n font-weight: 700;\r\n line-height: 1.3;\r\n padding: 0 10px;\r\n }\r\n \r\n .subtitle {\r\n font-size: clamp(1rem, 3vw, 1.2rem);\r\n opacity: 0.9;\r\n margin-bottom: 20px;\r\n padding: 0 15px;\r\n }\r\n \r\n .date-location {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n gap: 12px;\r\n margin-top: 20px;\r\n width: 100%;\r\n padding: 0 15px;\r\n }\r\n \r\n .date-location div {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n flex-wrap: wrap;\r\n gap: 8px;\r\n text-align: center;\r\n }\r\n \r\n .date-location i {\r\n color: var(--accent-gold);\r\n font-size: 1.2rem;\r\n min-width: 24px;\r\n }\r\n \r\n \/* Embed Canva Container - Responsif *\/\r\n .embed-container {\r\n width: 100%;\r\n max-width: 900px;\r\n margin: 30px auto 15px;\r\n padding: 0 20px;\r\n }\r\n \r\n .canva-embed {\r\n position: relative;\r\n width: 100%;\r\n height: 0;\r\n padding-top: 32.5391%; \/* Rasio aspek dari embed Canva *\/\r\n padding-bottom: 0;\r\n box-shadow: 0 4px 12px rgba(63, 69, 81, 0.16);\r\n overflow: hidden;\r\n border-radius: 12px;\r\n will-change: transform;\r\n background: #f8f9fa;\r\n }\r\n \r\n .canva-embed iframe {\r\n position: absolute;\r\n width: 100%;\r\n height: 100%;\r\n top: 0;\r\n left: 0;\r\n border: none;\r\n padding: 0;\r\n margin: 0;\r\n border-radius: 12px;\r\n }\r\n \r\n .embed-caption {\r\n text-align: center;\r\n margin-top: 12px;\r\n padding: 0 10px;\r\n }\r\n \r\n .embed-caption a {\r\n color: var(--primary-blue);\r\n text-decoration: none;\r\n font-size: 0.95rem;\r\n font-weight: 500;\r\n display: inline-flex;\r\n align-items: center;\r\n gap: 6px;\r\n padding: 8px 16px;\r\n border-radius: 20px;\r\n background: rgba(0, 71, 171, 0.08);\r\n transition: all 0.3s ease;\r\n }\r\n \r\n .embed-caption a:hover {\r\n background: rgba(0, 71, 171, 0.15);\r\n color: var(--dark-blue);\r\n transform: translateY(-2px);\r\n }\r\n \r\n .embed-caption a i {\r\n font-size: 0.9rem;\r\n }\r\n \r\n .content {\r\n padding: 30px 20px;\r\n width: 100%;\r\n max-width: 1200px;\r\n margin: 0 auto;\r\n }\r\n \r\n .section {\r\n margin-bottom: 35px;\r\n width: 100%;\r\n }\r\n \r\n h2 {\r\n color: var(--primary-blue);\r\n border-left: 5px solid var(--accent-gold);\r\n padding-left: 15px;\r\n margin-bottom: 20px;\r\n font-size: clamp(1.5rem, 4vw, 1.8rem);\r\n line-height: 1.4;\r\n }\r\n \r\n h3 {\r\n color: var(--dark-blue);\r\n margin-bottom: 10px;\r\n font-size: clamp(1.2rem, 3.5vw, 1.4rem);\r\n }\r\n \r\n p {\r\n margin-bottom: 15px;\r\n font-size: clamp(1rem, 2.5vw, 1.05rem);\r\n padding: 0 5px;\r\n }\r\n \r\n .highlight-box {\r\n background-color: #f0f7ff;\r\n border-left: 4px solid var(--primary-blue);\r\n padding: 20px 15px;\r\n border-radius: 0 8px 8px 0;\r\n margin: 20px 0;\r\n width: 100%;\r\n }\r\n \r\n .awards-grid {\r\n display: grid;\r\n grid-template-columns: 1fr;\r\n gap: 20px;\r\n margin-top: 20px;\r\n width: 100%;\r\n }\r\n \r\n .award-card {\r\n background: var(--white);\r\n border-radius: 10px;\r\n padding: 20px 15px;\r\n box-shadow: 0 4px 12px var(--shadow);\r\n border-top: 5px solid var(--accent-gold);\r\n transition: all 0.3s ease;\r\n width: 100%;\r\n }\r\n \r\n .award-card:hover {\r\n transform: translateY(-5px);\r\n box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);\r\n }\r\n \r\n .award-card.gold {\r\n border-top-color: var(--accent-gold);\r\n }\r\n \r\n .award-card.silver {\r\n border-top-color: #C0C0C0;\r\n }\r\n \r\n .award-rank {\r\n font-size: 1.6rem;\r\n font-weight: bold;\r\n color: var(--primary-blue);\r\n margin-bottom: 10px;\r\n }\r\n \r\n .winner-card {\r\n background: #f8f9fa;\r\n border-radius: 8px;\r\n padding: 18px 15px;\r\n margin: 12px 0;\r\n border-left: 4px solid var(--primary-blue);\r\n width: 100%;\r\n }\r\n \r\n .winner-name {\r\n font-weight: bold;\r\n color: var(--dark-blue);\r\n font-size: clamp(1rem, 2.5vw, 1.1rem);\r\n line-height: 1.4;\r\n }\r\n \r\n .session-list {\r\n list-style-type: none;\r\n margin: 20px 0;\r\n width: 100%;\r\n }\r\n \r\n .session-list li {\r\n padding: 15px;\r\n margin-bottom: 12px;\r\n background-color: #f8f9fa;\r\n border-radius: 8px;\r\n border-left: 4px solid var(--primary-blue);\r\n display: flex;\r\n align-items: flex-start;\r\n width: 100%;\r\n }\r\n \r\n .session-list li i {\r\n color: var(--primary-blue);\r\n margin-right: 12px;\r\n font-size: 1.3rem;\r\n margin-top: 2px;\r\n flex-shrink: 0;\r\n }\r\n \r\n .session-list li strong {\r\n display: block;\r\n margin-bottom: 5px;\r\n font-size: clamp(1rem, 2.5vw, 1.1rem);\r\n }\r\n \r\n .cta-section {\r\n background: linear-gradient(135deg, #f0f7ff 0%, #e6f0ff 100%);\r\n padding: 25px 20px;\r\n border-radius: 12px;\r\n text-align: center;\r\n margin-top: 40px;\r\n width: 100%;\r\n }\r\n \r\n .cta-title {\r\n color: var(--primary-blue);\r\n margin-bottom: 15px;\r\n font-size: clamp(1.3rem, 3.5vw, 1.6rem);\r\n }\r\n \r\n .cta-buttons {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 15px;\r\n margin-top: 20px;\r\n width: 100%;\r\n }\r\n \r\n .btn {\r\n padding: 16px 20px;\r\n border-radius: 50px;\r\n font-weight: bold;\r\n text-decoration: none;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n gap: 12px;\r\n transition: all 0.3s ease;\r\n cursor: pointer;\r\n border: none;\r\n font-size: clamp(0.95rem, 2.5vw, 1rem);\r\n width: 100%;\r\n min-height: 54px;\r\n }\r\n \r\n .btn-primary {\r\n background: var(--primary-blue);\r\n color: var(--white);\r\n }\r\n \r\n .btn-primary:hover, .btn-primary:active {\r\n background: var(--dark-blue);\r\n transform: translateY(-3px);\r\n box-shadow: 0 5px 15px rgba(0, 45, 98, 0.2);\r\n }\r\n \r\n .btn-secondary {\r\n background: var(--white);\r\n color: var(--primary-blue);\r\n border: 2px solid var(--primary-blue);\r\n }\r\n \r\n .btn-secondary:hover, .btn-secondary:active {\r\n background: #f0f7ff;\r\n transform: translateY(-3px);\r\n }\r\n \r\n .logo {\r\n display: flex;\r\n flex-wrap: wrap;\r\n justify-content: center;\r\n gap: 12px;\r\n margin-top: 30px;\r\n width: 100%;\r\n }\r\n \r\n .logo-item {\r\n background: var(--white);\r\n padding: 10px 15px;\r\n border-radius: 8px;\r\n font-weight: bold;\r\n color: var(--primary-blue);\r\n box-shadow: 0 3px 10px var(--shadow);\r\n font-size: clamp(0.9rem, 2.5vw, 1rem);\r\n text-align: center;\r\n flex: 1;\r\n min-width: 140px;\r\n max-width: 200px;\r\n }\r\n \r\n \/* Tablet Styles *\/\r\n @media (min-width: 768px) {\r\n .header {\r\n padding: 50px 30px 40px;\r\n }\r\n \r\n .content {\r\n padding: 40px 30px;\r\n }\r\n \r\n .date-location {\r\n flex-direction: row;\r\n justify-content: center;\r\n gap: 30px;\r\n }\r\n \r\n .embed-container {\r\n padding: 0 30px;\r\n margin: 40px auto 20px;\r\n }\r\n \r\n .canva-embed {\r\n border-radius: 16px;\r\n }\r\n \r\n .embed-caption a {\r\n font-size: 1rem;\r\n padding: 10px 20px;\r\n }\r\n \r\n .awards-grid {\r\n grid-template-columns: repeat(2, 1fr);\r\n }\r\n \r\n .cta-buttons {\r\n flex-direction: row;\r\n justify-content: center;\r\n }\r\n \r\n .btn {\r\n width: auto;\r\n min-width: 220px;\r\n }\r\n \r\n .session-list li {\r\n padding: 18px 20px;\r\n }\r\n }\r\n \r\n \/* Desktop Styles *\/\r\n @media (min-width: 1024px) {\r\n .header {\r\n padding: 60px 40px 45px;\r\n }\r\n \r\n .content {\r\n padding: 50px 40px;\r\n }\r\n \r\n .embed-container {\r\n max-width: 1000px;\r\n padding: 0 40px;\r\n margin: 45px auto 25px;\r\n }\r\n \r\n .awards-grid {\r\n grid-template-columns: repeat(2, 1fr);\r\n gap: 30px;\r\n }\r\n \r\n .cta-buttons {\r\n gap: 25px;\r\n }\r\n \r\n .btn {\r\n padding: 16px 30px;\r\n }\r\n \r\n .logo {\r\n gap: 20px;\r\n }\r\n \r\n .logo-item {\r\n padding: 12px 20px;\r\n }\r\n }\r\n \r\n \/* Very Large Screens *\/\r\n @media (min-width: 1400px) {\r\n .content {\r\n padding: 60px 50px;\r\n }\r\n \r\n .embed-container {\r\n max-width: 1100px;\r\n margin: 50px auto 30px;\r\n }\r\n }\r\n \r\n \/* Mobile-specific improvements *\/\r\n @media (max-width: 767px) {\r\n .btn {\r\n min-height: 60px;\r\n }\r\n \r\n .session-list li {\r\n padding: 16px 14px;\r\n }\r\n \r\n .award-card {\r\n padding: 18px 14px;\r\n }\r\n \r\n .embed-container {\r\n padding: 0 15px;\r\n margin: 25px auto 15px;\r\n }\r\n \r\n .canva-embed {\r\n border-radius: 10px;\r\n box-shadow: 0 3px 10px rgba(63, 69, 81, 0.16);\r\n }\r\n \r\n .embed-caption {\r\n padding: 0 5px;\r\n }\r\n \r\n .embed-caption a {\r\n width: 100%;\r\n justify-content: center;\r\n padding: 10px 20px;\r\n }\r\n \r\n \/* Improve tap targets for mobile *\/\r\n button, \r\n .btn, \r\n .session-list li,\r\n .award-card,\r\n .embed-caption a {\r\n cursor: pointer;\r\n -webkit-tap-highlight-color: transparent;\r\n }\r\n }\r\n \r\n \/* Animation for embed container *\/\r\n @keyframes fadeIn {\r\n from {\r\n opacity: 0;\r\n transform: translateY(10px);\r\n }\r\n to {\r\n opacity: 1;\r\n transform: translateY(0);\r\n }\r\n }\r\n \r\n .embed-container {\r\n animation: fadeIn 0.8s ease-out 0.3s both;\r\n }\r\n \r\n .section {\r\n animation: fadeIn 0.6s ease-out;\r\n }\r\n \r\n \/* Safe area for notched phones *\/\r\n @supports (padding: max(0px)) {\r\n .header, .content, .cta-section, .embed-container {\r\n padding-left: max(20px, env(safe-area-inset-left));\r\n padding-right: max(20px, env(safe-area-inset-right));\r\n }\r\n \r\n .header {\r\n padding-top: max(40px, env(safe-area-inset-top));\r\n }\r\n }\r\n \r\n \/* Loading state for embed *\/\r\n .canva-embed.loading {\r\n background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);\r\n background-size: 200% 100%;\r\n animation: loading 1.5s infinite;\r\n }\r\n \r\n @keyframes loading {\r\n 0% { background-position: 200% 0; }\r\n 100% { background-position: -200% 0; }\r\n }\r\n \r\n \/* Fullscreen support for Canva embed *\/\r\n .canva-embed:-webkit-full-screen {\r\n width: 100%;\r\n height: 100%;\r\n padding-top: 0;\r\n border-radius: 0;\r\n }\r\n \r\n .canva-embed:-moz-full-screen {\r\n width: 100%;\r\n height: 100%;\r\n padding-top: 0;\r\n border-radius: 0;\r\n }\r\n \r\n .canva-embed:-ms-fullscreen {\r\n width: 100%;\r\n height: 100%;\r\n padding-top: 0;\r\n border-radius: 0;\r\n }\r\n \r\n .canva-embed:fullscreen {\r\n width: 100%;\r\n height: 100%;\r\n padding-top: 0;\r\n border-radius: 0;\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n <div class=\"container\">\r\n <div class=\"header\">\r\n <div class=\"trophy-icon\">\r\n <i class=\"fas fa-trophy\"><\/i>\r\n <\/div>\r\n <h1>\ud83c\udfc6 E-Learning Awards FKUI 2025<\/h1>\r\n <p class=\"subtitle\">Inovasi Pembelajaran Digital<\/p>\r\n <p>Fakultas Kedokteran Universitas Indonesia (FKUI) sukses menyelenggarakan E-Learning Awards 2025<\/p>\r\n \r\n <div class=\"date-location\">\r\n <div>\r\n <i class=\"fas fa-calendar-alt\"><\/i>\r\n <span>Selasa, 25 November 2025<\/span>\r\n <\/div>\r\n <div>\r\n <i class=\"fas fa-map-marker-alt\"><\/i>\r\n <span>Lab. Komputer GDLN Lantai 1, Gedung IASTH - UI Salemba<\/span>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n \r\n <!-- Embed Canva Baru Section -->\r\n <div class=\"embed-container\">\r\n <div class=\"canva-embed\" id=\"canvaEmbed\">\r\n <iframe \r\n loading=\"lazy\" \r\n src=\"https:\/\/www.canva.com\/design\/DAG7KsEMctY\/Rt1W4igLisTsGfzjnj2iBQ\/watch?embed\" \r\n allowfullscreen=\"allowfullscreen\" \r\n allow=\"fullscreen\">\r\n <\/iframe>\r\n <\/div>\r\n <div class=\"embed-caption\">\r\n <a href=\"https:\/\/www.canva.com\/design\/DAG7KsEMctY\/Rt1W4igLisTsGfzjnj2iBQ\/watch?utm_content=DAG7KsEMctY&utm_campaign=designshare&utm_medium=embeds&utm_source=link\" \r\n target=\"_blank\" \r\n rel=\"noopener\">\r\n <i class=\"fas fa-external-link-alt\"><\/i>\r\n <span> website elearning by Center of e-Learning IMERI FK UI<\/span>\r\n <\/a>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"content\">\r\n <div class=\"section\">\r\n <h2>Tujuan Utama Kegiatan<\/h2>\r\n <p>Acara ini berfungsi sebagai sarana monitoring dan evaluasi modul-modul e-Learning, terutama melalui LMS EMAS3 UI. Selain itu, kegiatan ini menjadi forum penting untuk meningkatkan kompetensi staf pengajar dalam mengembangkan modul digital yang inovatif dan sesuai dengan standar Pedoman Penjaminan Mutu e-Learning UI.<\/p>\r\n <\/div>\r\n \r\n <div class=\"section\">\r\n <h2>Seminar & Workshop Kunci<\/h2>\r\n <p>E-Learning Awards 2025 membekali peserta dengan wawasan praktis melalui sesi-sesi strategis mengenai masa depan pendidikan kedokteran digital:<\/p>\r\n \r\n <ul class=\"session-list\">\r\n <li>\r\n <i class=\"fas fa-chart-line\"><\/i>\r\n <div>\r\n <strong>Tantangan Implementasi Kelas Khusus Daring:<\/strong>\r\n Mengupas isu strategis seputar penjaminan mutu, regulasi, dan infrastruktur untuk program kelas khusus daring (digital premium).\r\n <\/div>\r\n <\/li>\r\n <li>\r\n <i class=\"fas fa-laptop-code\"><\/i>\r\n <div>\r\n <strong>Pengembangan Online Course dan MOOC:<\/strong>\r\n Berbagi praktik sukses pengembangan konten interaktif, termasuk Interactive Video dengan Pop-up Question dan Gamifikasi, yang terbukti efektif dalam pelatihan berskala besar (misalnya, OCI\/MOOC FKUI untuk 10.000+ Dokter Internship).\r\n <\/div>\r\n <\/li>\r\n <li>\r\n <i class=\"fas fa-robot\"><\/i>\r\n <div>\r\n <strong>Workshop Optimalisasi EMAS3:<\/strong>\r\n Memandu penguasaan fitur terbaru dan integrasi Kecerdasan Buatan (AI) untuk personalisasi, efisiensi pengajaran, dan pembuatan konten yang lebih interaktif.\r\n <\/div>\r\n <\/li>\r\n <\/ul>\r\n <\/div>\r\n \r\n <div class=\"section\">\r\n <h2>Penganugerahan Penghargaan<\/h2>\r\n <p>Acara ini mencapai puncaknya dengan penganugerahan apresiasi terhadap inovasi dan kualitas materi pembelajaran digital yang berdampak signifikan (IMPACTFUL).<\/p>\r\n \r\n <div class=\"highlight-box\">\r\n <h3>Kategori Modul e-Learning Terbaik FKUI TA 2024\/2025<\/h3>\r\n <div class=\"awards-grid\">\r\n <div class=\"award-card gold\">\r\n <div class=\"award-rank\">Juara 1<\/div>\r\n <p><strong>Modul Humanism, Professionalism and Cultural Competence\/HPCC<\/strong><\/p>\r\n <p>S1 KKI - Pendidikan Dokter<\/p>\r\n <\/div>\r\n <div class=\"award-card silver\">\r\n <div class=\"award-rank\">Juara 2<\/div>\r\n <p><strong>Modul Pengembangan dan Evaluasi Kurikulum<\/strong><\/p>\r\n <p>S2 - Pendidikan Kedokteran<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"highlight-box\">\r\n <h3>Kategori Penanggung Jawab Modul e-Learning Terbaik FKUI TA 2024\/2025<\/h3>\r\n <div class=\"winner-card\">\r\n <div class=\"winner-name\">Gulshan Fahmi El Bayani, S.Gz, M.Biomed<\/div>\r\n <\/div>\r\n <div class=\"winner-card\">\r\n <div class=\"winner-name\">Dr. dr. Listya Tresnanti Mirtha, Sp.KO, Subsp.APK(K), MARS<\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"cta-section\">\r\n <h2 class=\"cta-title\">Informasi Lebih Lanjut<\/h2>\r\n <p>Apakah Anda ingin mengetahui informasi lebih lanjut mengenai salah satu sesi seminar atau workshop tersebut?<\/p>\r\n \r\n <div class=\"cta-buttons\">\r\n <button class=\"btn btn-primary\" id=\"seminarBtn\">\r\n <i class=\"fas fa-chalkboard-teacher\"><\/i>\r\n <span>Seminar & Workshop<\/span>\r\n <\/button>\r\n <button class=\"btn btn-secondary\" id=\"awardsBtn\">\r\n <i class=\"fas fa-award\"><\/i>\r\n <span>Detail Penghargaan<\/span>\r\n <\/button>\r\n <button class=\"btn btn-secondary\" id=\"contactBtn\">\r\n <i class=\"fas fa-envelope\"><\/i>\r\n <span>Kontak Panitia<\/span>\r\n <\/button>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"logo\">\r\n <div class=\"logo-item\">FKUI<\/div>\r\n <div class=\"logo-item\">E-Learning Awards 2025<\/div>\r\n <div class=\"logo-item\">Universitas Indonesia<\/div>\r\n <div class=\"logo-item\">LMS EMAS3 UI<\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n \r\n <script>\r\n \/\/ Touch-friendly event handlers\r\n document.getElementById('seminarBtn').addEventListener('click', function() {\r\n showAlert('Informasi Seminar', 'Informasi detail tentang seminar dan workshop dapat diperoleh melalui Pusat E-Learning FKUI atau menghubungi panitia melalui email elearning@fk.ui.ac.id');\r\n });\r\n \r\n document.getElementById('awardsBtn').addEventListener('click', function() {\r\n showAlert('Detail Penghargaan', 'Detail lengkap kategori penghargaan, kriteria penilaian, dan pemenang lainnya dapat diakses melalui portal E-Learning FKUI.');\r\n });\r\n \r\n document.getElementById('contactBtn').addEventListener('click', function() {\r\n showAlert('Kontak Panitia', 'Hubungi Panitia E-Learning Awards FKUI 2025:\\n\\n\ud83d\udce7 Email: elearning@fk.ui.ac.id\\n\ud83d\udcde Telepon: (021) 3190-xxxx\\n\ud83d\udccd Lokasi: Gedung IASTH Lantai 2, FKUI Salemba');\r\n });\r\n \r\n function showAlert(title, message) {\r\n alert(`${title}\\n\\n${message}`);\r\n }\r\n \r\n \/\/ Embed Canva loading handling\r\n const canvaEmbed = document.getElementById('canvaEmbed');\r\n const canvaIframe = canvaEmbed.querySelector('iframe');\r\n \r\n \/\/ Add loading class initially\r\n canvaEmbed.classList.add('loading');\r\n \r\n \/\/ Remove loading class when iframe loads\r\n canvaIframe.addEventListener('load', function() {\r\n canvaEmbed.classList.remove('loading');\r\n console.log('Canva embed loaded successfully');\r\n });\r\n \r\n \/\/ Handle iframe errors\r\n canvaIframe.addEventListener('error', function() {\r\n canvaEmbed.classList.remove('loading');\r\n console.error('Failed to load Canva embed');\r\n \r\n \/\/ Optional: Show error message\r\n const errorMsg = document.createElement('div');\r\n errorMsg.style.cssText = `\r\n position: absolute;\r\n top: 50%;\r\n left: 50%;\r\n transform: translate(-50%, -50%);\r\n text-align: center;\r\n color: var(--primary-blue);\r\n padding: 20px;\r\n background: rgba(255, 255, 255, 0.9);\r\n border-radius: 10px;\r\n max-width: 80%;\r\n `;\r\n errorMsg.innerHTML = `\r\n <i class=\"fas fa-exclamation-triangle\" style=\"font-size: 2rem; margin-bottom: 10px;\"><\/i>\r\n <p style=\"margin-bottom: 10px;\">Gagal memuat konten Canva<\/p>\r\n <a href=\"https:\/\/www.canva.com\/design\/DAG7KsEMctY\/Rt1W4igLisTsGfzjnj2iBQ\/watch\" \r\n target=\"_blank\" \r\n style=\"color: var(--primary-blue); text-decoration: underline;\">\r\n Buka di halaman baru\r\n <\/a>\r\n `;\r\n canvaEmbed.appendChild(errorMsg);\r\n });\r\n \r\n \/\/ Fallback: remove loading class after 5 seconds\r\n setTimeout(function() {\r\n canvaEmbed.classList.remove('loading');\r\n }, 5000);\r\n \r\n \/\/ Mobile touch improvements\r\n document.querySelectorAll('.award-card, .session-list li, .embed-caption a').forEach(element => {\r\n element.addEventListener('touchstart', function() {\r\n this.style.opacity = '0.9';\r\n });\r\n \r\n element.addEventListener('touchend', function() {\r\n this.style.opacity = '1';\r\n });\r\n });\r\n \r\n \/\/ Improve button feedback on mobile\r\n document.querySelectorAll('.btn').forEach(btn => {\r\n btn.addEventListener('touchstart', function() {\r\n this.style.transform = 'scale(0.98)';\r\n });\r\n \r\n btn.addEventListener('touchend', function() {\r\n this.style.transform = '';\r\n });\r\n });\r\n \r\n \/\/ Handle orientation change for embed\r\n let isLandscape = window.matchMedia(\"(orientation: landscape)\").matches;\r\n \r\n window.addEventListener('orientationchange', function() {\r\n isLandscape = !isLandscape;\r\n \r\n \/\/ Recalculate embed dimensions on orientation change\r\n setTimeout(function() {\r\n \/\/ Force iframe to reload on orientation change for better rendering\r\n const iframeSrc = canvaIframe.src;\r\n canvaIframe.src = '';\r\n setTimeout(() => {\r\n canvaIframe.src = iframeSrc;\r\n \r\n \/\/ Adjust embed container for landscape mode on mobile\r\n if (window.innerWidth <= 767) {\r\n if (isLandscape) {\r\n \/\/ In landscape mode on mobile, adjust padding for better fit\r\n canvaEmbed.style.paddingTop = '56.25%'; \/\/ 16:9 ratio for landscape\r\n } else {\r\n \/\/ In portrait mode, use original ratio\r\n canvaEmbed.style.paddingTop = '32.5391%';\r\n }\r\n }\r\n }, 100);\r\n }, 300);\r\n });\r\n \r\n \/\/ Responsive embed adjustments on resize\r\n let resizeTimer;\r\n window.addEventListener('resize', function() {\r\n clearTimeout(resizeTimer);\r\n resizeTimer = setTimeout(function() {\r\n \/\/ Adjust for mobile landscape\r\n if (window.innerWidth <= 767) {\r\n if (window.innerHeight < window.innerWidth) {\r\n \/\/ Landscape mode\r\n canvaEmbed.style.paddingTop = '56.25%';\r\n } else {\r\n \/\/ Portrait mode\r\n canvaEmbed.style.paddingTop = '32.5391%';\r\n }\r\n }\r\n }, 250);\r\n });\r\n \r\n \/\/ Initialize based on current orientation\r\n if (window.innerWidth <= 767 && window.innerHeight < window.innerWidth) {\r\n canvaEmbed.style.paddingTop = '56.25%';\r\n }\r\n \r\n \/\/ Fullscreen change handling\r\n document.addEventListener('fullscreenchange', handleFullscreenChange);\r\n document.addEventListener('webkitfullscreenchange', handleFullscreenChange);\r\n document.addEventListener('mozfullscreenchange', handleFullscreenChange);\r\n document.addEventListener('MSFullscreenChange', handleFullscreenChange);\r\n \r\n function handleFullscreenChange() {\r\n const isFullscreen = document.fullscreenElement || \r\n document.webkitFullscreenElement || \r\n document.mozFullScreenElement || \r\n document.msFullscreenElement;\r\n \r\n if (isFullscreen && isFullscreen === canvaEmbed) {\r\n console.log('Entered fullscreen mode');\r\n } else {\r\n console.log('Exited fullscreen mode');\r\n }\r\n }\r\n <\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>E-Learning Awards FKUI 2025 \ud83c\udfc6 E-Learning Awards FKUI 2025 Inovasi Pembelajaran Digital Fakultas Kedokteran Universitas Indonesia (FKUI) sukses menyelenggarakan E-Learning Awards 2025 Selasa, 25 November 2025 Lab. Komputer GDLN Lantai 1, Gedung IASTH – UI Salemba website elearning by Center of e-Learning IMERI FK UI Tujuan Utama Kegiatan Acara ini berfungsi sebagai sarana monitoring dan […]<\/p>\n","protected":false},"author":2,"featured_media":9874,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_joinchat":[],"footnotes":""},"categories":[51],"tags":[],"class_list":["post-9848","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-news"],"blocksy_meta":[],"_links":{"self":[{"href":"https:\/\/elearning-imeri.fk.ui.ac.id\/index.php?rest_route=\/wp\/v2\/posts\/9848","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/elearning-imeri.fk.ui.ac.id\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/elearning-imeri.fk.ui.ac.id\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/elearning-imeri.fk.ui.ac.id\/index.php?rest_route=\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/elearning-imeri.fk.ui.ac.id\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=9848"}],"version-history":[{"count":23,"href":"https:\/\/elearning-imeri.fk.ui.ac.id\/index.php?rest_route=\/wp\/v2\/posts\/9848\/revisions"}],"predecessor-version":[{"id":9873,"href":"https:\/\/elearning-imeri.fk.ui.ac.id\/index.php?rest_route=\/wp\/v2\/posts\/9848\/revisions\/9873"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/elearning-imeri.fk.ui.ac.id\/index.php?rest_route=\/wp\/v2\/media\/9874"}],"wp:attachment":[{"href":"https:\/\/elearning-imeri.fk.ui.ac.id\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=9848"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/elearning-imeri.fk.ui.ac.id\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=9848"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/elearning-imeri.fk.ui.ac.id\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=9848"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}