In einem typischen SCORM-Kurs wird die API-Verbindung im übergeordneten Frame beibehalten, während der Kursinhalt in einen untergeordneten Frame (iframe) geladen wird. Der Inhalt im Iframe kann beliebig geladen und entladen werden; Der Inhalt im iframe enthält in der Regel die wichtigen SCORM-Aufrufe, die Sie über die Lebensdauer eines Kurses machen möchten, z. B. den Score und den Abschlussstatus. Dies geschieht jedoch, indem die Informationen an den übergeordneten Frame weitergeleitet werden, der den Kommunikation mit dem LMS.
Hier schnelles Beispiel ist SCORM mit 1.2 (nicht in ein LMS getestet, Barebones, müssten konkretisiert werden)
index.html (Mutterrahmen)
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>Course Title</title>
<style>
/* Use CSS to make the iframe fill the parent frame,
giving impression no frames are being used */
body { padding: 0; margin: 0; overflow: hidden; }
iframe { position: absolute; top: 0; right: 0; bottom: 0; left: 0; overflow: auto; }
</style>
</head>
<body>
<iframe src="" id="course-content" frameborder="0"></iframe>
<script>
//Place initialization routine here.
//Connect to SCORM API, run API.LMSInitialize()
var SCORM_API = window.API; //shortcut reference
function setScore(score){
SCORM_API.LMSSetValue("cmi.core.score.raw", score);
}
function setStatus(status){
SCORM_API.LMSSetValue("cmi.core.lesson_status", status);
}
function endCourse(){
SCORM_API.LMSCommit();//Save, just in case
SCORM_API.LMSFinish();//Close API connection
}
SCORM_API.LMSInitialize();
//Load child frame once SCORM_API is ready
document.getElementById("course-content").setAttribute("src", "content.html");
</script>
</body>
</html>
content.html (Kinder Rahmen)
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>Course Content</title>
</head>
<body>
<p>This is the content of the course. Add scripts to make it do something.</p>
<script>
//Place course functionality here, such as setting a bookmark or score.
//'parent' is the parent frame.
//This is a very arbitrary example of what you can do when a course loads
parent.setScore("100");
parent.setStatus("completed");
parent.endCourse();
</script>
</body>
</html>
Sie würden normalerweise verwenden möchten eine SCORM-Wrapper einige schweres Heben zu handhaben, und Sie würden einen abstraction layer zu verbessern Code Wartbarkeit und ce verwenden möchten ntralisieren Sie Ihre SCORM-Befehle im übergeordneten Frame. Die endCourse()
-Funktion ist ein sehr einfaches Beispiel für eine Abstraktionsschicht. Anstatt die API direkt im untergeordneten Frame aufzurufen, rufen Sie eine Funktion auf.