|
|
@@ -0,0 +1,981 @@
|
|
|
+<!DOCTYPE html>
|
|
|
+<html>
|
|
|
+
|
|
|
+ <head>
|
|
|
+ <meta charset="utf-8">
|
|
|
+ <title></title>
|
|
|
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
|
+ <meta name="viewport" content="initial-scale=1,maximum-scale=1, minimum-scale=1,user-scalable=no">
|
|
|
+ <meta name="x5-orientation" content="portrait" />
|
|
|
+ <meta name="screen-orientation" content="portrait" />
|
|
|
+ <meta name="viewport" content="width=device-width, minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
|
|
|
+
|
|
|
+ <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
|
|
|
+ <meta name="apple-mobile-web-app-capable" content="yes">
|
|
|
+ <meta name="apple-mobile-web-app-status-bar-style" content="black">
|
|
|
+ <meta name="format-detection" content="telephone=no, email=no">
|
|
|
+ <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
|
|
|
+ <meta name="apple-mobile-web-app-capable" content="yes">
|
|
|
+ <!-- 删除苹果默认的工具栏和菜单栏 -->
|
|
|
+ <meta name="apple-mobile-web-app-status-bar-style" content="black">
|
|
|
+ <!-- 设置苹果工具栏颜��? -->
|
|
|
+ <meta name="format-detection" content="telphone=no, email=no">
|
|
|
+ <!-- 忽略页面中的数字识别为电话，忽略email识别 -->
|
|
|
+ <!-- 启用360浏览器的极速模��?(webkit) -->
|
|
|
+ <meta name="renderer" content="webkit">
|
|
|
+ <!-- 避免IE使用兼容模式 -->
|
|
|
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
|
+ <!-- 针对手持设备优化，主要是针对一些老的不识别viewport的浏览器，比如黑��? -->
|
|
|
+ <meta name="HandheldFriendly" content="true">
|
|
|
+ <!-- 微软的老式浏览��? -->
|
|
|
+ <meta name="MobileOptimized" content="320">
|
|
|
+ <!-- uc强制竖屏 -->
|
|
|
+ <!-- <meta name="screen-orientation" content="portrait"> -->
|
|
|
+ <!-- QQ强制竖屏 -->
|
|
|
+ <!-- <meta name="x5-orientation" content="portrait"> -->
|
|
|
+ <!-- 不能旋转，问题出在这 -->
|
|
|
+ <!-- UC强制全屏 -->
|
|
|
+ <meta name="full-screen" content="yes">
|
|
|
+ <!-- QQ强制全屏 -->
|
|
|
+ <meta name="x5-fullscreen" content="true">
|
|
|
+ <!-- UC应用模式 -->
|
|
|
+ <meta name="browsermode" content="application">
|
|
|
+ <!-- QQ应用模式 -->
|
|
|
+ <meta name="x5-page-mode" content="app">
|
|
|
+ <!-- windows phone 点击无高��? -->
|
|
|
+ <meta name="msapplication-tap-highlight" content="no">
|
|
|
+ <title></title>
|
|
|
+ <link rel="stylesheet" type="text/css" href="css/WXtrialInterface.css" />
|
|
|
+ <script async defer src="https://buttons.github.io/buttons.js"></script>
|
|
|
+ </head>
|
|
|
+
|
|
|
+ <body class="scroll h-player" style="overscroll-behavior: contain;">
|
|
|
+
|
|
|
+ <div class="container" id="player">
|
|
|
+ <div class="muted" id="btnMuted">
|
|
|
+ <div class="control-right-img" data-id="1">
|
|
|
+ <img src="../static/img/xuanfu_icon.png">
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- <video width="70%" disablePictureInPicture="true" autoplay poster="images/loader-thumb.jpg" id="playerVideo"></video> -->
|
|
|
+ <div id="wine">
|
|
|
+
|
|
|
+ <!-- <video id="video1" muted="muted" x5-video-orientation="landscape" playsinline="true" autoplay="true"
|
|
|
+ webkit-playsinline="true" x5-playsinline="true" x5-video-player-type="h5" x5-video-player-fullscreen="false" style="pointer-events: none;"></video> -->
|
|
|
+ <div id="box">
|
|
|
+ <video muted="muted" x5-video-orientation="landscape" playsinline="true" autoplay="true" webkit-playsinline="true"
|
|
|
+ x5-playsinline="true" x5-video-player-type="h5" x5-video-player-fullscreen="false" style="pointer-events: none;object-fit: fill;width: 100%;"
|
|
|
+ disablePictureInPicture="true" autoplay poster="images/loader-thumb.jpg" id="playerVideo"></video>
|
|
|
+ <audio preload="auto" autoplay controls poster="images/loader-thumb.jpg" id="audioPlayer"></audio>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="leftmains">
|
|
|
+ <div class="PictureQualityMain">
|
|
|
+ <div class="PictureQuality " data-id="3072000">高清</div>
|
|
|
+ <div class="PictureQuality avit" data-id="2243000">标清</div>
|
|
|
+ <div class="PictureQuality" data-id="400000">极速</div>
|
|
|
+ <div class="PictureQuality" data-id="400000">自动</div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="operation">
|
|
|
+ <div class="upload" id="showsuss" data-text="uploads">
|
|
|
+ <img src="../static/img/wx/shangchuan_icon.png">
|
|
|
+ <div>上传</div>
|
|
|
+ </div>
|
|
|
+ <div class="upload" onclick="cp(document.getElementById('user_ref_id'));" data-text="Shearplate">
|
|
|
+ <img src="../static/img/wx/jianqieban_icon.png">
|
|
|
+ <div>剪切板</div>
|
|
|
+ </div>
|
|
|
+ <div class="upload" id="upload" data-text="Signout">
|
|
|
+ <img src="../static/img/wx/tuichu_icon.png">
|
|
|
+ <div>退出</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ <div class="bottommains">
|
|
|
+ <div class="botmat1">
|
|
|
+ <div class="botmat1img" data-text="gengduo">
|
|
|
+ <img src="../static/img/wx/gengduo_icon.png">
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ <div class="botmat1">
|
|
|
+ <div class="botmat1img" data-text="home">
|
|
|
+ <img src="../static/img/wx/home_icon.png">
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ <div class="botmat1">
|
|
|
+ <div class="botmat1img" data-text="return">
|
|
|
+ <img src="../static/img/wx/fanhui_icon.png">
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="mainbox" style="display: none;">
|
|
|
+ <div class="boxTitle">提示</div>
|
|
|
+ <div class="boxText">
|
|
|
+ <div>由于小程序的功能限制，此功能暂时</div>
|
|
|
+ <div>无法使用，请下载APP使用更多功能</div>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ <div class="boxbt" onclick="cp(document.getElementById('user_ref_id'));">立即前往下载</div>
|
|
|
+
|
|
|
+ <div class="boximg"><img src="../static/img/wx/guanbi_icon.png"></div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="sbox" style="display: none;">
|
|
|
+ <div class="sboxText">下载地址已复制到剪切板</div>
|
|
|
+ <div class="sboxbu">确定</div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div id="copy-txt" style="position: absolute;opacity: 0;">
|
|
|
+ <span id="user_ref_id">www.androidsCloud.com</span>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>
|
|
|
+ <script src="../static/js/jquery-1.11.0.min.js"></script>
|
|
|
+ <script src="helper.js"></script>
|
|
|
+ <!-- 音频-->
|
|
|
+ <!-- <script src="../static/js/classlist.js"></script>
|
|
|
+ <script src="../static/js/players.js"></script>
|
|
|
+ <script src="../static/js/auroraplayer.js"></script>
|
|
|
+ <script src="../static/js/aurora.js"></script>
|
|
|
+ <script src="../static/js/aac.js"></script>
|
|
|
+ <script src="../static/js/web.js?id=101"></script> -->
|
|
|
+ <!-- <script src="../static/js/webapk.js"></script> -->
|
|
|
+ <!-- 视频-->
|
|
|
+
|
|
|
+ <!-- <script type="text/javascript" src="../static/js/Decoder.js"></script>
|
|
|
+ <script type="text/javascript" src="../static/js/YUVCanvas.js"></script>
|
|
|
+ <script type="text/javascript" src="../static/js/Player.js"></script> -->
|
|
|
+ <script type="text/javascript" src="jmuxer.js"></script>
|
|
|
+ <script src="https://cdn.bootcss.com/vConsole/3.2.0/vconsole.min.js"></script>
|
|
|
+ <!-- <script src="../static/distss/WXdraw.js?id=105"></script> -->
|
|
|
+
|
|
|
+ <script>
|
|
|
+ //隐藏控件 controls
|
|
|
+ var fpsCount = 0;
|
|
|
+ var requestCount = 0;
|
|
|
+ var timeCount = 0;
|
|
|
+ var isVisuable = true;
|
|
|
+ var isFeed = true;
|
|
|
+ var isDrag = false;
|
|
|
+ var shoudDrop = false;
|
|
|
+ var isEnough = true;
|
|
|
+ var ifCanPlay = false;
|
|
|
+ var isFinish = false;
|
|
|
+
|
|
|
+ var delayTime = new Date().getTime();
|
|
|
+ var feedTime = new Date().getTime();
|
|
|
+ var readyTime = new Date().getTime();
|
|
|
+ var requestTime = new Date().getTime();
|
|
|
+ var curTime = new Date().getTime();
|
|
|
+ var requestTime = new Date().getTime(); //记录离开时间
|
|
|
+ var myVideo = document.getElementById("playerVideo");
|
|
|
+ var myAudio = document.getElementById("audioPlayer");
|
|
|
+ var audioBuffer = [];
|
|
|
+ var audioBack = [];
|
|
|
+
|
|
|
+ Module = {};
|
|
|
+ Module.onRuntimeInitialized = function() {
|
|
|
+ console.log("Wasm 加载成功!")
|
|
|
+ isFinish = true;
|
|
|
+ }
|
|
|
+
|
|
|
+ document.addEventListener("visibilitychange", () => {
|
|
|
+
|
|
|
+ if (document.visibilityState == "visible") {
|
|
|
+ console.log("页面可见，继续喂视频");
|
|
|
+ //requestTime = new Date().getTime();
|
|
|
+ isVisuable = true;
|
|
|
+ } else {
|
|
|
+ isVisuable = false;
|
|
|
+ isFeed = false;
|
|
|
+ myVideo.pause();
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ });
|
|
|
+
|
|
|
+
|
|
|
+ myVideo.play();
|
|
|
+
|
|
|
+ myVideo.addEventListener('pause', function() {
|
|
|
+ //console.log("视频播放暂停");
|
|
|
+ isFeed = false;
|
|
|
+ });
|
|
|
+
|
|
|
+ myAudio.addEventListener('canplay', function() {
|
|
|
+ console.log("缓冲区大小 %f", myAudio.buffered.end(0) - myAudio.buffered.start(0));
|
|
|
+ });
|
|
|
+
|
|
|
+ /*function decodeAAC(data)
|
|
|
+ {
|
|
|
+ var retPtr = Module._malloc(4 * 5 * 1024);//接收的数据
|
|
|
+ var inputPtr = Module._malloc(4 * data.length);//输入数据
|
|
|
+
|
|
|
+ for( i =0;i < data.length;i++)
|
|
|
+ {
|
|
|
+ Module.HEAPU8[(inputPtr)+i] = data[i];//转换为堆数据
|
|
|
+ }
|
|
|
+
|
|
|
+ var pcmLen = Module._feedData(retPtr, inputPtr, data.length);
|
|
|
+
|
|
|
+ if(pcmLen > 0)
|
|
|
+ {
|
|
|
+ //console.log("%d帧 aac 解码成功, %d", decodeCount, pcmLen);
|
|
|
+ var pcmData = new Uint8Array(pcmLen);
|
|
|
+ for(i = 0;i < pcmLen;i++)
|
|
|
+ {
|
|
|
+ pcmData[i] = Module.HEAPU8[(retPtr)+i]
|
|
|
+ }
|
|
|
+
|
|
|
+ player.feed(pcmData);
|
|
|
+ }
|
|
|
+ else
|
|
|
+ {
|
|
|
+ console.log("%d帧 aac 解码失败, %d", decodeCount, pcmLen);
|
|
|
+ }
|
|
|
+
|
|
|
+ decodeCount++;
|
|
|
+ Module._free(inputPtr);
|
|
|
+ Module._free(retPtr);
|
|
|
+ } */
|
|
|
+
|
|
|
+
|
|
|
+ //解协议
|
|
|
+ function ParseProto(data) {
|
|
|
+ var temp = "";
|
|
|
+ var input = new Uint8Array(data),
|
|
|
+ duration,
|
|
|
+ video,
|
|
|
+ audio;
|
|
|
+
|
|
|
+ if (input[0] == 0 && input[1] == 0 && input[2] == 0 && input[3] == 1) {
|
|
|
+ // debugger
|
|
|
+ video = input;
|
|
|
+ duration = 24;
|
|
|
+ var nalType = input[4] & 0x1f; //nalType == 0x07|| nalType == 0x08 || nalType == 0x05
|
|
|
+
|
|
|
+ if (!isFeed) {
|
|
|
+ if (nalType == 0x05) {
|
|
|
+ console.log("发现I帧");
|
|
|
+ }
|
|
|
+
|
|
|
+ if (nalType == 0x05 && isVisuable) {
|
|
|
+ console.log("检测到I帧 %d，重新渲染, 耗时 %d ms", nalType, new Date().getTime() - requestTime);
|
|
|
+ isFeed = true;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ } else if (input[0] == 0xff) {
|
|
|
+ if (!isEnough) {
|
|
|
+ requestCount++;
|
|
|
+ //audioBuffer.push(input);
|
|
|
+ }
|
|
|
+ audio = input;
|
|
|
+
|
|
|
+ if (new Date().getTime() - curTime > 100) {
|
|
|
+ delayTime = new Date().getTime();
|
|
|
+ console.log("接收时间 %d ms", new Date().getTime() - curTime);
|
|
|
+ }
|
|
|
+ curTime = new Date().getTime();
|
|
|
+ duration = 24;
|
|
|
+ //console.log("duration %d", duration);
|
|
|
+
|
|
|
+ } else if (input[0] == 0x68) {
|
|
|
+ if (input[23] == 0x05) //横竖屏标识
|
|
|
+ {
|
|
|
+ var state = CheckScreenDirection(input.slice(24, 24 + 8));
|
|
|
+
|
|
|
+ if (state == 1) {
|
|
|
+ console.log("安卓卡此时竖屏");
|
|
|
+ //竖屏处理
|
|
|
+ } else {
|
|
|
+ console.log("安卓卡此时横屏");
|
|
|
+ //横屏处理
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ if (input[23] == 0x0b) {
|
|
|
+ console.log("多端登陆");
|
|
|
+ }
|
|
|
+ //console.log("屏幕旋转 %s", PrintArry(input));
|
|
|
+ }
|
|
|
+
|
|
|
+ return {
|
|
|
+ audio: audio,
|
|
|
+ video: video,
|
|
|
+ duration: duration
|
|
|
+ };
|
|
|
+ }
|
|
|
+
|
|
|
+ window.onload = function() {
|
|
|
+ // var socketURL = 'wss://jmuxer-demo-server.herokuapp.com';
|
|
|
+ //socketURL = "ws://127.0.0.1:8080"
|
|
|
+ // socketURL = "ws://192.168.11.233:8080"
|
|
|
+ //socketURL = "ws://14.215.128.98:14112";
|
|
|
+ // var socketURL = "ws://192.168.11.66:9101";
|
|
|
+ var socketURL = "ws://192.168.198.11:9101"
|
|
|
+ // socketURL = "ws://14.215.128.98:14077";
|
|
|
+ //socketURL = "wss://192.168.11.242:9104";
|
|
|
+
|
|
|
+
|
|
|
+ var jmuxer = new JMuxer({
|
|
|
+ node: 'playerVideo',
|
|
|
+ flushingTime: 15,
|
|
|
+ fps: 30,
|
|
|
+ mode: 'video',
|
|
|
+ debug: false
|
|
|
+ });
|
|
|
+
|
|
|
+ var audioMuxer = new JMuxer({
|
|
|
+ node: 'audioPlayer',
|
|
|
+ flushingTime: 15,
|
|
|
+ clearBuffer: true,
|
|
|
+ fps: 60, //可以不选，原先43
|
|
|
+ mode: 'audio',
|
|
|
+ debug: false
|
|
|
+ });
|
|
|
+
|
|
|
+ curTime = new Date().getTime();
|
|
|
+ var ws = new WebSocket(socketURL);
|
|
|
+ ws.binaryType = 'arraybuffer';
|
|
|
+
|
|
|
+ //断开检测
|
|
|
+ ws.onclose = function(e) {
|
|
|
+ alert("websocket连接断开");
|
|
|
+ console.log('websocket 断开: ' + e.code + ' ' + e.reason + ' ' + e.wasClean);
|
|
|
+ console.log(e);
|
|
|
+ }
|
|
|
+
|
|
|
+ ws.addEventListener('open', function(event) {
|
|
|
+ console.log("发送配置帧");
|
|
|
+ ws.send(ConfigChannel("RK3923C1201900139"));
|
|
|
+ });
|
|
|
+
|
|
|
+ ws.addEventListener('error', function(event) {
|
|
|
+ console.log("连接失败");
|
|
|
+ });
|
|
|
+
|
|
|
+ ws.addEventListener('message', function(event) {
|
|
|
+ var data = ParseProto(event.data); //JAVA服务器转发
|
|
|
+ //console.log("收到数据");
|
|
|
+
|
|
|
+ var audioData = {
|
|
|
+ audio: data.audio,
|
|
|
+ video: null,
|
|
|
+ duration: data.duration
|
|
|
+ };
|
|
|
+
|
|
|
+ var videoData = {
|
|
|
+ audio: null,
|
|
|
+ video: data.video,
|
|
|
+ duration: data.duration
|
|
|
+ };
|
|
|
+
|
|
|
+ if (myAudio.readyState == 2) {
|
|
|
+ requestTime = new Date().getTime();
|
|
|
+ isEnough = false;
|
|
|
+ console.log("数据存储不够，出现声音停止，时间差 %f", myAudio.buffered.end(0));
|
|
|
+ myAudio.pause();
|
|
|
+ //myAudio.playbackRate = 2;
|
|
|
+ } else if (myAudio.readyState == 4 && isEnough == false) {
|
|
|
+ myAudio.play();
|
|
|
+ var time = new Date().getTime();
|
|
|
+ isEnough = true;
|
|
|
+ console.log("填满耗时 %d ms, 填充帧数 %d, 填充延迟 %d ms", time - requestTime, requestCount, requestCount * 23);
|
|
|
+
|
|
|
+ console.log("----接收到启动 %d ms， 缓冲区 %f---", time - delayTime, myAudio.buffered.end(0) - myAudio.played.end(0));
|
|
|
+ }
|
|
|
+
|
|
|
+ if (data.audio != null) //喂音频
|
|
|
+ {
|
|
|
+ if (myAudio.buffered.length > 0 && myAudio.played.length > 0) {
|
|
|
+ var bufferTime = myAudio.buffered.end(0) - myAudio.played.end(0);
|
|
|
+ //console.log(" bufferTime %d", bufferTime);
|
|
|
+
|
|
|
+ if (bufferTime > 1) {
|
|
|
+ //console.log("丢掉一些包");
|
|
|
+ //return;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ audioMuxer.feed(audioData);
|
|
|
+ }
|
|
|
+
|
|
|
+ if (data.video != null) //喂视频
|
|
|
+ {
|
|
|
+ if (isFeed) {
|
|
|
+ jmuxer.feed(data);
|
|
|
+ }
|
|
|
+
|
|
|
+ //jmuxer.feed(videoData);
|
|
|
+ }
|
|
|
+
|
|
|
+ });
|
|
|
+
|
|
|
+
|
|
|
+ myVideo.onmousedown = function(event) {
|
|
|
+ //放在此处只是为了方便演示，实际使用中查找横竖屏只要刚连接上时调用一次就好。
|
|
|
+ //var checkBuffer = GetScreenState();
|
|
|
+ //ws.send(checkBuffer);
|
|
|
+
|
|
|
+ if (!isFeed) {
|
|
|
+ console.log("重新申请I帧");
|
|
|
+ requestTime = new Date().getTime();
|
|
|
+ var buffer = RequestIFrame();
|
|
|
+ //var buffer = new Uint8Array([0x01]);
|
|
|
+ ws.send(buffer);
|
|
|
+ }
|
|
|
+
|
|
|
+ //console.log("报文 %s", PrintArry(buffer));
|
|
|
+
|
|
|
+
|
|
|
+ if (event.button == 0) {
|
|
|
+ var posX = event.offsetX * 1080 * 1.0 / myVideo.clientWidth;
|
|
|
+ var posY = event.offsetY * 1920 * 1.0 / myVideo.clientHeight;
|
|
|
+ var buffer = ExexuteMouseDown(posX.toString(), posY.toString());
|
|
|
+ ws.send(buffer);
|
|
|
+ isDrag = true;
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ myVideo.onmousemove = function(event) {
|
|
|
+ if (isDrag && event.button == 0) {
|
|
|
+ var posX = event.offsetX * 1080 * 1.0 / myVideo.clientWidth;
|
|
|
+ var posY = event.offsetY * 1920 * 1.0 / myVideo.clientHeight;
|
|
|
+ var buffer = ExexuteMouseMove(posX.toString(), posY.toString());
|
|
|
+ ws.send(buffer);
|
|
|
+ //console.log("移动位置 %d, %d", posX, posY);
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ myVideo.onmouseup = function(event) {
|
|
|
+ isDrag = false;
|
|
|
+ var posX = event.offsetX * 1080 * 1.0 / myVideo.clientWidth;
|
|
|
+ var posY = event.offsetY * 1920 * 1.0 / myVideo.clientHeight;
|
|
|
+ var buffer = ExexuteMouseUp(posX.toString(), posY.toString());
|
|
|
+ ws.send(buffer);
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ myVideo.onkeydown = function(event) {
|
|
|
+ ExexuteKeyDown(e.keyCode);
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ function Back() {
|
|
|
+ if (event.button == 2) {
|
|
|
+ //ExexuteKeyDown(4);
|
|
|
+ }
|
|
|
+ ExexuteKeyDown(4);
|
|
|
+ window.event.returnValue = false;
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ var topwinHeight = window.screen.height - window.innerHeight + 30; //计算title top 头部
|
|
|
+ $('#wine').css({
|
|
|
+ "width": window.screen.width,
|
|
|
+ "height": window.screen.height - topwinHeight - 20,
|
|
|
+ "position": "absolute",
|
|
|
+
|
|
|
+ })
|
|
|
+ var winese = document.createElement("wine");
|
|
|
+ wine.style.top = "-" + winese + 'px';
|
|
|
+
|
|
|
+ var url = window.location.href;
|
|
|
+ url = url.split('/')
|
|
|
+ // var baseUrl = window.location.href; //"http://192.168.31.20"
|
|
|
+ // var baseUrl = 'https://'+url[2] //url[2] //'http://192.168.31.159'//'http://' + url[2]
|
|
|
+ var query = window.location.search.substring(1);
|
|
|
+ // query = "clientType=1&cardIp=14.215.128.96&port=2012&sn=RK3930C2301900012&demoTime=3600&id=377&diskName=SC93mBww"
|
|
|
+ var vars = query.split("&");
|
|
|
+ console.log(vars)
|
|
|
+ // var baseUrl = 'http://192.168.31.20'
|
|
|
+ var baseUrl = 'test.androidscloud.com'
|
|
|
+ var data = {}
|
|
|
+ // 审核
|
|
|
+ $.ajax({
|
|
|
+ url: baseUrl + "/api/user/v1/config/download/isShow",
|
|
|
+ data: {},
|
|
|
+ type: 'get',
|
|
|
+ dataType: 'json',
|
|
|
+ success: function(data) {
|
|
|
+
|
|
|
+ if (data.data) {
|
|
|
+ $("#showsuss").show()
|
|
|
+ } else {
|
|
|
+ $("#showsuss").hide()
|
|
|
+ }
|
|
|
+ //
|
|
|
+ }
|
|
|
+ })
|
|
|
+ var clientType = vars.find(e => {
|
|
|
+ return e.startsWith('clientType')
|
|
|
+ }) || ''
|
|
|
+ // console.log(clientType)
|
|
|
+ data.clientType = clientType.substring(11, clientType.length)
|
|
|
+ // 小程序直接进入
|
|
|
+ var diskName = vars.find(e => {
|
|
|
+ return e.startsWith('diskName')
|
|
|
+ }) || ''
|
|
|
+
|
|
|
+ data.diskName = diskName.substring(9, diskName.length)
|
|
|
+
|
|
|
+ // document.title = decodeURI(data.diskName)
|
|
|
+ if (data.clientType == 1) {
|
|
|
+ var cardIp = vars.find(e => {
|
|
|
+ return e.startsWith('cardIp')
|
|
|
+ }) || ''
|
|
|
+ var port = vars.find(e => {
|
|
|
+ return e.startsWith('port')
|
|
|
+ }) || ''
|
|
|
+
|
|
|
+ var sn = vars.find(e => {
|
|
|
+ return e.startsWith('sn')
|
|
|
+ }) || ''
|
|
|
+ var demoTime = vars.find(e => {
|
|
|
+ return e.startsWith('demoTime')
|
|
|
+ }) || ''
|
|
|
+ var id = vars.find(e => {
|
|
|
+ return e.startsWith('id')
|
|
|
+ }) || ''
|
|
|
+
|
|
|
+
|
|
|
+ data.clientType = clientType.substring(11, clientType.length)
|
|
|
+
|
|
|
+ data.cardIp = cardIp.substring(7, cardIp.length)
|
|
|
+
|
|
|
+ data.port = port.substring(5, port.length)
|
|
|
+
|
|
|
+ data.sn = sn.substring(3, sn.length)
|
|
|
+
|
|
|
+ data.demoTime = demoTime.substring(9, demoTime.length)
|
|
|
+ data.id = id.substring(3, id.length)
|
|
|
+
|
|
|
+ } else if (data.clientType == 2) { //分享屏幕
|
|
|
+ console.log("走到分享屏幕里面啦==========", data.clientTypes);
|
|
|
+ $(".leftmains").css({
|
|
|
+ "right": "-4rem"
|
|
|
+ })
|
|
|
+ $('.leftmains').hide()
|
|
|
+ $('.bottommains').hide()
|
|
|
+ $('#btnMuted').hide()
|
|
|
+ let ip = vars.find(e => {
|
|
|
+ return e.startsWith('ip')
|
|
|
+ }) || ''
|
|
|
+ var username = vars.find(e => {
|
|
|
+ return e.startsWith('username')
|
|
|
+ }) || ''
|
|
|
+ var id = vars.find(e => {
|
|
|
+ return e.startsWith('id')
|
|
|
+ }) || ''
|
|
|
+ var userCardId = vars.find(e => {
|
|
|
+ return e.startsWith('userCardId')
|
|
|
+ }) || ''
|
|
|
+ data.id = id.substring(3, id.length)
|
|
|
+ data.username = username.substring(9, username.length)
|
|
|
+ data.ip = ip.substring(3, ip.length)
|
|
|
+ data.userCardId = userCardId.substring(11, userCardId.length)
|
|
|
+ } else {
|
|
|
+ // $(".leftmains").css({
|
|
|
+ // "right":"-4rem"
|
|
|
+ // })
|
|
|
+ // $('.leftmains').hide()
|
|
|
+ // $('.bottommains').hide()
|
|
|
+ // $('#btnMuted').hide()
|
|
|
+ var username = vars.find(e => {
|
|
|
+ return e.startsWith('username')
|
|
|
+ }) || ''
|
|
|
+
|
|
|
+ var userCardId = vars.find(e => {
|
|
|
+ return e.startsWith('userCardId')
|
|
|
+ }) || ''
|
|
|
+ data.username = username.substring(9, username.length)
|
|
|
+ data.userCardId = userCardId.substring(11, userCardId.length)
|
|
|
+ console.log(data.ip)
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ // 心跳
|
|
|
+ // var time = 1000 * 30;
|
|
|
+ // var interval;
|
|
|
+ // fun()
|
|
|
+ //
|
|
|
+ // function run() {
|
|
|
+ //
|
|
|
+ // interval = setInterval(fun, time);
|
|
|
+ // }
|
|
|
+ //
|
|
|
+ // function fun() {
|
|
|
+ // $.ajax({
|
|
|
+ // url: baseUrl + "/api/game/v1/cloudGame/dev/get/cardSn",
|
|
|
+ // data: {
|
|
|
+ // sn: data.sn
|
|
|
+ // },
|
|
|
+ // type: 'get',
|
|
|
+ // dataType: 'json',
|
|
|
+ // success: function(data) {
|
|
|
+ //
|
|
|
+ // }
|
|
|
+ // })
|
|
|
+ //
|
|
|
+ // };
|
|
|
+ // run();
|
|
|
+ // data.clientType=1
|
|
|
+ // data.sn="RK3930C2301900044"
|
|
|
+ // data.cardIp="14.215.128.96"
|
|
|
+ // data.port=2044
|
|
|
+
|
|
|
+ var orientation = 0 //0 竖屏，1横屏
|
|
|
+ var winHeight = window.screen.height - window.innerHeight
|
|
|
+ // var urlss = url[2]
|
|
|
+ // var urlss='192.168.31.20'
|
|
|
+ // var urlss = "14.215.128.96"
|
|
|
+ var urlss = 'test.androidscloud.com'
|
|
|
+ document.body.addEventListener('touchmove', function(e) {
|
|
|
+ e.preventDefault()
|
|
|
+ }, {
|
|
|
+ passive: false
|
|
|
+ })
|
|
|
+
|
|
|
+ //
|
|
|
+ // urlss = "14.215.128.96"
|
|
|
+ // console.log()
|
|
|
+ // data.clientType = 1
|
|
|
+ // data.sn="RK3930C2301900044"
|
|
|
+ // data.cardIp="14.215.128.96"
|
|
|
+ // data.port=2044
|
|
|
+ // if (data.clientType == 3) {
|
|
|
+ // var players = AV.Player.fromWebSocket("wss://" + urlss + '/authVideoWebSocket?' + "clientType=" + data.clientType +
|
|
|
+ // "&username=" + data.username + "&userCardId=" + data.userCardId);
|
|
|
+ // } else if (data.clientType == 2) {
|
|
|
+ // // var players = AV.Player.fromWebSocket("wss://" + urlss + '/shareWebSocket?' + "clientType=" + data.clientType +
|
|
|
+ // // "&username=" + data.username + "&userCardId=" + data.userCardId + "&ip=" + data.ip);
|
|
|
+
|
|
|
+ // var players = AV.Player.fromWebSocket(
|
|
|
+ // "wss://test.androidscloud.com/videoWebSocket?clientType=1&cardIp=14.215.128.96&port=2005&sn=RK3930C2301900005");
|
|
|
+ // } else {
|
|
|
+ // var players = AV.Player.fromWebSocket("wss://" + urlss + '/videoWebSocket?' + "clientType=" + data.clientType +
|
|
|
+ // "&cardIp=" + data.cardIp + "&port=" + data.port + "&sn=" + data.sn);
|
|
|
+ // }
|
|
|
+ // // debugger
|
|
|
+ // var players = AV.Player.fromWebSocket('ws://14.215.128.96/authVideoWebSocket?clientType=3&username=WqXTc1593762177&userCardId=377');
|
|
|
+ // players.play();
|
|
|
+ // players.volume = 100
|
|
|
+ //var players = AV.Player.fromWebSocket('ws://14.215.128.96/videoWebSocket?clientType=0&cardIp=30.30.30.58&port=9100&sn=RK3930C2301900060');
|
|
|
+
|
|
|
+ var warid = {
|
|
|
+ id: data.id,
|
|
|
+ type: 1,
|
|
|
+ sn: data.sn
|
|
|
+ }
|
|
|
+ //结束时间 type=2
|
|
|
+ var warids = {
|
|
|
+ id: data.id,
|
|
|
+ type: 2,
|
|
|
+ sn: data.sn
|
|
|
+ }
|
|
|
+
|
|
|
+ // $.ajax({})
|
|
|
+
|
|
|
+ // 关闭浏览器
|
|
|
+ // window.onbeforeunload = function() {}
|
|
|
+
|
|
|
+ //撤销的array
|
|
|
+ var cancelList = new Array();
|
|
|
+ //撤销的次数
|
|
|
+ var cancelIndex = 0;
|
|
|
+ var inputType = 0 //输入类型 0:手写，1:键盘输入
|
|
|
+ //判断是否ie
|
|
|
+ var IE_HACK = (/msie/i.test(navigator.userAgent) &&
|
|
|
+ !/opera/i.test(navigator.userAgent));
|
|
|
+ // 云手机相关逻辑
|
|
|
+ // var player = new Player({
|
|
|
+ // size: {
|
|
|
+ // width: 1280,
|
|
|
+ // height: 720
|
|
|
+ // }
|
|
|
+ // });
|
|
|
+ // var secanv = document.getElementById("wine");
|
|
|
+
|
|
|
+ // secanv.appendChild(player.canvas);
|
|
|
+ // console.log("player=========>>>>", player);
|
|
|
+ // console.log("secanv>>>>", secanv);
|
|
|
+ // &cardIp="+data.data.extranetIp+"&port="+data.data.extranetPort+"&sn="+data.data.sn
|
|
|
+
|
|
|
+ $(function() {
|
|
|
+ initCanvas();
|
|
|
+ });
|
|
|
+ //初始化
|
|
|
+ var initCanvas = function() {
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ $("#voew").on("click", function() {})
|
|
|
+
|
|
|
+ $("#box").on("click", function() {
|
|
|
+ // draw_graph('pencil', this)
|
|
|
+
|
|
|
+ })
|
|
|
+
|
|
|
+ console.log(player)
|
|
|
+ $('#mocan').on('click', function() {
|
|
|
+ draw_graph('pencil', this)
|
|
|
+ })
|
|
|
+
|
|
|
+ // //初始化一下就可以了，
|
|
|
+ let vConsole = new VConsole();
|
|
|
+ // //你打印的数据 比如
|
|
|
+ console.log('test');
|
|
|
+ //就可像小程序一样的看了和调试了。
|
|
|
+ $('.no-ne-an').on('click', function() {
|
|
|
+ //结束时间 type=2
|
|
|
+ let warids = {
|
|
|
+ id: data.id,
|
|
|
+ type: 2,
|
|
|
+ sn: data.sn
|
|
|
+ }
|
|
|
+ $.ajax({
|
|
|
+ url: baseUrl + "/api/game/v1/cloudGame/dev/getSn",
|
|
|
+ data: warid,
|
|
|
+ type: 'get',
|
|
|
+ dataType: 'json',
|
|
|
+ success: function(data) {
|
|
|
+ history.go(-1)
|
|
|
+ if (data.status == 0) {
|
|
|
+
|
|
|
+ } else {
|
|
|
+ alert(data.msg)
|
|
|
+ }
|
|
|
+ //
|
|
|
+ }
|
|
|
+ })
|
|
|
+ })
|
|
|
+
|
|
|
+ var btnMuted = document.querySelector("#btnMuted");
|
|
|
+ btnMuted && (function() {
|
|
|
+ var setHistory = function(left, top) {
|
|
|
+ try {
|
|
|
+ localStorage.setItem("muted-btn-loc", JSON.stringify({
|
|
|
+ left: left,
|
|
|
+ top: top
|
|
|
+ }));
|
|
|
+ } catch (ex) {}
|
|
|
+ };
|
|
|
+ var getHistory = function() {
|
|
|
+ try {
|
|
|
+ var value = localStorage.getItem("muted-btn-loc");
|
|
|
+ if (!value) return null;
|
|
|
+ value = JSON.parse(value);
|
|
|
+ if (!value) return null;
|
|
|
+ return value;
|
|
|
+ } catch (ex) {
|
|
|
+ return null
|
|
|
+ }
|
|
|
+ };
|
|
|
+ var fixLoc = function(loc) {
|
|
|
+ var rect = btnMuted.getBoundingClientRect();
|
|
|
+ rect = {
|
|
|
+ top: rect.top,
|
|
|
+ left: rect.left,
|
|
|
+ width: rect.width,
|
|
|
+ height: rect.height
|
|
|
+ }; //部分低版本浏览器,该属性为只读
|
|
|
+ if (loc) {
|
|
|
+ rect.left = loc.left;
|
|
|
+ rect.top = loc.top;
|
|
|
+ }
|
|
|
+ var minX = 0;
|
|
|
+ var minY = 0;
|
|
|
+ var docRect = document.documentElement.getBoundingClientRect();
|
|
|
+ var maxY = docRect.height - rect.height;
|
|
|
+ var maxX = docRect.width - rect.width;
|
|
|
+ var left = rect.left;
|
|
|
+ var top = rect.top;
|
|
|
+ left = Math.min(left, maxX);
|
|
|
+ left = Math.max(left, minX);
|
|
|
+ top = Math.min(top, maxY);
|
|
|
+ top = Math.max(top, minY);
|
|
|
+ console.log(rect.top, top, loc);
|
|
|
+ if (loc || top !== rect.top || left !== rect.left) {
|
|
|
+ btnMuted.style.cssText += "left:" + left + "px;top:" + top + "px;";
|
|
|
+ }
|
|
|
+ }
|
|
|
+ window.addEventListener("resize", function() {
|
|
|
+ fixLoc();
|
|
|
+ });
|
|
|
+ var touchPoint = {
|
|
|
+ pageY: 0,
|
|
|
+ pageX: 0
|
|
|
+ };
|
|
|
+ var currentLoc = {
|
|
|
+ top: 0,
|
|
|
+ left: 0,
|
|
|
+ curTop: 0,
|
|
|
+ curLeft: 0
|
|
|
+ };
|
|
|
+ var toMove = false;
|
|
|
+ var touchmove = function(e) {
|
|
|
+ e.preventDefault();
|
|
|
+ var point = e.changedTouches[0];
|
|
|
+ var top = -touchPoint.pageY + point.pageY;
|
|
|
+ var left = -touchPoint.pageX + point.pageX;
|
|
|
+ if (toMove) {
|
|
|
+ top += currentLoc.top;
|
|
|
+ left += currentLoc.left;
|
|
|
+ currentLoc.curLeft = left;
|
|
|
+ currentLoc.curTop = top;
|
|
|
+ btnMuted.style.cssText += "left:" + left + "px;top:" + top + "px;";
|
|
|
+ } else {
|
|
|
+ if (Math.abs(top) >= 5 || Math.abs(left) >= 5) {
|
|
|
+ toMove = true;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ };
|
|
|
+ var touchend = function() {
|
|
|
+ window.removeEventListener("touchmove", touchmove, {
|
|
|
+ passive: false
|
|
|
+ });
|
|
|
+ window.removeEventListener("touchend", touchend, {
|
|
|
+ passive: false
|
|
|
+ });
|
|
|
+
|
|
|
+ if (toMove) {
|
|
|
+ setHistory(currentLoc.curLeft, currentLoc.curTop);
|
|
|
+ fixLoc();
|
|
|
+ } else {
|
|
|
+ //按点击处理
|
|
|
+
|
|
|
+ var set = $('.control-right-img').attr("data-id")
|
|
|
+ if (set == '1') {
|
|
|
+ $('.control-right-img').attr({
|
|
|
+ "data-id": "2"
|
|
|
+ })
|
|
|
+ // $('.control-right-img').find('img').attr({
|
|
|
+ // "src": "../static/img/musicturn.png"
|
|
|
+ // })
|
|
|
+ // players.volume = 100
|
|
|
+ $(".leftmains").css({
|
|
|
+ "right": "-4rem"
|
|
|
+ })
|
|
|
+ // console.log(players)
|
|
|
+ // players.play();
|
|
|
+ } else {
|
|
|
+
|
|
|
+ $('.control-right-img').attr({
|
|
|
+ "data-id": "1"
|
|
|
+ })
|
|
|
+
|
|
|
+ $(".leftmains").css({
|
|
|
+ "right": "0rem"
|
|
|
+ })
|
|
|
+ // $('.control-right-img').find('img').attr({
|
|
|
+ // "src": "../static/img/musicfalse.png"
|
|
|
+ // })
|
|
|
+ // players.volume = 0
|
|
|
+ // players.off('pause');
|
|
|
+ // players.pause();
|
|
|
+ // var embed = document.embedPlay;
|
|
|
+ console.log(players, "fdsfdsf")
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ btnMuted.addEventListener("touchstart", function(e) {
|
|
|
+ e.preventDefault();
|
|
|
+ toMove = false;
|
|
|
+ var point = e.changedTouches[0];
|
|
|
+ touchPoint.pageX = point.pageX;
|
|
|
+ touchPoint.pageY = point.pageY;
|
|
|
+ var rect = e.target.getBoundingClientRect();
|
|
|
+ currentLoc.top = rect.top;
|
|
|
+ currentLoc.left = rect.left;
|
|
|
+ window.addEventListener("touchmove", touchmove, {
|
|
|
+ passive: false
|
|
|
+ });
|
|
|
+ window.addEventListener("touchend", touchend, {
|
|
|
+ passive: false
|
|
|
+ });
|
|
|
+
|
|
|
+ }, {
|
|
|
+ passive: false
|
|
|
+ });
|
|
|
+ var history = getHistory();
|
|
|
+ if (history) {
|
|
|
+ fixLoc(history);
|
|
|
+ }
|
|
|
+ btnMuted.classList.remove("hide");
|
|
|
+ })();
|
|
|
+
|
|
|
+ $(".boximg").on("click", function() {
|
|
|
+ $(".mainbox").css({
|
|
|
+ "display": "none"
|
|
|
+ })
|
|
|
+ })
|
|
|
+
|
|
|
+ // 剪切板
|
|
|
+ $(".sboxbu").on("click", function() {
|
|
|
+ $(".sbox").css({
|
|
|
+ "display": "none"
|
|
|
+ })
|
|
|
+ })
|
|
|
+ // 剪切板
|
|
|
+ $(".uploadss").on("click", function() {
|
|
|
+ $(".sbox").css({
|
|
|
+ "display": "none"
|
|
|
+ })
|
|
|
+ })
|
|
|
+
|
|
|
+ $("#upload").on("click", function() {
|
|
|
+ wx.miniProgram.switchTab({
|
|
|
+ url: '/pages/home/home'
|
|
|
+ })
|
|
|
+ })
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ function selectText(x) {
|
|
|
+ if (document.selection) {
|
|
|
+ var range = document.body.createTextRange();
|
|
|
+ range.moveToElementText(x);
|
|
|
+ range.select();
|
|
|
+ } else if (window.getSelection) {
|
|
|
+ var selection = window.getSelection();
|
|
|
+ var range = document.createRange();
|
|
|
+ selection.removeAllRanges();
|
|
|
+ range.selectNodeContents(x);
|
|
|
+ selection.addRange(range);
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ function cp(x) {
|
|
|
+ $(".mainbox").css({
|
|
|
+ "display": "none"
|
|
|
+ })
|
|
|
+ $(".sbox").css({
|
|
|
+ "display": "block"
|
|
|
+ })
|
|
|
+ selectText(x);
|
|
|
+ document.execCommand("copy");
|
|
|
+
|
|
|
+ }
|
|
|
+ </script>
|
|
|
+ <script type="text/javascript" src="jmuxer.js"></script>
|
|
|
+ </body>
|
|
|
+
|
|
|
+</html>
|
wuyongxiang