WXtrialInterface.html 42 KB

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