WXtrialInterface.html 48 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8" />
  5. <title>双子星云手机</title>
  6. <meta name="x5-orientation" content="portrait" />
  7. <meta name="screen-orientation" content="portrait" />
  8. <meta name="apple-mobile-web-app-capable" content="yes" />
  9. <meta
  10. name="viewport"
  11. content="width=device-width, initial-scale=1, user-scalable=no"
  12. />
  13. <!-- 删除苹果默认的工具栏和菜单栏 -->
  14. <meta name="apple-mobile-web-app-status-bar-style" content="black" />
  15. <!-- 设置苹果工具栏颜 -->
  16. <meta name="format-detection" content="telphone=no, email=no" />
  17. <!-- 忽略页面中的数字识别为电话,忽略email识别 -->
  18. <!-- 启用360浏览器的极速模(webkit) -->
  19. <meta name="renderer" content="webkit" />
  20. <!-- 避免IE使用兼容模式 -->
  21. <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  22. <!-- 针对手持设备优化,主要是针对一些老的不识别viewport的浏览器,比如黑 -->
  23. <meta name="HandheldFriendly" content="true" />
  24. <!-- 微软的老式浏览 -->
  25. <meta name="MobileOptimized" content="320" />
  26. <!-- 不能旋转,问题出在这 -->
  27. <!-- UC强制全屏 -->
  28. <meta name="full-screen" content="yes" />
  29. <!-- QQ强制全屏 -->
  30. <meta name="x5-fullscreen" content="true" />
  31. <!-- UC应用模式 -->
  32. <meta name="browsermode" content="application" />
  33. <!-- QQ应用模式 -->
  34. <meta name="x5-page-mode" content="app" />
  35. <!-- windows phone 点击无高 -->
  36. <meta name="msapplication-tap-highlight" content="no" />
  37. <link rel="stylesheet" type="text/css" href="css/WXtrialInterface.css" />
  38. <link
  39. rel="stylesheet"
  40. href="https://cdn.bootcss.com/weui/1.1.3/style/weui.min.css"
  41. />
  42. <link
  43. rel="stylesheet"
  44. href="https://cdn.bootcss.com/jquery-weui/1.2.1/css/jquery-weui.min.css"
  45. />
  46. <!-- <link rel="stylesheet" href="../static/lib/swiper/swiper-bundle.min.css" />
  47. <script src="../static/lib/swiper/swiper-bundle.js"></script> -->
  48. <script src="../static/lib/doT-1.1.3/doT.min.js"></script>
  49. </head>
  50. <body class="scroll h-player" style="overscroll-behavior: contain">
  51. <template id="template-phone-size-item">
  52. {{~ it.list :value:index }}
  53. <div
  54. class="phone-size-item {{? value.width === it.active.width && value.height === it.active.height }}active{{?}}"
  55. data-width="{{= value.width }}"
  56. data-height="{{= value.height }}"
  57. >
  58. <span>{{= value.width }}x{{= value.height }}</span>
  59. </div>
  60. {{~}}
  61. </template>
  62. <div class="container" id="player">
  63. <div class="muted" id="btnMuted">
  64. <div class="control-right-img" data-id="1">
  65. <img src="../static/img/xuanfu_icon.png" />
  66. </div>
  67. </div>
  68. <div id="wine">
  69. <div id="box">
  70. <canvas id="playCanvas" width="450" height="800"></canvas>
  71. </div>
  72. </div>
  73. <div class="leftmains">
  74. <div class="PictureQualityMain">
  75. <div class="menu-btn PictureQuality" data-id="4">高清</div>
  76. <div class="menu-btn PictureQuality avit" data-id="3">标清</div>
  77. <div class="menu-btn PictureQuality" data-id="2">极速</div>
  78. </div>
  79. <div class="">
  80. <div class="menu-btn" id="open-set-phone-size-dialog-btn">
  81. <span>分辨率</span>
  82. </div>
  83. </div>
  84. <div class="operation">
  85. <div class="upload" id="showsuss" data-text="uploads">
  86. <img src="../static/img/wx/shangchuan_icon.png" />
  87. <div>上传</div>
  88. </div>
  89. <!-- <div class="upload" id="open-set-phone-size-dialog-btn">
  90. <img src="../static/img/wx/jianqieban_icon.png" />
  91. <div>分辨率</div>
  92. </div> -->
  93. <div class="upload" onclick="showShearPlate()" data-text="Shearplate">
  94. <img src="../static/img/wx/jianqieban_icon.png" />
  95. <div>剪贴板</div>
  96. </div>
  97. <div class="upload" id="upload" data-text="Signout">
  98. <img src="../static/img/wx/tuichu_icon.png" />
  99. <div>退出</div>
  100. </div>
  101. </div>
  102. </div>
  103. <div class="bottommains">
  104. <div class="botmat1">
  105. <div class="botmat1img" data-text="gengduo">
  106. <img src="../static/img/wx/gengduo_icon.png" />
  107. </div>
  108. </div>
  109. <div class="botmat1">
  110. <div class="botmat1img" data-text="home">
  111. <img src="../static/img/wx/home_icon.png" />
  112. </div>
  113. </div>
  114. <div class="botmat1">
  115. <div class="botmat1img" data-text="return">
  116. <img src="../static/img/wx/fanhui_icon.png" />
  117. </div>
  118. </div>
  119. </div>
  120. <img class="loading loading_sceen_pic" />
  121. </div>
  122. <div class="mask">
  123. <div class="box-shear-plate"></div>
  124. <img
  125. class="close"
  126. onclick="handleClose()"
  127. src="img/guanbi_icon@2x.png"
  128. alt=""
  129. />
  130. </div>
  131. <div class="weui-mask_transparent"></div>
  132. <div class="weui-toast weui_loading_toast weui-toast--visible">
  133. <div class="weui_loading">
  134. <i class="weui-loading weui-icon_toast"></i>
  135. </div>
  136. <p class="weui-toast_content">数据加载中</p>
  137. </div>
  138. <div class="try-use-wrap">
  139. <div class="try-use-container">
  140. <video
  141. width="100%"
  142. height="100%"
  143. id="source"
  144. autoplay="autoplay"
  145. loop="loop"
  146. webkit-playsinline="true"
  147. playsinline="true"
  148. x5-video-player-type="h5-page"
  149. >
  150. 您的浏览器不支持 video 标签。
  151. </video>
  152. <div class="time-close-wrap"><span class="time-node"></span> 关闭</div>
  153. </div>
  154. </div>
  155. <div class="buy-phone-wrap">
  156. <div class="bug-wrap">
  157. <div class="bug-title">获得极致体验服务请购买云手机</div>
  158. <div class="btn-list">
  159. <div class="btn cannel-btn">取消</div>
  160. <div class="btn go-bug">去购买</div>
  161. </div>
  162. </div>
  163. </div>
  164. <div class="look-wrap">
  165. <div class="bug-wrap">
  166. <div class="bug-title">关闭广告会退出云手机是否继续观看</div>
  167. <div class="btn-list">
  168. <div class="btn cannel-btn cannel-ad-btn">放弃</div>
  169. <div class="btn go-bug looking">继续观看</div>
  170. </div>
  171. </div>
  172. </div>
  173. <div id="set-phone-size-dialog" class="dialog">
  174. <div class="dialog-mask"></div>
  175. <!-- 设置分辨率的弹窗 -->
  176. <div class="dialog-content-border">
  177. <div class="dialog-content">
  178. <div class="dialog-header">
  179. <div class="dialog-btn cancel">
  180. <span>取消</span>
  181. </div>
  182. <div class="dialog-btn confirm">
  183. <span>确定</span>
  184. </div>
  185. </div>
  186. <div class="dialog-main">
  187. <div id="phone-size-list"></div>
  188. </div>
  189. </div>
  190. </div>
  191. </div>
  192. <script
  193. type="text/javascript"
  194. src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"
  195. ></script>
  196. <script src="https://lf1-cdn-tos.bytegoofy.com/goofy/developer/jssdk/jssdk-1.0.3.js"></script>
  197. <script type="text/javascript" src="jquery-1.11.0.min.js"></script>
  198. <!-- ffm软解 -->
  199. <script type="text/javascript" src="helper.js"></script>
  200. <script type="text/javascript" src="jquery-weui.min.js"></script>
  201. <script type="text/javascript" src="pcm-player.js"></script>
  202. <script type="text/javascript" src="webgl.js"></script>
  203. <script
  204. type="text/javascript"
  205. src="https://cdn.bootcss.com/vConsole/3.2.0/vconsole.min.js"
  206. ></script>
  207. <script
  208. type="text/javascript"
  209. src="https://js.cdn.aliyun.dcloud.net.cn/dev/uni-app/uni.webview.1.5.2.js"
  210. ></script>
  211. <script type="text/javascript">
  212. $(function () {
  213. //手指滑动多少距离就认为是滑成功
  214. //这个值不能太大,否则影响斜着滑动时,垂直滑动的流畅性,也不能太小,太灵敏也不好
  215. var diffXDistance = 50;
  216. //当前滑动的对象
  217. var currentObject;
  218. //上一次滑动的对象
  219. var lastObject;
  220. //是否可以左右滑动,在上下滑的时候禁止左右滑
  221. var canSlide = true;
  222. //用于记录按下的点
  223. var startPoint;
  224. $('.slide-content').css({
  225. width: $('.slide-wrapper').width(),
  226. });
  227. $('.slide-scroll')
  228. .css({
  229. width:
  230. $('.slide-wrapper').width() + $('.slide-content-button').width(),
  231. })
  232. .on('touchstart', function (e) {
  233. currentObject = this;
  234. startPoint = {
  235. x: e.originalEvent.changedTouches[0].pageX,
  236. y: e.originalEvent.changedTouches[0].pageY,
  237. };
  238. })
  239. .on('touchmove', function (e) {
  240. //如果是左右滑动,就禁止上下的滑动
  241. //如果是上下的滑动,就禁止左右滑动
  242. if (
  243. Math.abs(e.originalEvent.changedTouches[0].pageX - startPoint.x) >
  244. Math.abs(e.originalEvent.changedTouches[0].pageY - startPoint.y)
  245. ) {
  246. event.preventDefault();
  247. } else {
  248. canSlide = false;
  249. }
  250. })
  251. .on('touchend', function (e) {
  252. //如果是上下滑动,这里就直接返回了
  253. if (!canSlide) {
  254. canSlide = true;
  255. return true;
  256. }
  257. //点击除当前左滑对象之外的任意其他位置
  258. if (lastObject && currentObject != lastObject) {
  259. //右滑→
  260. $(lastObject).removeClass('animate-slide');
  261. //清空上一个左滑的对象
  262. lastObject = undefined;
  263. }
  264. var diffX = e.originalEvent.changedTouches[0].pageX - startPoint.x;
  265. if (diffX < -diffXDistance) {
  266. //左滑←
  267. $(currentObject).addClass('animate-slide');
  268. if (lastObject && lastObject != currentObject) {
  269. //右滑→
  270. $(lastObject).removeClass('animate-slide');
  271. }
  272. //记录上一个左滑的对象
  273. lastObject = currentObject;
  274. } else if (diffX >= diffXDistance) {
  275. if (currentObject == lastObject) {
  276. //右滑→
  277. $(currentObject).removeClass('animate-slide');
  278. //清空上一个左滑的对象
  279. lastObject = undefined;
  280. }
  281. }
  282. });
  283. });
  284. </script>
  285. <script>
  286. // 开发环境
  287. var isDev =
  288. /^192\.168\./.test(location.host) || /^localhost/.test(location.host);
  289. // if (isDev) {
  290. // baseUrl = 'http://gntest.phone.androidscloud.com:1280';
  291. // sourceType = 2;
  292. // }
  293. var topwinHeight = window.screen.height - window.innerHeight + 30; //计算title top 头部
  294. var url = window.location.href;
  295. url = url.split('/');
  296. var baseUrl = url[0] + '//' + url[2];
  297. console.log(baseUrl);
  298. var parameters = GetRequest();
  299. var token = parameters['token'];
  300. var mealType = parameters['mealType'];
  301. var userCardId = parameters['userCardId'];
  302. var videoTimer = null,
  303. videoTime = 0,
  304. adType = 0,
  305. sourceType = isNaN(parameters['sourceType'])
  306. ? sourceType
  307. : +parameters['sourceType'],
  308. disconnectionFlag = false,
  309. getDate = false;
  310. if (mealType === 'VIP') {
  311. $('.loading_sceen_pic').attr('src', '../static/img/home_bg_VIP.png');
  312. } else if (mealType === 'SVIP') {
  313. $('.loading_sceen_pic').attr('src', '../static/img/home_bg_SVIP.png');
  314. } else if (mealType === 'STAR') {
  315. $('.loading_sceen_pic').attr('src', '../static/img/home_bg_STAR.png');
  316. } else if (mealType === 'STARPRO') {
  317. $('.loading_sceen_pic').attr('src', '../static/img/home_bg_PRO.png');
  318. }
  319. $('#wine').css({
  320. width: window.screen.width,
  321. height: window.screen.height - topwinHeight - 20,
  322. position: 'absolute',
  323. });
  324. $('.loading').css({
  325. width: window.screen.width,
  326. height: window.screen.height - topwinHeight - 20,
  327. });
  328. var winese = document.createElement('wine');
  329. wine.style.top = '-' + winese + 'px';
  330. var isAudioPlay = false;
  331. let dbName = parameters['username'],
  332. version = 1,
  333. storeName = 'usercard';
  334. let indexedDB = window.indexedDB;
  335. let db;
  336. var socketURL;
  337. var cUrl;
  338. var cardToken, resolvingPower;
  339. const request = indexedDB.open(dbName, version);
  340. request.onsuccess = function (event) {
  341. db = event.target.result; // 数据库对象
  342. console.log('数据库打开成功');
  343. };
  344. request.onerror = function (event) {
  345. console.log('数据库打开报错');
  346. };
  347. request.onupgradeneeded = function (event) {
  348. // 数据库创建或升级的时候会触发
  349. console.log('onupgradeneeded');
  350. db = event.target.result; // 数据库对象
  351. let objectStore;
  352. if (!db.objectStoreNames.contains(storeName)) {
  353. objectStore = db.createObjectStore(storeName, { keyPath: 'id' }); // 创建表
  354. }
  355. };
  356. // 添加数据
  357. function addData(db, storeName, data) {
  358. let request = db
  359. .transaction([storeName], 'readwrite') // 事务对象 指定表格名称和操作模式("只读"或"读写")
  360. .objectStore(storeName) // 仓库对象
  361. .add(data);
  362. request.onsuccess = function (event) {
  363. console.log('数据写入成功');
  364. };
  365. request.onerror = function (event) {
  366. console.log('数据写入失败');
  367. throw new Error(event.target.error);
  368. };
  369. }
  370. // 根据id获取数据
  371. function getDataByKey(db, storeName, key) {
  372. let transaction = db.transaction([storeName]); // 事务
  373. let objectStore = transaction.objectStore(storeName); // 仓库对象
  374. let request = objectStore.get(key);
  375. request.onerror = function (event) {
  376. connect('add');
  377. };
  378. request.onsuccess = function (event) {
  379. console.log('主键查询结果: ', request.result);
  380. if (request.result) {
  381. socketURL = request.result.socketURL;
  382. cUrl = request.result.cUrl;
  383. cardToken = request.result.cardToken;
  384. resolvingPower = request.result.resolvingPower;
  385. doConnectBusiness();
  386. doConnectDirectives();
  387. } else {
  388. connect('add');
  389. }
  390. };
  391. }
  392. // 根据id修改数
  393. function updateDB(db, storeName, data) {
  394. let request = db
  395. .transaction([storeName], 'readwrite') // 事务对象
  396. .objectStore(storeName) // 仓库对象
  397. .put(data);
  398. request.onsuccess = function () {
  399. console.log('数据更新成功');
  400. };
  401. request.onerror = function () {
  402. console.log('数据更新失败');
  403. };
  404. }
  405. // 由于打开indexDB是异步的加个定时器避免 db对象还没获取到值导致 报错
  406. setTimeout(() => {
  407. getDataByKey(db, storeName, userCardId);
  408. }, 1000);
  409. function connect(type) {
  410. $.ajax({
  411. url: baseUrl + '/api/resources/user/cloud/connect',
  412. type: 'post',
  413. data: JSON.stringify({
  414. userCardId: Number(userCardId),
  415. }),
  416. headers: {
  417. 'content-Type': 'application/json',
  418. Authorization: token,
  419. },
  420. dataType: 'json',
  421. async: false,
  422. success: function (res) {
  423. if (res.status === 0) {
  424. if (res.data.internetHttps) {
  425. socketURL =
  426. 'wss://' +
  427. res.data.internetHttps +
  428. '/plugflow?cardIp=' +
  429. res.data.localIp +
  430. '&token=' +
  431. res.data.cardToken +
  432. '&type=business';
  433. cUrl =
  434. 'wss://' +
  435. res.data.internetHttps +
  436. '/businessChannel?cardIp=' +
  437. res.data.localIp +
  438. '&token=' +
  439. res.data.cardToken +
  440. '&type=directives';
  441. cardToken = res.data.cardToken;
  442. resolvingPower = res.data.resolvingPower;
  443. doConnectBusiness();
  444. doConnectDirectives();
  445. if (type === 'add') {
  446. addData(db, storeName, {
  447. id: userCardId,
  448. socketURL: socketURL,
  449. cUrl: cUrl,
  450. cardToken: res.data.cardToken,
  451. resolvingPower: res.data.resolvingPower,
  452. });
  453. } else {
  454. updateDB(db, storeName, {
  455. id: userCardId,
  456. socketURL: socketURL,
  457. cUrl: cUrl,
  458. cardToken: res.data.cardToken,
  459. resolvingPower: res.data.resolvingPower,
  460. });
  461. }
  462. } else {
  463. $.toast('网络异常,请稍后重试', 'text');
  464. }
  465. } else {
  466. $.toast('画面异常,请重新进入', 'text');
  467. quit();
  468. }
  469. },
  470. });
  471. }
  472. initAD();
  473. $.alert({
  474. title: '提示',
  475. text: '开始使用云手机',
  476. onOK: function () {
  477. isAudioPlay = true;
  478. },
  479. });
  480. //云机倒计时
  481. let validTime = parameters['validTime'] || 10000;
  482. if (validTime > 32000) {
  483. validTime = 32000;
  484. }
  485. let detailTime = validTime * 60 * 1000;
  486. setTimeout(() => {
  487. $('.bug-title').eq(0).text('尊敬的用户您的云手机试用时间已到期');
  488. getDate = true;
  489. $('.buy-phone-wrap').eq(0).show();
  490. }, detailTime);
  491. var orientation = 0; //0 竖屏,1横屏
  492. function array_unique(arr) {
  493. return arr.filter(function (e, i) {
  494. return arr.indexOf(e) === i;
  495. });
  496. }
  497. var cutList = [];
  498. let timer,
  499. isFlag = true;
  500. function showShearPlate() {
  501. stopManyClick(() => {
  502. $('.box-shear-plate').empty();
  503. $.ajax({
  504. url: baseUrl + '/api/public/v5/shear/content',
  505. headers: {
  506. Authorization: token,
  507. },
  508. type: 'get',
  509. dataType: 'json',
  510. success: function (res) {
  511. if (res.status === 0) {
  512. if (res.data.length) {
  513. cutList = array_unique(res.data);
  514. var str =
  515. '<div class="title">剪贴板<div onclick="handleClear()" class="btn-clear">清空</div></div><div class="slide-wrapper-content">';
  516. cutList.forEach(function (item) {
  517. str +=
  518. "<div class='slide-wrapper'><div class='slide-scroll animate-slide-start'><div class='slide-content'><div onclick='handleCopy(\"" +
  519. item.content +
  520. '")\'>' +
  521. item.content +
  522. "</div></div><div class='slide-content-button'><button onclick='handleDelete(" +
  523. item.id +
  524. ")'>删除</button></div></div></div>";
  525. });
  526. str += '</div>';
  527. $('.box-shear-plate').append(str);
  528. } else {
  529. $('.box-shear-plate').append(
  530. '<img class="empty" src="img/jianqieban_pic@2x.png" alt="" /><div class="empty-txt">剪贴板为空</div>',
  531. );
  532. }
  533. $('.mask').show();
  534. initSlider();
  535. } else {
  536. $('.box-shear-plate').append(
  537. '<img class="empty" src="img/jianqieban_pic@2x.png" alt="" /><div class="empty-txt">剪贴板为空</div>',
  538. );
  539. $('.mask').show();
  540. }
  541. },
  542. });
  543. });
  544. }
  545. //防止提示一秒内重复显示
  546. function stopManyClick(fn) {
  547. if (isFlag) {
  548. fn();
  549. }
  550. isFlag = false;
  551. if (timer) {
  552. clearTimeout(timer);
  553. }
  554. timer = setTimeout(() => {
  555. isFlag = true;
  556. }, 1500);
  557. }
  558. // 清空剪贴板
  559. function handleClear() {
  560. var ids = '';
  561. cutList.forEach(function (item) {
  562. ids += 'ids=' + item.id + '&';
  563. });
  564. ids = ids.substring(0, ids.lastIndexOf('&'));
  565. $.confirm('确定清空剪贴板?', function () {
  566. $.ajax({
  567. url: baseUrl + '/api/public/v5/shear/content?' + ids,
  568. headers: {
  569. Authorization: token,
  570. },
  571. type: 'DELETE',
  572. dataType: 'json',
  573. success: function (res) {
  574. if (res.status === 0) {
  575. showShearPlate();
  576. } else {
  577. $.toast(res.msg, 'text');
  578. }
  579. },
  580. });
  581. });
  582. }
  583. function handleCopy(content) {
  584. var cutting = {
  585. type: 'cutting',
  586. data: {
  587. str: content,
  588. },
  589. };
  590. wsss.send(JSON.stringify(cutting));
  591. }
  592. // 删除剪贴板
  593. function handleDelete(id) {
  594. $.ajax({
  595. url: baseUrl + '/api/public/v5/shear/content?ids=' + id,
  596. headers: {
  597. Authorization: token,
  598. },
  599. type: 'DELETE',
  600. dataType: 'json',
  601. success: function (res) {
  602. if (res.status === 0) {
  603. showShearPlate();
  604. } else {
  605. $.toast(res.msg, 'text');
  606. }
  607. },
  608. });
  609. }
  610. function initSlider() {
  611. //手指滑动多少距离就认为是滑成功
  612. //这个值不能太大,否则影响斜着滑动时,垂直滑动的流畅性,也不能太小,太灵敏也不好
  613. var diffXDistance = 50;
  614. //当前滑动的对象
  615. var currentObject;
  616. //上一次滑动的对象
  617. var lastObject;
  618. //是否可以左右滑动,在上下滑的时候禁止左右滑
  619. var canSlide = true;
  620. //用于记录按下的点
  621. var startPoint;
  622. $('.slide-content').css({
  623. width: $('.slide-wrapper').width(),
  624. });
  625. document.body.removeEventListener(
  626. 'touchmove',
  627. function (e) {
  628. e.preventDefault();
  629. },
  630. {
  631. passive: false,
  632. },
  633. );
  634. $('.slide-scroll')
  635. .css({
  636. width:
  637. $('.slide-wrapper').width() + $('.slide-content-button').width(),
  638. })
  639. .on('touchstart', function (e) {
  640. currentObject = this;
  641. startPoint = {
  642. x: e.originalEvent.changedTouches[0].pageX,
  643. y: e.originalEvent.changedTouches[0].pageY,
  644. };
  645. })
  646. .on('touchmove', function (e) {
  647. //如果是左右滑动,就禁止上下的滑动
  648. //如果是上下的滑动,就禁止左右滑动
  649. if (
  650. Math.abs(e.originalEvent.changedTouches[0].pageX - startPoint.x) >
  651. Math.abs(e.originalEvent.changedTouches[0].pageY - startPoint.y)
  652. ) {
  653. event.preventDefault();
  654. } else {
  655. canSlide = false;
  656. }
  657. })
  658. .on('touchend', function (e) {
  659. //如果是上下滑动,这里就直接返回了
  660. if (!canSlide) {
  661. canSlide = true;
  662. return true;
  663. }
  664. //点击除当前左滑对象之外的任意其他位置
  665. if (lastObject && currentObject != lastObject) {
  666. //右滑→
  667. $(lastObject).removeClass('animate-slide');
  668. //清空上一个左滑的对象
  669. lastObject = undefined;
  670. }
  671. var diffX = e.originalEvent.changedTouches[0].pageX - startPoint.x;
  672. if (diffX < -diffXDistance) {
  673. //左滑←
  674. $(currentObject).addClass('animate-slide');
  675. if (lastObject && lastObject != currentObject) {
  676. //右滑→
  677. $(lastObject).removeClass('animate-slide');
  678. }
  679. //记录上一个左滑的对象
  680. lastObject = currentObject;
  681. } else if (diffX >= diffXDistance) {
  682. if (currentObject == lastObject) {
  683. //右滑→
  684. $(currentObject).removeClass('animate-slide');
  685. //清空上一个左滑的对象
  686. lastObject = undefined;
  687. }
  688. }
  689. });
  690. }
  691. var btnMuted = document.querySelector('#btnMuted');
  692. btnMuted &&
  693. (function () {
  694. var setHistory = function (left, top) {
  695. try {
  696. localStorage.setItem(
  697. 'muted-btn-loc',
  698. JSON.stringify({
  699. left: left,
  700. top: top,
  701. }),
  702. );
  703. } catch (ex) {}
  704. };
  705. var getHistory = function () {
  706. try {
  707. var value = localStorage.getItem('muted-btn-loc');
  708. if (!value) return null;
  709. value = JSON.parse(value);
  710. if (!value) return null;
  711. return value;
  712. } catch (ex) {
  713. return null;
  714. }
  715. };
  716. var fixLoc = function (loc) {
  717. var rect = btnMuted.getBoundingClientRect();
  718. rect = {
  719. top: rect.top,
  720. left: rect.left,
  721. width: rect.width,
  722. height: rect.height,
  723. }; // 部分低版本浏览器,该属性为只读
  724. if (loc) {
  725. rect.left = loc.left;
  726. rect.top = loc.top;
  727. }
  728. var minX = 0;
  729. var minY = 0;
  730. var docRect = document.documentElement.getBoundingClientRect();
  731. var maxY = docRect.height - rect.height;
  732. var maxX = docRect.width - rect.width;
  733. var left = rect.left;
  734. var top = rect.top;
  735. left = Math.min(left, maxX);
  736. left = Math.max(left, minX);
  737. top = Math.min(top, maxY);
  738. top = Math.max(top, minY);
  739. if (loc || top !== rect.top || left !== rect.left) {
  740. btnMuted.style.cssText +=
  741. 'left:' + left + 'px;top:' + top + 'px;';
  742. }
  743. };
  744. window.addEventListener('resize', function () {
  745. fixLoc();
  746. });
  747. var touchPoint = {
  748. pageY: 0,
  749. pageX: 0,
  750. };
  751. var currentLoc = {
  752. top: 0,
  753. left: 0,
  754. curTop: 0,
  755. curLeft: 0,
  756. };
  757. var toMove = false;
  758. var touchmove = function (e) {
  759. e.preventDefault();
  760. var point = e.changedTouches[0];
  761. var top = -touchPoint.pageY + point.pageY;
  762. var left = -touchPoint.pageX + point.pageX;
  763. if (toMove) {
  764. top += currentLoc.top;
  765. left += currentLoc.left;
  766. currentLoc.curLeft = left;
  767. currentLoc.curTop = top;
  768. btnMuted.style.cssText +=
  769. 'left:' + left + 'px;top:' + top + 'px;';
  770. } else {
  771. if (Math.abs(top) >= 5 || Math.abs(left) >= 5) {
  772. toMove = true;
  773. }
  774. }
  775. };
  776. var touchend = function () {
  777. window.removeEventListener('touchmove', touchmove, {
  778. passive: false,
  779. });
  780. window.removeEventListener('touchend', touchend, {
  781. passive: false,
  782. });
  783. if (toMove) {
  784. setHistory(currentLoc.curLeft, currentLoc.curTop);
  785. fixLoc();
  786. } else {
  787. //按点击处理
  788. var set = $('.control-right-img').attr('data-id');
  789. if (set == '1') {
  790. $('.control-right-img').attr({
  791. 'data-id': '2',
  792. });
  793. $('.leftmains').css({
  794. right: '0rem',
  795. });
  796. } else {
  797. $('.control-right-img').attr({
  798. 'data-id': '1',
  799. });
  800. $('.leftmains').css({
  801. right: '-4rem',
  802. });
  803. }
  804. }
  805. };
  806. btnMuted.addEventListener(
  807. 'touchstart',
  808. function (e) {
  809. e.preventDefault();
  810. toMove = false;
  811. var point = e.changedTouches[0];
  812. touchPoint.pageX = point.pageX;
  813. touchPoint.pageY = point.pageY;
  814. var rect = e.target.getBoundingClientRect();
  815. currentLoc.top = rect.top;
  816. currentLoc.left = rect.left;
  817. window.addEventListener('touchmove', touchmove, {
  818. passive: false,
  819. });
  820. window.addEventListener('touchend', touchend, {
  821. passive: false,
  822. });
  823. },
  824. {
  825. passive: false,
  826. },
  827. );
  828. var history = getHistory();
  829. if (history) {
  830. fixLoc(history);
  831. }
  832. btnMuted.classList.remove('hide');
  833. })();
  834. $('#upload').on('click', function () {
  835. decodeWoker.postMessage('close');
  836. decodeWoker.terminate();
  837. quit();
  838. });
  839. function handleClose() {
  840. $('.mask').hide();
  841. }
  842. var decodeCount = 1;
  843. var isFinish = false;
  844. var player = new PCMPlayer({
  845. encoding: '16bitInt',
  846. channels: 2,
  847. sampleRate: 44100,
  848. flushingTime: 22,
  849. debug: false,
  850. });
  851. Module = {};
  852. Module.onRuntimeInitialized = function () {
  853. isFinish = true;
  854. };
  855. function decodeAAC(data) {
  856. var retPtr = Module._malloc(4 * 5 * 1024); //接收的数据
  857. var inputPtr = Module._malloc(4 * data.length); //输入数据
  858. for (var i = 0; i < data.length; i++) {
  859. Module.HEAPU8[inputPtr + i] = data[i]; //转换为堆数据
  860. }
  861. var pcmLen = Module._feedData(retPtr, inputPtr, data.length);
  862. if (pcmLen >= 0) {
  863. var pcmData = new Uint8Array(pcmLen);
  864. for (var i = 0; i < pcmLen; i++) {
  865. pcmData[i] = Module.HEAPU8[retPtr + i];
  866. }
  867. player.feed(pcmData);
  868. }
  869. decodeCount++;
  870. Module._free(inputPtr);
  871. Module._free(retPtr);
  872. }
  873. var decodeWoker = new Worker('decoder.js');
  874. var myVideo = document.getElementById('playCanvas');
  875. var logicWidth = 720;
  876. var logicHeight = 1280;
  877. decodeWoker.onmessage = function (event) {
  878. var objData = event.data;
  879. // console.log("🚀 ~ file: WXtrialInterface.html ~ line 806 ~ objData", objData)
  880. switch (objData.cmd) {
  881. case 0:
  882. break;
  883. case 1:
  884. // console.log(objData);
  885. if (logicWidth != objData.width || logicHeight != objData.height) {
  886. logicWidth = objData.width;
  887. logicHeight = objData.height;
  888. }
  889. // logicWidth = 375
  890. // logicHeight = 812
  891. webglPlayer.renderFrame(
  892. objData.data,
  893. logicWidth,
  894. logicHeight,
  895. logicWidth * logicHeight,
  896. (logicWidth / 2) * (logicHeight / 2),
  897. );
  898. $('.weui-mask_transparent').hide();
  899. $('.weui-toast').hide();
  900. $('.loading').hide();
  901. break;
  902. case 5:
  903. var buffer = RequestIFrame();
  904. webSocketWorker.postMessage(buffer);
  905. }
  906. };
  907. var isFinish = false;
  908. var webglPlayer = new WebGLPlayer(myVideo, {
  909. preserveDrawingBuffer: false,
  910. });
  911. function GetRequest() {
  912. var url = location.search; // 获取url中"?"符后的字串
  913. var obj = new Object();
  914. if (url.indexOf('?') != -1) {
  915. var str = url.substr(1);
  916. strs = str.split('&');
  917. for (var i = 0; i < strs.length; i++) {
  918. obj[strs[i].split('=')[0]] = strs[i].split('=')[1];
  919. }
  920. }
  921. return obj;
  922. }
  923. function doConnectBusiness() {
  924. var webSocketWorker = new Worker(
  925. 'websocket.js?socketURL=' +
  926. encodeURIComponent(socketURL) +
  927. '&cardToken=' +
  928. encodeURIComponent(cardToken),
  929. );
  930. window.webSocketWorker = webSocketWorker;
  931. webSocketWorker.onmessage = function (event) {
  932. var input = event.data;
  933. if (input[0] == 0xff && isAudioPlay) {
  934. decodeAAC(input);
  935. }
  936. if (
  937. input[0] == 0 &&
  938. input[1] == 0 &&
  939. input[2] == 0 &&
  940. input[3] == 1
  941. ) {
  942. var cmd = {
  943. type: 'rawData',
  944. data: event.data,
  945. };
  946. decodeWoker.postMessage(cmd);
  947. }
  948. if (input[0] == 0x68) {
  949. if (input[23] == 0x5c) {
  950. if (CheckVerifyCode(input)) {
  951. webSocketWorker.postMessage(ConfigChannel('RK3923C1201900139'));
  952. var checkBuffer = GetScreenState();
  953. webSocketWorker.postMessage(checkBuffer);
  954. } else {
  955. connect('update');
  956. }
  957. }
  958. if (input[23] == 0x05) {
  959. //横竖屏标识
  960. var state = CheckScreenDirection(input.slice(24, 24 + 8));
  961. if (state == 1) {
  962. console.log('安卓卡此时竖屏');
  963. //竖屏处理
  964. resolving = 1;
  965. $('#playCanvas').removeClass('horizontal').addClass('vertical');
  966. } else {
  967. console.log('安卓卡此时横屏');
  968. //横屏处理
  969. resolving = 0;
  970. $('#playCanvas').removeClass('vertical').addClass('horizontal');
  971. }
  972. }
  973. if (input[23] == 0x0b) {
  974. console.log('多端登陆');
  975. }
  976. }
  977. if (event.data === 'close') {
  978. $.toast('画面异常,请重新进入', 'text');
  979. decodeWoker.postMessage('close');
  980. decodeWoker.terminate();
  981. quit();
  982. }
  983. };
  984. }
  985. // 激活码广告相关配置
  986. function getConfigByPhoneType() {
  987. return new Promise((resolve, reject) => {
  988. $.ajax({
  989. url: baseUrl + '/api/pay/v5/trialCodeConfig/getConfigByPhoneType',
  990. headers: {
  991. Authorization: token,
  992. },
  993. data: {
  994. userCardId: userCardId,
  995. phoneType: mealType,
  996. },
  997. type: 'get',
  998. dataType: 'json',
  999. success: function (res) {
  1000. console.log(res);
  1001. let obj = res.data;
  1002. if (res.status === 0) {
  1003. resolve(obj);
  1004. } else {
  1005. $.toast(res.msg, 'text');
  1006. }
  1007. },
  1008. });
  1009. });
  1010. }
  1011. //列表
  1012. function getSetmealList() {
  1013. return new Promise((resolve, reject) => {
  1014. $.ajax({
  1015. url: baseUrl + '/api/resources/v4/freetrial/setmeal/list',
  1016. headers: {
  1017. Authorization: token,
  1018. },
  1019. type: 'get',
  1020. dataType: 'json',
  1021. success: function (res) {
  1022. if (res.status === 0) {
  1023. let list = res.data;
  1024. list.map((item) => {
  1025. if (item.phoneType === mealType) {
  1026. resolve(item);
  1027. }
  1028. });
  1029. } else {
  1030. $.toast(res.msg, 'text');
  1031. }
  1032. },
  1033. });
  1034. });
  1035. }
  1036. //广告信息
  1037. var adData = null; // 广告数据
  1038. var adLastTime = 0; // 广告时间
  1039. var intervalTime = 0; // 间隔时间
  1040. // let adType = 0;
  1041. console.log(
  1042. '🚀 ~ file: WXtrialInterface.html ~ line 973 ~ sourceType',
  1043. sourceType,
  1044. );
  1045. // 拉取广告数据
  1046. function getAD() {
  1047. return $.ajax({
  1048. url: baseUrl + '/api/public/v5/advertising/getAdInfoByAdPlace',
  1049. headers: {
  1050. Authorization: token,
  1051. },
  1052. data: JSON.stringify({
  1053. adPlace: adType,
  1054. os: 0,
  1055. }),
  1056. type: 'POST',
  1057. dataType: 'json',
  1058. contentType: 'application/json;charset=UTF-8',
  1059. }).then(function (res) {
  1060. if (res.status === 0) {
  1061. var list = res.data.filter(
  1062. (v) => v.adType === 1 && !!v.adVideoBase.videoUrl,
  1063. );
  1064. adData = list[Math.floor(Math.random() * list.length)];
  1065. console.log(
  1066. '🚀 ~ file: WXtrialInterface.html ~ line 990 ~ getAD ~ adData',
  1067. adData,
  1068. );
  1069. return adData;
  1070. } else {
  1071. return Promise.reject(new Error(res.msg));
  1072. }
  1073. });
  1074. }
  1075. // 播放广告
  1076. function playAD() {
  1077. var nowTime = Date.now();
  1078. if (
  1079. adData &&
  1080. // [1, 2].includes(sourceType) &&
  1081. $('.try-use-wrap').eq(0).is(':hidden') &&
  1082. nowTime > adLastTime + intervalTime
  1083. ) {
  1084. $('#source').attr('src', adData.adVideoBase.videoUrl);
  1085. $('.try-use-wrap').eq(0).show();
  1086. $('#source')[0].play();
  1087. videoTime = adData.forcedTime;
  1088. adData = null;
  1089. adLastTime = nowTime;
  1090. videoTimer = setInterval(() => {
  1091. if (videoTime > 0) {
  1092. videoTime--;
  1093. $('.time-node')
  1094. .eq(0)
  1095. .text(videoTime + 's');
  1096. } else {
  1097. clearInterval(videoTimer);
  1098. $('.time-node').eq(0).text('');
  1099. }
  1100. }, 1000);
  1101. if (intervalTime > 0) {
  1102. // 间隔广告拉取下一次广告数据
  1103. adType = 16;
  1104. getAD();
  1105. }
  1106. if (adType === 16 && sourceType == 1) {
  1107. // 间隔广告和试用才上报
  1108. report(0);
  1109. }
  1110. }
  1111. }
  1112. /**
  1113. * 初始化广告
  1114. * 因移动端video无法自动播放,play()方法不能异步调用。
  1115. * 解决方案,初始化时预先请求广告数据,在用户对云手机touchmove事件中去播放广告并请求下一次广告数据。
  1116. */
  1117. function initAD() {
  1118. console.log(
  1119. '🚀 ~ file: WXtrialInterface.html ~ line 1052 ~ initAD ~ sourceType',
  1120. sourceType,
  1121. );
  1122. (function () {
  1123. switch (sourceType) {
  1124. case 1: {
  1125. return getSetmealList().then(function (res) {
  1126. intervalTime =
  1127. res.intervalSwitch === 1
  1128. ? res.intervalAdvertDuration * 1000 * 60
  1129. : 0;
  1130. if (res.pushFlowAdvert === 1) {
  1131. adType = 15;
  1132. adTime = 0;
  1133. } else if (intervalTime > 0) {
  1134. adType = 16;
  1135. adTime = date.now();
  1136. }
  1137. });
  1138. }
  1139. case 2: {
  1140. return getConfigByPhoneType().then(function (res) {
  1141. if (res.isDisconnectionTime === 1) {
  1142. var time = res.disconnectionTime * 60 * 1000;
  1143. setTimeout(() => {
  1144. disconnectionFlag = true;
  1145. $('.buy-phone-wrap').eq(0).show();
  1146. }, time);
  1147. }
  1148. intervalTime =
  1149. res.isIntervalPlayAd === 1
  1150. ? res.intervalPlayAdTime * 1000 * 60
  1151. : 0;
  1152. if (res.isShowAd === 1) {
  1153. adType = 15;
  1154. adTime = 0;
  1155. } else if (intervalTime > 0) {
  1156. adType = 16;
  1157. adTime = date.now();
  1158. }
  1159. });
  1160. }
  1161. default: {
  1162. return Promise.reject();
  1163. }
  1164. }
  1165. })().then(function () {
  1166. console.log(adType);
  1167. this.$('#playCanvas').on('touchstart', playAD);
  1168. // this.$('#playCanvas').on('touchmove', playAD);
  1169. getAD();
  1170. });
  1171. }
  1172. // 观看广告次数上报1
  1173. function reportFrequency() {
  1174. $.ajax({
  1175. url:
  1176. baseUrl +
  1177. '/api/resoures/v1/trial/reportFrequency/' +
  1178. form.userCardId,
  1179. headers: {
  1180. Authorization: form.token,
  1181. },
  1182. type: 'post',
  1183. contentType: 'application/json',
  1184. dataType: 'json',
  1185. success: function (res) {},
  1186. });
  1187. }
  1188. //间隔广告上报
  1189. function report(type) {
  1190. $.ajax({
  1191. url: baseUrl + '/api/resources/v1/trial/report',
  1192. headers: {
  1193. Authorization: token,
  1194. },
  1195. data: JSON.stringify({
  1196. userCardId: userCardId,
  1197. reportType: type,
  1198. }),
  1199. type: 'POST',
  1200. dataType: 'json',
  1201. contentType: 'application/json;charset=UTF-8',
  1202. success: function (res) {},
  1203. });
  1204. }
  1205. //关闭广告
  1206. $('.time-close-wrap')[0].addEventListener('click', () => {
  1207. if (videoTime == 0) {
  1208. reportFrequency();
  1209. }
  1210. $('.buy-phone-wrap').eq(0).show();
  1211. });
  1212. // 点击取消
  1213. $('.cannel-btn')[0].addEventListener('click', () => {
  1214. $('.buy-phone-wrap').eq(0).hide();
  1215. if (disconnectionFlag || getDate) {
  1216. //设置了断线时间,取消直接退出
  1217. systemBuriedPoint('激活码-断线-取消');
  1218. quit();
  1219. return;
  1220. }
  1221. let pointName = '';
  1222. if (sourceType == 1) {
  1223. pointName =
  1224. videoTime == 0 ? '免费试用-关闭-取消' : '免费试用-强制关闭-取消';
  1225. } else {
  1226. pointName =
  1227. videoTime == 0 ? '激活码-关闭-取消' : '激活码-强制关闭-取消';
  1228. }
  1229. systemBuriedPoint(pointName);
  1230. if (videoTime == 0) {
  1231. if (adType === 16 && sourceType == 1) {
  1232. report(1);
  1233. }
  1234. $('.try-use-wrap').eq(0).hide();
  1235. $('#source')[0].pause();
  1236. return;
  1237. }
  1238. $('.look-wrap').eq(0).show();
  1239. });
  1240. // 点击去购买
  1241. $('.go-bug')[0].addEventListener('click', () => {
  1242. let pointName = '';
  1243. if (disconnectionFlag) {
  1244. pointName = '激活码-断线-去购买';
  1245. } else if (sourceType == 1) {
  1246. pointName =
  1247. videoTime == 0
  1248. ? '免费试用-关闭-去购买'
  1249. : '免费试用-强制关闭-去购买';
  1250. } else {
  1251. pointName =
  1252. videoTime == 0 ? '激活码-关闭-去购买' : '激活码-强制关闭-去购买';
  1253. }
  1254. systemBuriedPoint(pointName);
  1255. if (getDate) {
  1256. if (window.__wxjs_environment === 'miniprogram') {
  1257. wx.miniProgram.navigateTo({
  1258. url: '/packageA/order/buy/index?buyType=试用界面购买',
  1259. });
  1260. } else {
  1261. uni.webView.navigateTo({
  1262. url: '/pages/order/order',
  1263. });
  1264. }
  1265. } else {
  1266. if (window.__wxjs_environment === 'miniprogram') {
  1267. wx.miniProgram.navigateTo({
  1268. url:
  1269. `/packageA/order/renew/index?buyType=${
  1270. sourceType == 1
  1271. ? '试用弹窗购买按钮进入-普通试用'
  1272. : '试用弹窗购买按钮进入-激活码试用'
  1273. }&record=` + userCardId,
  1274. });
  1275. } else {
  1276. uni.webView.navigateTo({
  1277. url: '/pages/order/order',
  1278. });
  1279. }
  1280. }
  1281. });
  1282. window.onbeforeunload = function () {
  1283. wsss.close();
  1284. decodeWoker.postMessage('close');
  1285. decodeWoker.terminate();
  1286. };
  1287. function quit() {
  1288. if (navigator.userAgent.toLowerCase().includes('toutiaomicroapp')) {
  1289. tt.miniProgram.switchTab({
  1290. url: '/pages/home/home',
  1291. });
  1292. } else if (window.__wxjs_environment === 'miniprogram') {
  1293. wx.miniProgram.switchTab({
  1294. url: '/pages/home/home',
  1295. });
  1296. } else {
  1297. uni.webView.navigateBack({
  1298. delta: 1,
  1299. });
  1300. }
  1301. }
  1302. function updatePhoneSizeListHtml() {
  1303. const templatePhoneSizeItem = doT.template(
  1304. $('#template-phone-size-item').html().replace(/&amp;/g, '&'),
  1305. );
  1306. const phoneSizeListItemsHtml = templatePhoneSizeItem({
  1307. list: window.phoneSizeList,
  1308. active: window.activePhoneSize,
  1309. });
  1310. $('#phone-size-list').html(phoneSizeListItemsHtml);
  1311. }
  1312. $('#open-set-phone-size-dialog-btn').on('click', function (e) {
  1313. window.activePhoneSize = window.currentPhoneSize;
  1314. updatePhoneSizeListHtml();
  1315. $('#set-phone-size-dialog').addClass('show');
  1316. });
  1317. // $('#set-phone-size-dialog').addClass('show');
  1318. $('.dialog .dialog-mask')
  1319. .add('.dialog .dialog-btn.cancel')
  1320. .on('click', function (e) {
  1321. $(e.currentTarget).parents('.dialog').removeClass('show');
  1322. });
  1323. function getPhoneSizeList() {
  1324. $.ajax({
  1325. url: baseUrl + '/api/public/v5/shear/content',
  1326. headers: {
  1327. Authorization: token,
  1328. },
  1329. type: 'get',
  1330. dataType: 'json',
  1331. });
  1332. }
  1333. // 分辨率列表
  1334. window.phoneSizeList = [];
  1335. // 当前生效的分辨率
  1336. window.currentPhoneSize = {
  1337. width: 720,
  1338. height: 1280,
  1339. };
  1340. // 选中的分辨率
  1341. window.activePhoneSize = window.currentPhoneSize;
  1342. function getPhoneSizeList() {
  1343. return $.ajax({
  1344. url: baseUrl + '/api/public/config/switch/getValue/toJSONObject',
  1345. headers: {
  1346. Authorization: token,
  1347. },
  1348. type: 'get',
  1349. dataType: 'json',
  1350. data: {
  1351. configKey: 'cloud_phone_resolving_power',
  1352. },
  1353. }).then(function (response) {
  1354. return response.data.map(function (v) {
  1355. return {
  1356. width: v.width || v.abscissa,
  1357. height: v.height || v.ordinate,
  1358. };
  1359. });
  1360. // [
  1361. // // { width: 320, height: 240 },
  1362. // // { width: 640, height: 480 },
  1363. // { width: 375, height: 812 },
  1364. // { width: 720, height: 1280 },
  1365. // // { width: 1280, height: 720 },
  1366. // // { width: 1080, height: 1920 },
  1367. // ];
  1368. });
  1369. }
  1370. getPhoneSizeList().then(function (phoneSizeList) {
  1371. window.phoneSizeList = phoneSizeList;
  1372. return updatePhoneSizeListHtml();
  1373. });
  1374. // const phoneSizeListSwiper = new Swiper('#phone-size-list-swiper', {
  1375. // direction: 'vertical',
  1376. // slidesPerView: 'auto',
  1377. // loop: false,
  1378. // centeredSlides: true,
  1379. // });
  1380. function setPhoneSize(config) {
  1381. $.ajax({
  1382. url:
  1383. baseUrl +
  1384. '/api/resources/v5/machine/resolution/operationResolvingPower',
  1385. headers: {
  1386. Authorization: token,
  1387. },
  1388. type: 'post',
  1389. dataType: 'json',
  1390. data: {
  1391. userCardId: window.userCardId,
  1392. width: config.width,
  1393. height: config.height,
  1394. },
  1395. });
  1396. wsss.send(
  1397. JSON.stringify({
  1398. type: 'setPhoneSize',
  1399. data: {
  1400. width: config.width,
  1401. height: config.height,
  1402. },
  1403. }),
  1404. );
  1405. wsss.send(
  1406. JSON.stringify({
  1407. type: 'forwardMsg',
  1408. data: {
  1409. code: 'phoneSizeChange',
  1410. width: config.width,
  1411. height: config.height,
  1412. desc: '分辨率修改', // 可选
  1413. },
  1414. }),
  1415. );
  1416. window.currentPhoneSize = config;
  1417. }
  1418. // wsss.addEventListener('message', function (event) {
  1419. // console.log(
  1420. // '🚀 ~ file: WXtrialInterface.html ~ line 1476 ~ event',
  1421. // event,
  1422. // );
  1423. // });
  1424. $('#phone-size-list').on('click', '.phone-size-item', function (e) {
  1425. const data = $(e.currentTarget).data();
  1426. window.activePhoneSize = data;
  1427. updatePhoneSizeListHtml();
  1428. // setPhoneSize(data.width, data.height);
  1429. });
  1430. $('#set-phone-size-dialog .dialog-btn.confirm').on('click', function (e) {
  1431. setPhoneSize(window.activePhoneSize);
  1432. $('#set-phone-size-dialog').removeClass('show');
  1433. });
  1434. </script>
  1435. <script type="text/javascript" src="WXdraw.js"></script>
  1436. <script type="text/javascript" src="aac.js"></script>
  1437. </body>
  1438. </html>