react-vimeo icon indicating copy to clipboard operation
react-vimeo copied to clipboard

Question: How do i set or change the quality of the video?

Open AugustGSP opened this issue 5 years ago • 3 comments

Quality for embedded Vimeo videos is usually set with the URL quality parameter. Is it possible to set the default quality with this module?

AugustGSP avatar Jun 04 '20 00:06 AugustGSP

It looks like the Vimeo SDK has a quality option, but only on first instantiation, so it would not be possible to update it at runtime. I guess it would still be good to expose it as a prop in this package for completeness 😇

goto-bus-stop avatar Jun 20 '20 17:06 goto-bus-stop

Has this been implemented already?

anatolzak avatar Nov 06 '20 16:11 anatolzak

So after some research, it is possible now to set the quality of the video at runtime as well!

https://github.com/vimeo/player.js#setqualityquality-string-promisestring-typeerrorerror

const App = () => {
  const playerRef = useRef()

  const onReady = player => {
    playerRef.current = player
  }

  const setQuality = newQuality => {
    if (playerRef.current) {
      playerRef.current.setQuality(newQuality).then(function (quality) {
        // quality was successfully set
      }).catch(function (error) {
        switch (error.name) {
          case 'TypeError':
            // the quality selected is not valid
            break;

          default:
            // some other error occurred
            break;
        }
      });
    }
  }


  return (
    <Vimeo
      video={1243124124}
      width={640}
      height={480}
      onReady={onReady}
    />
  )
}

anatolzak avatar Nov 07 '20 08:11 anatolzak

this should be addressed by 941b68b9b4669aff9f648111c88a58970f618cfa, released in 📦 0.9.9. thanks!

goto-bus-stop avatar Oct 18 '22 11:10 goto-bus-stop