Skip to content

Latest commit

 

History

History
60 lines (43 loc) · 1.82 KB

readme.md

File metadata and controls

60 lines (43 loc) · 1.82 KB
Raw

Hive Stencil SCORM Viewer

Web component that allows you to render SCORM (e-learning) courses in your web (and Ionic native) applications. Injects custom event hooks and binding to support offline tracking of courses without a 3rd party library.

The SCORM course must be served on the same origin (host:port) as the consuming application to avoid cross-frame injection.

Installation

  • npm install @teamhive/stencil-scorm-viewer

Usage

  • <hive-scorm-viewer src="http://www.mydomain/index.html"></hive-scorm-viewer>

Angular (6+) / Ionic (4+)

In your angular.json file add the following assets matcher in your projects.app.architect.build.options.assets collection:

{
    "glob": "**/*",
    "input": "node_modules/@teamhive/stencil-scorm-viewer/dist/scormviewer",
    "output": "./scormviewer"
}

In your main AppModule (i.e. app.module.ts) add the following import statement:

import '@teamhive/stencil-scorm-viewer/dist/scormviewer';

Events

Event Description
onSetValue Emitted when the course captures form data. Locally tracks data to courseData object.
onCommit Emitted when a value is committed to the API.
onInitiailize Emitted when the course initializes against the LMS.
onFinish Emitted when the course finishes.
onTerminate Emitted when the course is terminated.

Development

Local Development

  • npm i
  • npm run start

Note: You will need to drop SCORM assets into www/ to test in the browser.

Building the Stencil Component

  • npm run build
  • npm publish or npm pack for local deployments

Testing

  • npm run test

Contributors

Sean Perkins
Sean Perkins