KalturaPlugins:ExternalResources

From HTML5 Video
Jump to: navigation, search


KDP Compatibility
Home Page
Repository URL http://www.kaltura.org/kalorg/html5video/trunk/mwEmbed/modules/KalturaSupport

Contents

Introduction

External Resources adds support for loading External resources onPage ( for both flash and html5) or within the iframe of the javasciprt html5 player.

example page

The purpose of this document is to detail configuration options for associating external resources with kaltura plugins.

Usage

OnPage Resources

Javascript onPage resources are included for both html5 and flash and will be included on page prior to execution of jsCallbackReady. OnPage resources can use jsCallbackReady but its recommend that they instead use the following method that will enable you to add code to be executed once the player is ready for bindings:

KWidget.addReadyCallback( function( /* @param = playerId of ready player */ ) );

Note: the use of relative links is supported, but its recommended that you use absolute links in case we later develop functionality to package multiple resources in a single request on the serverside without embed context.

Example of onPage vars external resources ( not associated with any plugin )

 <var key="onPageJs1" value="externalResources/onPageJs1.js" />
 <var key="onPageCss1" value="externalResources/onPageCss1.css" />


HTML5 Iframe resources

To include HTML5 iframe side resources you can use uiVars. Resources included here are “custom plugins” and are functionality equivalent to the loader.js files you see in mwEmbed modules. They can bind to all the player build out events check for the existing of plugins and load more files if needed. The iframe resources can be defined as follows:

    <var key="IframeCustomPluginJs1" value="externalResources/IframeCustomPluginJs1.js" />
    <var key="IframeCustomPluginJs2" value="externalResources/IframeCustomPluginJs2.js" />
    <var key="IframeCustomPluginCss1" value="externalResources/IframeCustomPluginCss1.css" />


HTML5 iframe resource associated with plugin

<Plugin id="fooBar" /*...*/ iframeHTML5Js1="externalResources/iframeHTML5_fooBarPlugin.js" />

Note: If using relative css image paths they should be relative to the page embed location ( not the css file ). Practically you should use absolute urls or base64 embed the assets in the css file.

Note: Mw.CustomResourceIncludes is deprecated for external use. This configuration variable is used internally to structure the delivery of resources to the player, but uiConf includes of scripts should use the iframe or onPage vars to explicitly say the loading mode of the given plugin.

Example UIConf

Example xml plugin configuration:

<Plugin id="fooBar" width="0%" height="0%" includeInLayout="false"
	loadingPolicy="onDemand" 
     	onPageJs1="externalResources/onPageCSS1_fooBar.css"
     	onPageCss1="externalResources/onPage_fooBarPlugin.css"
        iframeHTML5Js1="externalResources/Html5IframePlugin.js"
/>