Can change video quality settings for some Vimeo videos only in iOS

Viewed 95

Some of my Vimeo videos rendered in the iOS web view show the quality settings to toggle between different qualities. But in other videos, I can only see 360p quality. Is there any specific reason for this behavior?

I can toggle between qualities inside the Android Web view.

I'm using a React Native Web View to render the Vimeo player.

My web view template

<html>
<head>
  <meta name="viewport" content="width=device-width initial-scale=1.0 maximum-scale=1 user-scalable=0 minimum-scale=1">
</head>

<body style="width: 100%; height: 100%; margin: 0;">
  <div style="width: 100%; height: 100%;">
    <div id="video" style="width: 100%; height: 100%; display: flex; justify-content: center;">
    </div>
  </div>
  <script id="vimeo" async src="https://player.vimeo.com/api/player.js"></script>
  <script>
    function webViewBridge() {
      const sendEvent = (evt, data = null) => {
        // Passes events through the bridge
        var payload = {
          name: evt,
          data: data
        };
        window.ReactNativeWebView.postMessage(JSON.stringify(payload));
      }

      var options = { id: '${VIDEO_ID}' }
      const player = new Vimeo.Player('video', options)

      player.ready().then(function () {
        player.on('play', function () {
          sendEvent('play');
        })
        player.on('ended', function () {
          sendEvent('finish');
        })
        player.on('error', function () {
          sendEvent('error', "Player error");
        })
        sendEvent('ready');
      }).catch((e) => {
        sendEvent('error', e.message);
      })
    }

    let script = document.querySelector('#vimeo');
    script.addEventListener('load', function () {
      webViewBridge();
    });
  </script>
</body>
</html>
0 Answers
Related