Git Product home page Git Product logo

videojs-collect-data's Introduction

videojs-collect-data

Collect data from client on during watching video.

Table of Contents

Installation

npm install --save @filmgardi/videojs-collect-data

Usage

To include videojs-collect-data on your website or web application, use any of the following methods.

<script> Tag

This is the simplest case. Get the script in whatever way you prefer and include the plugin after you include video.js, so that the videojs global is available.

<script src="//path/to/video.min.js"></script>
<script src="//path/to/videojs-collect-data.min.js"></script>
<script>
  var player = videojs('my-video');

  const collectDataOption = {
    intervalTime: 1000, // `intervalTime` get integer value. "base on miliseconds"
    requiredParameter: [
      { name: 'require1', value: 'require1_Value' },
      { name: 'require2', value: 1 },
      { name: 'require3', value: true },
      { name: 'require4', value: new Date().getTime() },
      { name: 'require5', value: 12 },

    ],
    action: { // The main action in each interval call this function.
      name: 'Temp1', // The name of action.
      method: 'POST', // GET,POST,PUT,DELETE
      url: 'https://example.com/api/v1/temp',// The destination url
      body: { // The body have to main parameter :
              // params : the defination of your request body set here.
              // config : the config is optional variable for create your body.
        params: {
          p1: 'p1_value', // static value
          p2: 'p2_value', // static value
          nestetParam: {
            p3: 'FG-VIDEO_HALF_TIME', // FG-VIDEO_HALF_TIME : get half video duration
            p4: 'FG-VIDEO_CURRENT_TIME', // FG-VIDEO_CURRENT_TIME : get videojs current time
            p5: 'FG-DEVICE_RESOLUTION' // FG-DEVICE_RESOLUTION : get client monitor resolution
            p6: 'FG-METHOD(${fuid} + "_" + ${fmid})', // FG-METHOD(arguments) : calculate arguments
            p7: 'FG-VIDEO_MIN_TO_NOW', // FG-VIDEO_MIN_TO_NOW : get videojs difference between live time and play time 
            // you can use static value and `params` inside parameters in your arguments.
            // ex.
            // 1: FG-METHOD(${p1} + ${p2})
            // 2: FG-METHOD(${require1} + ${require2})
            // 3: FG-METHOD(${require2} * ${require5}) use same type value for ( * and / and - ) operation.
          },
          ...
        },
        config: {
          targetParam: 'nestetParam' // with this config `requiredParameter` object add to `targetParam` object if you did't set `targetParam` the object add to root of `params`.
          ignore:{
            requiredParameter: false, // with this option control append `requiredParameter`to your body
            clientInfo: false // with this option control append `clientInfo`to your body
            //clientInfo contain os: "Linux", osVersion: "x86_64", market: "WEB", marketVersion: "0.0.1"
          }
        }
      }
    },
    altAction: [
      {
        name: 'Temp2',
        method: 'POST',
        url: 'https://example.com/api/v1/temp2',
        body: {
          params: {
            p1: 'FG-VIDEO_HALF_TIME',
            p2: 'FG-VIDEO_CURRENT_TIME',
            p3: 'FG-DEVICE_RESOLUTION',
            p4: 'FG-VIDEO_MIN_TO_NOW',
          }
        }
      },
      {
        name: 'Temp3',
        method: 'POST',
        url: 'https://example.com/api/v1/temp3/',
        headers: {
          Authorization: 'Authorization hash',
          ...
        },
        body: {
          params: {
            p1: 'FG-VIDEO_HALF_TIME',
            p2: 'FG-VIDEO_CURRENT_TIME',
            p3: 'FG-VIDEO_MIN_TO_NOW',
          }
        }
      }
    ]
  };

  player.collectData(collectDataOption);
</script>

Browserify/CommonJS

When using with Browserify, install videojs-collect-data via npm and require the plugin as you would any other module.

var videojs = require('video.js');

// The actual plugin function is exported by this module, but it is also
// attached to the `Player.prototype`; so, there is no need to assign it
// to a variable.
require('@filmgardi/videojs-collect-data');

var player = videojs('my-video');

player.collectData();

RequireJS/AMD

When using with RequireJS (or another AMD library), get the script in whatever way you prefer and require the plugin as you normally would:

require(['video.js', '@filmgardi/videojs-collect-data'], function(videojs) {
  var player = videojs('my-video');

  player.collectData();
});

License

MIT. Copyright (c) m-saffari <[email protected]>

videojs-collect-data's People

Contributors

faridghafoori avatar saffari-m avatar

Stargazers

 avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.