WXtrialInterface.html 29 KB

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