WXtrialInterface.html 28 KB

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