JW Player is the world's most popular embeddable media player.
JavaScript ActionScript CSS HTML
Switch branches/tags
Latest commit 3fc52be Jun 26, 2017 @hghazzi hghazzi committed with egreaves Preloading: Trigger When Player is Viewable (#2125)
* Preload the first player on the page or when a player becomes viewable
JW8-23
Permalink
Failed to load latest commit information.
.github Use the active voice in the PR template Jun 5, 2017
assets Rewind icon resized and removed unused icons Feb 7, 2017
libs-external Fix playlist error handling after api.load Nov 12, 2015
src Preloading: Trigger When Player is Viewable (#2125) Jun 26, 2017
test Unskip API Config Unit Tests (#2123) Jun 21, 2017
.babelrc Upgrade to webpack2 Jun 12, 2017
.eslintignore Lint polyfills and remove non-standard webvtt prefs (#2006) Apr 24, 2017
.eslintrc Add eslint rule to forbid for-of loops Jun 19, 2017
.gitignore Remove and ignore package-lock.json file (#2115) Jun 19, 2017
.jshintignore Created custom style-loader that does not include base64 data url hea… May 3, 2016
.project.default default FlashBuilder files May 15, 2014
.stylelintrc Fix icon font smoothing in webkit browsers Apr 10, 2017
.travis.yml Update travis config to use node 8 (#2117) Jun 20, 2017
CONTRIBUTING.md New docs (#1654) Jan 5, 2017
Gruntfile.js Remove sourcemaps from CSS files (#2118) Jun 20, 2017
LICENSE Adding our CC license, human-readable version below Jul 1, 2014
README.md Use new webpack env arguments Jun 22, 2017
accessibility.md ADD aria attributes for better accessibility... (#1198) JW7-2628 Jun 27, 2016
browserslist Replace Handlebars with ES6 string templates JW7-4245 Apr 7, 2017
karma.conf.js Fix Istanbul to work with webpack (#2099) Jun 21, 2017
package.json Fix Istanbul to work with webpack (#2099) Jun 21, 2017
postcss.config.js Place postcss config in a place thats easier for processes to find. Apr 4, 2017
test-context.js Enable ES6 on source and tests Apr 1, 2017
webpack.config.js Fix Istanbul to work with webpack (#2099) Jun 21, 2017

README.md

JW Player Logo

Join the chat at https://gitter.im/jwplayer/jwplayer

Plays everywhere, every time.

Live on over 2 million sites with 1.3 billion unique plays per month, JW Player is the solution for seamless video playback across browsers and media types. It empowers the developer to interact with video programmatically to create unique and awesome user experiences.

Official Documentation

This is the free version of JW Player. It does not contain the same features as the Premium, Platinum, or Enterprise editions. If you are a paid customer and want a player, please download it from the "Downloads" section of your JW Dashboard.

A Simple Example

The example below will render a video player into the div with the player id, listens to an event, and makes a few calls using the API.

<html>
    <head>
        <script src='LINK_TO_YOUR_PLAYER'></script>
        <script>jwplayer.key='YOUR_KEY';</script>
    </head>
    <body>
        <div id="player">Loading the player...</div>
        <script>
            // Setup the player
            const player = jwplayer('player').setup({
                file: 'LINK_TO_YOUR_FILE.mp4'
             });
             
            // Listen to an event
            player.on('pause', (event) => {
                alert('Why did my user pause their video instead of watching it?');
            });
            
            // Call the API
            const bumpIt = () => {
                const vol = player.getVolume();
                player.setVolume(vol + 10);
            }
            bumpIt();
        </script>
    </body>
</html>

Check out an interactive example in this JSFiddle.

Contributing

We appreciate all contributions towards the player! Before submitting an issue or PR, please see our contributing docs here.

Building the Player

We use grunt and a few npm scripts to build the player, lint code, and run tests. Debug code is built to /bin-debug, while minified & uglified code is built to /bin-release. Code is built with webpack, linted with eslint, and tested with karma, mocha and chai.

Requirements:

  1. Node.js
  2. Java*

* Optional, but required for building Flash. If not installed you must grunt with the --force flag.

Steps:

  1. Fork the project, clone your fork, and set up the remotes:
# Clone your fork of the repo into the current directory
git clone https://github.com/<your-username>/jwplayer
# Navigate to the newly cloned directory
cd jwplayer
# Assign the original repo to a remote called "upstream"
git remote add upstream https://github.com/jwplayer/jwplayer
  1. Install the dependencies:
# Install grunt globally
npm install -g grunt
npm install
# Optionally, install webpack-dev-server
npm install -g webpack-dev-server
  1. Build the player:
# Build once, Flash and JS
grunt
# Complete Watch - builds FLash and JS, lints, and tests on each change
grunt serve
# Quick JS Watch - build only. Requires webpack-dev-server to be installed globally
webpack-dev-server -w --env.debug --port 8888 --output-public-path /bin-debug/
  1. Test your code:
# All browsers
grunt test
# Individual browsers - chrome, firefox, ie11, ie10, ie9
grunt karma:{BROWSER} e.g. grunt karma:chrome
  1. Lint your code:
npm run lint

Software License

The use of this library is governed by a Creative Commons license. You can use, modify, copy, and distribute this edition as long as it’s for non-commercial use, you provide attribution, and share under a similar license. http://www.jwplayer.com/license/