Skip to content

An alternative web video player for videos authored in Camtasia Studio.

Notifications You must be signed in to change notification settings

CoderCow/c2j-Player

Repository files navigation

c2j-Player

This is a video.js based web player meant ot be an alternative to the web player exported by Camtasia Studio.

It can consume json files as they're generated by the camtasia2json utility and supports some of its special metadata to enrich the video.

The most important features are:

  • Basic video playback functionality using video.js / html5 video tag.
  • Named video chapters, displayed on the control bar.
  • Named notes, attached to a specific position in the video.
    • They have html formatable description text.
    • They are highlighted when the video playback is near their position.
  • Named overlay rectangles which can:
    • Jump to a specific position in the video.
    • Open a link in a new browser tab.
    • Stop the video until they have been clicked.
  • A button to change playback speed.
  • Multilingual video support.

Screenshots

The whole player (playing a Camtasia Studio tutorial video).

c2j-Player as a Whole

The control bar in minimized mode:

Minimized Control Bar

A chapter:

Chapter on Bar

An Overlay:

Overlay

A note on the bar:

Note on Bar

A note on the bar (revealed):

Clicked Note

Language selection (configured in simplified mode):

Language Selection Menu

How to Use

  • Download the release files. These go into your webserver's content directory.
  • Edit config.json in the player directory to configure the player's behaviour. These settings can be overwritten using url parameters aswell.
  • The player consumes both metadata files (json) and video media (mp4, webm, ogv and whatever the browser supports) from the videos directory by default.
  • Metadata files and video media can be produced by using Camtasia Studio together with camtasia2json. Use c2j's special tracks and metadata elements to add chapters, notes, overlays and multiple languages to your camtasia project then produce the media and let c2j consume your camtasia project file (which is xml) to produce the json metadata file.
  • Embed the player's index.html as an iframe or open it directly in your browser, passing the parameter ?video=name-of-json-file as url parameter.