Getting Started with Kaltura HTML5

From HTML5 Video
Jump to: navigation, search


Contents

Installing the Javascript Library

When the library is loaded in your page, all html5 media elements will, by default, be rewritten using Kaltura's control interface. See Rewriting HTML5 Media Elements for further information on the advantages to this method of video inclusion as well as instructions on disabling rewriting to control the player solely through javascript.

.org CDN Hosted Script Installation 

Note: if your a kaltura customer you should use the embed code provided via the KMC.

The Kaltura HTML5 Video Library may be included either in your web page's <head> or <body> section by including a single line of javascript: 

<script src="http://html5.kaltura.org/js"></script>

Self Hosting the Library

The full, GPL licensed Kaltura HTML5 Video Library may be checked out from the Kaltura source code repository and set up on a PHP enabled web server for fully customizable use.

You can check out the code from the kaltura/mwEmbed project on github 

git clone git://github.com/kaltura/mwEmbed.git

You will then want to checkout a recent release tag 

git checkout tagName

You will want to edit LocalSettings.php A good example of local settings is included in LocalSettings.php.sample You can copy that sample to the LocalSettings.php location in the root of the mwEmbed folder. If your setting up the library for onPrem or CE edition take a look at LocalSettings.KalturaPlatform.php which includes a local settings file that you can point at your CE or onPrem kaltura install to bootstrap the html5 library configuration .

Once you checkout the library assuming it located at some location like: http://example.com/mwEmbed, in your pages that you want to activate the html5 library script you should include: 

<script src="http://example.com/mwEmbed/mwEmbedLoader.php"></script>

MIT Licensed Static Player Installation

The MIT Licensed Kaltura HTML5 Media Player is a statically compiled library that you may freely distribute when all code must be hosted directly on the website and linking to the CDN hosted library is not possible.

The most recent version of the MIT Licensed library should be downloaded from kaltura.org. Assuming the script is installed to kaltura-html5player-widget, then, in your document <head>, include the css and javascript: 

<!-- If your page already includes jQuery you can skip this step -->
<script type="text/javascript" src="kaltura-html5player-widget/jquery-1.4.2.min.js" ></script>
<!-- Include the css and javascript  -->
<link rel="stylesheet" href="kaltura-html5player-widget/skins/jquery.ui.themes/jquery-ui-1.7.2.custom.css"></link> 
<link rel="stylesheet" href="kaltura-html5player-widget/mwEmbed-player-static.css"></link> 
<script type="text/javascript" src="kaltura-html5player-widget/mwEmbed-player-static.js"></script>

Inserting HTML5 Media Elements onto a Web Page

Once the appropriate Javascript library has been included in the web page, any Media Elements in the page <body> will be replaced with the Kaltura Player: 

<video controls poster="./media/sintel.jpg" width="720" height="306">
  <source type="video/mp4" src="./media/sintel.mp4">
  <source type="video/ogg" src="./media/sintel.ogg">
  <track kind="subtitles" srclang="en" src="./media/sintel_en.srt"> 
  <track kind="subtitles" srclang="ru" src="./media/sintel_ru.srt"> 
</video>

becomes:


Retrieved from "http://html5video.org/w/index.php?title=Getting_Started_with_Kaltura_HTML5&oldid=1221"
Retrieved from "http://html5video.org/w/index.php?title=Getting_Started_with_Kaltura_HTML5&oldid=1221"