GithubHelp home page GithubHelp logo

neuralnoise / videojs-ga Goto Github PK

View Code? Open in Web Editor NEW

This project forked from mickey/videojs-ga

0.0 2.0 0.0 257 KB

Google Analytics plugin for video.js

License: MIT License

JavaScript 79.50% HTML 0.47% CSS 18.48% CoffeeScript 1.55%

videojs-ga's Introduction

videojs-ga

Google Analytics plugin for video.js

Getting Started

Download videojs and videojs.ga

In your web page:

<video id="video" src="movie.mp4" controls></video>
<script src="video.js"></script>
<script src="dist/videojs.ga.min.js"></script>
<script>
videojs('video', {}, function() {
  this.ga(); // "load the plugin, by defaults tracks everything!!"
});
</script>

Please note that the Google Analytics script must be loaded before the ga plugin

Options

You can provide options to the plugin either by passing them in the javascript or in the html.

player.ga({
  'eventsToTrack': ['fullscreen', 'resize'],
  'debug': true
});
<video id="video" src="movie.mp4" controls data-setup='{"ga": {"eventsToTrack": ["error"]}}'></video>

The plugin will take in priority options provided in the javascript, followed by the ones provided in html and finally the defaults.

The following options are supported:

####eventCategory

This is the category sent to GA. If you don't know what it is please check GA's doc default: 'Video'

####eventLabel

This is the label sent to GA. If you don't know what it is please check GA's doc default: basename of the video path so if the path is http://s3.amazonaws.com/pouet.mp4 the label would be pouet

####eventsToTrack

The events you want to track. Most of this events are videojs events. Some of them might reflects my needs. I'm open to add some more if you care to provide a good use case or a pull request. default: every events [ 'loaded', 'percentsPlayed', 'start', 'end', 'seek', 'play', 'pause', 'resize', 'volumeChange', 'error', 'fullscreen']

Most of the events are selft explanatory, here's the ones that may need more details:

  • percentsPlayed: will send an event every X percents. X being defined by the option percentsPlayedInterval.

####percentsPlayedInterval

This options goes with the percentsPlayed event. Every percentsPlayedInterval percents an event will be sent to GA. default: 10

####debug

If set to false, console logs will be ommited default: false

ga.js and analytics.js

This plugin supports the ga.js and the newer analytics.js Google Analytics libraries. It autodetects the library you use.

See information in google

To view the data on Google, access your account in analytics, in left panel click in Behavior > Events > Top Events.

TODO

  • track the engine used (html5/flash) along with the source (ogg, mp4, ...)
  • track the time to download the video

videojs-ga's People

Contributors

mickey avatar jakiestfu avatar dominic-p avatar collin avatar breim avatar hosiawak avatar pdebruic avatar

Watchers

James Cloos avatar Starbuck 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.