Project-Wing
/
fis_lib_media_rt


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101
							<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Remote View</title>
    <link rel="stylesheet" href="./css/common.css?v=202305271602" />
    <style>
      #remote_view {
        width: 100%;
        height: 100%;
      }
    </style>
  </head>

  <body>
    <canvas id="remote_view"></canvas>
    <script src="./lib/jquery/jquery.min.js"></script>
    <script src="./lib/node_player_0.12.6/NodePlayer.min.js"></script>
    <!-- <script src="./lib/debug/NodePlayer.min.js"></script> -->
    <script src="./js/common.js?v=202311141652"></script>
    <script src="./js/rtmp_video_capturer.js?v=202306031755"></script>
    <script src="./lib/device_live/player.js"></script>
    <script>
      async function start() {
        await LivePlayer.init();
        var url = getQueryString("url");
        console.log("%c 🔥🔥🔥🔥 remote_view start", "color:#4fff4B", url);
        var player = new LivePlayer("remote_view", url);
        function onResize() {
          let width = window.innerWidth;
          let height = window.innerHeight;
          player.setViewSize(width, height);
        }
        addResizeCallback(function () {
          onResize();
        });
        player.onBuffer = function (state) {
          console.log("%c 🔥🔥🔥🔥 onBuffer", "color:#ed9ec7",state);
        };
        player.onPlay = function () {
          console.log("%c 🔥🔥🔥🔥 onPlay", "color:#ed9ec7");
        };
        player.onBeforeReconnect = () => {
          console.log("%c 🔥🔥🔥🔥 onBeforeReconnect", "color:#ed9ec7");
        };
        player.onInfo = function (info) {
          onResize();
        };
        player.onTimeout = function () {
          console.log(
            "%c Line:57 🥔 onTimeout",
            "color:#2eafb0",
            "timeout 10s"
          );
        };
        player.onAudioInfo = function (info) {};
        player.play(true);
        function play() {
          player.start(url);
        }
        function stop() {
          player.stop();
        }
        // 0-100
        function setVolume(volume) {
          // 0.0-1.0
          player.setVolume(volume / 100);
        }
        function setAudioMute(isMute) {
          player.enableAudio(!isMute);
        }
        function setVideoMute(isMute) {
          player.enableVideo(!isMute);
        }
        function regMsgEventBus() {
          var fnMap = {
            play: play,
            stop: stop,
            setVolume: setVolume,
            setAudioMute: setAudioMute,
            setVideoMute: setVideoMute,
            mountSubView: function () {},
          };
          window.addEventListener("message", function (e) {
            var msg = e.data;
            var method = msg.method;
            var fn = fnMap[method];
            if (!!fn) {
              var data = msg.data;
              fn(data);
            }
          });
        }
        regMsgEventBus();
      }
      start();
    </script>
  </body>
</html>