WXtrialInterface.html 36 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146
  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 name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
  10. <!-- 删除苹果默认的工具栏和菜单栏 -->
  11. <meta name="apple-mobile-web-app-status-bar-style" content="black">
  12. <!-- 设置苹果工具栏颜 -->
  13. <meta name="format-detection" content="telphone=no, email=no">
  14. <!-- 忽略页面中的数字识别为电话,忽略email识别 -->
  15. <!-- 启用360浏览器的极速模(webkit) -->
  16. <meta name="renderer" content="webkit">
  17. <!-- 避免IE使用兼容模式 -->
  18. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  19. <!-- 针对手持设备优化,主要是针对一些老的不识别viewport的浏览器,比如黑 -->
  20. <meta name="HandheldFriendly" content="true">
  21. <!-- 微软的老式浏览 -->
  22. <meta name="MobileOptimized" content="320">
  23. <!-- 不能旋转,问题出在这 -->
  24. <!-- UC强制全屏 -->
  25. <meta name="full-screen" content="yes">
  26. <!-- QQ强制全屏 -->
  27. <meta name="x5-fullscreen" content="true">
  28. <!-- UC应用模式 -->
  29. <meta name="browsermode" content="application">
  30. <!-- QQ应用模式 -->
  31. <meta name="x5-page-mode" content="app">
  32. <!-- windows phone 点击无高 -->
  33. <meta name="msapplication-tap-highlight" content="no">
  34. <link rel="stylesheet" type="text/css" href="css/WXtrialInterface.css" />
  35. <link rel="stylesheet" href="https://cdn.bootcss.com/weui/1.1.3/style/weui.min.css" />
  36. <link rel="stylesheet" href="https://cdn.bootcss.com/jquery-weui/1.2.1/css/jquery-weui.min.css" />
  37. <style>
  38. .try-use-wrap, .buy-phone-wrap, .look-wrap{
  39. width: 100%;
  40. height: 100%;
  41. position: fixed;
  42. top: 0;
  43. left: 0;
  44. z-index: 9999;
  45. background: rgba(0, 0, 0, 0.5);
  46. display: none;
  47. }
  48. .try-use-container{
  49. width: 80%;
  50. height: 409px;
  51. position: absolute;
  52. top: 50%;
  53. left: 50%;
  54. transform: translate(-50%, -50%);
  55. background-color: #FFFFFF;
  56. border-radius: 0.66em;
  57. }
  58. .time-close-wrap{
  59. width: 5.46em;
  60. height: 2em;
  61. line-height: 2em;
  62. text-align: center;
  63. position: absolute;
  64. top: 0.24em;
  65. right: 0.3em;
  66. background: rgba(0, 0, 0, 0.49);
  67. border-radius: 1.26em;
  68. font-size: 12px;
  69. color: #FFFFFF;
  70. }
  71. .bug-wrap{
  72. width: 90%;
  73. height: 115px;
  74. background: #FFFFFF;
  75. border-radius: 10px;
  76. position: absolute;
  77. top: 50%;
  78. left: 50%;
  79. transform: translate(-50%, -50%);
  80. }
  81. .bug-title{
  82. text-align: center;
  83. margin: 25px 0;
  84. font-size: 18px;
  85. font-weight: 600;
  86. color: #333333;
  87. }
  88. .btn-list{
  89. width: 100%;
  90. height: 44px;
  91. line-height: 44px;
  92. border-top: 1px solid rgba(238,238,238,1);
  93. position: absolute;
  94. bottom: 0;
  95. left: 0;
  96. display: flex;
  97. align-items: center;
  98. }
  99. .btn{
  100. flex: 1;
  101. text-align: center;
  102. }
  103. .cannel-btn{
  104. font-size: 18px;
  105. color: #666666;
  106. }
  107. .go-bug{
  108. font-size: 18px;
  109. color: #3B7FFF;
  110. border-left: 1px solid rgba(238,238,238,1);
  111. }
  112. </style>
  113. </head>
  114. <body class="scroll h-player" style="overscroll-behavior: contain;">
  115. <div class="container" id="player">
  116. <div class="muted" id="btnMuted">
  117. <div class="control-right-img" data-id="1">
  118. <img src="../static/img/xuanfu_icon.png">
  119. </div>
  120. </div>
  121. <div id="wine">
  122. <div id="box">
  123. <canvas id="playCanvas" width="450" height="800"></canvas>
  124. </div>
  125. </div>
  126. <div class="leftmains">
  127. <div class="PictureQualityMain">
  128. <div class="PictureQuality" data-id="4">高清</div>
  129. <div class="PictureQuality avit" data-id="3">标清</div>
  130. <div class="PictureQuality" data-id="2">极速</div>
  131. </div>
  132. <div class="operation">
  133. <div class="upload" id="showsuss" data-text="uploads">
  134. <img src="../static/img/wx/shangchuan_icon.png">
  135. <div>上传</div>
  136. </div>
  137. <div class="upload" onclick="showShearPlate()" data-text="Shearplate">
  138. <img src="../static/img/wx/jianqieban_icon.png">
  139. <div>剪贴板</div>
  140. </div>
  141. <div class="upload" id="upload" data-text="Signout">
  142. <img src="../static/img/wx/tuichu_icon.png">
  143. <div>退出</div>
  144. </div>
  145. </div>
  146. </div>
  147. <div class="bottommains">
  148. <div class="botmat1">
  149. <div class="botmat1img" data-text="gengduo">
  150. <img src="../static/img/wx/gengduo_icon.png">
  151. </div>
  152. </div>
  153. <div class="botmat1">
  154. <div class="botmat1img" data-text="home">
  155. <img src="../static/img/wx/home_icon.png">
  156. </div>
  157. </div>
  158. <div class="botmat1">
  159. <div class="botmat1img" data-text="return">
  160. <img src="../static/img/wx/fanhui_icon.png">
  161. </div>
  162. </div>
  163. </div>
  164. <img class="loading loading_sceen_pic" />
  165. </div>
  166. <div class="mask">
  167. <div class="box-shear-plate"></div>
  168. <img class="close" onclick="handleClose()" src="img/guanbi_icon@2x.png" alt="">
  169. </div>
  170. <div class="weui-mask_transparent"></div>
  171. <div class="weui-toast weui_loading_toast weui-toast--visible">
  172. <div class="weui_loading"><i class="weui-loading weui-icon_toast"></i></div>
  173. <p class="weui-toast_content">数据加载中</p>
  174. </div>
  175. <div class="try-use-wrap">
  176. <div class="try-use-container">
  177. <video width="100%" height="100%" id="source" muted autoplay="autoplay" loop="loop">
  178. 您的浏览器不支持 video 标签。
  179. </video>
  180. <div class="time-close-wrap"><span class="time-node"></span> 关闭</div>
  181. </div>
  182. </div>
  183. <div class="buy-phone-wrap">
  184. <div class="bug-wrap">
  185. <div class="bug-title">获得极致体验服务请购买云手机</div>
  186. <div class="btn-list">
  187. <div class="btn cannel-btn">取消</div>
  188. <div class="btn go-bug">去购买</div>
  189. </div>
  190. </div>
  191. </div>
  192. <div class="look-wrap">
  193. <div class="bug-wrap">
  194. <div class="bug-title">关闭广告会退出云手机是否继续观看</div>
  195. <div class="btn-list">
  196. <div class="btn cannel-btn cannel-ad-btn">放弃</div>
  197. <div class="btn go-bug looking">继续观看</div>
  198. </div>
  199. </div>
  200. </div>
  201. <script type="text/javascript" src="https://js.cdn.aliyun.dcloud.net.cn/dev/uni-app/uni.webview.1.5.2.js"></script>
  202. <script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>
  203. <script src="https://lf1-cdn-tos.bytegoofy.com/goofy/developer/jssdk/jssdk-1.0.3.js"></script>
  204. <script type="text/javascript" src="jquery-1.11.0.min.js"></script>
  205. <!-- ffm软解 -->
  206. <script type="text/javascript" src="helper.js"></script>
  207. <script type="text/javascript" src="jquery-weui.min.js"></script>
  208. <script type="text/javascript" src="pcm-player.js"></script>
  209. <script type="text/javascript" src="webgl.js"></script>
  210. <script type="text/javascript" src="https://cdn.bootcss.com/vConsole/3.2.0/vconsole.min.js"></script>
  211. <script type="text/javascript" src="WXdraw.js"></script>
  212. <script type="text/javascript">
  213. $(function () {
  214. //手指滑动多少距离就认为是滑成功
  215. //这个值不能太大,否则影响斜着滑动时,垂直滑动的流畅性,也不能太小,太灵敏也不好
  216. var diffXDistance = 50;
  217. //当前滑动的对象
  218. var currentObject;
  219. //上一次滑动的对象
  220. var lastObject;
  221. //是否可以左右滑动,在上下滑的时候禁止左右滑
  222. var canSlide = true;
  223. //用于记录按下的点
  224. var startPoint;
  225. $(".slide-content").css({
  226. width: $(".slide-wrapper").width()
  227. });
  228. $(".slide-scroll").css({
  229. width: $(".slide-wrapper").width() + $(".slide-content-button").width()
  230. })
  231. .on('touchstart', function (e) {
  232. currentObject = this;
  233. startPoint = {
  234. x: e.originalEvent.changedTouches[0].pageX,
  235. y: e.originalEvent.changedTouches[0].pageY
  236. };
  237. })
  238. .on('touchmove', function (e) {
  239. //如果是左右滑动,就禁止上下的滑动
  240. //如果是上下的滑动,就禁止左右滑动
  241. if (Math.abs(e.originalEvent.changedTouches[0].pageX - startPoint.x) > Math.abs(e.originalEvent.changedTouches[0].pageY - startPoint.y)) {
  242. event.preventDefault();
  243. } else {
  244. canSlide = false;
  245. }
  246. })
  247. .on('touchend', function (e) {
  248. //如果是上下滑动,这里就直接返回了
  249. if (!canSlide) {
  250. canSlide = true;
  251. return true;
  252. }
  253. //点击除当前左滑对象之外的任意其他位置
  254. if (lastObject && currentObject != lastObject) {
  255. //右滑→
  256. $(lastObject).removeClass("animate-slide");
  257. //清空上一个左滑的对象
  258. lastObject = undefined;
  259. }
  260. var diffX = e.originalEvent.changedTouches[0].pageX - startPoint.x;
  261. if (diffX < -diffXDistance) {
  262. //左滑←
  263. $(currentObject).addClass("animate-slide");
  264. if (lastObject && lastObject != currentObject) {
  265. //右滑→
  266. $(lastObject).removeClass("animate-slide");
  267. }
  268. //记录上一个左滑的对象
  269. lastObject = currentObject;
  270. } else if (diffX >= diffXDistance) {
  271. if (currentObject == lastObject) {
  272. //右滑→
  273. $(currentObject).removeClass("animate-slide");
  274. //清空上一个左滑的对象
  275. lastObject = undefined;
  276. }
  277. }
  278. });
  279. });
  280. </script>
  281. <script>
  282. var videoTimer = null, videoTime = 0, adType = 0, sourceType = 0, disconnectionFlag = false, getDate = false;
  283. var topwinHeight = window.screen.height - window.innerHeight + 30; //计算title top 头部
  284. var url = window.location.href;
  285. url = url.split('/');
  286. var baseUrl = url[0] + '//' + url[2];
  287. console.log(baseUrl)
  288. var parameters = GetRequest();
  289. var form = {};
  290. form.token = parameters['token'];
  291. form.mealType = parameters['mealType'];
  292. form.userCardId = parameters['userCardId'];
  293. if (parameters['mealType'] === 'VIP') {
  294. $(".loading_sceen_pic").attr('src', '../static/img/home_bg_VIP.png');
  295. } else if (parameters['mealType'] === 'SVIP') {
  296. $(".loading_sceen_pic").attr('src', '../static/img/home_bg_SVIP.png');
  297. } else if (parameters['mealType'] === 'STAR') {
  298. $(".loading_sceen_pic").attr('src', '../static/img/home_bg_STAR.png');
  299. } else if (parameters['mealType'] === 'STARPRO') {
  300. $(".loading_sceen_pic").attr('src', '../static/img/home_bg_PRO.png');
  301. }
  302. $('#wine').css({
  303. "width": window.screen.width,
  304. "height": window.screen.height - topwinHeight - 20,
  305. "position": "absolute"
  306. })
  307. $('.loading').css({
  308. "width": window.screen.width,
  309. "height": window.screen.height - topwinHeight - 20
  310. });
  311. var winese = document.createElement("wine");
  312. wine.style.top = "-" + winese + 'px';
  313. var isAudioPlay = false;
  314. adInit();
  315. $.alert({
  316. title: '提示',
  317. text: '开始使用云手机',
  318. onOK: function () {
  319. isAudioPlay = true;
  320. }
  321. });
  322. //云机倒计时
  323. let validTime = parameters['validTime'] || 10000;
  324. if(validTime > 32000) {
  325. validTime = 32000;
  326. }
  327. let detailTime = validTime * 60 * 1000;
  328. setTimeout(() => {
  329. $('.bug-title').eq(0).text('尊敬的用户您的云手机试用时间已到期');
  330. getDate = true;
  331. $('.buy-phone-wrap').eq(0).show();
  332. }, detailTime)
  333. var orientation = 0; //0 竖屏,1横屏
  334. function array_unique(arr) {
  335. return arr.filter(function (e, i) {
  336. return arr.indexOf(e) === i;
  337. })
  338. }
  339. var cutList = [];
  340. let timer, isFlag = true;
  341. function showShearPlate() {
  342. stopManyClick(() => {
  343. $('.box-shear-plate').empty();
  344. $.ajax({
  345. url: baseUrl + "/api/public/v5/shear/content",
  346. headers: {
  347. 'Authorization': form.token
  348. },
  349. type: 'get',
  350. dataType: 'json',
  351. success: function (res) {
  352. if (res.status === 0) {
  353. if (res.data.length) {
  354. cutList = array_unique(res.data)
  355. var str = '<div class="title">剪贴板<div onclick="handleClear()" class="btn-clear">清空</div></div><div class="slide-wrapper-content">'
  356. cutList.forEach(function (item) {
  357. 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>"
  358. })
  359. str += '</div>'
  360. $('.box-shear-plate').append(str);
  361. } else {
  362. $('.box-shear-plate').append('<img class="empty" src="img/jianqieban_pic@2x.png" alt="" /><div class="empty-txt">剪贴板为空</div>')
  363. }
  364. $('.mask').show();
  365. initSlider();
  366. } else {
  367. $('.box-shear-plate').append('<img class="empty" src="img/jianqieban_pic@2x.png" alt="" /><div class="empty-txt">剪贴板为空</div>')
  368. $('.mask').show();
  369. }
  370. }
  371. })
  372. })
  373. }
  374. //防止提示一秒内重复显示
  375. function stopManyClick(fn) {
  376. if (isFlag) {
  377. fn();
  378. }
  379. isFlag = false;
  380. if (timer) { clearTimeout(timer); }
  381. timer = setTimeout(() => { isFlag = true }, 1500);
  382. }
  383. // 清空剪贴板
  384. function handleClear() {
  385. var ids = '';
  386. cutList.forEach(function (item) {
  387. ids += 'ids=' + item.id + '&'
  388. });
  389. ids = ids.substring(0, ids.lastIndexOf('&'));
  390. $.confirm("确定清空剪贴板?", function () {
  391. $.ajax({
  392. url: baseUrl + "/api/public/v5/shear/content?" + ids,
  393. headers: {
  394. 'Authorization': form.token
  395. },
  396. type: 'DELETE',
  397. dataType: 'json',
  398. success: function (res) {
  399. if (res.status === 0) {
  400. showShearPlate();
  401. } else {
  402. $.toast(res.msg, "text");
  403. }
  404. }
  405. })
  406. });
  407. }
  408. function handleCopy(content) {
  409. var cutting = {
  410. "type": "cutting",
  411. "data": {
  412. "str": content
  413. }
  414. }
  415. wsss.send(JSON.stringify(cutting));
  416. }
  417. // 删除剪贴板
  418. function handleDelete(id) {
  419. $.ajax({
  420. url: baseUrl + "/api/public/v5/shear/content?ids=" + id,
  421. headers: {
  422. 'Authorization': form.token
  423. },
  424. type: 'DELETE',
  425. dataType: 'json',
  426. success: function (res) {
  427. if (res.status === 0) {
  428. showShearPlate();
  429. } else {
  430. $.toast(res.msg, "text");
  431. }
  432. }
  433. })
  434. }
  435. function initSlider() {
  436. //手指滑动多少距离就认为是滑成功
  437. //这个值不能太大,否则影响斜着滑动时,垂直滑动的流畅性,也不能太小,太灵敏也不好
  438. var diffXDistance = 50;
  439. //当前滑动的对象
  440. var currentObject;
  441. //上一次滑动的对象
  442. var lastObject;
  443. //是否可以左右滑动,在上下滑的时候禁止左右滑
  444. var canSlide = true;
  445. //用于记录按下的点
  446. var startPoint;
  447. $(".slide-content").css({
  448. width: $(".slide-wrapper").width()
  449. });
  450. document.body.removeEventListener('touchmove', function (e) {
  451. e.preventDefault()
  452. }, {
  453. passive: false
  454. })
  455. $(".slide-scroll").css({
  456. width: $(".slide-wrapper").width() + $(".slide-content-button").width()
  457. })
  458. .on('touchstart', function (e) {
  459. currentObject = this;
  460. startPoint = {
  461. x: e.originalEvent.changedTouches[0].pageX,
  462. y: e.originalEvent.changedTouches[0].pageY
  463. };
  464. })
  465. .on('touchmove', function (e) {
  466. //如果是左右滑动,就禁止上下的滑动
  467. //如果是上下的滑动,就禁止左右滑动
  468. if (Math.abs(e.originalEvent.changedTouches[0].pageX - startPoint.x) > Math.abs(e.originalEvent.changedTouches[0].pageY - startPoint.y)) {
  469. event.preventDefault();
  470. } else {
  471. canSlide = false;
  472. }
  473. })
  474. .on('touchend', function (e) {
  475. //如果是上下滑动,这里就直接返回了
  476. if (!canSlide) {
  477. canSlide = true;
  478. return true;
  479. }
  480. //点击除当前左滑对象之外的任意其他位置
  481. if (lastObject && currentObject != lastObject) {
  482. //右滑→
  483. $(lastObject).removeClass("animate-slide");
  484. //清空上一个左滑的对象
  485. lastObject = undefined;
  486. }
  487. var diffX = e.originalEvent.changedTouches[0].pageX - startPoint.x;
  488. if (diffX < -diffXDistance) {
  489. //左滑←
  490. $(currentObject).addClass("animate-slide");
  491. if (lastObject && lastObject != currentObject) {
  492. //右滑→
  493. $(lastObject).removeClass("animate-slide");
  494. }
  495. //记录上一个左滑的对象
  496. lastObject = currentObject;
  497. } else if (diffX >= diffXDistance) {
  498. if (currentObject == lastObject) {
  499. //右滑→
  500. $(currentObject).removeClass("animate-slide");
  501. //清空上一个左滑的对象
  502. lastObject = undefined;
  503. }
  504. }
  505. });
  506. }
  507. var btnMuted = document.querySelector("#btnMuted");
  508. btnMuted && (function () {
  509. var setHistory = function (left, top) {
  510. try {
  511. localStorage.setItem("muted-btn-loc", JSON.stringify({
  512. left: left,
  513. top: top
  514. }));
  515. } catch (ex) { }
  516. };
  517. var getHistory = function () {
  518. try {
  519. var value = localStorage.getItem("muted-btn-loc");
  520. if (!value) return null;
  521. value = JSON.parse(value);
  522. if (!value) return null;
  523. return value;
  524. } catch (ex) {
  525. return null
  526. }
  527. };
  528. var fixLoc = function (loc) {
  529. var rect = btnMuted.getBoundingClientRect();
  530. rect = {
  531. top: rect.top,
  532. left: rect.left,
  533. width: rect.width,
  534. height: rect.height
  535. }; // 部分低版本浏览器,该属性为只读
  536. if (loc) {
  537. rect.left = loc.left;
  538. rect.top = loc.top;
  539. }
  540. var minX = 0;
  541. var minY = 0;
  542. var docRect = document.documentElement.getBoundingClientRect();
  543. var maxY = docRect.height - rect.height;
  544. var maxX = docRect.width - rect.width;
  545. var left = rect.left;
  546. var top = rect.top;
  547. left = Math.min(left, maxX);
  548. left = Math.max(left, minX);
  549. top = Math.min(top, maxY);
  550. top = Math.max(top, minY);
  551. if (loc || top !== rect.top || left !== rect.left) {
  552. btnMuted.style.cssText += "left:" + left + "px;top:" + top + "px;";
  553. }
  554. }
  555. window.addEventListener("resize", function () {
  556. fixLoc();
  557. });
  558. var touchPoint = {
  559. pageY: 0,
  560. pageX: 0
  561. };
  562. var currentLoc = {
  563. top: 0,
  564. left: 0,
  565. curTop: 0,
  566. curLeft: 0
  567. };
  568. var toMove = false;
  569. var touchmove = function (e) {
  570. e.preventDefault();
  571. var point = e.changedTouches[0];
  572. var top = -touchPoint.pageY + point.pageY;
  573. var left = -touchPoint.pageX + point.pageX;
  574. if (toMove) {
  575. top += currentLoc.top;
  576. left += currentLoc.left;
  577. currentLoc.curLeft = left;
  578. currentLoc.curTop = top;
  579. btnMuted.style.cssText += "left:" + left + "px;top:" + top + "px;";
  580. } else {
  581. if (Math.abs(top) >= 5 || Math.abs(left) >= 5) {
  582. toMove = true;
  583. }
  584. }
  585. };
  586. var touchend = function () {
  587. window.removeEventListener("touchmove", touchmove, {
  588. passive: false
  589. });
  590. window.removeEventListener("touchend", touchend, {
  591. passive: false
  592. });
  593. if (toMove) {
  594. setHistory(currentLoc.curLeft, currentLoc.curTop);
  595. fixLoc();
  596. } else {
  597. //按点击处理
  598. var set = $('.control-right-img').attr("data-id")
  599. if (set == '1') {
  600. $('.control-right-img').attr({
  601. "data-id": "2"
  602. })
  603. $(".leftmains").css({
  604. "right": "0rem"
  605. })
  606. } else {
  607. $('.control-right-img').attr({
  608. "data-id": "1"
  609. })
  610. $(".leftmains").css({
  611. "right": "-4rem"
  612. })
  613. }
  614. }
  615. }
  616. btnMuted.addEventListener("touchstart", function (e) {
  617. e.preventDefault();
  618. toMove = false;
  619. var point = e.changedTouches[0];
  620. touchPoint.pageX = point.pageX;
  621. touchPoint.pageY = point.pageY;
  622. var rect = e.target.getBoundingClientRect();
  623. currentLoc.top = rect.top;
  624. currentLoc.left = rect.left;
  625. window.addEventListener("touchmove", touchmove, {
  626. passive: false
  627. });
  628. window.addEventListener("touchend", touchend, {
  629. passive: false
  630. });
  631. }, {
  632. passive: false
  633. });
  634. var history = getHistory();
  635. if (history) {
  636. fixLoc(history);
  637. }
  638. btnMuted.classList.remove("hide");
  639. })();
  640. $("#upload").on("click", function () {
  641. decodeWoker.postMessage('close');
  642. decodeWoker.terminate();
  643. webSocketWorker.terminate();
  644. if (navigator.userAgent.toLowerCase().includes('toutiaomicroapp')) {
  645. tt.miniProgram.switchTab({
  646. url: '/pages/home/home'
  647. })
  648. } else if(window.__wxjs_environment === 'miniprogram') {
  649. wx.miniProgram.switchTab({
  650. url: '/pages/home/home'
  651. })
  652. } else {
  653. location.href = 'http://14.18.190.141:1280/cloud/phone/web/#/pages/index/index'
  654. // 动态设置有问题 https://ask.dcloud.net.cn/question/96060
  655. // document.addEventListener('UniAppJSBridgeReady', function() {
  656. // console.log(222)
  657. // uni.navigateTo({
  658. // url: '/pages/index/index'
  659. // });
  660. // })
  661. }
  662. })
  663. function handleClose() {
  664. $('.mask').hide();
  665. }
  666. var decodeCount = 1;
  667. var isFinish = false;
  668. var player = new PCMPlayer({
  669. encoding: '16bitInt',
  670. channels: 2,
  671. sampleRate: 44100,
  672. flushingTime: 22,
  673. debug: false
  674. });
  675. Module = {};
  676. Module.onRuntimeInitialized = function () {
  677. isFinish = true;
  678. }
  679. function decodeAAC(data) {
  680. var retPtr = Module._malloc(4 * 5 * 1024); //接收的数据
  681. var inputPtr = Module._malloc(4 * data.length); //输入数据
  682. for (var i = 0; i < data.length; i++) {
  683. Module.HEAPU8[(inputPtr) + i] = data[i]; //转换为堆数据
  684. }
  685. var pcmLen = Module._feedData(retPtr, inputPtr, data.length);
  686. if (pcmLen >= 0) {
  687. var pcmData = new Uint8Array(pcmLen);
  688. for (var i = 0; i < pcmLen; i++) {
  689. pcmData[i] = Module.HEAPU8[(retPtr) + i]
  690. }
  691. player.feed(pcmData);
  692. }
  693. decodeCount++;
  694. Module._free(inputPtr);
  695. Module._free(retPtr);
  696. }
  697. var decodeWoker = new Worker('decoder.js');
  698. var myVideo = document.getElementById("playCanvas");
  699. var logicWidth = 720;
  700. var logicHeight = 1280;
  701. decodeWoker.onmessage = function (event) {
  702. var objData = event.data;
  703. switch (objData.cmd) {
  704. case 0:
  705. break;
  706. case 1:
  707. if (logicWidth != objData.width || logicHeight != objData.height) {
  708. logicWidth = objData.width;
  709. logicHeight = objData.height;
  710. }
  711. webglPlayer.renderFrame(objData.data, logicWidth, logicHeight, logicWidth * logicHeight, (logicWidth / 2) * (logicHeight / 2));
  712. $('.weui-mask_transparent').hide()
  713. $('.weui-toast').hide()
  714. $('.loading').hide()
  715. break;
  716. case 5:
  717. var buffer = RequestIFrame();
  718. webSocketWorker.postMessage(buffer);
  719. }
  720. }
  721. var isFinish = false;
  722. var webglPlayer = new WebGLPlayer(myVideo, {
  723. preserveDrawingBuffer: false
  724. });
  725. function GetRequest() {
  726. var url = location.search; // 获取url中"?"符后的字串
  727. var obj = new Object();
  728. if (url.indexOf("?") != -1) {
  729. var str = url.substr(1);
  730. strs = str.split("&");
  731. for (var i = 0; i < strs.length; i++) {
  732. obj[strs[i].split("=")[0]] = (strs[i].split("=")[1]);
  733. }
  734. }
  735. return obj;
  736. }
  737. var ip = parameters["ip"];
  738. var appletPushAddress = parameters["appletPushAddress"];
  739. var token = parameters["cardToken"];
  740. var webSocketWorker = new Worker('websocket.js?ip=' + ip + '&appletPushAddress=' + appletPushAddress + '&token=' + token);
  741. webSocketWorker.onmessage = function (event) {
  742. var input = event.data;
  743. if (input[0] == 0xff && isAudioPlay) {
  744. decodeAAC(input);
  745. }
  746. if (input[0] == 0 && input[1] == 0 && input[2] == 0 && input[3] == 1) {
  747. var cmd = {
  748. type: "rawData",
  749. data: event.data
  750. };
  751. decodeWoker.postMessage(cmd);
  752. }
  753. if (input[0] == 0x68) {
  754. if (input[23] == 0x5c) {
  755. if (CheckVerifyCode(input)) {
  756. webSocketWorker.postMessage(ConfigChannel('RK3923C1201900139'));
  757. var checkBuffer = GetScreenState();
  758. webSocketWorker.postMessage(checkBuffer);
  759. }
  760. else {
  761. $.toast("画面异常,请重新进入", "text");
  762. decodeWoker.postMessage('close');
  763. decodeWoker.terminate();
  764. webSocketWorker.terminate();
  765. if (navigator.userAgent.toLowerCase().includes('toutiaomicroapp')) {
  766. tt.miniProgram.switchTab({
  767. url: '/pages/home/home'
  768. })
  769. } else if(window.__wxjs_environment === 'miniprogram') {
  770. wx.miniProgram.switchTab({
  771. url: '/pages/home/home'
  772. })
  773. } else {
  774. location.href = `${baseUrl}/cloud/phone/web/#/pages/index/index`
  775. // document.addEventListener('UniAppJSBridgeReady', function() {
  776. // uni.navigateTo({
  777. // url: '/pages/index/index'
  778. // });
  779. // })
  780. }
  781. }
  782. }
  783. if (input[23] == 0x05) { //横竖屏标识
  784. var state = CheckScreenDirection(input.slice(24, 24 + 8));
  785. if (state == 1) {
  786. console.log("安卓卡此时竖屏");
  787. //竖屏处理
  788. resolving = 1;
  789. } else {
  790. console.log("安卓卡此时横屏");
  791. //横屏处理
  792. resolving = 0;
  793. }
  794. }
  795. if (input[23] == 0x0b) {
  796. console.log("多端登陆");
  797. }
  798. }
  799. if (event.data === 'close') {
  800. $.toast("画面异常,请重新进入", "text");
  801. decodeWoker.postMessage('close');
  802. decodeWoker.terminate();
  803. webSocketWorker.terminate();
  804. if (navigator.userAgent.toLowerCase().includes('toutiaomicroapp')) {
  805. tt.miniProgram.switchTab({
  806. url: '/pages/home/home'
  807. })
  808. } else if(window.__wxjs_environment === 'miniprogram') {
  809. wx.miniProgram.switchTab({
  810. url: '/pages/home/home'
  811. })
  812. } else {
  813. location.href = `${baseUrl}/cloud/phone/web/#/pages/index/index`
  814. // document.addEventListener('UniAppJSBridgeReady', function() {
  815. // uni.navigateTo({
  816. // url: '/pages/index/index'
  817. // });
  818. // })
  819. }
  820. }
  821. }
  822. // 激活码广告相关配置
  823. function getConfigByPhoneType() {
  824. console.log('form', form)
  825. return new Promise((resolve, reject) => {
  826. $.ajax({
  827. url: baseUrl + "/api/pay/v5/trialCodeConfig/getConfigByPhoneType",
  828. headers: {
  829. 'Authorization': form.token
  830. },
  831. data: {
  832. userCardId: form.userCardId,
  833. phoneType: form.mealType
  834. },
  835. type: 'get',
  836. dataType: 'json',
  837. success: function (res) {
  838. console.log(res)
  839. let obj = res.data;
  840. if (res.status === 0) {
  841. resolve(obj)
  842. } else {
  843. $.toast(res.msg, "text");
  844. }
  845. }
  846. })
  847. })
  848. }
  849. //列表
  850. function getSetmealList() {
  851. return new Promise((resolve, reject) => {
  852. $.ajax({
  853. url: baseUrl + "/api/resources/v4/freetrial/setmeal/list",
  854. headers: {
  855. 'Authorization': form.token
  856. },
  857. type: 'get',
  858. dataType: 'json',
  859. success: function (res) {
  860. if (res.status === 0) {
  861. let list = res.data;
  862. list.map((item) => {
  863. if(item.phoneType === parameters['mealType']){
  864. resolve(item)
  865. }
  866. })
  867. } else {
  868. $.toast(res.msg, "text");
  869. }
  870. }
  871. })
  872. })
  873. }
  874. //广告信息
  875. function adInit() {
  876. sourceType = parameters['sourceType'];
  877. if(sourceType == 1) {
  878. getSetmealList().then((res) => {
  879. if(res.pushFlowAdvert === 1){
  880. getAdList(15);
  881. }
  882. if(res.intervalSwitch === 1) {
  883. let time = res.intervalAdvertDuration * 60 * 1000;
  884. setInterval(() => {
  885. $('.try-use-wrap').eq(0).hide();
  886. getAdList(16);
  887. }, time);
  888. }
  889. })
  890. }else if(sourceType == 2) {
  891. getConfigByPhoneType().then((res) => {
  892. if(res.isDisconnectionTime === 1){
  893. let time = res.disconnectionTime * 60 * 1000;
  894. setTimeout(() => {
  895. disconnectionFlag = true;
  896. $('.buy-phone-wrap').eq(0).show();
  897. }, time);
  898. }
  899. if(res.isShowAd === 1){
  900. getAdList(15);
  901. }
  902. if(res.isIntervalPlayAd === 1) {
  903. let time = res.intervalPlayAdTime * 60 * 1000;
  904. setInterval(() => {
  905. $('.try-use-wrap').eq(0).hide();
  906. getAdList(16);
  907. }, time);
  908. }
  909. })
  910. }
  911. }
  912. // 广告接口
  913. function getAdList(type){
  914. adType = type;
  915. $.ajax({
  916. url: baseUrl + "/api/public/v5/advertising/getAdInfoByAdPlace",
  917. headers: {
  918. 'Authorization': form.token
  919. },
  920. data: JSON.stringify({
  921. adPlace: type,
  922. os: 0
  923. }),
  924. type: 'POST',
  925. dataType: 'json',
  926. contentType: "application/json;charset=UTF-8",
  927. success: function (res) {
  928. if (res.status === 0) {
  929. let list = res.data;
  930. let indexs = Math.floor(Math.random()*list.length);
  931. videoTime = list[indexs].forcedTime;
  932. // $('#source').src = list[0].adVideoBase.videoUrl;
  933. $("#source").attr("src", list[indexs].adVideoBase.videoUrl);//更新url
  934. $("#source").attr("autoplay", "true");//直接播放
  935. videoTimer = setInterval(() =>{
  936. if(videoTime > 0) {
  937. videoTime--;
  938. $('.time-node').eq(0).text(videoTime + 's');
  939. } else {
  940. clearInterval(videoTimer);
  941. $('.time-node').eq(0).text('');
  942. }
  943. },1000)
  944. if (adType === 16 && sourceType == 1) { // 间隔广告和试用才上报
  945. report(0);
  946. }
  947. $('.try-use-wrap').eq(0).show();
  948. } else {
  949. $.toast(res.msg, "text");
  950. }
  951. }
  952. })
  953. }
  954. //间隔广告上报
  955. function report(type) {
  956. $.ajax({
  957. url: baseUrl + "/api/resources/v1/trial/report",
  958. headers: {
  959. 'Authorization': form.token
  960. },
  961. data: JSON.stringify({
  962. userCardId: form.userCardId,
  963. reportType: type
  964. }),
  965. type: 'POST',
  966. dataType: 'json',
  967. contentType: "application/json;charset=UTF-8",
  968. success: function (res) {}
  969. })
  970. }
  971. //关闭广告
  972. $('.time-close-wrap')[0].addEventListener('click', () => {
  973. $('.buy-phone-wrap').eq(0).show();
  974. })
  975. // 点击取消
  976. $('.cannel-btn')[0].addEventListener('click', () => {
  977. $('.buy-phone-wrap').eq(0).hide();
  978. if (disconnectionFlag || getDate) {//设置了断线时间,取消直接退出
  979. systemBuriedPoint('激活码-断线-取消');
  980. wx.miniProgram.switchTab({
  981. url: '/pages/home/home'
  982. })
  983. return
  984. }
  985. let pointName = '';
  986. if(sourceType == 1){
  987. pointName = videoTime == 0 ? '免费试用-关闭-取消' : '免费试用-强制关闭-取消';
  988. } else {
  989. pointName = videoTime == 0 ? '激活码-关闭-取消' : '激活码-强制关闭-取消';
  990. }
  991. systemBuriedPoint(pointName);
  992. if(videoTime == 0) {
  993. if (adType === 16 && sourceType == 1) {
  994. report(1);
  995. }
  996. $('.try-use-wrap').eq(0).hide();
  997. return
  998. }
  999. $('.look-wrap').eq(0).show();
  1000. })
  1001. // 点击去购买
  1002. $('.go-bug')[0].addEventListener('click', () => {
  1003. let pointName = '';
  1004. if(disconnectionFlag) {
  1005. pointName = '激活码-断线-去购买';
  1006. } else if(sourceType == 1){
  1007. pointName = videoTime == 0 ? '免费试用-关闭-去购买' : '免费试用-强制关闭-去购买';
  1008. } else {
  1009. pointName = videoTime == 0 ? '激活码-关闭-去购买' : '激活码-强制关闭-去购买';
  1010. }
  1011. systemBuriedPoint(pointName);
  1012. if(getDate){
  1013. wx.miniProgram.navigateTo({
  1014. url: '/packageA/order/buy/index'
  1015. })
  1016. } else {
  1017. wx.miniProgram.navigateTo({
  1018. url: '/packageA/order/renew/index?record=' + form.userCardId
  1019. })
  1020. }
  1021. })
  1022. // 放弃
  1023. $('.cannel-ad-btn')[0].addEventListener('click', () => {
  1024. if(sourceType == 1){
  1025. systemBuriedPoint('免费试用-强制关闭-放弃');
  1026. } else {
  1027. systemBuriedPoint('激活码-强制关闭-放弃');
  1028. }
  1029. wx.miniProgram.switchTab({
  1030. url: '/pages/home/home'
  1031. })
  1032. })
  1033. // 继续观看
  1034. $('.looking')[0].addEventListener('click', () => {
  1035. $('.look-wrap').eq(0).hide();
  1036. if(sourceType == 1){
  1037. systemBuriedPoint('免费试用-强制关闭-继续观看');
  1038. } else {
  1039. systemBuriedPoint('激活码-强制关闭-继续观看');
  1040. }
  1041. })
  1042. // 埋点
  1043. function systemBuriedPoint(pointName){
  1044. $.ajax({
  1045. url: baseUrl + "/api/public/v1/systemBuriedPoint/stat",
  1046. headers: {
  1047. 'Authorization': form.token
  1048. },
  1049. type: 'post',
  1050. data:JSON.stringify({
  1051. pointName: pointName
  1052. }),
  1053. contentType:"application/json",
  1054. dataType: 'json',
  1055. success: function (res) {}
  1056. })
  1057. }
  1058. function Close() { // webworker 关闭,清理
  1059. var cmd = {
  1060. cmd: 0
  1061. };
  1062. decodeWoker.postMessage(cmd);
  1063. decodeWoker.terminate();
  1064. webSocketWorker.postMessage(cmd);
  1065. webSocketWorker.terminate();
  1066. }
  1067. var isDrag = false;
  1068. myVideo.onkeydown = function (event) {
  1069. ExexuteKeyDown(e.keyCode);
  1070. }
  1071. var level = 2;
  1072. function switchSharpness() {
  1073. var cmd = {
  1074. type: "switchSharpness",
  1075. };
  1076. decodeWoker.postMessage(cmd);//通知解码器worker切换分辨率
  1077. var buffer = makeSharpness(level);
  1078. webSocketWorker.postMessage(buffer);
  1079. if (level < 4) {
  1080. level++;
  1081. } else {
  1082. level = 0;
  1083. }
  1084. }
  1085. window.onbeforeunload = function () {
  1086. wsss.close();
  1087. decodeWoker.postMessage('close');
  1088. decodeWoker.terminate();
  1089. webSocketWorker.terminate();
  1090. }
  1091. </script>
  1092. <script type="text/javascript" src="aac.js"></script>
  1093. </body>
  1094. </html>