Skip to content

Plugins

Jump to bottom Edit New page
Steve Heffernan edited this page Nov 6, 2019 · 178 revisions

Creating a plugin

View the plugin docs. If you'd like a head-start on the scaffolding for a new video.js plugin, check out the Yeoman video.js plugin generator.

Adding to this page

When you add a plugin to this page, have a look at how others have done so, it should be a single item, with a link to the project's source code or home page, and a short description (one line after formatting has been applied).

If you see a plugin without a description, feel free to edit the page and add it in, any contributions are appreciated.

Plugins

Contrib Plugins

Larger projects covering common but optional extensions of the player. (See the django definition)

  • videojs-contrib-hls: Add HTTP Live Streaming (HLS) support in desktop browsers (via Flash)
  • videojs-contrib-ads: Provides common functionality needed by video advertisement libraries working with video.js

Community Plugins

  • videojs-theater-mode: Adds a "theater mode" button to the control bar that triggers an event the player can listen for and respond to (ie, dim the page's background, expand the player).
  • videojs-airplay: Adds an airplay button if the browser supports the WebKitPlaybackTargetAvailabilityEvent
  • videojs-DEL: A plugin that is for Doing Ending Leaving (Yes, thats what it stands for!)!
  • videojs-Background: A plugin that allows for videos to be displayed as a full background to any element.
  • videojs-endcapCTA: A plugin for custom CTA (Call To Action) to be displayed at end of video. Super simple displaying of your HTML - E.g. a contact form, a buy now button or a link to product/store.
  • videojs-HDtoggle: HD button which toggles between HD and non-HD source.
  • videojs-hotkeys: A plugin for Video.js that enables keyboard hotkeys when the player has focus.
  • videojs-ima: Easily integrate the Google IMA SDK into Video.js to enable advertising on your video content.
  • videojs-brightcoveAnalytics: Allow tracking of views/impressions & engagement data in videojs for Brightcove videos
  • videojs-markers: Add customizable markers upon progress bars
  • videojs-ad-markers: Provide basic functionality to implement an advertising system with markers on the timeline
  • videojs-caption: Have the most flexibility and power for displaying caption videojs
  • videojs-errors: displays user-friendly error messages.
  • videojs-youtube-videowall: Display video wall of related youtube videos after the video finishes. Require videojs-youtube.
  • videojs-thumbnails: displays thumbnail images over the progress bar.
  • videojs-endcard: Simple, customizable end card solution for VideoJS.
  • videojs-vast: A VideoJS plugin to play pre-roll videos from a VAST feed.
  • videojs-vpaid: A VideoJS plugin to play pre-roll videos from a VPAID feed; supports numerous VPAID event firings as well as ad timeout.
  • videojs-vast-vpaid-waterfall: Adds user-configurable VAST and VPAID preroll, midroll, and postroll with fallback ads.
  • videojs-rtc: displays a WebRTC chat window alongside the player to be able to chat with a friend while watching a video.
  • videojs-leapmotion: a plugin to control video playback with Leap Motion.
  • videojs-playlist: easily create a playlist of videos. Gives some methods to videojs and provides useful events to allow customization.
  • videojs-playlist-thumbs: plays videos (youtube or local) in a loop and show a sidebar with the videos list with thumbnail and title.
  • videojs-playlist (<video> or <audio>): designed for video or audio playlists. Plays tracks continuously or by selecting them.
  • videojs-persistvolume: remembers the volume last set by the user and applies it to new instances of player.
  • videojs-rotatezoom: a plugin to easily rotate or zoom in a video.
  • videojs-watermark: Display a watermark/overlay on top of the video.
  • videojs-cuepoints: Sync actions with the media timeline.
  • videojs-rangeslider: Create a range slider to select a region of a video in video-js.
  • videojs-marquee-overlay-scrolling-text: Scrolling text with marquee plugin integration. ( Useful for webtv station )
  • videojs-dynamic-overlay: Dynamic text change location with given duration. It's for website that has private content and prevent screen capture easily ( Useful for education system )
  • videojs-ga: Google Analytics plugin for video.js
  • videojs-related: Button that when clicked shows a list of images that link to urls. Envisioned as a way to show related content inside the player.
  • videojs-relatedCarousel: Button that when clicked shows a list of images that link to urls. Envisioned as a way to show related content inside the player.
  • videojs-ageGate: Forces a user to enter a satisfactory birth date before video will play.
  • videojs-progressTips: Tooltip on hover of the progressbar with the time.
  • videojs-logobrand: Add a logo/brand image to the player that appears/disappears with the controls. (also useful as a basic plugin template for learning how Video.JS plugins work.
  • videojs-brand: Simple plugin that adds your logo brand in the player controls.
  • videojs-imageOverlay: Add an opaque, clickable overlay on a video during a specified time range.
  • videojs-chromecast: Display a chromecast Button on Control Bar video.js players.
  • video.js-chromecast: Display a chromecast Button on Control Bar video.js 5. players.
  • videojs-disable-progress: Disable / Enable progress scrubbing. Useful for preroll advertisements where skipping the video isn't an option.
  • videojs-share: allows to copy video url / embed code and share video to social networks and messengers.
  • videojs-share: allows to copy video embed code and share video to social networks.
  • videojs-sharing: Add a menu to the control bar to share the video/page using the addThis API (no account required)
  • videojs-stereopanner: Adds stereo channel panning functions
  • videojs-akamai-analytics: Akamai Sola Analytics plugin for video.js
  • videojs-comscore: Reports to comScore using their latest Streaming Tag SDK
  • videojs-vr: Project video onto different geometric shapes (Sphere, Cube, Cylinder) and view in 3d with optional Oculus Rift support
  • video-speed: Adds customizable video-speed control. Deprecated. There is now native support for playback rates and this plugin only works with v4.8.5 because of usage of mangled properties.
  • OpenVideoAnnotation - plugin to create annotations in video-js using annotator. Project in: openvideoannotation.org
  • videojs-overlay: display simple HTML overlays during video playback.
  • videojs-seek: Seeks to a specific time point specified by a query string parameter.
  • videojs-preroll: Simple preroll plugin that displays an advertisement before the main video
  • videojs-framebyframe: Adds buttons for stepping through a video frame by frame
  • videojs-ABdm: Use CommentCoreLibrary to show comments (whic is called as DanMu) during playing.
  • videojs-ass: Adds Advanced SubStation Alpha subtitles support.
  • videojs-transcript: Display an interactive transcript from caption or subtitle tracks.
  • videojs-autoplay-toggle: adds an autoplay toggle which will persist to cookies or localstorage.
  • videojs-offset: Allows you to play a segment of the video.
  • videojs-youtube-progress: Preserve progress seeker when control bar is hidden.
  • projectorjs: A small no-dependencies JavaScript library that enables the display of overlays on native HTML5 video elements, or (optionally) video elements powered by videojs.
  • videojs-record: A video.js plugin for recording audio/video/image files.
  • videojs-clarify-annotations: A video.js plugin for displaying annotations in the scrubber timeline based on search results from the Clarify API.
  • videojs-timer:A video.js plugin for interval based video consumptions.
  • videojs-vast-vpaid: A video.js plugin to play VAST and VPAID pre-roll ads. Regarding VPAID we already support Flash ads and are working to support HTML5 ads.
  • videojs-timecode: Shows current time and duration in a broadcast-style format: hh:mm:ss:ff. Configurable for PAL/PALp/NTSC.
  • videojs-resolution-switcher: A video.js plugin which allows to choose video resolution (works only with video.js v5)
  • videojs-countdown: Autoplay countdown timer that starts when the player is scrolled into view.
  • videojs-resume: Resume playback of a video from the point in time it was left.
  • videojs-audio-tracks: Use the Audio Tracks API to play multiple audio tracks from a single video.
  • videojs-responsive-layout: Adapt the layout of the control bar depending on the width of the player, using the Video.js 5 responsive classes.
  • videojs-suggestedVideoEndcap: Creates an endcap screen with a grid of suggested video links to watch.
  • videojs-socialShare: Creates a Twitter and/or Facebook social share button on hover over the video player.
  • videojs-afk-monitor: Prompts user to continue watching after certain period of inactivity.
  • videojs-sc: Adobe Analytics (SiteCatalyst)
  • videojs-abloop: Allows looping of a section of a video
  • videojs-stopButton: A video.js plugin that displays a stop button in the control bar.
  • videojs-bug: Adds a TV-style logo bug with configurable options to your video.
  • videojs-upnext: Displays a countdown with the same style as Youtube's when the video ends.
  • videojs-event-tracking: Track events with VideoJS and keep an eye on performance metrics. (Useful with Google Analytics, Amplitude, Mixpanel, Piwik, and other event tracking platforms)

Playback Techs (support media from different sources)

  • video-js-swf: Allows you to decode HLS videos with Flash within VideoJS.
  • videojs-youtube: Allows you to play YouTube videos within VideoJS.
  • videojs-vimeo: Allows you to play Vimeo videos within VideoJS.
  • videojs-dailymotion: Allows you to play Dailymotion videos within VideoJS.
  • videojs-soundcloud: Allows you to play soundcloud tracks within VideoJS.
  • videojs-externals: All External Embeds Player Playback Technology
  • videojs-wavesurfer: Adds a interactive waveform for audio and video files.
  • videojs-dashjs: Loads dash.js as a tech to support MPEG-DASH videos.
  • videojs-peer5: Adds P2P delivery layer to the HLS plugin (based on Peer5's WebRTC technology)
  • videojs-silverlight: Allows you to play WMV, WMA, MP4, MP3, WAV and FLAC medias through Silverlight within Video.js.
  • videojs-vlc: Allows you to play all media through VLC web plug-in within Video.js.
  • videojs-aurora: Allows you to play WAV, OGG, MP3, M4A, AAC and FLAC medias through Aurora.js within Video.js.
  • videojs-java: Allows you to play AIFF, AVI, GSM, MID, MPG, MP2, MOV, AU and WAV medias through Java within Video.js.
  • videojs-flashls: Allows you to play HLS files (m3u8) via the flashls project.
  • videojs-ooyala: Video.js plugin to fetch videos from Ooyala.
  • videojs-wistia: Allows you to play Wistia videos within VideoJS.
  • videojs-ogvjs: Allows you to play Ogg Vorbis/Theora HTML5 videos using ogv.js Javascript decoding; for browsers like Safari and IE that do not yet support patent-free formats natively.
  • videojs-panorama Allows you to play a full 360 degree video within VideoJS.
  • videojs-replay Turns the play/pause toggle into a replay button after playback has ended.
  • videojs-watermark Display a configurable watermark in the video player.
  • videojs-ad-scheduler VMAP based advertisement scheduler for video.js.
  • videojs-hlsjs-p2p Video.js 5.0+ HLS(hls.js) source handler with P2P assisted playback.
  • videojs-dashjs-p2p Video.js 5.0+ MPEG-DASH(dash.js) source handler(based on videojs-contrib-dash) with P2P assisted playback.
  • videojs-shaka: Loads Google's shaka player as a tech to support MPEG-DASH videos.

For Other Platforms and Frameworks

https://github.com/videojs/video.js.wiki.git Page not avaiable now.

Add a custom sidebar
Clone this wiki locally