Questions tagged [plyr.js]

A simple HTML5, YouTube and Vimeo player

What is ?

Plyr is a simple, accessible and customizable HTML5, YouTube and Vimeo media player..

It is a lightweight, accessible and customizable media player that supports modern browsers. There are many other players out there but the team wanted to keep things simple, using the right elements for the job.

N.B.: This tag was named to distingush it from which is an R package for splitting, applying and combining large data structures.


Resources

82 questions
3
votes
2 answers

Using PLYR for Youtube videos - poster image?

I am using Plyr (https://github.com/sampotts/plyr) to play Youtube videos inline. But i now want to add a poster to the player, so i can use a thumbnail for the video, before it plays. Plyr supports this, but i can not get it to work. I am currently…
brother
  • 7,651
  • 9
  • 34
  • 58
3
votes
2 answers

Vimeo API with ReactJS and Plyr

I have a React component that uses the https://github.com/selz/plyr media player. Everything works fine until the component unmounts, which results in an error from the Vimeo API. Specifically: Uncaught (in promise) TypeError: Cannot read property…
Ryan Potter
  • 835
  • 1
  • 11
  • 25
3
votes
0 answers

Using plyr.io with youtube embedded gives "cannot read property of play of undefined" error

I am dynamically loading embedded youtube videos into the http://plyr.io custom player player.source({ type: 'video', title: 'Example title', sources: [{ src: '5WU7oGiwiao', // youtube 11 digit id type: …
cwal
  • 3,732
  • 3
  • 19
  • 20
2
votes
1 answer

Plyr audio player muted for the first second of audio

I am using Plyr audio player for my Rails app, along with Simulus.js. I dynamically add audio source when the user clicks on different audio buttons. Then I launch the audio player with the .play() method. However, the beginning of the track can't…
nico_lrx
  • 715
  • 1
  • 19
  • 36
2
votes
0 answers

Unknown error from PostCSS plugin. Your current PostCSS version is 6.0.23, but postcss-preset-env uses 7.0.29

Getting this error "Unknown error from PostCSS plugin. Your current PostCSS version is 6.0.23, but postcss-preset-env uses 7.0.29. Perhaps this is the source of the error below." while I was trying to upgrade Plyr version from 3.5.10 to 3.7.2.
Sathvik27
  • 21
  • 1
2
votes
0 answers

video player caption not enable after set caption file

I am using https://plyr.io/ to have a video player with captions. (Documentation: https://github.com/sampotts/plyr). Below is the steps to reproduce caption issue with video player with example code: In the page load initialize the video player in…
V.Prasad
  • 131
  • 4
  • 19
2
votes
0 answers

Vue-Plyr loading video very slow

My video's size is 2.7 MB and vue-plyr needs 10 seconds or so to load it in my local development environment (laravel/vue). During that time the plyr frame just stays black. The bad thing is that it doesn't even autoplay after it's loaded. Am I…
Artur Müller Romanov
  • 4,417
  • 10
  • 73
  • 132
2
votes
0 answers

Integrate VAST in plyr Video Player

DEVELOPER LEVEL - Beginner Have recently started programming. Only Familiar with HTM/CSS/JS & NodeJS. THE PROJECT - I'm using this ↓ code to play files using plyr Video player in my website. LINK TO CODEPEN (The below snippet is very lengthy,…
Anupma
  • 53
  • 5
2
votes
1 answer

JSON Data with Plyr Player

Hello I have a php code which shows a json file with video url. I want to use that url in plyr player. When click the link https://example.com/test.php It shows the output file as json which…
jewon
  • 23
  • 3
2
votes
2 answers

How to implement plyr.js within a Rails 6 site?

https://plyr.io/ is a javascript library to play videos with support for YouTube and Vimeo. I'm trying to implement it within a Rails 6 site. What are the steps to make this happen?
Ivan Raszl
  • 330
  • 2
  • 12
2
votes
0 answers

Different configurations for different plyrs on 1 page

Loving plyr.js - am using the npm package but am just wondering how we configure different players with different settings on the same page. It seems the local storage config object just gets overwritten every time? I.e. I have some videos acting…
2
votes
2 answers

Uncaught DOMException on route change hls.js React.js

I use plyr.js to create a video player. Caught an error with hls.js: Uncaught DOMException: Failed to read the 'buffered' property from 'SourceBuffer': This SourceBuffer has been removed from the parent media source. It happens when I change video…
Arthur
  • 3,056
  • 7
  • 31
  • 61
2
votes
1 answer

How to integrate HLS.js and mp4's with Plyr

is it possible to not hardcode the source of an hls file inside javascript but instead put the source in a tag like regular mp4 files? Use Case I am running a website with the html5 based Plyr. So far, I have managed to get it running along…
ryan77627
  • 21
  • 1
  • 3
2
votes
1 answer

Plyr video player: How to expose/access multiple players?

I'm using the Plyr video player plugin. Setting up a player for a single video is straightforward and works well: $(document).ready(function() { var player_singleVideo = new Plyr("#singleVideo", { // Options controls: [] }); // Expose…
JoSch
  • 869
  • 1
  • 15
  • 35
2
votes
0 answers

Unbranded YouTube Player After Depreciations

YouTube recently changed the rel and showinfo parameters when embedding video from YouTube, which means that custom players like Plyr will still show the YouTube logo and related videos for the first few seconds when played, and when paused. Is…