WXtrialInterface.html 29 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title></title>
  6. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  7. <meta name="viewport" content="initial-scale=1,maximum-scale=1, minimum-scale=1,user-scalable=no">
  8. <meta name="x5-orientation" content="portrait" />
  9. <meta name="screen-orientation" content="portrait" />
  10. <meta name="viewport" content="width=device-width, minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
  11. <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
  12. <meta name="apple-mobile-web-app-capable" content="yes">
  13. <meta name="apple-mobile-web-app-status-bar-style" content="black">
  14. <meta name="format-detection" content="telephone=no, email=no">
  15. <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
  16. <meta name="apple-mobile-web-app-capable" content="yes">
  17. <!-- 删除苹果默认的工具栏和菜单栏 -->
  18. <meta name="apple-mobile-web-app-status-bar-style" content="black">
  19. <!-- 设置苹果工具栏颜��? -->
  20. <meta name="format-detection" content="telphone=no, email=no">
  21. <!-- 忽略页面中的数字识别为电话,忽略email识别 -->
  22. <!-- 启用360浏览器的极速模��?(webkit) -->
  23. <meta name="renderer" content="webkit">
  24. <!-- 避免IE使用兼容模式 -->
  25. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  26. <!-- 针对手持设备优化,主要是针对一些老的不识别viewport的浏览器,比如黑��? -->
  27. <meta name="HandheldFriendly" content="true">
  28. <!-- 微软的老式浏览��? -->
  29. <meta name="MobileOptimized" content="320">
  30. <!-- uc强制竖屏 -->
  31. <!-- <meta name="screen-orientation" content="portrait"> -->
  32. <!-- QQ强制竖屏 -->
  33. <!-- <meta name="x5-orientation" content="portrait"> -->
  34. <!-- 不能旋转,问题出在这 -->
  35. <!-- UC强制全屏 -->
  36. <meta name="full-screen" content="yes">
  37. <!-- QQ强制全屏 -->
  38. <meta name="x5-fullscreen" content="true">
  39. <!-- UC应用模式 -->
  40. <meta name="browsermode" content="application">
  41. <!-- QQ应用模式 -->
  42. <meta name="x5-page-mode" content="app">
  43. <!-- windows phone 点击无高��? -->
  44. <meta name="msapplication-tap-highlight" content="no">
  45. <title></title>
  46. <link rel="stylesheet" type="text/css" href="css/WXtrialInterface.css" />
  47. <script async defer src="https://buttons.github.io/buttons.js"></script>
  48. </head>
  49. <body class="scroll h-player" style="overscroll-behavior: contain;">
  50. <div class="container" id="player">
  51. <div class="muted" id="btnMuted">
  52. <div class="control-right-img" data-id="1">
  53. <img src="../static/img/xuanfu_icon.png">
  54. </div>
  55. </div>
  56. <div id="wine">
  57. <!-- <video id="video1" muted="muted" x5-video-orientation="landscape" playsinline="true" autoplay="true"
  58. webkit-playsinline="true" x5-playsinline="true" x5-video-player-type="h5" x5-video-player-fullscreen="false" style="pointer-events: none;"></video> -->
  59. <!-- <div id="box"> -->
  60. <!-- <video muted="muted" x5-video-orientation="landscape" playsinline="true" autoplay="true"
  61. webkit-playsinline="true" x5-playsinline="true" x5-video-player-type="h5"
  62. x5-video-player-fullscreen="false" style="pointer-events: none;object-fit: fill;width: 100%;height:100%"
  63. disablePictureInPicture="true" poster="images/loader-thumb.jpg" id="playerVideo"></video> -->
  64. <video id="playerVideo" 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%;height:100%"></video>
  65. <div id="box"></div>
  66. <audio preload="auto" autoplay controls poster="images/loader-thumb.jpg" id="audioPlayer"
  67. style="position: absolute;top: 0;width: 0;height: 0;"></audio>
  68. </div>
  69. <div class="leftmains">
  70. <div class="PictureQualityMain">
  71. <div class="PictureQuality " data-id="3072000">高清</div>
  72. <div class="PictureQuality avit" data-id="2243000">标清</div>
  73. <div class="PictureQuality" data-id="400000">极速</div>
  74. <div class="PictureQuality" data-id="400000">自动</div>
  75. </div>
  76. <div class="operation">
  77. <div class="upload" id="showsuss" data-text="uploads">
  78. <img src="../static/img/wx/shangchuan_icon.png">
  79. <div>上传</div>
  80. </div>
  81. <div class="upload" onclick="cp(document.getElementById('user_ref_id'));" data-text="Shearplate">
  82. <img src="../static/img/wx/jianqieban_icon.png">
  83. <div>剪切板</div>
  84. </div>
  85. <div class="upload" id="upload" data-text="Signout">
  86. <img src="../static/img/wx/tuichu_icon.png">
  87. <div>退出</div>
  88. </div>
  89. </div>
  90. </div>
  91. <div class="bottommains">
  92. <div class="botmat1">
  93. <div class="botmat1img" data-text="gengduo">
  94. <img src="../static/img/wx/gengduo_icon.png">
  95. </div>
  96. </div>
  97. <div class="botmat1">
  98. <div class="botmat1img" data-text="home">
  99. <img src="../static/img/wx/home_icon.png">
  100. </div>
  101. </div>
  102. <div class="botmat1">
  103. <div class="botmat1img" data-text="return">
  104. <img src="../static/img/wx/fanhui_icon.png">
  105. </div>
  106. </div>
  107. </div>
  108. <div class="mainbox" style="display: none;">
  109. <div class="boxTitle">提示</div>
  110. <div class="boxText">
  111. <div>由于小程序的功能限制,此功能暂时</div>
  112. <div>无法使用,请下载APP使用更多功能</div>
  113. </div>
  114. <div class="boxbt" onclick="cp(document.getElementById('user_ref_id'));">立即前往下载</div>
  115. <div class="boximg"><img src="../static/img/wx/guanbi_icon.png"></div>
  116. </div>
  117. <div class="sbox" style="display: none;">
  118. <div class="sboxText">下载地址已复制到剪切板</div>
  119. <div class="sboxbu">确定</div>
  120. </div>
  121. </div>
  122. <body oncontextmenu="Back()">
  123. </body>
  124. <div id="copy-txt" style="position: absolute;opacity: 0;">
  125. <span id="user_ref_id">www.androidsCloud.com</span>
  126. </div>
  127. <!-- <script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script> -->
  128. <script src="../static/js/jquery-1.11.0.min.js"></script>
  129. <script src="helper.js"></script>
  130. <script type="text/javascript" src="pcm-player.js"></script>
  131. <!-- 音频
  132. <!-- <script src="../static/js/classlist.js"></script>
  133. <script src="../static/js/players.js"></script>
  134. <script src="../static/js/auroraplayer.js"></script>
  135. <script src="../static/js/aurora.js"></script>
  136. <script src="../static/js/aac.js"></script>
  137. <script src="../static/js/web.js?id=101"></script> -->
  138. <!-- <script src="../static/js/webapk.js"></script> -->
  139. <!-- 视频-->
  140. <!-- <script type="text/javascript" src="../static/js/Decoder.js"></script>
  141. <script type="text/javascript" src="../static/js/YUVCanvas.js"></script>
  142. <script type="text/javascript" src="../static/js/Player.js"></script> -->
  143. <!-- <script type="text/javascript" src="jmuxer.js"></script> -->
  144. <script src="https://cdn.bootcss.com/vConsole/3.2.0/vconsole.min.js"></script>
  145. <script src="WXdraw.js?v=110"></script>
  146. <script>
  147. var topwinHeight = window.screen.height - window.innerHeight + 30; //计算title top 头部
  148. $('#wine').css({
  149. "width": window.screen.width,
  150. "height": window.screen.height - topwinHeight - 20,
  151. "position": "absolute",
  152. })
  153. var winese = document.createElement("wine");
  154. wine.style.top = "-" + winese + 'px';
  155. //隐藏控件 controls
  156. var fpsCount = 0;
  157. var requestCount = 0;
  158. var timeCount = 0;
  159. var isVisuable = true;
  160. var isFeed = true;
  161. var isDrag = false;
  162. var shoudDrop = false;
  163. var isEnough = true;
  164. var ifCanPlay = false;
  165. var isFinish = false;
  166. var delayTime = new Date().getTime();
  167. var feedTime = new Date().getTime();
  168. var readyTime = new Date().getTime();
  169. var requestTime = new Date().getTime();
  170. var curTime = new Date().getTime();
  171. var requestTime = new Date().getTime(); //记录离开时间
  172. var myVideo = document.getElementById("playerVideo");
  173. $("#wine").click(function() {
  174. console.log("9999999999")
  175. });
  176. var myAudio = document.getElementById("audioPlayer");
  177. var audioBuffer = [];
  178. var audioBack = [];
  179. Module = {};
  180. Module.onRuntimeInitialized = function() {
  181. console.log("Wasm 加载成功!")
  182. isFinish = true;
  183. }
  184. document.addEventListener("visibilitychange", () => {
  185. if (document.visibilityState == "visible") {
  186. console.log("页面可见,继续喂视频");
  187. //requestTime = new Date().getTime();
  188. isVisuable = true;
  189. } else {
  190. isVisuable = false;
  191. isFeed = false;
  192. myVideo.pause();
  193. }
  194. });
  195. myVideo.play();
  196. myVideo.addEventListener('pause', function() {
  197. //console.log("视频播放暂停");
  198. isFeed = false;
  199. });
  200. myAudio.addEventListener('canplay', function() {
  201. console.log("缓冲区大小 %f", myAudio.buffered.end(0) - myAudio.buffered.start(0));
  202. });
  203. var decodeCount = 1;
  204. var isFinish = false;
  205. var player = new PCMPlayer({
  206. encoding: '16bitInt',
  207. channels: 2,
  208. sampleRate: 44100,
  209. flushingTime: 22,
  210. debug: false
  211. });
  212. Module = {};
  213. Module.onRuntimeInitialized = function() {
  214. console.log("Wasm 加载成功!")
  215. isFinish = true;
  216. }
  217. function decodeAAC(data) {
  218. var retPtr = Module._malloc(4 * 5 * 1024); //接收的数据
  219. var inputPtr = Module._malloc(4 * data.length); //输入数据
  220. for (i = 0; i < data.length; i++) {
  221. Module.HEAPU8[(inputPtr) + i] = data[i]; //转换为堆数据
  222. }
  223. var pcmLen = Module._feedData(retPtr, inputPtr, data.length);
  224. if (pcmLen >= 0) {
  225. //console.log("%d帧 aac 解码成功, %d", decodeCount, pcmLen);
  226. var pcmData = new Uint8Array(pcmLen);
  227. for (i = 0; i < pcmLen; i++) {
  228. pcmData[i] = Module.HEAPU8[(retPtr) + i]
  229. }
  230. player.feed(pcmData);
  231. } else {
  232. console.log("%d帧 aac 解码失败, %d", decodeCount, pcmLen);
  233. }
  234. decodeCount++;
  235. Module._free(inputPtr);
  236. Module._free(retPtr);
  237. }
  238. //解协议
  239. function ParseProto(data) {
  240. var temp = "";
  241. var input = new Uint8Array(data),
  242. duration,
  243. video,
  244. audio;
  245. if (input[0] == 0 && input[1] == 0 && input[2] == 0 && input[3] == 1) {
  246. // debugger
  247. video = input;
  248. duration = 24;
  249. var nalType = input[4] & 0x1f; //nalType == 0x07|| nalType == 0x08 || nalType == 0x05
  250. if (!isFeed) {
  251. if (nalType == 0x05) {
  252. console.log("发现I帧");
  253. }
  254. if (nalType == 0x05 && isVisuable) {
  255. console.log("检测到I帧 %d,重新渲染, 耗时 %d ms", nalType, new Date().getTime() - requestTime);
  256. isFeed = true;
  257. }
  258. }
  259. } else if (input[0] == 0xff) {
  260. if (!isEnough) {
  261. requestCount++;
  262. //audioBuffer.push(input);
  263. }
  264. audio = input;
  265. if (new Date().getTime() - curTime > 100) {
  266. delayTime = new Date().getTime();
  267. console.log("接收时间 %d ms", new Date().getTime() - curTime);
  268. }
  269. curTime = new Date().getTime();
  270. duration = 24;
  271. //console.log("duration %d", duration);
  272. } else if (input[0] == 0x68) {
  273. if (input[23] == 0x05) //横竖屏标识
  274. {
  275. var state = CheckScreenDirection(input.slice(24, 24 + 8));
  276. if (state == 1) {
  277. console.log("安卓卡此时竖屏");
  278. //竖屏处理
  279. } else {
  280. console.log("安卓卡此时横屏");
  281. //横屏处理
  282. }
  283. }
  284. if (input[23] == 0x0b) {
  285. console.log("多端登陆");
  286. }
  287. //console.log("屏幕旋转 %s", PrintArry(input));
  288. }
  289. return {
  290. audio: audio,
  291. video: video,
  292. duration: duration
  293. };
  294. }
  295. function GetRequest() {
  296. var url = location.search; // 获取url中"?"符后的字串
  297. var obj= new Object();
  298. if (url.indexOf("?") != -1) {
  299. var str = url.substr(1);
  300. strs = str.split("&");
  301. for(var i = 0; i < strs.length; i ++) {
  302. obj[strs[i].split("=")[0]]=(strs[i].split("=")[1]);
  303. }
  304. }
  305. return obj;
  306. }
  307. window.onload = function() {
  308. var parameters = GetRequest();
  309. var ip = parameters["ip"];
  310. // var socketURL = 'wss://jmuxer-demo-server.herokuapp.com';
  311. //socketURL = "ws://127.0.0.1:8080"
  312. // socketURL = "ws://192.168.11.233:8080"
  313. //socketURL = "ws://14.215.128.98:14112";
  314. // var socketURL = "ws://192.168.11.66:9101";
  315. // var socketURL = "ws://192.168.198.21:9101"
  316. // var socketURL = "ws://14.215.128.97:15508"
  317. var socketURL = "ws://192.168.198.82:9100" + ip;
  318. // socketURL = "ws://14.215.128.98:14077";
  319. //socketURL = "wss://192.168.11.242:9104";
  320. var jmuxer = new JMuxer({
  321. node: 'playerVideo',
  322. flushingTime: 15,
  323. fps: 30,
  324. mode: 'video',
  325. debug: false
  326. });
  327. var audioMuxer = new JMuxer({
  328. node: 'audioPlayer',
  329. flushingTime: 15,
  330. clearBuffer: true,
  331. fps: 60, //可以不选,原先43
  332. mode: 'audio',
  333. debug: false
  334. });
  335. curTime = new Date().getTime();
  336. var ws = new WebSocket(socketURL);
  337. ws.binaryType = 'arraybuffer';
  338. //断开检测
  339. ws.onclose = function(e) {
  340. alert("websocket连接断开");
  341. console.log('websocket 断开: ' + e.code + ' ' + e.reason + ' ' + e.wasClean);
  342. console.log(e);
  343. }
  344. ws.addEventListener('open', function(event) {
  345. console.log("发送配置帧");
  346. ws.send(ConfigChannel("RK3923C1201900139"));
  347. });
  348. ws.addEventListener('error', function(event) {
  349. console.log("连接失败");
  350. });
  351. ws.addEventListener('message', function(event) {
  352. var data = ParseProto(event.data); //JAVA服务器转发
  353. //console.log("收到数据");
  354. var audioData = {
  355. audio: data.audio,
  356. video: null,
  357. duration: data.duration
  358. };
  359. var videoData = {
  360. audio: null,
  361. video: data.video,
  362. duration: data.duration
  363. };
  364. var input = new Uint8Array(event.data);
  365. // console.log("音频数据", input, input[0] == 0xff);
  366. if (input[0] == 0xff) {
  367. if (isFinish) {
  368. var time = new Date().getTime();
  369. decodeAAC(input);
  370. }
  371. } else {}
  372. if (myAudio.readyState == 2) {
  373. requestTime = new Date().getTime();
  374. isEnough = false;
  375. console.log("数据存储不够,出现声音停止,时间差 %f", myAudio.buffered.end(0));
  376. myAudio.pause();
  377. //myAudio.playbackRate = 2;
  378. } else if (myAudio.readyState == 4 && isEnough == false) {
  379. myAudio.play();
  380. var time = new Date().getTime();
  381. isEnough = true;
  382. console.log("填满耗时 %d ms, 填充帧数 %d, 填充延迟 %d ms", time - requestTime, requestCount,
  383. requestCount * 23);
  384. console.log("----接收到启动 %d ms, 缓冲区 %f---", time - delayTime, myAudio.buffered.end(0) - myAudio
  385. .played.end(0));
  386. }
  387. if (data.audio != null) //喂音频
  388. {
  389. if (myAudio.buffered.length > 0 && myAudio.played.length > 0) {
  390. var bufferTime = myAudio.buffered.end(0) - myAudio.played.end(0);
  391. //console.log(" bufferTime %d", bufferTime);
  392. if (bufferTime > 1) {
  393. //console.log("丢掉一些包");
  394. //return;
  395. }
  396. }
  397. audioMuxer.feed(audioData);
  398. }
  399. if (data.video != null) //喂视频
  400. {
  401. if (isFeed) {
  402. // console.log("渲染视频");
  403. jmuxer.feed(data);
  404. }
  405. //jmuxer.feed(videoData);
  406. }
  407. });
  408. var myPlay = document.getElementById("wine");
  409. myPlay.onmousedown = function(event) {
  410. console.log('5555555555')
  411. if (event.button == 0) {
  412. var posX = event.offsetX * 720 * 1.0 / myVideo.clientWidth;
  413. var posY = event.offsetY * 1280 * 1.0 / myVideo.clientHeight;
  414. var buffer = ExexuteMouseDown(posX.toString(), posY.toString());
  415. // console.log('posX=======posY', posX, posY)
  416. // console.log('buffer=======', buffer)
  417. ws.send(buffer);
  418. console.log('ws', ws)
  419. isDrag = true;
  420. }
  421. }
  422. myPlay.onmousemove = function(event) {
  423. console.log('5555555555', isDrag, event.button)
  424. if (isDrag && event.button == 0) {
  425. var posX = event.offsetX * 720 * 1.0 / myVideo.clientWidth;
  426. var posY = event.offsetY * 1280 * 1.0 / myVideo.clientHeight;
  427. var buffer = ExexuteMouseMove(posX.toString(), posY.toString());
  428. ws.send(buffer);
  429. console.log("移动位置 %d, %d", posX, posY);
  430. }
  431. }
  432. myPlay.onmouseup = function(event) {
  433. console.log('5555555555')
  434. isDrag = false;
  435. var posX = event.offsetX * 720 * 1.0 / myVideo.clientWidth;
  436. var posY = event.offsetY * 1280 * 1.0 / myVideo.clientHeight;
  437. var buffer = ExexuteMouseUp(posX.toString(), posY.toString());
  438. ws.send(buffer);
  439. }
  440. myPlay.onkeydown = function(event) {
  441. console.log('5555555555')
  442. ExexuteKeyDown(e.keyCode);
  443. }
  444. }
  445. function Back() {
  446. if (event.button == 2) {
  447. //ExexuteKeyDown(4);
  448. }
  449. ExexuteKeyDown(4);
  450. window.event.returnValue = false;
  451. return false;
  452. }
  453. var url = window.location.href;
  454. url = url.split('/')
  455. // var baseUrl = window.location.href; //"http://192.168.31.20"
  456. // var baseUrl = 'https://'+url[2] //url[2] //'http://192.168.31.159'//'http://' + url[2]
  457. var query = window.location.search.substring(1);
  458. // query = "clientType=1&cardIp=14.215.128.96&port=2012&sn=RK3930C2301900012&demoTime=3600&id=377&diskName=SC93mBww"
  459. var vars = query.split("&");
  460. console.log(vars)
  461. // var baseUrl = 'http://192.168.31.20'
  462. // var baseUrl = 'test.androidscloud.com'
  463. var baseUrl = "http://192.168.199.243";
  464. var data = {}
  465. // 审核
  466. $.ajax({
  467. url: baseUrl + "/api/user/v1/config/download/isShow",
  468. data: {},
  469. type: 'get',
  470. dataType: 'json',
  471. success: function(data) {
  472. if (data.data) {
  473. $("#showsuss").show()
  474. } else {
  475. $("#showsuss").hide()
  476. }
  477. //
  478. }
  479. })
  480. var clientType = vars.find(e => {
  481. return e.startsWith('clientType')
  482. }) || ''
  483. // console.log(clientType)
  484. data.clientType = clientType.substring(11, clientType.length)
  485. // 小程序直接进入
  486. var diskName = vars.find(e => {
  487. return e.startsWith('diskName')
  488. }) || ''
  489. data.diskName = diskName.substring(9, diskName.length)
  490. // document.title = decodeURI(data.diskName)
  491. if (data.clientType == 1) {
  492. var cardIp = vars.find(e => {
  493. return e.startsWith('cardIp')
  494. }) || ''
  495. var port = vars.find(e => {
  496. return e.startsWith('port')
  497. }) || ''
  498. var sn = vars.find(e => {
  499. return e.startsWith('sn')
  500. }) || ''
  501. var demoTime = vars.find(e => {
  502. return e.startsWith('demoTime')
  503. }) || ''
  504. var id = vars.find(e => {
  505. return e.startsWith('id')
  506. }) || ''
  507. data.clientType = clientType.substring(11, clientType.length)
  508. data.cardIp = cardIp.substring(7, cardIp.length)
  509. data.port = port.substring(5, port.length)
  510. data.sn = sn.substring(3, sn.length)
  511. data.demoTime = demoTime.substring(9, demoTime.length)
  512. data.id = id.substring(3, id.length)
  513. } else if (data.clientType == 2) { //分享屏幕
  514. console.log("走到分享屏幕里面啦==========", data.clientTypes);
  515. $(".leftmains").css({
  516. "right": "-4rem"
  517. })
  518. $('.leftmains').hide()
  519. $('.bottommains').hide()
  520. $('#btnMuted').hide()
  521. let ip = vars.find(e => {
  522. return e.startsWith('ip')
  523. }) || ''
  524. var username = vars.find(e => {
  525. return e.startsWith('username')
  526. }) || ''
  527. var id = vars.find(e => {
  528. return e.startsWith('id')
  529. }) || ''
  530. var userCardId = vars.find(e => {
  531. return e.startsWith('userCardId')
  532. }) || ''
  533. data.id = id.substring(3, id.length)
  534. data.username = username.substring(9, username.length)
  535. data.ip = ip.substring(3, ip.length)
  536. data.userCardId = userCardId.substring(11, userCardId.length)
  537. } else {
  538. // $(".leftmains").css({
  539. // "right":"-4rem"
  540. // })
  541. // $('.leftmains').hide()
  542. // $('.bottommains').hide()
  543. // $('#btnMuted').hide()
  544. var username = vars.find(e => {
  545. return e.startsWith('username')
  546. }) || ''
  547. var userCardId = vars.find(e => {
  548. return e.startsWith('userCardId')
  549. }) || ''
  550. data.username = username.substring(9, username.length)
  551. data.userCardId = userCardId.substring(11, userCardId.length)
  552. console.log(data.ip)
  553. }
  554. // 心跳
  555. // var time = 1000 * 30;
  556. // var interval;
  557. // fun()
  558. //
  559. // function run() {
  560. //
  561. // interval = setInterval(fun, time);
  562. // }
  563. //
  564. // function fun() {
  565. // $.ajax({
  566. // url: baseUrl + "/api/game/v1/cloudGame/dev/get/cardSn",
  567. // data: {
  568. // sn: data.sn
  569. // },
  570. // type: 'get',
  571. // dataType: 'json',
  572. // success: function(data) {
  573. //
  574. // }
  575. // })
  576. //
  577. // };
  578. // run();
  579. // data.clientType=1
  580. // data.sn="RK3930C2301900044"
  581. // data.cardIp="14.215.128.96"
  582. // data.port=2044
  583. var orientation = 0 //0 竖屏,1横屏
  584. var winHeight = window.screen.height - window.innerHeight
  585. // var urlss = url[2]
  586. // var urlss='192.168.31.20'
  587. // var urlss = "14.215.128.96"
  588. var urlss = 'test.androidscloud.com'
  589. document.body.addEventListener('touchmove', function(e) {
  590. e.preventDefault()
  591. }, {
  592. passive: false
  593. })
  594. //
  595. // urlss = "14.215.128.96"
  596. // console.log()
  597. // data.clientType = 1
  598. // data.sn="RK3930C2301900044"
  599. // data.cardIp="14.215.128.96"
  600. // data.port=2044
  601. // if (data.clientType == 3) {
  602. // var players = AV.Player.fromWebSocket("wss://" + urlss + '/authVideoWebSocket?' + "clientType=" + data.clientType +
  603. // "&username=" + data.username + "&userCardId=" + data.userCardId);
  604. // } else if (data.clientType == 2) {
  605. // // var players = AV.Player.fromWebSocket("wss://" + urlss + '/shareWebSocket?' + "clientType=" + data.clientType +
  606. // // "&username=" + data.username + "&userCardId=" + data.userCardId + "&ip=" + data.ip);
  607. // var players = AV.Player.fromWebSocket(
  608. // "wss://test.androidscloud.com/videoWebSocket?clientType=1&cardIp=14.215.128.96&port=2005&sn=RK3930C2301900005");
  609. // } else {
  610. // var players = AV.Player.fromWebSocket("wss://" + urlss + '/videoWebSocket?' + "clientType=" + data.clientType +
  611. // "&cardIp=" + data.cardIp + "&port=" + data.port + "&sn=" + data.sn);
  612. // }
  613. // // debugger
  614. // var players = AV.Player.fromWebSocket('ws://14.215.128.96/authVideoWebSocket?clientType=3&username=WqXTc1593762177&userCardId=377');
  615. // players.play();
  616. // players.volume = 100
  617. //var players = AV.Player.fromWebSocket('ws://14.215.128.96/videoWebSocket?clientType=0&cardIp=30.30.30.58&port=9100&sn=RK3930C2301900060');
  618. var warid = {
  619. id: data.id,
  620. type: 1,
  621. sn: data.sn
  622. }
  623. //结束时间 type=2
  624. var warids = {
  625. id: data.id,
  626. type: 2,
  627. sn: data.sn
  628. }
  629. // $.ajax({})
  630. // 关闭浏览器
  631. // window.onbeforeunload = function() {}
  632. //撤销的array
  633. var cancelList = new Array();
  634. //撤销的次数
  635. var cancelIndex = 0;
  636. var inputType = 0 //输入类型 0:手写,1:键盘输入
  637. //判断是否ie
  638. var IE_HACK = (/msie/i.test(navigator.userAgent) &&
  639. !/opera/i.test(navigator.userAgent));
  640. // 云手机相关逻辑
  641. // var player = new Player({
  642. // size: {
  643. // width: 1280,
  644. // height: 720
  645. // }
  646. // });
  647. // var secanv = document.getElementById("wine");
  648. // secanv.appendChild(player.canvas);
  649. // console.log("player=========>>>>", player);
  650. // console.log("secanv>>>>", secanv);
  651. // &cardIp="+data.data.extranetIp+"&port="+data.data.extranetPort+"&sn="+data.data.sn
  652. $(function() {
  653. initCanvas();
  654. });
  655. //初始化
  656. var initCanvas = function() {
  657. }
  658. $("#voew").on("click", function() {})
  659. $("#box").on("click", function() {
  660. // draw_graph('pencil', this)
  661. })
  662. console.log(player)
  663. $('#mocan').on('click', function() {
  664. draw_graph('pencil', this)
  665. })
  666. // //初始化一下就可以了,
  667. let vConsole = new VConsole();
  668. // //你打印的数据 比如
  669. console.log('test');
  670. //就可像小程序一样的看了和调试了。
  671. $('.no-ne-an').on('click', function() {
  672. //结束时间 type=2
  673. let warids = {
  674. id: data.id,
  675. type: 2,
  676. sn: data.sn
  677. }
  678. $.ajax({
  679. url: baseUrl + "/api/game/v1/cloudGame/dev/getSn",
  680. data: warid,
  681. type: 'get',
  682. dataType: 'json',
  683. success: function(data) {
  684. history.go(-1)
  685. if (data.status == 0) {
  686. } else {
  687. alert(data.msg)
  688. }
  689. //
  690. }
  691. })
  692. })
  693. var btnMuted = document.querySelector("#btnMuted");
  694. btnMuted && (function() {
  695. var setHistory = function(left, top) {
  696. try {
  697. localStorage.setItem("muted-btn-loc", JSON.stringify({
  698. left: left,
  699. top: top
  700. }));
  701. } catch (ex) {}
  702. };
  703. var getHistory = function() {
  704. try {
  705. var value = localStorage.getItem("muted-btn-loc");
  706. if (!value) return null;
  707. value = JSON.parse(value);
  708. if (!value) return null;
  709. return value;
  710. } catch (ex) {
  711. return null
  712. }
  713. };
  714. var fixLoc = function(loc) {
  715. var rect = btnMuted.getBoundingClientRect();
  716. rect = {
  717. top: rect.top,
  718. left: rect.left,
  719. width: rect.width,
  720. height: rect.height
  721. }; //部分低版本浏览器,该属性为只读
  722. if (loc) {
  723. rect.left = loc.left;
  724. rect.top = loc.top;
  725. }
  726. var minX = 0;
  727. var minY = 0;
  728. var docRect = document.documentElement.getBoundingClientRect();
  729. var maxY = docRect.height - rect.height;
  730. var maxX = docRect.width - rect.width;
  731. var left = rect.left;
  732. var top = rect.top;
  733. left = Math.min(left, maxX);
  734. left = Math.max(left, minX);
  735. top = Math.min(top, maxY);
  736. top = Math.max(top, minY);
  737. console.log(rect.top, top, loc);
  738. if (loc || top !== rect.top || left !== rect.left) {
  739. btnMuted.style.cssText += "left:" + left + "px;top:" + top + "px;";
  740. }
  741. }
  742. window.addEventListener("resize", function() {
  743. fixLoc();
  744. });
  745. var touchPoint = {
  746. pageY: 0,
  747. pageX: 0
  748. };
  749. var currentLoc = {
  750. top: 0,
  751. left: 0,
  752. curTop: 0,
  753. curLeft: 0
  754. };
  755. var toMove = false;
  756. var touchmove = function(e) {
  757. e.preventDefault();
  758. var point = e.changedTouches[0];
  759. var top = -touchPoint.pageY + point.pageY;
  760. var left = -touchPoint.pageX + point.pageX;
  761. if (toMove) {
  762. top += currentLoc.top;
  763. left += currentLoc.left;
  764. currentLoc.curLeft = left;
  765. currentLoc.curTop = top;
  766. btnMuted.style.cssText += "left:" + left + "px;top:" + top + "px;";
  767. } else {
  768. if (Math.abs(top) >= 5 || Math.abs(left) >= 5) {
  769. toMove = true;
  770. }
  771. }
  772. };
  773. var touchend = function() {
  774. window.removeEventListener("touchmove", touchmove, {
  775. passive: false
  776. });
  777. window.removeEventListener("touchend", touchend, {
  778. passive: false
  779. });
  780. if (toMove) {
  781. setHistory(currentLoc.curLeft, currentLoc.curTop);
  782. fixLoc();
  783. } else {
  784. //按点击处理
  785. var set = $('.control-right-img').attr("data-id")
  786. if (set == '1') {
  787. $('.control-right-img').attr({
  788. "data-id": "2"
  789. })
  790. // $('.control-right-img').find('img').attr({
  791. // "src": "../static/img/musicturn.png"
  792. // })
  793. // players.volume = 100
  794. $(".leftmains").css({
  795. "right": "-4rem"
  796. })
  797. // console.log(players)
  798. // players.play();
  799. } else {
  800. $('.control-right-img').attr({
  801. "data-id": "1"
  802. })
  803. $(".leftmains").css({
  804. "right": "0rem"
  805. })
  806. // $('.control-right-img').find('img').attr({
  807. // "src": "../static/img/musicfalse.png"
  808. // })
  809. // players.volume = 0
  810. // players.off('pause');
  811. // players.pause();
  812. // var embed = document.embedPlay;
  813. // console.log(players, "fdsfdsf")
  814. }
  815. }
  816. }
  817. btnMuted.addEventListener("touchstart", function(e) {
  818. e.preventDefault();
  819. toMove = false;
  820. var point = e.changedTouches[0];
  821. touchPoint.pageX = point.pageX;
  822. touchPoint.pageY = point.pageY;
  823. var rect = e.target.getBoundingClientRect();
  824. currentLoc.top = rect.top;
  825. currentLoc.left = rect.left;
  826. window.addEventListener("touchmove", touchmove, {
  827. passive: false
  828. });
  829. window.addEventListener("touchend", touchend, {
  830. passive: false
  831. });
  832. }, {
  833. passive: false
  834. });
  835. var history = getHistory();
  836. if (history) {
  837. fixLoc(history);
  838. }
  839. btnMuted.classList.remove("hide");
  840. })();
  841. $(".boximg").on("click", function() {
  842. $(".mainbox").css({
  843. "display": "none"
  844. })
  845. })
  846. // 剪切板
  847. $(".sboxbu").on("click", function() {
  848. $(".sbox").css({
  849. "display": "none"
  850. })
  851. })
  852. // 剪切板
  853. $(".uploadss").on("click", function() {
  854. $(".sbox").css({
  855. "display": "none"
  856. })
  857. })
  858. $("#upload").on("click", function() {
  859. wx.miniProgram.switchTab({
  860. url: '/pages/home/home'
  861. })
  862. })
  863. function selectText(x) {
  864. if (document.selection) {
  865. var range = document.body.createTextRange();
  866. range.moveToElementText(x);
  867. range.select();
  868. } else if (window.getSelection) {
  869. var selection = window.getSelection();
  870. var range = document.createRange();
  871. selection.removeAllRanges();
  872. range.selectNodeContents(x);
  873. selection.addRange(range);
  874. }
  875. }
  876. function cp(x) {
  877. $(".mainbox").css({
  878. "display": "none"
  879. })
  880. $(".sbox").css({
  881. "display": "block"
  882. })
  883. selectText(x);
  884. document.execCommand("copy");
  885. }
  886. </script>
  887. <script type="text/javascript" src="jmuxer.js"></script>
  888. <script type="text/text/javascript" src="aac.js"></script>
  889. </body>
  890. </html>