WXtrialInterface.html 21 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793
  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="x5-orientation" content="portrait" />
  8. <meta name="screen-orientation" content="portrait" />
  9. <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
  10. <meta name="apple-mobile-web-app-capable" content="yes">
  11. <!-- 删除苹果默认的工具栏和菜单栏 -->
  12. <meta name="apple-mobile-web-app-status-bar-style" content="black">
  13. <!-- 设置苹果工具栏颜? -->
  14. <meta name="format-detection" content="telphone=no, email=no">
  15. <!-- 忽略页面中的数字识别为电话,忽略email识别 -->
  16. <!-- 启用360浏览器的极速模?(webkit) -->
  17. <meta name="renderer" content="webkit">
  18. <!-- 针对手持设备优化,主要是针对一些老的不识别viewport的浏览器,比如黑? -->
  19. <meta name="HandheldFriendly" content="true">
  20. <!-- 微软的老式浏览? -->
  21. <meta name="MobileOptimized" content="320">
  22. <!-- 不能旋转,问题出在这 -->
  23. <!-- UC强制全屏 -->
  24. <meta name="full-screen" content="yes">
  25. <!-- QQ强制全屏 -->
  26. <meta name="x5-fullscreen" content="true">
  27. <!-- UC应用模式 -->
  28. <meta name="browsermode" content="application">
  29. <!-- QQ应用模式 -->
  30. <meta name="x5-page-mode" content="app">
  31. <!-- windows phone 点击无高? -->
  32. <meta name="msapplication-tap-highlight" content="no">
  33. <link rel="stylesheet" type="text/css" href="css/WXtrialInterface.css" />
  34. <link rel="stylesheet" href="https://cdn.bootcss.com/weui/1.1.3/style/weui.min.css" />
  35. <link rel="stylesheet" href="https://cdn.bootcss.com/jquery-weui/1.2.1/css/jquery-weui.min.css" />
  36. </head>
  37. <body class="scroll h-player" style="overscroll-behavior: contain;">
  38. <div class="container" id="player">
  39. <div class="muted" id="btnMuted">
  40. <div class="control-right-img" data-id="1">
  41. <img src="../static/img/xuanfu_icon.png">
  42. </div>
  43. </div>
  44. <div id="wine">
  45. <video id="playerVideo" muted="muted" x5-video-orientation="landscape" playsinline="true" autoplay="true"
  46. webkit-playsinline="true" x5-playsinline="true" x5-video-player-type="h5" x5-video-player-fullscreen="false"
  47. style="pointer-events: none;object-fit: fill;width: 100%;height:100%"></video>
  48. <div id="box"></div>
  49. <audio preload="auto" autoplay controls poster="images/loader-thumb.jpg" id="audioPlayer"
  50. style="position: absolute;top: 0;width: 0;height: 0;"></audio>
  51. </div>
  52. <div class="leftmains">
  53. <div class="PictureQualityMain">
  54. <div class="PictureQuality " data-id="1803000">高清</div>
  55. <div class="PictureQuality avit" data-id="1243000">标清</div>
  56. <div class="PictureQuality" data-id="400000">极速</div>
  57. <div class="PictureQuality" data-id="200">自动</div>
  58. </div>
  59. <div class="operation">
  60. <div class="upload" id="showsuss" data-text="uploads">
  61. <img src="../static/img/wx/shangchuan_icon.png">
  62. <div>上传</div>
  63. </div>
  64. <div class="upload" onclick="showShearPlate()" data-text="Shearplate">
  65. <img src="../static/img/wx/jianqieban_icon.png">
  66. <div>剪贴板</div>
  67. </div>
  68. <div class="upload" id="upload" data-text="Signout">
  69. <img src="../static/img/wx/tuichu_icon.png">
  70. <div>退出</div>
  71. </div>
  72. </div>
  73. </div>
  74. <div class="bottommains">
  75. <div class="botmat1">
  76. <div class="botmat1img" data-text="gengduo">
  77. <img src="../static/img/wx/gengduo_icon.png">
  78. </div>
  79. </div>
  80. <div class="botmat1">
  81. <div class="botmat1img" data-text="home">
  82. <img src="../static/img/wx/home_icon.png">
  83. </div>
  84. </div>
  85. <div class="botmat1">
  86. <div class="botmat1img" data-text="return">
  87. <img src="../static/img/wx/fanhui_icon.png">
  88. </div>
  89. </div>
  90. </div>
  91. <div class="loading"></div>
  92. </div>
  93. <div class="mask">
  94. <div class="box-shear-plate"></div>
  95. <img class="close" onclick="handleClose()" src="img/guanbi_icon@2x.png" alt="">
  96. </div>
  97. <div class="weui-mask_transparent"></div>
  98. <div class="weui-toast weui_loading_toast weui-toast--visible">
  99. <div class="weui_loading"><i class="weui-loading weui-icon_toast"></i></div>
  100. <p class="weui-toast_content">数据加载中</p>
  101. </div>
  102. <body oncontextmenu="Back()">
  103. </body>
  104. <script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>
  105. <script type="text/javascript" src="../static/js/jquery-1.11.0.min.js"></script>
  106. <script type="text/javascript" src="helper.js"></script>
  107. <script type="text/javascript" src="pcm-player.js"></script>
  108. <script type="text/javascript" src="https://cdn.bootcss.com/vConsole/3.2.0/vconsole.min.js"></script>
  109. <script src="https://cdn.bootcss.com/jquery-weui/1.2.1/js/jquery-weui.min.js"></script>
  110. <script type="text/javascript" src="WXdraw.js?v=110"></script>
  111. <script type="text/javascript" src="jmuxer.js"></script>
  112. <script>
  113. var isAudioPlay = false;
  114. $.alert({
  115. title: '提示',
  116. text: '开始使用云手机',
  117. onOK: function () {
  118. var video = document.getElementById("playerVideo");
  119. video.play();
  120. isAudioPlay = true;
  121. $('.weui-mask_transparent').hide();
  122. $('.weui-toast').hide();
  123. $('.loading').hide();
  124. }
  125. });
  126. var topwinHeight = window.screen.height - window.innerHeight + 30; //计算title top 头部
  127. $('#wine').css({
  128. "width": window.screen.width,
  129. "height": window.screen.height - topwinHeight - 20,
  130. "position": "absolute"
  131. });
  132. $('.loading').css({
  133. "width": window.screen.width,
  134. "height": window.screen.height - topwinHeight - 20
  135. });
  136. var winese = document.createElement("wine");
  137. wine.style.top = "-" + winese + 'px';
  138. var requestCount = 0;
  139. var isVisuable = true;
  140. var isFeed = true;
  141. var isDrag = false;
  142. var isEnough = true;
  143. var isFinish = false;
  144. var delayTime = new Date().getTime();
  145. var curTime = new Date().getTime();
  146. var myVideo = document.getElementById("playerVideo");
  147. Module = {};
  148. Module.onRuntimeInitialized = function () {
  149. isFinish = true;
  150. }
  151. var isWSS = true;
  152. var parameters = GetRequest();
  153. var ip = parameters["ip"];
  154. var domainName = parameters["domainName"];
  155. // var socketURL = isWSS ? "wss://" + domainName + "/card?cardIp=" + ip : "ws://" + domainName + "/card?cardIp=" + ip;
  156. var socketURL = "ws://192.168.199.46:9100";
  157. var jmuxer = new JMuxer({
  158. node: 'playerVideo',
  159. flushingTime: 15,
  160. fps: 30,
  161. mode: 'video',
  162. debug: false
  163. });
  164. window.onload = function () {
  165. curTime = new Date().getTime();
  166. var myPlay = document.getElementById("wine");
  167. myPlay.onkeydown = function (event) {
  168. ExexuteKeyDown(e.keyCode);
  169. }
  170. }
  171. var ws, errorTime = 0;
  172. doConnect();
  173. // 节流
  174. // 设置一个标志
  175. function throttle(fn, delay) {
  176. let flag = true;
  177. errorTime += delay;
  178. return () => {
  179. if (!flag) return;
  180. flag = false;
  181. timer = setTimeout(() => {
  182. fn();
  183. flag = true;
  184. }, delay);
  185. };
  186. }
  187. function doConnect() {
  188. ws = new WebSocket(socketURL);
  189. ws.binaryType = 'arraybuffer';
  190. ws.onclose = function (e) {
  191. ws.close();
  192. throttle(doConnect, 100);
  193. if (errorTime > 1000) {
  194. wx.miniProgram.switchTab({
  195. url: '/pages/home/home'
  196. })
  197. }
  198. }
  199. ws.addEventListener('open', function (event) {
  200. ws.send(ConfigChannel("RK3923C1201900139"));
  201. var checkBuffer = GetScreenState();
  202. ws.send(checkBuffer);
  203. });
  204. ws.addEventListener('error', function (event) {
  205. ws.close();
  206. throttle(doConnect, 100);
  207. if (errorTime > 1000) {
  208. wx.miniProgram.switchTab({
  209. url: '/pages/home/home'
  210. })
  211. }
  212. });
  213. ws.addEventListener('message', function (event) {
  214. var data = ParseProto(event.data); //JAVA服务器转发
  215. var input = new Uint8Array(event.data);
  216. if (data.audio != null && isAudioPlay) { //喂音频
  217. if (input[0] == 0xff) {
  218. if (isFinish) {
  219. decodeAAC(input);
  220. }
  221. }
  222. }
  223. if (data.video != null) { //喂视频
  224. if (isFeed) {
  225. jmuxer.feed(data);
  226. }
  227. }
  228. });
  229. }
  230. document.addEventListener("visibilitychange", function () {
  231. if (document.visibilityState == "visible") {
  232. var buffer = RequestIFrame();
  233. ws.send(buffer);
  234. isVisuable = true;
  235. } else {
  236. isVisuable = false;
  237. isFeed = false;
  238. myVideo.pause();
  239. }
  240. });
  241. myVideo.addEventListener('pause', function () {
  242. isFeed = false;
  243. });
  244. var decodeCount = 1;
  245. var player = new PCMPlayer({
  246. encoding: '16bitInt',
  247. channels: 2,
  248. sampleRate: 44100,
  249. flushingTime: 22,
  250. debug: false
  251. });
  252. function handleClose() {
  253. document.body.addEventListener('touchmove', function (e) {
  254. e.preventDefault()
  255. }, {
  256. passive: false
  257. })
  258. $('.mask').hide();
  259. }
  260. function decodeAAC(data) {
  261. var retPtr = Module._malloc(4 * 5 * 1024); // 接收的数据
  262. var inputPtr = Module._malloc(4 * data.length); // 输入数据
  263. for (var i = 0; i < data.length; i++) {
  264. Module.HEAPU8[(inputPtr) + i] = data[i]; //转换为堆数据
  265. }
  266. var pcmLen = Module._feedData(retPtr, inputPtr, data.length);
  267. if (pcmLen >= 0) {
  268. var pcmData = new Uint8Array(pcmLen);
  269. for (var i = 0; i < pcmLen; i++) {
  270. pcmData[i] = Module.HEAPU8[(retPtr) + i]
  271. }
  272. player.feed(pcmData);
  273. }
  274. decodeCount++;
  275. Module._free(inputPtr);
  276. Module._free(retPtr);
  277. }
  278. //解协议
  279. function ParseProto(data) {
  280. var input = new Uint8Array(data),
  281. duration,
  282. video,
  283. audio;
  284. if (input[0] == 0 && input[1] == 0 && input[2] == 0 && input[3] == 1) {
  285. video = input;
  286. duration = 24;
  287. var nalType = input[4] & 0x1f;
  288. if (!isFeed) {
  289. if (nalType == 0x05 && isVisuable) {
  290. isFeed = true;
  291. }
  292. }
  293. } else if (input[0] == 0xff) {
  294. if (!isEnough) {
  295. requestCount++;
  296. }
  297. audio = input;
  298. if (new Date().getTime() - curTime > 100) {
  299. delayTime = new Date().getTime();
  300. }
  301. curTime = new Date().getTime();
  302. duration = 24;
  303. } else if (input[0] == 0x68) {
  304. if (input[23] == 0x05) { //横竖屏标识
  305. var state = CheckScreenDirection(input.slice(24, 24 + 8));
  306. if (state == 1) {
  307. console.log("安卓卡此时竖屏");
  308. //竖屏处理
  309. resolving = 1;
  310. } else {
  311. console.log("安卓卡此时横屏");
  312. //横屏处理
  313. resolving = 0;
  314. }
  315. }
  316. if (input[23] == 0x0b) {
  317. console.log("多端登陆");
  318. }
  319. }
  320. return {
  321. audio: audio,
  322. video: video,
  323. duration: duration
  324. };
  325. }
  326. function GetRequest() {
  327. var url = location.search; // 获取url中"?"符后的字串
  328. var obj = new Object();
  329. if (url.indexOf("?") != -1) {
  330. var str = url.substr(1);
  331. strs = str.split("&");
  332. for (var i = 0; i < strs.length; i++) {
  333. obj[strs[i].split("=")[0]] = (strs[i].split("=")[1]);
  334. }
  335. }
  336. return obj;
  337. }
  338. function Back() {
  339. ExexuteKeyDown(4);
  340. window.event.returnValue = false;
  341. return false;
  342. }
  343. var url = window.location.href;
  344. url = url.split('/');
  345. // var baseUrl = url[0] + '//' + url[2];
  346. var baseUrl = 'http://per.cs.se.androidscloud.com';
  347. var form = {};
  348. $.ajax({
  349. url: baseUrl + "/api/user/v1/config/download/isShow",
  350. data: {},
  351. type: 'get',
  352. dataType: 'json',
  353. success: function (data) {
  354. if (data.data) {
  355. $("#showsuss").show()
  356. } else {
  357. $("#showsuss").hide()
  358. }
  359. }
  360. })
  361. form.clientType = parameters['clientType'];
  362. form.diskName = parameters['diskName'];
  363. if (form.clientType == 1) {
  364. form.cardIp = parameters['cardIp'];
  365. form.port = parameters['port'];
  366. form.sn = parameters['sn'];
  367. form.demoTime = parameters['demoTime'];
  368. form.id = parameters['id'];
  369. } else if (form.clientType == 2) { //分享屏幕
  370. $(".leftmains").css({
  371. "right": "-4rem"
  372. })
  373. $('.leftmains').hide()
  374. $('.bottommains').hide()
  375. $('#btnMuted').hide()
  376. form.id = parameters['id'];
  377. form.ip = parameters['ip'];
  378. form.userCardId = parameters['userCardId'];
  379. } else {
  380. form.id = parameters['id'];
  381. form.userCardId = parameters['userCardId'];
  382. }
  383. var cutList = [];
  384. function showShearPlate() {
  385. $('.box-shear-plate').empty();
  386. $.ajax({
  387. url: baseUrl + "/api/user/v1/shear/content",
  388. data: {},
  389. headers: {
  390. 'Authorization': form.id //id
  391. },
  392. type: 'get',
  393. dataType: 'json',
  394. success: function (res) {
  395. if (res.status === 0) {
  396. if (res.data.length) {
  397. cutList = res.data
  398. var str = '<div class="title">剪贴板<div onclick="handleClear()" class="btn-clear">清空</div></div><div class="slide-wrapper-content">'
  399. res.data.forEach(function (item) {
  400. str += "<div class='slide-wrapper'><div class='slide-scroll animate-slide-start'><div class='slide-content'><div onclick='handleCopy(\"" + item.content + "\")'>" + item.content + "</div></div><div class='slide-content-button'><button onclick='handleDelete(" + item.id + ")'>删除</button></div></div></div>"
  401. })
  402. str += '</div>'
  403. $('.box-shear-plate').append(str);
  404. } else {
  405. $('.box-shear-plate').append('<img class="empty" src="img/jianqieban_pic@2x.png" alt="" /><div class="empty-txt">剪贴板为空</div>')
  406. }
  407. $('.mask').show();
  408. initSlider();
  409. } else {
  410. $('.box-shear-plate').append('<img class="empty" src="img/jianqieban_pic@2x.png" alt="" /><div class="empty-txt">剪贴板为空</div>')
  411. $('.mask').show();
  412. }
  413. }
  414. })
  415. }
  416. // 清空剪贴板
  417. function handleClear() {
  418. var ids = '';
  419. cutList.forEach(function (item) {
  420. ids += 'ids=' + item.id + '&'
  421. });
  422. ids = ids.substring(0, ids.lastIndexOf('&'));
  423. $.confirm("确定清空剪贴板?", function () {
  424. $.ajax({
  425. url: baseUrl + "/api/user/v1/shear/content?" + ids,
  426. headers: {
  427. 'Authorization': form.id //id
  428. },
  429. type: 'DELETE',
  430. dataType: 'json',
  431. success: function (res) {
  432. if (res.status === 0) {
  433. showShearPlate();
  434. } else {
  435. $.toast(res.msg, "text");
  436. }
  437. }
  438. })
  439. });
  440. }
  441. function handleCopy(content) {
  442. $.ajax({
  443. url: baseUrl + "/api/wsi/v1/config/cut",
  444. data: JSON.stringify({
  445. str: content,
  446. sn: form.sn
  447. }),
  448. headers: {
  449. 'Authorization': form.id //id
  450. },
  451. contentType: "application/json;charset=UTF-8",
  452. type: 'post',
  453. dataType: 'json',
  454. success: function (res) {
  455. if (res.status === 0) {
  456. $.toast('复制成功', "text");
  457. } else {
  458. $.toast(res.msg, "text");
  459. }
  460. }
  461. })
  462. }
  463. // 删除剪贴板
  464. function handleDelete(id) {
  465. $.ajax({
  466. url: baseUrl + "/api/user/v1/shear/content?ids=" + id,
  467. headers: {
  468. 'Authorization': form.id //id
  469. },
  470. type: 'DELETE',
  471. dataType: 'json',
  472. success: function (res) {
  473. if (res.status === 0) {
  474. showShearPlate();
  475. } else {
  476. $.toast(res.msg, "text");
  477. }
  478. }
  479. })
  480. }
  481. function initSlider() {
  482. //手指滑动多少距离就认为是滑成功
  483. //这个值不能太大,否则影响斜着滑动时,垂直滑动的流畅性,也不能太小,太灵敏也不好
  484. var diffXDistance = 50;
  485. //当前滑动的对象
  486. var currentObject;
  487. //上一次滑动的对象
  488. var lastObject;
  489. //是否可以左右滑动,在上下滑的时候禁止左右滑
  490. var canSlide = true;
  491. //用于记录按下的点
  492. var startPoint;
  493. $(".slide-content").css({
  494. width: $(".slide-wrapper").width()
  495. });
  496. document.body.removeEventListener('touchmove', function (e) {
  497. e.preventDefault()
  498. }, {
  499. passive: false
  500. })
  501. $(".slide-scroll").css({
  502. width: $(".slide-wrapper").width() + $(".slide-content-button").width()
  503. })
  504. .on('touchstart', function (e) {
  505. currentObject = this;
  506. startPoint = {
  507. x: e.originalEvent.changedTouches[0].pageX,
  508. y: e.originalEvent.changedTouches[0].pageY
  509. };
  510. })
  511. .on('touchmove', function (e) {
  512. //如果是左右滑动,就禁止上下的滑动
  513. //如果是上下的滑动,就禁止左右滑动
  514. if (Math.abs(e.originalEvent.changedTouches[0].pageX - startPoint.x) > Math.abs(e.originalEvent.changedTouches[0].pageY - startPoint.y)) {
  515. event.preventDefault();
  516. } else {
  517. canSlide = false;
  518. }
  519. })
  520. .on('touchend', function (e) {
  521. //如果是上下滑动,这里就直接返回了
  522. if (!canSlide) {
  523. canSlide = true;
  524. return true;
  525. }
  526. //点击除当前左滑对象之外的任意其他位置
  527. if (lastObject && currentObject != lastObject) {
  528. //右滑→
  529. $(lastObject).removeClass("animate-slide");
  530. //清空上一个左滑的对象
  531. lastObject = undefined;
  532. }
  533. var diffX = e.originalEvent.changedTouches[0].pageX - startPoint.x;
  534. if (diffX < -diffXDistance) {
  535. //左滑←
  536. $(currentObject).addClass("animate-slide");
  537. if (lastObject && lastObject != currentObject) {
  538. //右滑→
  539. $(lastObject).removeClass("animate-slide");
  540. }
  541. //记录上一个左滑的对象
  542. lastObject = currentObject;
  543. } else if (diffX >= diffXDistance) {
  544. if (currentObject == lastObject) {
  545. //右滑→
  546. $(currentObject).removeClass("animate-slide");
  547. //清空上一个左滑的对象
  548. lastObject = undefined;
  549. }
  550. }
  551. });
  552. }
  553. var orientation = 0; //0 竖屏,1横屏
  554. // document.body.addEventListener('touchmove', function (e) {
  555. // e.preventDefault()
  556. // }, {
  557. // passive: false
  558. // })
  559. // //初始化一下就可以了
  560. // var vConsole = new VConsole();
  561. var btnMuted = document.querySelector("#btnMuted");
  562. btnMuted && (function () {
  563. var setHistory = function (left, top) {
  564. try {
  565. localStorage.setItem("muted-btn-loc", JSON.stringify({
  566. left: left,
  567. top: top
  568. }));
  569. } catch (ex) { }
  570. };
  571. var getHistory = function () {
  572. try {
  573. var value = localStorage.getItem("muted-btn-loc");
  574. if (!value) return null;
  575. value = JSON.parse(value);
  576. if (!value) return null;
  577. return value;
  578. } catch (ex) {
  579. return null
  580. }
  581. };
  582. var fixLoc = function (loc) {
  583. var rect = btnMuted.getBoundingClientRect();
  584. rect = {
  585. top: rect.top,
  586. left: rect.left,
  587. width: rect.width,
  588. height: rect.height
  589. }; //部分低版本浏览器,该属性为只读
  590. if (loc) {
  591. rect.left = loc.left;
  592. rect.top = loc.top;
  593. }
  594. var minX = 0;
  595. var minY = 0;
  596. var docRect = document.documentElement.getBoundingClientRect();
  597. var maxY = docRect.height - rect.height;
  598. var maxX = docRect.width - rect.width;
  599. var left = rect.left;
  600. var top = rect.top;
  601. left = Math.min(left, maxX);
  602. left = Math.max(left, minX);
  603. top = Math.min(top, maxY);
  604. top = Math.max(top, minY);
  605. if (loc || top !== rect.top || left !== rect.left) {
  606. btnMuted.style.cssText += "left:" + left + "px;top:" + top + "px;";
  607. }
  608. }
  609. window.addEventListener("resize", function () {
  610. fixLoc();
  611. });
  612. var touchPoint = {
  613. pageY: 0,
  614. pageX: 0
  615. };
  616. var currentLoc = {
  617. top: 0,
  618. left: 0,
  619. curTop: 0,
  620. curLeft: 0
  621. };
  622. var toMove = false;
  623. var touchmove = function (e) {
  624. e.preventDefault();
  625. var point = e.changedTouches[0];
  626. var top = -touchPoint.pageY + point.pageY;
  627. var left = -touchPoint.pageX + point.pageX;
  628. if (toMove) {
  629. top += currentLoc.top;
  630. left += currentLoc.left;
  631. currentLoc.curLeft = left;
  632. currentLoc.curTop = top;
  633. btnMuted.style.cssText += "left:" + left + "px;top:" + top + "px;";
  634. } else {
  635. if (Math.abs(top) >= 5 || Math.abs(left) >= 5) {
  636. toMove = true;
  637. }
  638. }
  639. };
  640. var touchend = function () {
  641. window.removeEventListener("touchmove", touchmove, {
  642. passive: false
  643. });
  644. window.removeEventListener("touchend", touchend, {
  645. passive: false
  646. });
  647. if (toMove) {
  648. setHistory(currentLoc.curLeft, currentLoc.curTop);
  649. fixLoc();
  650. } else {
  651. //按点击处理
  652. var set = $('.control-right-img').attr("data-id")
  653. if (set == '1') {
  654. $('.control-right-img').attr({
  655. "data-id": "2"
  656. })
  657. $(".leftmains").css({
  658. "right": "0rem"
  659. })
  660. } else {
  661. $('.control-right-img').attr({
  662. "data-id": "1"
  663. })
  664. $(".leftmains").css({
  665. "right": "-4rem"
  666. })
  667. }
  668. }
  669. }
  670. btnMuted.addEventListener("touchstart", function (e) {
  671. e.preventDefault();
  672. toMove = false;
  673. var point = e.changedTouches[0];
  674. touchPoint.pageX = point.pageX;
  675. touchPoint.pageY = point.pageY;
  676. var rect = e.target.getBoundingClientRect();
  677. currentLoc.top = rect.top;
  678. currentLoc.left = rect.left;
  679. window.addEventListener("touchmove", touchmove, {
  680. passive: false
  681. });
  682. window.addEventListener("touchend", touchend, {
  683. passive: false
  684. });
  685. }, {
  686. passive: false
  687. });
  688. var history = getHistory();
  689. if (history) {
  690. fixLoc(history);
  691. }
  692. btnMuted.classList.remove("hide");
  693. })();
  694. $(".boximg").on("click", function () {
  695. $(".mainbox").css({
  696. "display": "none"
  697. })
  698. })
  699. // 剪贴板
  700. $(".sboxbu").on("click", function () {
  701. $(".sbox").css({
  702. "display": "none"
  703. })
  704. })
  705. // 剪贴板
  706. $(".uploadss").on("click", function () {
  707. $(".sbox").css({
  708. "display": "none"
  709. })
  710. })
  711. $("#upload").on("click", function () {
  712. wx.miniProgram.switchTab({
  713. url: '/pages/home/home'
  714. })
  715. })
  716. function selectText(x) {
  717. if (document.selection) {
  718. var range = document.body.createTextRange();
  719. range.moveToElementText(x);
  720. range.select();
  721. } else if (window.getSelection) {
  722. var selection = window.getSelection();
  723. var range = document.createRange();
  724. selection.removeAllRanges();
  725. range.selectNodeContents(x);
  726. selection.addRange(range);
  727. }
  728. }
  729. function cp(x) {
  730. $(".mainbox").css({
  731. "display": "none"
  732. })
  733. $(".sbox").css({
  734. "display": "block"
  735. })
  736. selectText(x);
  737. document.execCommand("copy");
  738. }
  739. </script>
  740. <script type="text/javascript" src="aac.js"></script>
  741. </body>
  742. </html>