npm package: @playkit-js/omniture-on-page
Description: [![Build Status](https://app.travis-ci.com/kaltura/playkit-js-plugin-example.svg?branch=master)](https://app.travis-ci.com/kaltura/playkit-js-plugin-example) [![](https://img.shields.io/npm/v/@playkit-js/plugin-example/latest.svg)](https://www.npmjs.com/p
Author: Adi Machmali
Latest version: 1.0.1

[![Build Status](https://app.travis-ci.com/kaltura/playkit-js-plugin-example.svg?branch=master)](https://app.travis-ci.com/kaltura/playkit-js-plugin-example)
[![](https://img.shields.io/npm/v/@playkit-js/plugin-example/latest.svg)](https://www.npmjs.com/package/@playkit-js/plugin-example)
[![](https://img.shields.io/npm/v/@playkit-js/plugin-example/canary.svg)](https://www.npmjs.com/package/@playkit-js/plugin-example/v/canary)

# playkit-js-omniture-on-page

playkit-js-omniture-on-page is a [kaltura player] which allows to monitor player event and report them into Omniture (Adobe Analytics)

It relies on [kaltura player] core API for managing UI features.

playkit-js-plugin-example is written in [ECMAScript6] (`*.js`) and [TypeScript] (`*.ts`) (strongly typed superset of ES6),
and transpiled in ECMAScript5 using [Babel](https://babeljs.io/) and the [TypeScript compiler].

[Webpack] is used to build the distro bundle and serve the local development environment.

[kaltura player]: https://github.com/kaltura/kaltura-player-js.
[ecmascript6]: https://github.com/ericdouglas/ES6-Learning#articles--tutorials
[typescript]: https://www.typescriptlang.org/
[typescript compiler]: https://www.typescriptlang.org/docs/handbook/compiler-options.html
[webpack]: https://webpack.js.org/

## Prerequisites

The plugin requires [Kaltura Player] and [playkit-ui-managers] to be loaded first.
[kaltura player]: https://github.com/kaltura/kaltura-player-js
[playkit-ui-managers]: https://github.com/kaltura/playkit-js-ui-managers

## Features

## Getting started with development

```sh
# First, checkout the repository and install the required dependencies
git clone https://github.com/Kaltura-PS/playkit-js-omniture-on-page.git

# Navigate to the repo dir
cd playkit-js-omniture-on-page

# Run dev-server for demo page (recompiles on file-watch, and write to actual dist fs artifacts)
yarn
yarn build
yarn dev

# Before submitting a PR - Run the pre commit command
npm run pre:commit

# this command will run:

# 1. types check
# 2. lint check
# 3. generate/update types
# 4. generate/update docs
```

The dev server will host files on port 8000. Once started, the demo can be found running at http://localhost:8000/.

Before submitting a PR, please see our [contribution guidelines](CONTRIBUTING.md).

### Linter (ESlint)

Run linter:

```
npm run lint:check
```

Run linter with auto-fix mode:

```
yarn run lint:fix
```

### Formatting Code

Run prettier to format code

```
yarn run prettier:fix
```

### Type Check

Run type-check to verify TypeScript types

```
yarn run types:check
```

### Automated tests (Mocha/Karma)

Run all tests at once:

```
yarn test
```

Run unit tests in watch mode:

```
yarn run test:watch
```

## Design

An overview of this project's design, can be found [here](https://kaltura.atlassian.net/wiki/spaces/PROD/pages/3554412657/Side+Panel+Manager+-+Design+Document).

## API docs

[API docs](https://kaltura.github.io/playkit-js-plugin-example/docs/api/index.html)

## How to config at Prod

```js
plugins: {
  {
    "omnitureOnPage": {
    "dynamicMediaName": true,
      "s_codeVarName": "s",
      "monitorEventInterval": 0,
      "trackMilestones": "25,50,75",
      "autoTrack": true,
      "trackWhilePlaying": true,
      "referer": "Kaltura Referer",
      "customEvents": "ENTER_FULLSCREEN,EXIT_FULLSCREEN,FIRST_QUARTILE,SECOND_QUARTILE,THIRD_QUARTILE,PLAYBACK_ENDED",
      "FIRST_QUARTILEEvent": "event45",
      "FIRST_QUARTILEEvar1": "eVar45",
      "FIRST_QUARTILEEvar1Value": "entryName",
      "ENTER_FULLSCREENEvent": "event50",
      "ENTER_FULLSCREENEvar1": "eVar50",
      "ENTER_FULLSCREENEvar1Value": "entryId",
      "ENTER_FULLSCREENEvar2": "eVar51",
      "ENTER_FULLSCREENEvar2Value": "entryName",
      "ENTER_FULLSCREENProp1": "prop50",
      "ENTER_FULLSCREENProp1Value": "referer",
      "EXIT_FULLSCREENEvent": "event40",
      "EXIT_FULLSCREENEvar1": "eVar40",
      "EXIT_FULLSCREENEvar1Value": "entryId",
      "EXIT_FULLSCREENEvar2": "eVar41",
      "EXIT_FULLSCREENEvar2Value": "entryName",
      "EXIT_FULLSCREENProp1": "prop40",
      "EXIT_FULLSCREENProp1Value": "referer",
      "additionalEvarsAndPropsValuesDelimiter": ",",
      "additionalEvarsAndProps": "eVar4,eVar6,eVar7,eVar8,eVar9,eVar16,eVar19,eVar24,eVar27,eVar28,eVar29,eVar37,eVar43,eVar45,eVar46,eVar61,eVar62,eVar63,eVar64,eVar65,eVar68,eVar71,prop4,prop6,prop7,prop8,prop9,prop13,prop28",
      "additionalEvarsAndPropsValues": "referenceId,trDataLoad.categoryRefId,trDataLoad.categoryName,trDataLoad.companyId,trDataLoad.companyName,eud,preferedFlavorBR,trDataLoad.flashVersion,trDataLoad.location,riuid,jobrole,trDataLoad.playerName,pn,wtype,euid,entryId,trDataLoad.kalturaChannelId,trDataLoad.kalturaCompanyId,trDataLoad.instanceId,trDataLoad.content,rootEntryId,t1uid,referenceId,trDataLoad.categoryRefId,trDataLoad.categoryName,trDataLoad.companyId,trDataLoad.companyName,trDataLoad.screen,riuid",
      "mediaName": "{trDataLoad.categoryName}>{entryName}>{rootEntryId}",
      "s_codeUrl": "https://www.kaltura.com/html5/html5lib/kwidget-ps/ps/modules/tr/resources/s_code_prod.js",
      "eud": 1000,
      "euid": 1005,
      "jobrole": 1002,
      "pn": 1003,
      "riuid": 1007,
      "t1uid": 1006,
      "wtype": 1004
  }
}
```

## Demo

[https://kaltura.github.io/playkit-js-plugin-example/demo/index.html](https://kaltura.github.io/playkit-js-plugin-example/demo/index.html)

## Compatibility

playkit-js-plugin-example is only compatible with browsers supporting MediaSource extensions (MSE) API with 'video/MP4' mime-type inputs.

playkit-js-plugin-example is supported on:

- Chrome 39+ for Android
- Chrome 39+ for Desktop
- Firefox 41+ for Android
- Firefox 42+ for Desktop
- IE11 for Windows 8.1+
- Edge for Windows 10+
- Safari 8+ for MacOS 10.10+
- Safari for ipadOS 13+

## License

playkit-js-plugin-example is released under [Apache 2.0 License](LICENSE)