@flashphoner/websdk 2.0.228 → 2.0.229

package/examples/demo/streaming/hls-native/hls-native.html

@@ -6,6 +6,7 @@
     <link rel="stylesheet" href="../../dependencies/bootstrap/css/bootstrap.css">
     <link rel="stylesheet" href="hls-native.css">
     <title>HLS Native Player Minimal</title>
+    <script type="text/javascript" src="../../../../flashphoner.js"></script>
     <script type="text/javascript" src="../../dependencies/jquery/jquery-1.12.0.js"></script>
     <script type="text/javascript" src="../../dependencies/jquery/jquery-ui.js"></script>
     <script type="text/javascript" src="../../dependencies/js/utils.js"></script>

package/examples/demo/streaming/hls-native/hls-native.js

@@ -1,3 +1,4 @@
+var Browser = Flashphoner.Browser;
 var remoteVideo = null;
 
 function loadPlayerPage() {
@@ -10,6 +11,10 @@ function initPage() {
     $("#applyBtn").prop('disabled', false).text("Play").off('click').click(playBtnClick);
     remoteVideo = document.getElementById('remoteVideo');
     remoteVideo.style ="background-color: lightgrey;";
+    if (Browser.isSafariWebRTC() && Browser.isiOS()) {
+        // iOS hack when using standard controls to leave fullscreen mode
+        setWebkitFullscreenHandlers(remoteVideo);
+    }
 }
 
 function playBtnClick() {
@@ -32,7 +37,6 @@ function playBtnClick() {
         }
         else {
             $("#notifyFlash").text("Your browser doesn't support native HLS playback");
-            cleanRemoteVideo();
         }
     }
 }

package/examples/demo/streaming/hls-player/hls-player.html

@@ -7,6 +7,7 @@
     <link rel="stylesheet" href="hls-player.css">
     <link rel="stylesheet" href="video-js.css">
     <title>HLS VideoJS Player Minimal</title>
+    <script type="text/javascript" src="../../../../flashphoner.js"></script>
     <script type="text/javascript" src="../../dependencies/jquery/jquery-1.12.0.js"></script>
     <script type="text/javascript" src="../../dependencies/jquery/jquery-ui.js"></script>
     <script type="text/javascript" src="../../dependencies/js/utils.js"></script>

package/examples/demo/streaming/hls-player/hls-player.js

@@ -1,3 +1,4 @@
+var Browser = Flashphoner.Browser;
 var player = null;
 
 function loadPlayerPage() {
@@ -10,7 +11,7 @@ function initPage() {
     $("#applyBtn").prop('disabled', false).text("Play").off('click').click(playBtnClick);
     var remoteVideo = document.getElementById('remoteVideo');
     remoteVideo.className = "video-js vjs-default-skin";
-    player = videojs(remoteVideo);
+    player = initVideoJsPlayer(remoteVideo);
 }
 
 function playBtnClick() {
@@ -23,12 +24,23 @@ function playBtnClick() {
         if (key.length > 0 && token.length > 0) {
             videoSrc += "?" + key + "=" + token;
         }
+        player.on('loadedmetadata', function() {
+            console.log("Play with VideoJs");
+            player.play();
+        });
+        player.on('error', function() {
+            var error = player.error();
+            // Stop on error
+            stopBtnClick();
+            if (error && error.code == error.MEDIA_ERR_DECODE) {
+                // Restart playback in case of decode error
+                playBtnClick();
+            }
+        });
         player.src({
             src: videoSrc,
             type: "application/vnd.apple.mpegurl"
         });
-        console.log("Play with VideoJs");
-        player.play();
         onStarted();
     }
 }
@@ -76,8 +88,10 @@ function createRemoteVideo(parent) {
     remoteVideo.autoplay="autoplay";
     remoteVideo.type="application/vnd.apple.mpegurl";
     remoteVideo.className = "video-js vjs-default-skin";
+    remoteVideo.setAttribute("playsinline","");
+    remoteVideo.setAttribute("webkit-playsinline","");
     parent.appendChild(remoteVideo);
-    player = videojs(remoteVideo);
+    player = initVideoJsPlayer(remoteVideo);
 }
 
 
@@ -109,3 +123,23 @@ function highlightInput(input) {
 function removeHighlight(input) {
     input.closest('.form-group').removeClass("has-error");
 }
+
+function initVideoJsPlayer(video) {
+    var videoJsPlayer = videojs(video);
+    if (Browser.isSafariWebRTC() && Browser.isiOS()) {
+        // iOS hack when using standard controls to leave fullscreen mode
+        var videoTag = getActualVideoTag();
+        if(videoTag) {
+            setWebkitFullscreenHandlers(videoTag);
+        }
+    }
+    return videoJsPlayer;
+}
+
+function getActualVideoTag() {
+    var videos = document.querySelectorAll("video");
+    if (videos && videos.length > 0) {
+        return videos[0];
+    }
+    return null;
+}

package/examples/demo/streaming/hls-player/player-page.html

@@ -60,6 +60,8 @@
             <video id="remoteVideo" width="852" height="480"
                    controls="controls"
                    autoplay="autoplay"
+                   playsinline="playsinline"
+                   webkit-playsinline="webkit-playsinline"
                    type="application/vnd.apple.mpegurl"></video>
         </div>
     </div>