Media play back controls on capacitor mobile app

Hey @REVEB,

In addition to your topic How to stop videos from playing simultaneously and continuing our private messages about that, here is the solution I found:

  1. We have called a javascript function on video.Play event.
    Now we pass to that function the current($index) video title as an argument

  2. Back to pauseAllVideos() function:


    // before the end head tag:
    <script type="text/javascript">
        function pauseAllVideos(vid_title) {
            if ('mediaSession' in navigator) {
                navigator.mediaSession.metadata = new MediaMetadata({
                title: vid_title, 
                });
            }
            document.querySelectorAll(".myvideo").forEach((el) => {
                el.onplay = function(e){
                    document.querySelectorAll(".myvideo").forEach((el1) => {
                        if(el !== el1){
                            el1.pause();
                    });
                }
            });            
        } 
        </script>
    </head>

Errors in your page:

1) Remove this code because fires errors:

2) OffCanvas and Browser components