CODEWITHSUNDEEP
javascriptandroidioscordovapicture-in-picture
R sukumar
R sukumar

Reputation: 100

is that possible to enable and controls the JavaScript Picture-in-Picture mode android and iOS device?

I create the video calling app using webrtc, and i have successfully create the video calling app using Cordova on android and iOS.

Next i started to create the Picture-in-Picture mode using JavaScript in my web application that's also works fine, but my mobile app not support requestpictureinpicture mode.

how to enable and controls the JavaScript Picture-in-Picture mode android and iOS device?

async function videoShrink(video){
    var video = document.getElementsByTagName("video")[0];
   
    try {
        // If there is no element in Picture-in-Picture yet, request for it
        if (video !== document.pictureInPictureElement) {
            await video.requestPictureInPicture();
        }
        // If Picture-in-Picture already exists, exit the mode
        else {
            await document.exitPictureInPicture();
        }

    } catch (error) {
        // console.log(`Oh Horror! ${error}`);
        console.log(error);
    }   
 }

Upvotes: 1

Views: 946

Answers (2)

maranR
maranR

Reputation: 423

video.requestPictureInPicture();

Is not Used for WebView Cordova platform so you can only customize the Layout Using CSS Animation

Upvotes: 1

Eric
Eric

Reputation: 10646

There are a few plugins that you could give a try.

https://www.npmjs.com/package/cordova-plugin-pip

https://github.com/efoxbr/cordova-plugin-pip-mode

Also check out

https://github.com/collab-project/videojs-record/blob/master/examples/picture-in-picture.html

Upvotes: 0

Related Questions