-
Notifications
You must be signed in to change notification settings - Fork 52
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
* Add kaltura ott player. * Add docs. * Split webpack to ott & ovp. * Add types. * Update samples.
- Loading branch information
Dan Ziv
authored
Jan 10, 2018
1 parent
a0e6cd3
commit c740a33
Showing
47 changed files
with
61,444 additions
and
918 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -3,4 +3,5 @@ | |
/dist | ||
karma.conf.js | ||
webpack.config.js | ||
|
||
webpack.config.ovp.js | ||
webpack.config.ott.js |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1 +1,150 @@ | ||
# kaltura-player-js | ||
# Kaltura Player JS Platform - OTT and OVP media players based on the [PlayKit JS Player] | ||
|
||
[![Build Status](https://travis-ci.org/kaltura/kaltura-player-js.svg?branch=master)](https://travis-ci.org/kaltura/kaltura-player-js) | ||
|
||
Kaltura Player JS is written in [ECMAScript6], statically analysed using [Flow] and transpiled in ECMAScript5 using [Babel]. | ||
|
||
[Flow]: https://flow.org/ | ||
[ECMAScript6]: https://github.com/ericdouglas/ES6-Learning#articles--tutorials | ||
[Babel]: https://babeljs.io | ||
[Playkit JS Player]: https://github.com/kaltura/playkit-js | ||
|
||
## Getting Started | ||
|
||
### Installing | ||
|
||
First, clone and run [yarn] to install dependencies: | ||
|
||
[yarn]: https://yarnpkg.com/lang/en/ | ||
|
||
``` | ||
git clone https://github.com/kaltura/kaltura-player-js.git | ||
cd kaltura-player-js | ||
yarn install | ||
``` | ||
|
||
### Building | ||
|
||
Then, build the player | ||
|
||
```javascript | ||
yarn run build | ||
``` | ||
|
||
### Embed the library in your test page | ||
|
||
Finally, add the bundle as a script tag in your page, and initialize the player | ||
|
||
**OVP Player** | ||
```html | ||
<script type="text/javascript" src="/PATH/TO/FILE/kaltura-ovp-player.js"></script> | ||
<div id="player-placeholder" style="height:360px; width:640px"> | ||
<script type="text/javascript"> | ||
// Step 1 - Create kaltura player options object | ||
var options = { | ||
targetId: "player-placeholder", // Mandatory | ||
provider: { | ||
... | ||
partnerId: "YOUR_PARTNER_ID" // Mandatory | ||
... | ||
}, | ||
player: { // Optional | ||
... | ||
}, | ||
ui : { // Optional | ||
... | ||
} | ||
}; | ||
// Step 2 - Get the player instance | ||
var player = KalturaPlayer.setup(options); | ||
// Step 3 - Create media info object | ||
var mediaInfo = { | ||
entryId: "YOUR_ENTRY_ID" // Mandatory | ||
}; | ||
// Step 4 - Load the media | ||
player.loadMedia(mediaInfo).then(function() { | ||
// Step 5 - Start to play | ||
player.play(); | ||
}); | ||
</script> | ||
``` | ||
|
||
**OTT Player** | ||
|
||
```html | ||
<script type="text/javascript" src="/PATH/TO/FILE/kaltura-tv-player.js"></script> | ||
<div id="player-placeholder" style="height:360px; width:640px"> | ||
<script type="text/javascript"> | ||
// Step 1 - Create kaltura player options object | ||
var options = { | ||
targetId: "player-placeholder", // Mandatory | ||
provider: { | ||
... | ||
partnerId: "YOUR_PARTNER_ID" // Mandatory | ||
... | ||
}, | ||
player: { // Optional | ||
... | ||
}, | ||
ui : { // Optional | ||
... | ||
} | ||
}; | ||
// Step 2 - Get the player instance | ||
var player = KalturaPlayer.setup(options); | ||
// Step 3 - Create media info object | ||
var mediaInfo = { | ||
entryId: "YOUR_ENTRY_ID" // Mandatory | ||
mediaType: "YOUR_MEDIA_TYPE", // Optional, default: "MEDIA" | ||
contextType: "YOUR_MEDIA_CONTEXT_TYPE" // Optional, default: "PLAYBACK" | ||
}; | ||
// Step 4 - Load the media | ||
player.loadMedia(mediaInfo).then(function() { | ||
// Step 5 - Start to play | ||
player.play(); | ||
}); | ||
</script> | ||
``` | ||
|
||
## Configuration | ||
|
||
## Running the tests | ||
|
||
Tests can be run localy via [Karma], which will run on Chrome, Firefox and Safari | ||
|
||
[Karma]: https://karma-runner.github.io/1.0/index.html | ||
``` | ||
yarn run test | ||
``` | ||
|
||
You can test individual browsers: | ||
``` | ||
yarn run test:chrome | ||
yarn run test:firefox | ||
yarn run test:safari | ||
``` | ||
|
||
### And coding style tests | ||
|
||
We use ESLint [recommended set](http://eslint.org/docs/rules/) with some additions for enforcing [Flow] types and other rules. | ||
|
||
See [ESLint config](.eslintrc.json) for full configuration. | ||
|
||
We also use [.editorconfig](.editorconfig) to maintain consistent coding styles and settings, please make sure you comply with the styling. | ||
|
||
|
||
## Compatibility | ||
|
||
TBD | ||
|
||
## Contributing | ||
|
||
Please read [CONTRIBUTING.md](https://gist.github.com/PurpleBooth/b24679402957c63ec426) for details on our code of conduct, and the process for submitting pull requests to us. | ||
|
||
## Versioning | ||
|
||
We use [SemVer](http://semver.org/) for versioning. For the versions available, see the [tags on this repository](https://github.com/kaltura/playkit-js-providers/tags). | ||
|
||
## License | ||
|
||
This project is licensed under the AGPL-3.0 License - see the [LICENSE.md](LICENSE.md) file for details |
Large diffs are not rendered by default.
Oops, something went wrong.
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,19 @@ | ||
// @flow | ||
declare type PartialKalturaPlayerOptionsObject = { | ||
targetId: string, | ||
logLevel?: string, | ||
disableUserCache?: boolean, | ||
player?: PKPlayerOptionsObject, | ||
provider: ProviderOptionsObject, | ||
ui?: UIOptionsObject | ||
}; | ||
|
||
declare type KalturaPlayerOptionsObject = { | ||
targetId: string, | ||
logLevel?: string, | ||
disableUserCache?: boolean, | ||
player: PKPlayerOptionsObject, | ||
provider: ProviderOptionsObject, | ||
ui: UIOptionsObject | ||
}; | ||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,2 @@ | ||
// @flow | ||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,42 @@ | ||
<!DOCTYPE html> | ||
<html lang="en"> | ||
<head> | ||
<meta charset="UTF-8"> | ||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=no"> | ||
<title>Title</title> | ||
<link rel="stylesheet" type="text/css" href="./style.css"/> | ||
<script src="./kaltura-ovp-player.js" type="text/javascript"></script> | ||
</head> | ||
<body> | ||
<div id="player-placeholder"></div> | ||
<script> | ||
var config = { | ||
targetId: 'player-placeholder', | ||
provider: { | ||
partnerId: 1091, | ||
env: { | ||
cdnUrl: "http://qa-apache-php7.dev.kaltura.com/", | ||
serviceUrl: "http://qa-apache-php7.dev.kaltura.com/api_v3" | ||
} | ||
}, | ||
player: { | ||
plugins: { | ||
kanalytics: { | ||
serviceUrl: "http://qa-apache-php7.dev.kaltura.com/api_v3" | ||
}, | ||
ima: { | ||
adTagUrl: 'https://pubads.g.doubleclick.net/gampad/ads?sz=640x480&iu=/124319096/external/ad_rule_samples&ciu_szs=300x250&ad_rule=1&impl=s&gdfp_req=1&env=vp&output=vmap&unviewed_position_start=1&cust_params=deployment%3Ddevsite%26sample_ar%3Dpremidpost&cmsid=496&vid=short_onecue&correlator=' | ||
} | ||
} | ||
} | ||
}; | ||
|
||
try { | ||
var kalturaPlayer = KalturaPlayer.setup(config); | ||
kalturaPlayer.loadMedia({entryId: '0_wifqaipd'}); | ||
} catch (e) { | ||
console.error(e.message) | ||
} | ||
</script> | ||
</body> | ||
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.