Pada artikel sebelumnya telah dibahas apa itu SCORM secara singkat dan juga menyiapkan 3 laman HTML dan 1 kode javascript. Pada artikel ini saya akan membahas teknis mengenai isi dari ketiga laman HTML tersebut.<\/p>\n\n\n\n
Buka dokumen index.html<\/strong> dengan menggunakan notepad<\/em> atau code editor<\/em> yang dimiliki dan masukkan kode berikut:<\/p>\n\n\n\n Bagi yang tidak terbiasa dengan kode HTML dan Javascript<\/em> mungkin akan terintimidasi dengan uraian di atas, namun sederhananya adalah yang akan muncul ke pembelajar adalah bagian dari <h1> sampai dengan <\/p>. dan terdapat hyperlink<\/em> yang dapat diklik oleh pembelajar berupa teks sini<\/strong>, untuk menuju ke laman konten.html<\/p>\n\n\n\n Bagi para programmer<\/em>, yang perlu diperhatikan adalah pada bagian:<\/p>\n\n\n\n Untuk laman konten.html, silakan membuat dokumennya dan masukkan kode berikut.<\/p>\n\n\n\n Sangat mirip seperti laman sebelumnya, namun isinya saja yang berbeda. Pada laman ini pembelajar akan melihat video Youtube yang ter-embed<\/em> ke dalam konten (tentu anda dapat menggantinya dengan yang lain, ini hanya untuk kesederhanaan<\/strong>). Serta terdapat tautan berupa hyperlink<\/em> dengan teks sini<\/strong> untuk menuju ke laman penutup.html.<\/p>\n\n\n\n Laman penutup.html akan kita gunakan sesuai fungsinya yaitu “penutup” yang akan mengirimkan status completed<\/strong><\/em> kepada LMS dalam sesi pembelajaran.<\/p>\n\n\n\n Pada laman penutup.html ini terdapat kode tambahan yaitu completeSCO<\/em><\/strong>… kode ini berfungsi untuk mengirimkan status “completed<\/strong><\/em>” dari konten ke LMS ketika laman ini ter-load<\/em>.<\/p>\n\n\n\n<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\">\n <title>Index<\/title>\n <script src=\"SCORM_API_wrapper.js\"><\/script> \n <script>\n var quit = false;\n function quitSCO() {\n if (quit) return;\n quit = true;\n pipwerks.SCORM.save();\n pipwerks.SCORM.quit();\n }\n <\/script> \n<\/head>\n<body \n onload=\"pipwerks.SCORM.init()\" \n onunload=\"quitSCO()\" \n onbeforeunload=\"quitSCO()\" >\n\n <h1>Konten Pembelajaran SCORM 1.2 Compliant<\/h1>\n <p>Ini adalah halaman awal, biasanya berisi objektif pembelajaran. Klik di <a href=\"konten.html\">sini<\/a> untuk melanjutkan.<\/p> \n\n<\/body>\n<\/html><\/code><\/pre>\n\n\n\n<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\">\n <title>Konten<\/title>\n <script src=\"SCORM_API_wrapper.js\"><\/script> \n <script>\n var quit = false;\n function quitSCO() {\n if (quit) return;\n quit = true;\n pipwerks.SCORM.save();\n pipwerks.SCORM.quit();\n }\n <\/script> \n<\/head>\n<body \n onload=\"pipwerks.SCORM.init()\" \n onunload=\"quitSCO()\" \n onbeforeunload=\"quitSCO()\" >\n\n <h1>Konten video<\/h1>\n <p>Bisa saja konten video di-embed di sini, misalnya ke sebuah laman Youtube<\/p> \n <iframe width=\"560\" height=\"315\" src=\"https:\/\/www.youtube.com\/embed\/JGz3i6zhJ3E\" frameborder=\"0\" allow=\"accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture\" allowfullscreen><\/iframe>\n\n <p>Bila sudah menonton video ini, klik di <a href=\"penutup.html\">sini<\/a> untuk melihat konklusi.<\/p>\n\n<\/body>\n<\/html><\/code><\/pre>\n\n\n\n<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"UTF-8\">\n <title>Penutup<\/title>\n <script src=\"SCORM_API_wrapper.js\"><\/script> \n <script>\n var quit = false;\n function quitSCO() {\n if (quit) return;\n quit = true;\n pipwerks.SCORM.save();\n pipwerks.SCORM.quit();\n }\n function completeSCO() {\n pipwerks.SCORM.data.set(\"cmi.core.lesson_status\", \"completed\");\n }\n <\/script> \n<\/head>\n<body \n onload=\"pipwerks.SCORM.init(); completeSCO();\" \n onunload=\"quitSCO()\" \n onbeforeunload=\"quitSCO()\" >\n\n <h1>Penutup<\/h1>\n <p>Anda telah mengunjungi laman ini yang berarti Anda telah selesai mengakses materi, sistem LMS akan mencatat selesai \"completed\".<\/p>\n\n<\/body>\n<\/html><\/code><\/pre>\n\n\n\n