Plyr is merging into Vidstack

sampotts commented 2 years ago

See https://github.com/sampotts/plyr/issues/2737 for update.

mihar-22 commented 2 years ago

Super excited as we've been working on @vidstack/player for a while now, and I've personally been looking forward to sharing it with the Plyr community.

Two more things I want to add quickly is:

@vidstack/player is currently being used at Reddit on their new mobile web platform! New UI we've been putting together at Reddit should be released sometime next week.
Working on getting the issues related to the Beta release up. You can more information here. Just note that we're still actively working on it, so consider it a WIP.

sparkktv commented 2 years ago

A few questions, will it work the same way as Plyr? Will there be YouTube & Vimeo support still? And can we continue to use Plyr if we choose for the foreseeable future?

mihar-22 commented 2 years ago

Hey @sparkktv 😄

Will it work the same way as Plyr?

I'm not entirely sure what you're hoping will be the same when you ask this (if you could elaborate on some features), but what I can say is we're planning on creating a legacy Plyr skin. This means you'll get the exact same look and feel, with mostly the same configuration options. All you need to do from your end is install a new package, and update a few lines of HTML.

Will there be YouTube & Vimeo support still?

Yes! That's planned for the 1.0 release.

And can we continue to use Plyr if we choose for the foreseeable future?

Yes! Even after we archive Plyr it'll still be available via NPM/CDN, but the next major version will be deprecated. All this means is as long as you're version locked, you can stay on Plyr as long as you like, it just won't be receiving any updates.

Hope that helps!

adeeb1 commented 2 years ago

Will features that are already production-ready like Dailymotion support and markers be included?
What's the timeline for 1.0 release?

sampotts commented 2 years ago

Will features that are already production-ready like Dailymotion support and markers be included?

Those features may well be production-ready for Plyr, but they won't be able to be directly ported over to the Vidstack player. It's a complete re-write from the ground up, using web components. Some of the code/logic from those changes will be able to be carried over but the thought is that Vidstack will offer a plugin framework unlike Plyr where you get all or nothing.

What's the timeline for 1.0 release?

Rahim can correct me if I'm wrong but we've not discussed a firm date. This is an open source project and Rahim and I both have full time jobs. We're committing as much time as we can to get it over the line.

lofcz commented 2 years ago

@sampotts would you please consider merging #2386 and #2410 upstream? While we understand you are now focusing on Vidstack there is and will be a huge community around Plyr for a long time.

sampotts commented 2 years ago

@sampotts would you please consider merging #2386 and #2410 upstream? While we understand you are now focusing on Vidstack there is and will be a huge community around Plyr for a long time.

Sure, I'll take a look this week.

shrkwt commented 2 years ago

@sampotts Most importantly will you please provide option to change quality of an MPEG DASH or HLS stream while it's playing. Just like streaming site like youtube in which we are able to change the video resolution/quality while the video is playing.

spmeesseman commented 2 years ago

Hi Sam first off thank you so much for the great work with plyr. I tried emailing you about this but will the new Vidstack project have any commercially supported licenses available? I had sent an email asking about a commercial license for plyr at a cost (my company is forcing removal of all open source from our projects) which would be ideal, but just wondering if we can discuss that maybe over email?

sampotts commented 2 years ago

Sorry Scott, I’ll get back to you today.

Cheers Sam

On 3 Mar 2022, at 4:55 am, Scott Meesseman @.***> wrote:

Hi Sam first off thank you so much for the great work with plyr. I tried emailing you about this but will the new Vidstack project have any commercially supported licenses available? I had sent an email asking about a commercial license for plyr at a cost (my company is forcing removal of all open source from our projects) which would be ideal, but just wondering if we can discuss that maybe over email?

— Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you were mentioned.

fredlunau commented 2 years ago

I just started using plyr a few months ago (along with glightbox and losslesscut) to slowly build a way to view video clips from within my larger (and way longer) otherwise boring home videos. Thanks for a fabulous library that even me, a weekend JS developer at best, can enjoy using!

spmeesseman commented 2 years ago

Hi again Sam, just wanted to make sure you were able to locate my email and can reply when you have a chance, my company is all over me to see if we can work something out. I'd love to get something worked out and you paid at the same time for all your great work. If we can't work something out they want me to remove plyr (long story I can explain if needed once we chat) and that would ****.

mihar-22 commented 2 years ago

👋

The Vidstack Player Beta is here: https://github.com/vidstack/player/discussions/626

Enjoy!

ffxsam commented 2 years ago

Should we be using Vidstack now that it's at version 1.6.1? The only thing I'm confused about is that the docs seem to be for 0.x, and there's no documentation on how to use the player with Vimeo or YouTube.

mihar-22 commented 2 years ago

Should we be using Vidstack now that it's at version 1.6.1?

Sorry for the confusion @ffxsam, the version 1.6.1 is currently on the @next tag. I'll update the docs to reflect that's next instead of 0.x (semantically the same thing). We're still actively working on it and wouldn't consider it production ready for the public, so for now my recommendation is to keep using Plyr.

The only thing I'm confused about is that the docs seem to be for 0.x, and there's no documentation on how to use the player with Vimeo or YouTube.

There's links for Vimeo/YouTube because we get asked that a lot. It's right under the "Providers" section. If you follow the links you'll see that it's on the roadmap :)

ffxsam commented 2 years ago

@mihar-22 Thanks a ton! (and for all your work on Vidstack - can't wait till it's production-ready!)

add-n2x commented 2 years ago

@mihar-22 two questions:

1.) Does Vidstack also support audio-only use? Not only technically but is it also providing a nice audio player UI, not just a video player UX able to play audio files too? Would be great if there are some demo pages or screen shots for that use case.

2.) Since it appears that you plan to monetize Vidstack, will the basic features always stay free? Where do you plan to draw the line?

Since I'm currently researching a versatile player for radio stations, these topics are essential too me.

mihar-22 commented 2 years ago

Hey @davidtrattnig!

1) Yes we will support audio as much as possible including a neat default UI. We will be adding things to the home page over time such as features, skins and so on as we complete them.

2) The player and other open-source projects will always be free and have more than enough features for most people to build what they need. Anything paid will be created to save you additional time such as media UI templates, possibly some additional skins (beyond the default), our CMS and so on. We look up to companies such as Laravel and hope to provide the same balance.

Feel free @davidtrattnig and anyone else to come over to the Discord Channel if you have any further questions.

add-n2x commented 2 years ago

@mihar-22 Many thanks for your quick and detailed answer!

ljfreelancer88 commented 2 years ago

Are you planning to add also a feature where I can be able loop "section" of a video? Say I want to loop a video starting from 4sec. to 8sec. and repeat the loop to (n) times. This use case is for musicians alike who transcribe songs.

ghost commented 2 years ago

Vidstack is one of the most ugly video players out there, firefox's default styling for video elements looks better than vidstack

ghost commented 2 years ago

And that Plyr skin will have to be the default, otherwise I will use Plyr even if you want me to or not

ghost commented 2 years ago

Why monetize it? You really do want me to use Plyr instead of Vidstack. And even if you were to give Vidstack a nice interface I would never contribute a single thing to it, because you are making it proprietary.

ghost commented 2 years ago

I'd literally rather use Video.JS (Which used to be the ugliest video player) instead of Vidstack.

ghost commented 2 years ago

And why did you darken the video when you hover the video in Vidsack, Vidstack and your UI design for Vidsack are both horrible.

mihar-22 commented 2 years ago

You’re special @h57758. That’s not our default skin, it’s simply a demo to showcase some of the controls and features while we’re working on things in the background. You’d know if you asked.

Vidstack Player is MIT licensed. Not sure what your proprietary spiel is about.

ghost commented 2 years ago

Ok! But why don't you show the default skin on the demo (Maybe it isn't finished?)
Ignore what I said on that one.

Sorry for not asking, but why would I, people would showcase exactly what they are offering on the webpage. (Btw, it is the middle of the night 00:06)

lofcz commented 2 years ago

@mihar-22 takes some self-control to write a reply like that one 👍🏻

ffxsam commented 2 years ago

@h57758 Many people contributing to this project are doing so for free. Please take some consideration before posting rude and unconstructive comments about people's hard work.

Plus, if you really dislike some of the design decisions, you're welcome to fork the repo and create your own build.

ghost commented 2 years ago

@h57758 Many people contributing to this project are doing so for free. Please take some consideration before posting rude and unconstructive comments about people's hard work.

Plus, if you really dislike some of the design decisions, you're welcome to fork the repo and create your own build.

Sorry
I'm not a designer and I will never be able to top Plyr's interface.

ottman commented 1 year ago

What is the status on this @sampotts ?

mihar-22 commented 1 year ago

Status Update

We spent a good portion of last year building tooling to help us ship a media player that meets our design goals. Recap can be found in our first major release this year. This release also includes heaps of QOL improvements such as out of the box styles to get up and running quickly.
This week we followed up that release with React 18 and Next.js support including SSR -> release notes.
We have our community skin designs up on GitHub. Make sure to scroll through, there's heaps of examples.

What's Next?

For the coming week we're working on additional small fixes, wrapping up the docs, and releasing our media icons set.

Following that all we have left is reaching feature parity which includes the tasks on this project board. It looks roughly about a sprint worth of work (<2 weeks). Right after that it's just skins, putting together examples, and getting ready to ship 1.0. Rough estimate at this time looks like end of March to completion but don't hold me to it because we still have to figure out funding and other stuff which might eat some time.

Oh and one final note on additional framework integrations. We'll also be adding Vue, Svelte, and Solid and hope to have them ready before 1.0 but we'll see how we go in terms of money/time.

Screenshots

benderillo commented 1 year ago

Question: since Plyr is merging into vidstack, are the issues submitted to Plyr repo no longer addressed?

sampotts commented 1 year ago

Major bugs will be for sure. The space bar issue you've opened has been addressed in a PR, I just need to merge (if I've not already) and release it to npm.

I've not had much time to work on Plyr or Vidstack (just had another kid), but I'm hoping I can create a Plyr-like skin for the Vidstack player so folks have the same UI that seems to be a popular feature. I don't see Plyr going anywhere anytime soon.

benderillo commented 1 year ago

Major bugs will be for sure. The space bar issue you've opened has been addressed in a PR, I just need to merge (if I've not already) and release it to npm.

I've not had much time to work on Plyr or Vidstack (just had another kid), but I'm hoping I can create a Plyr-like skin for the Vidstack player so folks have the same UI that seems to be a popular feature. I don't see Plyr going anywhere anytime soon.

Congrats on a new kid!!!
Could you share a PR number to have a look at the fix please :)

sampotts commented 1 year ago

Thanks!

I think this PR should fix your issue. I'll try and get a release out in a day or two. Sorry, I'm so slow.

benderillo commented 1 year ago

I think https://github.com/sampotts/plyr/pull/2581 should fix your issue. I'll try and get a release out in a day or two. Sorry, I'm so slow.

@sampotts Much appreciated! I used patch-package as interim to apply this PR to my project while the official release is not out yet. So far it solves the issue for me, but the official release would be a better fix :D

connecteev commented 1 year ago

@mihar-22 @sampotts When can we expect vidstack to have a vue version available? Plyr and Vime (both of which are merging into vidstack) have vue bindings (or a vue wrapper), but I don't see anything like that for vidstack. Thanks.

mihar-22 commented 1 year ago

We'll have Vue install docs very soon, but you'll need to use our Web Component library. Vue has perfect support for it, so you won't be missing out anything special. The pre-1.0 is coming in 1-2 weeks (depending on how long new docs take) which is where I'll strongly recommend migrating over. I'll have more information as soon as the release is out.

connecteev commented 1 year ago

@mihar-22 sounds great, can't wait for this to be out.

dohahelmy commented 1 year ago

@mihar-22 Any update soon for the vue docs?

mihar-22 commented 1 year ago

I'm working on our new docs as we speak. We have a completely new site and player library dropping very soon, feeling confident it should be in a week or two latest. It's been a long 2+ months of work on this so really looking forward to sharing it! Just a little bit more time needed to wrap it all up.

ffxsam commented 1 year ago

@mihar-22 You and the team are doing awesome work! Can't wait to implement the new Vidstack into our platform.

kasvith commented 1 year ago

Hi, will Vidstack Vimeo support quality control(for paid accounts)?

mihar-22 commented 1 year ago

Closing this issue now as we have an update here: https://github.com/sampotts/plyr/issues/2737

kgnfth commented 7 months ago

I dont like it. Plyr is easy to use and simple to setup. Everything in vidstack is difficult to setup for me.

mihar-22 commented 7 months ago

👋 @kgnfth, feel free to drop by and share what's difficult. If you like the current Plyr setup, what's different or difficult about this?

import { VidstackPlayer, PlyrLayout } from 'vidstack/global/player';

const player = await VidstackPlayer.create({
  target: '#target',
  title: 'Sprite Fight',
  src: 'https://files.vidstack.io/sprite-fight/720p.mp4',
  poster: 'https://files.vidstack.io/sprite-fight/poster.webp',
  layout: new PlyrLayout({
    thumbnails: 'https://files.vidstack.io/sprite-fight/thumbnails.vtt',
  }),
});

By the way, we also have Plyr compatability:

import { Plyr } from 'vidstack/global/plyr';

const player = new Plyr('#target', {
  title: 'Sprite Fight',
  src: 'https://files.vidstack.io/sprite-fight/720p.mp4',
  poster: 'https://files.vidstack.io/sprite-fight/poster.webp',
  thumbnails: 'https://files.vidstack.io/sprite-fight/thumbnails.vtt',
});

I'd argue the Web Components and React libraries are even easier. All setup is available in our installation docs.

deedarb commented 7 months ago

I migrated from Plyr to vidstack and found out that vidstack is not working in Android 8.1 inside ionic application, reverted back to Plyr and planning to migrate to video.js 😮‍💨

mihar-22 commented 7 months ago

Not much we can do if bugs are not reported. You'll inevitably find an issue with every player, it's on you to help the maintainers find and fix the bug, it's a natural part of adopting open-source.

deedarb commented 7 months ago

it is not a bug/error, old web views do not support custom elements. https://www.vidstack.io/docs/player/getting-started/installation/javascript?provider=video&styling=default-layout&install=npm#5-check-support Some users have old phones or do not update system webview.

sampotts / plyr