A simple wrapper around Kaltura player
To install Kaltura Player from npm:
npm install angular2-kaltura --save
Import KalturaModule
and define it as one of the imports of your application module:
import { NgModule } from '@angular/core';
import { KalturaModule } from 'angular2-kaltura';
import { AppComponent } from './app.component';
@NgModule({
imports: [
KalturaModule
],
declarations: [
AppComponent
],
bootstrap: [
AppComponent
]
})
export class AppModule { }
Add the following HTML to the component template in which you want to use the select component:
<kaltura-player [config]="kalturaConfig"
[videoId]="videoId"
[secure]="true"
(ready)="doSomethingOnReady(targetId)">
</kaltura-player>
videoId
is the entry_id from Kaltura
config
is a KalturaConfig
object (yes I like Typescript).
secure
is a boolean flag. Set to true
if you want to load Kaltura Player Javascript via https. Default false
(ready)
is an event which is emitted when the Kaltura Player is ready. targetId
is the DOM id of the element that wrapps the player.
Within the component class you have to set KalturaConfig
object.
private kalturaConfig: KalturaConfig;
...
this.kalturaConfig = new KalturaConfig('partner_id', 'uiconfid');
To customize the player you can pass the flashvars object to KalturaConfig
like this:
// flashvars is optional and allows you to set runtime uiVar configuration
this.kalturaConfig.flashvars = {
autoPlay: false,
IframeCustomPluginCss1: '/path/to/your/custom.css',
mediaProxy: {
entry: {
name: 'Some title'
}
},
topBarContainer: {
plugin: true
}
};