GithubHelp home page GithubHelp logo

devinchen / videojs-youtube Goto Github PK

View Code? Open in Web Editor NEW

This project forked from videojs/videojs-youtube

0.0 2.0 0.0 852 KB

YouTube playback technology for Video.js

License: MIT License

JavaScript 97.29% HTML 2.71%

videojs-youtube's Introduction

YouTube Playback Technology
for Video.js Build Status

Selenium Test Status

YouTube playback technology for the Video.js player.

Install

You can use bower (bower install videojs-youtube), npm (npm install videojs-youtube) or the source and build it using grunt. Then, the only file you need is dist/vjs.youtube.js.

Example

<!DOCTYPE html>
<html>
<head>
  <link type="text/css" rel="stylesheet" href="https://vjs.zencdn.net/4.12/video-js.css" />
  <script src="https://vjs.zencdn.net/4.12/video.js"></script>
  <script src="vjs.youtube.js"></script>
</head>
<body>
  <video id="vid1" src="" class="video-js vjs-default-skin" controls preload="auto" width="640" height="360" data-setup='{ "techOrder": ["youtube"], "src": "http://www.youtube.com/watch?v=xjS6SftYQaQ" }'>
  </video>
</body>
</html>

See the examples folder for more

How does it work?

Including the script vjs.youtube.js will add the YouTube as a tech. You just have to add it to your techOrder option. Then, you add the option src with your YouTube URL.

It supports:

Additional Options

This plugin exposes the following additional player options:

  • ytcontrols (Boolean): Display the YouTube player controls instead of the Video.js player controls. (default false)
  • ytFullScreenControls (Boolean): Show the fullscreen controls on the default youtube player controls. Also enables double click to fullscreen. (default true)
  • quality (String): Set the default video quality. Should be one of 1080p, 720p, 480p, 360p, 240p, 144p.
  • playsInline (Boolean): Sets the playsinline YouTube player parameter to enable inline playback on iOS
  • forceHTML5 (Boolean): Forces loading the YouTube HTML5 player (default true)

##Special Thank You Thanks to Steve Heffernan for the amazing Video.js and to John Hurliman for the original version of the YouTube tech

videojs-youtube's People

Contributors

abeutot avatar ange007 avatar apptv avatar da1nonly avatar danielcebrian avatar danielhudson avatar dcharbonnier avatar ddaf avatar dennisss avatar designorant avatar dirkjanm avatar dominic-p avatar dragosmocrii avatar exon avatar gintsmurans avatar jordanj77 avatar justinlevi avatar martindale avatar owenedwards avatar passkey1510 avatar robinnorth avatar ryanand26 avatar slobo avatar snemarch avatar stopspazzing avatar webnard 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.