1.0.0 • Published 7 years ago

@teamhive/stencil-scorm-viewer v1.0.0

Weekly downloads
3
License
MIT
Repository
github
Last release
7 years ago

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

EventDescription
onSetValueEmitted when the course captures form data. Locally tracks data to courseData object.
onCommitEmitted when a value is committed to the API.
onInitiailizeEmitted when the course initializes against the LMS.
onFinishEmitted when the course finishes.
onTerminateEmitted 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|