WXtrialInterface.html 61 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770177117721773177417751776177717781779178017811782178317841785178617871788178917901791179217931794179517961797179817991800180118021803180418051806180718081809181018111812181318141815181618171818181918201821182218231824182518261827182818291830183118321833183418351836183718381839184018411842184318441845184618471848184918501851185218531854185518561857185818591860186118621863186418651866186718681869187018711872187318741875187618771878187918801881188218831884188518861887188818891890189118921893189418951896189718981899190019011902190319041905190619071908190919101911191219131914191519161917191819191920192119221923192419251926192719281929193019311932193319341935193619371938193919401941194219431944194519461947194819491950195119521953
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8" />
  5. <title>云手机</title>
  6. <!-- 告诉 IE 浏览器使用最新的渲染引擎(Edge 模式)来渲染页面,而不是使用旧的兼容模式。这可以确保页面在 IE 浏览器中以最佳方式显示。 -->
  7. <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  8. <!-- 强制页面在移动设备上以竖屏模式显示 portrait 表示页面只能以竖屏模式显示 -->
  9. <meta name="x5-orientation" content="portrait" />
  10. <!-- 与 x5-orientation 类似,用于指定页面的方向 -->
  11. <meta name="screen-orientation" content="portrait" />
  12. <!-- 控制页面在移动设备上的视口(viewport)行为 -->
  13. <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no,shrink-to-fit=no,viewport-fit=cover" />
  14. <!-- 允许网页应用以全屏模式运行 当用户将网页添加到主屏幕后,点击图标打开时,页面会以全屏模式显示,隐藏浏览器的地址栏和导航栏。适用于将网页应用伪装成原生应用的场景-->
  15. <meta name="apple-mobile-web-app-capable" content="yes" />
  16. <!-- 控制页面在 iOS 设备上的全屏模式和状态栏颜色 -->
  17. <meta name="apple-mobile-web-app-status-bar-style" content="black" />
  18. <!-- 禁止自动识别电话号码和邮箱地址 -->
  19. <meta name="format-detection" content="telphone=no, email=no" />
  20. <!-- 忽略页面中的数字识别为电话,忽略email识别 -->
  21. <!-- 启用360浏览器的极速模?(webkit) -->
  22. <meta name="renderer" content="webkit" />
  23. <!-- 针对手持设备优化,主要是针对一些老的不识别viewport的浏览器,比如黑? -->
  24. <meta name="HandheldFriendly" content="true" />
  25. <!-- 微软的老式浏览? -->
  26. <meta name="MobileOptimized" content="320" />
  27. <!-- 不能旋转,问题出在这 -->
  28. <!-- UC强制全屏 -->
  29. <meta name="full-screen" content="yes" />
  30. <!-- QQ强制全屏 -->
  31. <meta name="x5-fullscreen" content="true" />
  32. <!-- UC应用模式 -->
  33. <meta name="browsermode" content="application" />
  34. <!-- QQ应用模式 -->
  35. <meta name="x5-page-mode" content="app" />
  36. <!-- 禁用 Windows Phone 8 及更高版本中的灰色点击高亮 -->
  37. <meta name="msapplication-tap-highlight" content="no" />
  38. <link rel="stylesheet" type="text/css" href="css/WXtrialInterface.css" />
  39. <link rel="stylesheet" href="../static/css/weui.min.css" />
  40. <link rel="stylesheet" href="../static/css/jquery-weui.min.css" />
  41. <!-- <link rel="stylesheet" href="../static/lib/swiper/swiper-bundle.min.css" />
  42. <script src="../static/lib/swiper/swiper-bundle.js"></script> -->
  43. <script src="../static/lib/doT-1.1.3/doT.min.js"></script>
  44. <script src="../static/lib/qs.js"></script>
  45. <script src="../static/lib/copy-to-clipboard.js"></script>
  46. </head>
  47. <body class="scroll h-player" style="overscroll-behavior: contain">
  48. <template id="template-phone-size-item">
  49. {{~ it.list :value:index }}
  50. <div class="phone-size-item {{? value.width === it.active.width && value.height === it.active.height }}active{{?}}" data-id="{{= value.id }}" data-dpi="{{= value.dpi }}" data-width="{{= value.width }}" data-height="{{= value.height }}">
  51. <span>{{= value.width }}x{{= value.height }}</span>
  52. </div>
  53. {{~}}
  54. </template>
  55. <template id="template-shear">
  56. {{? it.length }}
  57. <div class="title">
  58. 剪贴板
  59. <div class="btn-clear">清空</div>
  60. </div>
  61. <div class="slide-wrapper-content">
  62. {{~ it :item:index }}
  63. <div class="slide-wrapper" data-id="{{= item.id}}">
  64. <div class="slide-scroll animate-slide-start">
  65. <div class="slide-content" data-content="{{= encodeHtml(item.content)}}">
  66. <div>{{= encodeHtml(item.content)}}</div>
  67. </div>
  68. <div class="slide-content-button" data-id="{{= item.id}}">
  69. <button>删除</button>
  70. </div>
  71. </div>
  72. </div>
  73. {{~}}
  74. </div>
  75. {{??}}
  76. <img class="empty" src="img/jianqieban_pic@2x.png" alt="" />
  77. <div class="empty-txt">剪贴板为空</div>
  78. {{?}}
  79. </template>
  80. <div class="container" id="player">
  81. <div class="muted" id="btnMuted">
  82. <div class="control-right-img" data-id="1">
  83. <img src="../static/img/xuanfu_icon.png" />
  84. </div>
  85. </div>
  86. <div id="wine">
  87. <div id="box">
  88. <canvas id="playCanvas" width="450" height="800"></canvas>
  89. </div>
  90. <div class="count-view" id="countView">
  91. <div class="fnca"><span class="countdown-time" style="color: #ffffff;"></span>
  92. <div class="line"></div><img class="wh22" src="../static/img/close.png" alt="" onclick="handleclose()">
  93. </div>
  94. </div>
  95. </div>
  96. <div class="leftmains">
  97. <div class="PictureQualityMain">
  98. <div class="menu-btn PictureQuality" data-id="4">高清</div>
  99. <div class="menu-btn PictureQuality avit" data-id="3">标清</div>
  100. <div class="menu-btn PictureQuality" data-id="2">极速</div>
  101. </div>
  102. <div class="open-set-phone-size-dialog-btn-wrap">
  103. <div class="menu-btn" id="open-set-phone-size-dialog-btn">
  104. <span>分辨率</span>
  105. </div>
  106. </div>
  107. <div class="operation">
  108. <div class="upload" id="showsuss" data-text="uploads">
  109. <img src="../static/img/wx/shangchuan_icon.png" />
  110. <div>上传</div>
  111. </div>
  112. <div class="upload" onclick="showShearPlate()" data-text="Shearplate">
  113. <img src="../static/img/wx/jianqieban_icon.png" />
  114. <div>剪贴板</div>
  115. </div>
  116. <div class="upload" id="upload" data-text="Signout" onclick="handleQuit('quit')">
  117. <img src="../static/img/wx/tuichu_icon.png" />
  118. <div>退出</div>
  119. </div>
  120. <div class="upload" id="dormant" data-text="Dormant" onclick="handleQuit('dormant')">
  121. <img src="../static/img/wx/tuichu_icon.png" />
  122. <div>退出并下机</div>
  123. </div>
  124. </div>
  125. </div>
  126. <div class="bottommains">
  127. <div class="botmat1">
  128. <div class="botmat1img" data-text="gengduo">
  129. <img src="../static/img/wx/gengduo_icon.png" />
  130. </div>
  131. </div>
  132. <div class="botmat1">
  133. <div class="botmat1img" data-text="home">
  134. <img src="../static/img/wx/home_icon.png" />
  135. </div>
  136. </div>
  137. <div class="botmat1">
  138. <div class="botmat1img" data-text="return">
  139. <img src="../static/img/wx/fanhui_icon.png" />
  140. </div>
  141. </div>
  142. </div>
  143. <img class="loading loading_sceen_pic" />
  144. </div>
  145. <div class="mask">
  146. <div class="box-shear-plate"></div>
  147. <img class="close" onclick="handleClose()" src="img/guanbi_icon@2x.png" alt="" />
  148. </div>
  149. <div class="weui-mask_transparent"></div>
  150. <div class="weui-toast weui_loading_toast weui-toast--visible">
  151. <div class="weui_loading">
  152. <i class="weui-loading weui-icon_toast"></i>
  153. </div>
  154. <p class="weui-toast_content">数据加载中</p>
  155. </div>
  156. <div class="try-use-wrap">
  157. <div class="try-use-container">
  158. <video width="100%" height="100%" id="source" autoplay="autoplay" loop="loop" webkit-playsinline="true" playsinline="true" x5-video-player-type="h5-page">
  159. 您的浏览器不支持 video 标签。
  160. </video>
  161. <div class="time-close-wrap"><span class="time-node"></span> 关闭</div>
  162. </div>
  163. </div>
  164. <div class="buy-phone-wrap">
  165. <div class="bug-wrap">
  166. <div class="bug-title">获得极致体验服务请购买云手机</div>
  167. <div class="btn-list">
  168. <div class="btn cannel-btn">取消</div>
  169. <div class="btn go-bug">去购买</div>
  170. </div>
  171. </div>
  172. </div>
  173. <div class="look-wrap">
  174. <div class="bug-wrap">
  175. <div class="bug-title">关闭广告会退出云手机是否继续观看</div>
  176. <div class="btn-list">
  177. <div class="btn cannel-btn cannel-ad-btn">放弃</div>
  178. <div class="btn go-bug looking">继续观看</div>
  179. </div>
  180. </div>
  181. </div>
  182. <div id="set-phone-size-dialog" class="dialog">
  183. <div class="dialog-mask"></div>
  184. <!-- 设置分辨率的弹窗 -->
  185. <div class="dialog-content-border">
  186. <div class="dialog-content">
  187. <div class="dialog-header">
  188. <div class="dialog-btn cancel">
  189. <span>取消</span>
  190. </div>
  191. <div class="dialog-btn confirm">
  192. <span>确定</span>
  193. </div>
  194. </div>
  195. <div class="dialog-main">
  196. <div id="phone-size-list"></div>
  197. </div>
  198. </div>
  199. </div>
  200. </div>
  201. <div class="dialog-jifei">
  202. <div class="apply-wrap">
  203. <div class="apply-container">
  204. <div class="apply-title">应用推荐</div>
  205. <div class="apply-list"></div>
  206. <div class="apply-list-change">换一批</div>
  207. <img class="apply-close" src="img/close.png" alt="" />
  208. </div>
  209. </div>
  210. <div class="time-lang-wrap">
  211. <div class="time-lang-container">
  212. <img class="time-lang-img" src="img/smallBell.png" />
  213. <div class="time-lang-title">本月时长已用完</div>
  214. <div class="time-lang-tip">您可以去购买时长页面进行购买</div>
  215. <div class="time-lang-btn">续时长</div>
  216. </div>
  217. </div>
  218. <div class="countdown-wrap">
  219. <div class="countdown-container">
  220. <img class="countdown-img" src="img/countdown.png" />
  221. <div class="countdown-title">计费规则</div>
  222. <div class="countdown-tip">进入云机开始计时,点击退出并下机停止<br />计时。点击退出云机仍处于计时状态。</div>
  223. <div class="countdown-tip2">云机时长剩余:<span class="countdown-time"></span></div>
  224. <div class="countdown-btn">我知道了</div>
  225. </div>
  226. </div>
  227. <script type="text/html" id="apply">
  228. <div class="apply-item">
  229. <img class="apply-img" src="{{imageUrl}}" />
  230. <div class="apply-row">
  231. <div class="apply-row-title">{{filename}}</div>
  232. <div class="apply-row-down">{{installNum}}</div>
  233. </div>
  234. <div class="apply-down-btn" data-id="{{id}}" data-url="{{downloadUrl}}">下载</div>
  235. </div>
  236. </script>
  237. </div>
  238. <script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>
  239. <script src="https://lf1-cdn-tos.bytegoofy.com/goofy/developer/jssdk/jssdk-1.0.3.js"></script>
  240. <script type="text/javascript" src="jquery-1.11.0.min.js"></script>
  241. <!-- ffm软解 -->
  242. <script type="text/javascript" src="helper.js"></script>
  243. <script type="text/javascript" src="jquery-weui.min.js"></script>
  244. <script type="text/javascript" src="pcm-player.js"></script>
  245. <script type="text/javascript" src="webgl.js"></script>
  246. <script type="text/javascript" src="../static/js/uni.webview.1.5.2.js"></script>
  247. <script type="text/javascript">
  248. $(function () {
  249. //手指滑动多少距离就认为是滑成功
  250. //这个值不能太大,否则影响斜着滑动时,垂直滑动的流畅性,也不能太小,太灵敏也不好
  251. var diffXDistance = 50;
  252. //当前滑动的对象
  253. var currentObject;
  254. //上一次滑动的对象
  255. var lastObject;
  256. //是否可以左右滑动,在上下滑的时候禁止左右滑
  257. var canSlide = true;
  258. //用于记录按下的点
  259. var startPoint;
  260. //var vConsole = new VConsole();
  261. $('.slide-content').css({
  262. width: $('.slide-wrapper').width(),
  263. });
  264. $('.slide-scroll')
  265. .css({
  266. width:
  267. $('.slide-wrapper').width() + $('.slide-content-button').width(),
  268. })
  269. .on('touchstart', function (e) {
  270. currentObject = this;
  271. startPoint = {
  272. x: e.originalEvent.changedTouches[0].pageX,
  273. y: e.originalEvent.changedTouches[0].pageY,
  274. };
  275. })
  276. .on('touchmove', function (e) {
  277. //如果是左右滑动,就禁止上下的滑动
  278. //如果是上下的滑动,就禁止左右滑动
  279. if (
  280. Math.abs(e.originalEvent.changedTouches[0].pageX - startPoint.x) >
  281. Math.abs(e.originalEvent.changedTouches[0].pageY - startPoint.y)
  282. ) {
  283. event.preventDefault();
  284. } else {
  285. canSlide = false;
  286. }
  287. })
  288. .on('touchend', function (e) {
  289. //如果是上下滑动,这里就直接返回了
  290. if (!canSlide) {
  291. canSlide = true;
  292. return true;
  293. }
  294. //点击除当前左滑对象之外的任意其他位置
  295. if (lastObject && currentObject != lastObject) {
  296. //右滑→
  297. $(lastObject).removeClass('animate-slide');
  298. //清空上一个左滑的对象
  299. lastObject = undefined;
  300. }
  301. var diffX = e.originalEvent.changedTouches[0].pageX - startPoint.x;
  302. if (diffX < -diffXDistance) {
  303. //左滑←
  304. $(currentObject).addClass('animate-slide');
  305. if (lastObject && lastObject != currentObject) {
  306. //右滑→
  307. $(lastObject).removeClass('animate-slide');
  308. }
  309. //记录上一个左滑的对象
  310. lastObject = currentObject;
  311. } else if (diffX >= diffXDistance) {
  312. if (currentObject == lastObject) {
  313. //右滑→
  314. $(currentObject).removeClass('animate-slide');
  315. //清空上一个左滑的对象
  316. lastObject = undefined;
  317. }
  318. }
  319. });
  320. });
  321. </script>
  322. <script>
  323. // 开发环境
  324. var isDev =
  325. /^192\.168\./.test(location.host) || /^localhost/.test(location.host);
  326. // if (isDev) {
  327. // baseUrl = 'http://gntest.phone.androidscloud.com:1280';
  328. // sourceType = 2;
  329. // }
  330. var topwinHeight = window.screen.height - window.innerHeight + 30; //计算title top 头部
  331. var url = window.location.href;
  332. url = url.split('/');
  333. var baseUrl = url[0] + '//' + url[2];
  334. //var baseUrl = 'https://client.phone.androidscloud.com'
  335. console.log(baseUrl);
  336. var parameters = GetRequest();
  337. var token = parameters['token'];
  338. var mealType = parameters['mealType'];
  339. var userCardId = parameters['userCardId'];
  340. var username = parameters['username'];
  341. var connectStatus = parameters['connectStatus'];
  342. var videoTimer = null,
  343. videoTime = 0,
  344. adType = 0,
  345. sourceType = isNaN(parameters['sourceType']) ? sourceType : +parameters['sourceType'],
  346. userCardType = isNaN(parameters['userCardType']) ? userCardType : +parameters['userCardType'],
  347. disconnectionFlag = false,
  348. getDate = false;
  349. // 计时套餐显示退出并下机按钮
  350. if ([1,2,3].includes(userCardType)) {
  351. $('#dormant').css({ display: 'block' })
  352. }
  353. /*
  354. if (mealType === 'VIP') {
  355. $('.loading_sceen_pic').attr('src', '../static/img/home_bg_VIP.png');
  356. } else if (mealType === 'SVIP') {
  357. $('.loading_sceen_pic').attr('src', '../static/img/home_bg_SVIP.png');
  358. } else if (mealType === 'STAR') {
  359. $('.loading_sceen_pic').attr('src', '../static/img/home_bg_STAR.png');
  360. } else if (mealType === 'STARPRO') {
  361. $('.loading_sceen_pic').attr('src', '../static/img/home_bg_PRO.png');
  362. }
  363. */
  364. $('#wine').css({
  365. width: window.screen.width,
  366. height: window.screen.height - topwinHeight - 20,
  367. position: 'absolute',
  368. });
  369. $('.loading').css({
  370. width: window.screen.width,
  371. height: window.screen.height - topwinHeight - 20,
  372. });
  373. var winese = document.createElement('wine');
  374. wine.style.top = '-' + winese + 'px';
  375. var isAudioPlay = false;
  376. let dbName = parameters['username'],
  377. version = 1,
  378. storeName = 'usercard',
  379. paramCardToken = decodeURIComponent(parameters['cardToken']);
  380. let indexedDB = window.indexedDB;
  381. let db;
  382. var socketURL;
  383. var cUrl;
  384. var cardToken, resolvingPower;
  385. const request = indexedDB.open(dbName, version);
  386. request.onsuccess = function (event) {
  387. db = event.target.result; // 数据库对象
  388. console.log('数据库打开成功');
  389. };
  390. request.onerror = function (event) {
  391. console.log('数据库打开报错');
  392. };
  393. request.onupgradeneeded = function (event) {
  394. // 数据库创建或升级的时候会触发
  395. console.log('onupgradeneeded');
  396. db = event.target.result; // 数据库对象
  397. let objectStore;
  398. if (!db.objectStoreNames.contains(storeName)) {
  399. objectStore = db.createObjectStore(storeName, { keyPath: 'id' }); // 创建表
  400. }
  401. };
  402. // 添加数据
  403. function addData(db, storeName, data) {
  404. let request = db
  405. .transaction([storeName], 'readwrite') // 事务对象 指定表格名称和操作模式("只读"或"读写")
  406. .objectStore(storeName) // 仓库对象
  407. .add(data);
  408. request.onsuccess = function (event) {
  409. console.log('数据写入成功');
  410. };
  411. request.onerror = function (event) {
  412. console.log('数据写入失败');
  413. throw new Error(event.target.error);
  414. };
  415. }
  416. // 根据id获取数据
  417. function getDataByKey(db, storeName, key) {
  418. let transaction = db.transaction([storeName]); // 事务
  419. let objectStore = transaction.objectStore(storeName); // 仓库对象
  420. let request = objectStore.get(key);
  421. request.onerror = function (event) {
  422. connect('add');
  423. };
  424. request.onsuccess = function (event) {
  425. console.log('主键查询结果: ', request.result);
  426. console.log(paramCardToken,request.result?.cardToken,'xxx')
  427. if (request.result && paramCardToken == request.result?.cardToken) {
  428. socketURL = request.result.socketURL;
  429. cUrl = request.result.cUrl;
  430. cardToken = request.result?.cardToken;
  431. resolvingPower = request.result.resolvingPower;
  432. window.currentPhoneSize = {
  433. width: request.result.width,
  434. height: request.result.height,
  435. dpi: request.result.dpi,
  436. };
  437. doConnectBusiness();
  438. doConnectDirectives();
  439. } else {
  440. connect('add');
  441. }
  442. };
  443. }
  444. // 根据id修改数
  445. function updateDB(db, storeName, data) {
  446. let request = db
  447. .transaction([storeName], 'readwrite') // 事务对象
  448. .objectStore(storeName) // 仓库对象
  449. .put(data);
  450. request.onsuccess = function () {
  451. console.log('数据更新成功');
  452. };
  453. request.onerror = function () {
  454. console.log('数据更新失败');
  455. };
  456. }
  457. // 根据id删除数据
  458. function deleteDB(db, storeName, id) {
  459. let request = db.transaction([storeName], 'readwrite').objectStore(storeName).delete(id)
  460. request.onsuccess = function () {
  461. console.log('数据删除成功')
  462. }
  463. request.onerror = function () {
  464. console.log('数据删除失败')
  465. }
  466. }
  467. // 由于打开indexDB是异步的加个定时器避免 db对象还没获取到值导致 报错
  468. setTimeout(() => {
  469. getDataByKey(db, storeName, userCardId);
  470. }, 1000);
  471. var timerInterval = null,
  472. timeInterval = 0;
  473. function connect(type) {
  474. $.ajax({
  475. url: baseUrl + '/api/resources/user/cloud/connect',
  476. type: 'post',
  477. data: JSON.stringify({
  478. userCardId: Number(userCardId),
  479. }),
  480. headers: {
  481. 'content-Type': 'application/json',
  482. Authorization: token,
  483. },
  484. dataType: 'json',
  485. async: false,
  486. success: function (res) {
  487. if (res.status === 0) {
  488. //getResidueTime()
  489. if(connectStatus==1) {
  490. getResidueTime();
  491. }
  492. if (timerInterval) {
  493. timerInterval = clearTimeout();
  494. }
  495. if (res.data.internetHttps) {
  496. socketURL =
  497. 'wss://' +
  498. res.data.internetHttps +
  499. '/plugflow?cardIp=' +
  500. res.data.localIp +
  501. '&token=' +
  502. res.data.cardToken +
  503. '&type=business';
  504. cUrl =
  505. 'wss://' +
  506. res.data.internetHttps +
  507. '/businessChannel?cardIp=' +
  508. res.data.localIp +
  509. '&token=' +
  510. res.data.cardToken +
  511. '&type=directives';
  512. cardToken = res.data.cardToken;
  513. resolvingPower = res.data.resolvingPower;
  514. doConnectBusiness();
  515. doConnectDirectives();
  516. if (type === 'add') {
  517. addData(db, storeName, {
  518. id: userCardId,
  519. socketURL: socketURL,
  520. cUrl: cUrl,
  521. cardToken: res.data.cardToken,
  522. resolvingPower: res.data.resolvingPower,
  523. width: res.data.width,
  524. height: res.data.high,
  525. dpi: res.data.dpi,
  526. });
  527. } else {
  528. updateDB(db, storeName, {
  529. id: userCardId,
  530. socketURL: socketURL,
  531. cUrl: cUrl,
  532. cardToken: res.data.cardToken,
  533. resolvingPower: res.data.resolvingPower,
  534. width: res.data.width,
  535. height: res.data.high,
  536. dpi: res.data.dpi,
  537. });
  538. }
  539. const data = window.phoneSizeList.find(function (v) {
  540. return (
  541. v.width === res.data.width &&
  542. v.height === res.data.height &&
  543. v.dpi === res.data.dpi
  544. );
  545. });
  546. window.currentPhoneSize = data || {
  547. width: res.data.width,
  548. height: res.data.height,
  549. dpi: res.data.dpi,
  550. };
  551. } else {
  552. $.toast('网络异常,请稍后重试', 'text');
  553. setTimeout(() => {
  554. clearInterval(intervaler);
  555. quit();
  556. }, 3000);
  557. }
  558. return;
  559. }
  560. if (res.status === 5200) {
  561. if (timeInterval > 7) {
  562. $.toast('网络异常,请稍后重试', 'text');
  563. timerInterval = clearTimeout();
  564. setTimeout(() => {
  565. quit();
  566. }, 3000);
  567. return;
  568. }
  569. timerInterval = setTimeout(() => {
  570. connect(type);
  571. timeInterval += 1;
  572. }, 3000);
  573. return;
  574. }
  575. if (res.status === 5220) {
  576. $.toast('云手机正在一键修复中', 'text');
  577. setTimeout(() => {
  578. quit();
  579. }, 3000);
  580. return;
  581. }
  582. if (res.status === 5203) {
  583. $.toast('正在排队中,请稍等', 'text');
  584. setTimeout(() => {
  585. quit();
  586. }, 3000);
  587. return;
  588. }
  589. if (res.status === 5204) {
  590. $.toast('云机异常,正在为你重新分配云机', 'text');
  591. setTimeout(() => {
  592. quit();
  593. }, 3000);
  594. return;
  595. }
  596. $('#countView').hide();
  597. $('.countdown-wrap').hide();
  598. //downline();
  599. $.toast('画面异常,请重新进入', 'text');
  600. setTimeout(() => {
  601. quit();
  602. }, 3000);
  603. },
  604. });
  605. }
  606. initAD();
  607. var isShowCountdown = +parameters['isShowCountdown'], isShowRule = +parameters['isShowRule'];
  608. $.alert({
  609. title: '提示',
  610. text: '开始使用云手机',
  611. onOK: function () {
  612. isAudioPlay = true;
  613. if (isShowCountdown) {
  614. $('#countView').eq(0).show();
  615. }
  616. if (isShowRule) {
  617. $('.countdown-wrap').eq(0).show();
  618. }
  619. //getResidueTime();
  620. },
  621. });
  622. //云机倒计时
  623. let validTime = parameters['validTime'] || 10000;
  624. if (validTime > 32000) {
  625. validTime = 32000;
  626. }
  627. let detailTime = validTime * 60 * 1000;
  628. setTimeout(() => {
  629. $('.bug-title').eq(0).text('尊敬的用户您的云手机试用时间已到期');
  630. getDate = true;
  631. $('.buy-phone-wrap').eq(0).show();
  632. }, detailTime);
  633. var orientation = 0; //0 竖屏,1横屏
  634. function array_unique(arr) {
  635. return arr.filter(function (e, i) {
  636. return arr.indexOf(e) === i;
  637. });
  638. }
  639. var cutList = [];
  640. let timer,
  641. isFlag = true;
  642. const shearTemplate = doT.template(
  643. $('#template-shear').html().replace(/&amp;/g, '&'),
  644. );
  645. function updateShearHtml(list) {
  646. $('.box-shear-plate').html(shearTemplate(list));
  647. }
  648. // 对字符串进行html转义
  649. function encodeHtml(content) {
  650. return [
  651. ['<', '&lt;'],
  652. ['>', '&gt;'],
  653. ['&', '&amp;'],
  654. ['"', '&quot;'],
  655. ].reduce(function (previousValue, currentValue) {
  656. return previousValue.replace(
  657. new RegExp(currentValue[0], 'g'),
  658. currentValue[1],
  659. );
  660. }, content);
  661. }
  662. $('.box-shear-plate').on('click', '.slide-content', function (e) {
  663. handleCopy(e.currentTarget.dataset.content);
  664. });
  665. $('.box-shear-plate').on('click', '.btn-clear', function (e) {
  666. handleClear();
  667. });
  668. $('.box-shear-plate').on('click', '.slide-content-button', function (e) {
  669. handleDelete(e.currentTarget.dataset.id);
  670. });
  671. function showShearPlate(type) {
  672. if (!isControl) {
  673. return;
  674. }
  675. stopManyClick(function () {
  676. new Promise((resolve, reject) => {
  677. if (window.navigator.clipboard) {
  678. window.navigator.clipboard
  679. .readText()
  680. .then(
  681. function (content) {
  682. return $.ajax({
  683. url: baseUrl + '/api/public/v5/shear/content',
  684. type: 'post',
  685. dataType: 'json',
  686. data: JSON.stringify({
  687. content: content,
  688. }),
  689. headers: {
  690. 'content-Type': 'application/json',
  691. Authorization: token,
  692. },
  693. });
  694. },
  695. function (err) {
  696. if (type === 'clear') {
  697. return
  698. }
  699. $.toast('读取剪贴板失败', 'text');
  700. },
  701. )
  702. .finally(resolve);
  703. } else {
  704. resolve();
  705. }
  706. }).then(function () {
  707. $('.box-shear-plate').empty();
  708. return $.ajax({
  709. url: baseUrl + '/api/public/v5/shear/content',
  710. headers: {
  711. Authorization: token,
  712. },
  713. type: 'get',
  714. dataType: 'json',
  715. success: function (res) {
  716. updateShearHtml(res.status === 0 ? res.data : []);
  717. $('.mask').show();
  718. initSlider();
  719. },
  720. });
  721. });
  722. });
  723. }
  724. //防止提示一秒内重复显示
  725. function stopManyClick(fn) {
  726. if (isFlag) {
  727. fn();
  728. }
  729. isFlag = false;
  730. if (timer) {
  731. clearTimeout(timer);
  732. }
  733. timer = setTimeout(() => {
  734. isFlag = true;
  735. }, 1500);
  736. }
  737. // 清空剪贴板
  738. function handleClear() {
  739. $.confirm('确定清空剪贴板?', function () {
  740. $.ajax({
  741. url:
  742. baseUrl +
  743. '/api/public/v5/shear/content' +
  744. Qs.stringify(
  745. {
  746. ids: Array.from($('.slide-wrapper')).map((v) => v.dataset.id),
  747. },
  748. { arrayFormat: 'repeat', addQueryPrefix: true },
  749. ),
  750. headers: {
  751. Authorization: token,
  752. },
  753. type: 'DELETE',
  754. dataType: 'json',
  755. success: function (res) {
  756. if (res.status === 0) {
  757. showShearPlate('clear');
  758. } else {
  759. $.toast(res.msg, 'text');
  760. }
  761. },
  762. });
  763. });
  764. }
  765. function handleCopy(content) {
  766. var cutting = {
  767. type: 'cutting',
  768. data: {
  769. str: content,
  770. },
  771. };
  772. wsss.send(JSON.stringify(cutting));
  773. }
  774. // 删除剪贴板
  775. function handleDelete(id) {
  776. $.ajax({
  777. url: baseUrl + '/api/public/v5/shear/content?ids=' + id,
  778. headers: {
  779. Authorization: token,
  780. },
  781. type: 'DELETE',
  782. dataType: 'json',
  783. success: function (res) {
  784. if (res.status === 0) {
  785. showShearPlate();
  786. } else {
  787. $.toast(res.msg, 'text');
  788. }
  789. },
  790. });
  791. }
  792. function initSlider() {
  793. //手指滑动多少距离就认为是滑成功
  794. //这个值不能太大,否则影响斜着滑动时,垂直滑动的流畅性,也不能太小,太灵敏也不好
  795. var diffXDistance = 50;
  796. //当前滑动的对象
  797. var currentObject;
  798. //上一次滑动的对象
  799. var lastObject;
  800. //是否可以左右滑动,在上下滑的时候禁止左右滑
  801. var canSlide = true;
  802. //用于记录按下的点
  803. var startPoint;
  804. $('.slide-content').css({
  805. width: $('.slide-wrapper').width(),
  806. });
  807. document.body.removeEventListener(
  808. 'touchmove',
  809. function (e) {
  810. e.preventDefault();
  811. },
  812. {
  813. passive: false,
  814. },
  815. );
  816. $('.slide-scroll')
  817. .css({
  818. width:
  819. $('.slide-wrapper').width() + $('.slide-content-button').width(),
  820. })
  821. .on('touchstart', function (e) {
  822. currentObject = this;
  823. startPoint = {
  824. x: e.originalEvent.changedTouches[0].pageX,
  825. y: e.originalEvent.changedTouches[0].pageY,
  826. };
  827. })
  828. .on('touchmove', function (e) {
  829. //如果是左右滑动,就禁止上下的滑动
  830. //如果是上下的滑动,就禁止左右滑动
  831. if (
  832. Math.abs(e.originalEvent.changedTouches[0].pageX - startPoint.x) >
  833. Math.abs(e.originalEvent.changedTouches[0].pageY - startPoint.y)
  834. ) {
  835. event.preventDefault();
  836. } else {
  837. canSlide = false;
  838. }
  839. })
  840. .on('touchend', function (e) {
  841. //如果是上下滑动,这里就直接返回了
  842. if (!canSlide) {
  843. canSlide = true;
  844. return true;
  845. }
  846. //点击除当前左滑对象之外的任意其他位置
  847. if (lastObject && currentObject != lastObject) {
  848. //右滑→
  849. $(lastObject).removeClass('animate-slide');
  850. //清空上一个左滑的对象
  851. lastObject = undefined;
  852. }
  853. var diffX = e.originalEvent.changedTouches[0].pageX - startPoint.x;
  854. if (diffX < -diffXDistance) {
  855. //左滑←
  856. $(currentObject).addClass('animate-slide');
  857. if (lastObject && lastObject != currentObject) {
  858. //右滑→
  859. $(lastObject).removeClass('animate-slide');
  860. }
  861. //记录上一个左滑的对象
  862. lastObject = currentObject;
  863. } else if (diffX >= diffXDistance) {
  864. if (currentObject == lastObject) {
  865. //右滑→
  866. $(currentObject).removeClass('animate-slide');
  867. //清空上一个左滑的对象
  868. lastObject = undefined;
  869. }
  870. }
  871. });
  872. }
  873. $('#wine').on('click', function (e) {
  874. console.log('🚀 ~ file: WXdraw.js ~ line 4 ~ e', e);
  875. $('.control-right-img').attr({
  876. 'data-id': '1',
  877. });
  878. $('.leftmains').css({
  879. right: '-4rem',
  880. });
  881. });
  882. var btnMuted = document.querySelector('#btnMuted');
  883. btnMuted &&
  884. (function () {
  885. var setHistory = function (left, top) {
  886. try {
  887. localStorage.setItem(
  888. 'muted-btn-loc',
  889. JSON.stringify({
  890. left: left,
  891. top: top,
  892. }),
  893. );
  894. } catch (ex) { }
  895. };
  896. var getHistory = function () {
  897. try {
  898. var value = localStorage.getItem('muted-btn-loc');
  899. if (!value) return null;
  900. value = JSON.parse(value);
  901. if (!value) return null;
  902. return value;
  903. } catch (ex) {
  904. return null;
  905. }
  906. };
  907. var fixLoc = function (loc) {
  908. var rect = btnMuted.getBoundingClientRect();
  909. rect = {
  910. top: rect.top,
  911. left: rect.left,
  912. width: rect.width,
  913. height: rect.height,
  914. }; // 部分低版本浏览器,该属性为只读
  915. if (loc) {
  916. rect.left = loc.left;
  917. rect.top = loc.top;
  918. }
  919. var minX = 0;
  920. var minY = 0;
  921. var docRect = document.documentElement.getBoundingClientRect();
  922. var maxY = docRect.height - rect.height;
  923. var maxX = docRect.width - rect.width;
  924. var left = rect.left;
  925. var top = rect.top;
  926. left = Math.min(left, maxX);
  927. left = Math.max(left, minX);
  928. top = Math.min(top, maxY);
  929. top = Math.max(top, minY);
  930. if (loc || top !== rect.top || left !== rect.left) {
  931. btnMuted.style.cssText +=
  932. 'left:' + left + 'px;top:' + top + 'px;';
  933. }
  934. };
  935. window.addEventListener('resize', function () {
  936. fixLoc();
  937. });
  938. var touchPoint = {
  939. pageY: 0,
  940. pageX: 0,
  941. };
  942. var currentLoc = {
  943. top: 0,
  944. left: 0,
  945. curTop: 0,
  946. curLeft: 0,
  947. };
  948. var toMove = false;
  949. var touchmove = function (e) {
  950. e.preventDefault();
  951. var point = e.changedTouches[0];
  952. var top = -touchPoint.pageY + point.pageY;
  953. var left = -touchPoint.pageX + point.pageX;
  954. if (toMove) {
  955. top += currentLoc.top;
  956. left += currentLoc.left;
  957. currentLoc.curLeft = left;
  958. currentLoc.curTop = top;
  959. btnMuted.style.cssText +=
  960. 'left:' + left + 'px;top:' + top + 'px;';
  961. } else {
  962. if (Math.abs(top) >= 5 || Math.abs(left) >= 5) {
  963. toMove = true;
  964. }
  965. }
  966. };
  967. var touchend = function () {
  968. window.removeEventListener('touchmove', touchmove, {
  969. passive: false,
  970. });
  971. window.removeEventListener('touchend', touchend, {
  972. passive: false,
  973. });
  974. if (toMove) {
  975. setHistory(currentLoc.curLeft, currentLoc.curTop);
  976. fixLoc();
  977. } else {
  978. //按点击处理
  979. var set = $('.control-right-img').attr('data-id');
  980. if (set == '1') {
  981. $('.control-right-img').attr({
  982. 'data-id': '2',
  983. });
  984. $('.leftmains').css({
  985. right: '0rem',
  986. });
  987. } else {
  988. $('.control-right-img').attr({
  989. 'data-id': '1',
  990. });
  991. $('.leftmains').css({
  992. right: '-4rem',
  993. });
  994. }
  995. }
  996. };
  997. btnMuted.addEventListener(
  998. 'touchstart',
  999. function (e) {
  1000. e.preventDefault();
  1001. toMove = false;
  1002. var point = e.changedTouches[0];
  1003. touchPoint.pageX = point.pageX;
  1004. touchPoint.pageY = point.pageY;
  1005. var rect = e.target.getBoundingClientRect();
  1006. currentLoc.top = rect.top;
  1007. currentLoc.left = rect.left;
  1008. window.addEventListener('touchmove', touchmove, {
  1009. passive: false,
  1010. });
  1011. window.addEventListener('touchend', touchend, {
  1012. passive: false,
  1013. });
  1014. },
  1015. {
  1016. passive: false,
  1017. },
  1018. );
  1019. var history = getHistory();
  1020. if (history) {
  1021. fixLoc(history);
  1022. }
  1023. btnMuted.classList.remove('hide');
  1024. })();
  1025. function handleClose() {
  1026. $('.mask').hide();
  1027. }
  1028. var decodeCount = 1;
  1029. var isFinish = false;
  1030. var player = new PCMPlayer({
  1031. encoding: '16bitInt',
  1032. channels: 2,
  1033. sampleRate: 44100,
  1034. flushingTime: 22,
  1035. debug: false,
  1036. });
  1037. Module = {};
  1038. Module.onRuntimeInitialized = function () {
  1039. isFinish = true;
  1040. };
  1041. function decodeAAC(data) {
  1042. var retPtr = Module._malloc(4 * 5 * 1024); //接收的数据
  1043. var inputPtr = Module._malloc(4 * data.length); //输入数据
  1044. for (var i = 0; i < data.length; i++) {
  1045. Module.HEAPU8[inputPtr + i] = data[i]; //转换为堆数据
  1046. }
  1047. var pcmLen = Module._feedData(retPtr, inputPtr, data.length);
  1048. if (pcmLen >= 0) {
  1049. var pcmData = new Uint8Array(pcmLen);
  1050. for (var i = 0; i < pcmLen; i++) {
  1051. pcmData[i] = Module.HEAPU8[retPtr + i];
  1052. }
  1053. player.feed(pcmData);
  1054. }
  1055. decodeCount++;
  1056. Module._free(inputPtr);
  1057. Module._free(retPtr);
  1058. }
  1059. var decodeWoker = new Worker('decoder.js');
  1060. var myVideo = document.getElementById('playCanvas');
  1061. var logicWidth = 720;
  1062. var logicHeight = 1280;
  1063. decodeWoker.onmessage = function (event) {
  1064. var objData = event.data;
  1065. // console.log("🚀 ~ file: WXtrialInterface.html ~ line 806 ~ objData", objData)
  1066. switch (objData.cmd) {
  1067. case 0:
  1068. break;
  1069. case 1:
  1070. // console.log(objData);
  1071. if (logicWidth != objData.width || logicHeight != objData.height) {
  1072. logicWidth = objData.width;
  1073. logicHeight = objData.height;
  1074. }
  1075. // logicWidth = 375
  1076. // logicHeight = 812
  1077. webglPlayer.renderFrame(
  1078. objData.data,
  1079. logicWidth,
  1080. logicHeight,
  1081. logicWidth * logicHeight,
  1082. (logicWidth / 2) * (logicHeight / 2),
  1083. );
  1084. $('.weui-mask_transparent').hide();
  1085. $('.weui-toast').hide();
  1086. $('.loading').hide();
  1087. break;
  1088. case 5:
  1089. var buffer = RequestIFrame();
  1090. webSocketWorker.postMessage(buffer);
  1091. }
  1092. };
  1093. var isFinish = false;
  1094. var webglPlayer = new WebGLPlayer(myVideo, {
  1095. preserveDrawingBuffer: false,
  1096. });
  1097. function GetRequest() {
  1098. var url = location.search; // 获取url中"?"符后的字串
  1099. var obj = new Object();
  1100. if (url.indexOf('?') != -1) {
  1101. var str = url.substr(1);
  1102. strs = str.split('&');
  1103. for (var i = 0; i < strs.length; i++) {
  1104. obj[strs[i].split('=')[0]] = strs[i].split('=')[1];
  1105. }
  1106. }
  1107. return obj;
  1108. }
  1109. var webSocketWorker;
  1110. /*
  1111. var webSocketWorker;
  1112. var intervalId;
  1113. let num = 0;
  1114. //心跳
  1115. function sendHeartbeat() {
  1116. // console.log(intervalId, 'intervalId') webSocketWorker.readyState === WebSocket.OPEN &&
  1117. if (wsss.readyState === WebSocket.OPEN) {
  1118. console.log('connection is ok');
  1119. num = 0;
  1120. //webSocketWorker.send('ping');
  1121. wsss.send('ping')
  1122. } else {
  1123. //clearInterval(intervalId)
  1124. console.error('connection is not open '+num);
  1125. if(num == 20) {
  1126. console.log('num == 20')
  1127. return;
  1128. }
  1129. num++
  1130. connect("add")
  1131. }
  1132. }
  1133. */
  1134. function doConnectBusiness() {
  1135. webSocketWorker = new Worker(
  1136. 'websocket.js?socketURL=' +
  1137. encodeURIComponent(socketURL) +
  1138. '&cardToken=' +
  1139. encodeURIComponent(cardToken),
  1140. );
  1141. window.webSocketWorker = webSocketWorker;
  1142. /*
  1143. if(intervalId){
  1144. clearInterval(intervalId)
  1145. }
  1146. intervalId = setInterval(()=> {
  1147. sendHeartbeat()
  1148. },5000)
  1149. */
  1150. webSocketWorker.onmessage = function (event) {
  1151. var input = event.data;
  1152. if (input[0] == 0xff && isAudioPlay) {
  1153. decodeAAC(input);
  1154. }
  1155. if (
  1156. input[0] == 0 &&
  1157. input[1] == 0 &&
  1158. input[2] == 0 &&
  1159. input[3] == 1
  1160. ) {
  1161. var cmd = {
  1162. type: 'rawData',
  1163. data: event.data,
  1164. };
  1165. decodeWoker.postMessage(cmd);
  1166. }
  1167. if (input[0] == 0x68) {
  1168. if (input[23] == 0x5c) {
  1169. if (CheckVerifyCode(input)) {
  1170. webSocketWorker.postMessage(ConfigChannel('RK3923C1201900139'));
  1171. var checkBuffer = GetScreenState();
  1172. webSocketWorker.postMessage(checkBuffer);
  1173. } else {
  1174. connect('update');
  1175. }
  1176. }
  1177. if (input[23] == 0x05) {
  1178. //横竖屏标识
  1179. if (input[28] == 0x01 && input[29] == 0x01) {
  1180. var state = CheckScreenDirection(input.slice(24, 24 + 8));
  1181. if (state == 1) {
  1182. console.log('安卓卡此时竖屏');
  1183. //竖屏处理
  1184. resolving = 1;
  1185. // $('#playCanvas').removeClass('horizontal').addClass('vertical');
  1186. } else {
  1187. console.log('安卓卡此时横屏');
  1188. //横屏处理
  1189. resolving = 0;
  1190. // $('#playCanvas').removeClass('vertical').addClass('horizontal');
  1191. }
  1192. }
  1193. // window.phoneSizeList = window.phoneSizeListBack.map(function (
  1194. // item,
  1195. // ) {
  1196. // return resolving
  1197. // ? item
  1198. // : Object.assign({}, item, {
  1199. // width: item.height,
  1200. // height: item.width,
  1201. // });
  1202. // });
  1203. // wsss.send(
  1204. // JSON.stringify({
  1205. // type: 'getPhoneSize',
  1206. // }),
  1207. // );
  1208. // 横竖屏变更时获取分辨率要延迟,不然会获取到变更前的分辨率
  1209. // setTimeout(function () {
  1210. // wsss.send(
  1211. // JSON.stringify({
  1212. // type: 'getPhoneSize',
  1213. // }),
  1214. // );
  1215. // }, 500);
  1216. }
  1217. if (input[23] == 0x0b) {
  1218. console.log('多端登陆');
  1219. }
  1220. }
  1221. if (event.data === 'close') {
  1222. $('#countView').hide();
  1223. $('.countdown-wrap').hide();
  1224. downline();
  1225. $.toast('画面异常,请重新进入', 'text');
  1226. setTimeout(() => {
  1227. decodeWoker.postMessage('close');
  1228. decodeWoker.terminate();
  1229. quit();
  1230. }, 3000);
  1231. }
  1232. };
  1233. }
  1234. // 激活码广告相关配置
  1235. function getConfigByPhoneType() {
  1236. return new Promise((resolve, reject) => {
  1237. $.ajax({
  1238. url: baseUrl + '/api/pay/v5/trialCodeConfig/getConfigByPhoneType',
  1239. headers: {
  1240. Authorization: token,
  1241. },
  1242. data: {
  1243. userCardId: userCardId,
  1244. phoneType: mealType,
  1245. },
  1246. type: 'get',
  1247. dataType: 'json',
  1248. success: function (res) {
  1249. console.log(res);
  1250. let obj = res.data;
  1251. if (res.status === 0) {
  1252. resolve(obj);
  1253. } else {
  1254. $.toast(res.msg, 'text');
  1255. }
  1256. },
  1257. });
  1258. });
  1259. }
  1260. //列表
  1261. function getSetmealList() {
  1262. return new Promise((resolve, reject) => {
  1263. $.ajax({
  1264. url: baseUrl + '/api/resources/v4/freetrial/setmeal/list',
  1265. headers: {
  1266. Authorization: token,
  1267. },
  1268. type: 'get',
  1269. dataType: 'json',
  1270. success: function (res) {
  1271. if (res.status === 0) {
  1272. let list = res.data;
  1273. list.map((item) => {
  1274. if (item.phoneType === mealType) {
  1275. resolve(item);
  1276. }
  1277. });
  1278. } else {
  1279. $.toast(res.msg, 'text');
  1280. }
  1281. },
  1282. });
  1283. });
  1284. }
  1285. //广告信息
  1286. var adData = null; // 广告数据
  1287. var adLastTime = 0; // 广告时间
  1288. var intervalTime = 0; // 间隔时间
  1289. // let adType = 0;
  1290. console.log(
  1291. '🚀 ~ file: WXtrialInterface.html ~ line 973 ~ sourceType',
  1292. sourceType,
  1293. );
  1294. // 拉取广告数据
  1295. function getAD() {
  1296. return $.ajax({
  1297. url: baseUrl + '/api/public/v5/advertising/getAdInfoByAdPlace',
  1298. headers: {
  1299. Authorization: token,
  1300. },
  1301. data: JSON.stringify({
  1302. adPlace: adType,
  1303. os: 0,
  1304. }),
  1305. type: 'POST',
  1306. dataType: 'json',
  1307. contentType: 'application/json;charset=UTF-8',
  1308. }).then(function (res) {
  1309. if (res.status === 0) {
  1310. var list = res.data.filter(
  1311. (v) => v.adType === 1 && !!v.adVideoBase.videoUrl,
  1312. );
  1313. adData = list[Math.floor(Math.random() * list.length)];
  1314. console.log(
  1315. '🚀 ~ file: WXtrialInterface.html ~ line 990 ~ getAD ~ adData',
  1316. adData,
  1317. );
  1318. return adData;
  1319. } else {
  1320. return Promise.reject(new Error(res.msg));
  1321. }
  1322. });
  1323. }
  1324. // 播放广告
  1325. function playAD() {
  1326. var nowTime = Date.now();
  1327. if (adData && $('.try-use-wrap').eq(0).is(':hidden') && nowTime > adLastTime + intervalTime) {
  1328. $('#source').attr('src', adData.adVideoBase.videoUrl);
  1329. $('.try-use-wrap').eq(0).show();
  1330. $('#source')[0].play();
  1331. videoTime = adData.forcedTime;
  1332. adData = null;
  1333. adLastTime = nowTime;
  1334. videoTimer = setInterval(() => {
  1335. if (videoTime > 0) {
  1336. videoTime--;
  1337. $('.time-node')
  1338. .eq(0)
  1339. .text(videoTime + 's');
  1340. } else {
  1341. clearInterval(videoTimer);
  1342. $('.time-node').eq(0).text('');
  1343. }
  1344. }, 1000);
  1345. if (intervalTime > 0) {
  1346. // 间隔广告拉取下一次广告数据
  1347. adType = 16;
  1348. getAD();
  1349. }
  1350. if (adType === 16 && sourceType == 1) {
  1351. // 间隔广告和试用才上报
  1352. report(0);
  1353. }
  1354. }
  1355. }
  1356. var residueTimer = null;
  1357. // 获取云机剩余时长
  1358. function getResidueTime() {
  1359. clearInterval(residueTimer);
  1360. if (![1,2,3].includes(userCardType)) {
  1361. return
  1362. }
  1363. return $.ajax({
  1364. url: baseUrl + `/api/resources/yearMember/getResidueTime?userCardId=${userCardId}`,
  1365. headers: {
  1366. Authorization: token,
  1367. },
  1368. type: 'get',
  1369. dataType: 'json',
  1370. contentType: 'application/json;charset=UTF-8',
  1371. }).then(function (res) {
  1372. if (res.status === 0) {
  1373. let time = res.data;
  1374. startTime();
  1375. residueTimer = setInterval(() => {
  1376. if (time > 0) {
  1377. time--;
  1378. $('.countdown-time').text(residueTimeStamp(time));
  1379. } else {
  1380. clearInterval(residueTimer);
  1381. downline();
  1382. }
  1383. }, 1000)
  1384. } else {
  1385. return Promise.reject(new Error(res.msg));
  1386. }
  1387. });
  1388. }
  1389. // 客户端成功进入云手机后调用
  1390. function startTime() {
  1391. if (![1,2,3].includes(userCardType)) {
  1392. return
  1393. }
  1394. return $.ajax({
  1395. url: baseUrl + `/api/resources/yearMember/startTime?userCardId=${userCardId}`,
  1396. headers: {
  1397. Authorization: token,
  1398. },
  1399. type: 'get',
  1400. dataType: 'json',
  1401. contentType: 'application/json;charset=UTF-8',
  1402. }).then(function (res) { });
  1403. }
  1404. // 秒转化为时分秒
  1405. function getResultTime(time) {
  1406. let theTime = parseInt(time);// 秒
  1407. let theTime1 = 0;// 分
  1408. let theTime2 = 0;// 小时
  1409. if (theTime > 60) {
  1410. theTime1 = parseInt(theTime / 60);
  1411. theTime = parseInt(theTime % 60);
  1412. if (theTime1 > 60) {
  1413. theTime2 = parseInt(theTime1 / 60);
  1414. theTime1 = parseInt(theTime1 % 60);
  1415. }
  1416. }
  1417. let result = '' + parseInt(theTime);
  1418. if (theTime1 > 0) {
  1419. result = '' + parseInt(theTime1) + ':' + result;
  1420. }
  1421. if (theTime2 > 0) {
  1422. result = '' + parseInt(theTime2) + ':' + result;
  1423. }
  1424. return result;
  1425. }
  1426. // 推荐列表
  1427. function getRecommend() {
  1428. return $.ajax({
  1429. url: baseUrl + `/api/public/v1/market/get/recommend?userCardId=${userCardId}`,
  1430. headers: {
  1431. Authorization: token,
  1432. },
  1433. type: 'get',
  1434. dataType: 'json',
  1435. contentType: 'application/json;charset=UTF-8',
  1436. }).then(function (res) {
  1437. if (res.status === 0) {
  1438. $('.apply-wrap').eq(0).show();
  1439. let list = res.data;
  1440. let result = '';
  1441. list.map(item => {
  1442. item.installNum = `有${item.installNum}人下载`
  1443. result += $('#apply').text().replace(/{{(.*?)}}/g, function (node, key) {
  1444. return item[key];
  1445. })
  1446. })
  1447. $('.apply-list').eq(0).append(result)
  1448. } else {
  1449. return Promise.reject(new Error(res.msg));
  1450. }
  1451. });
  1452. }
  1453. //点击了换一批
  1454. $('.apply-list-change')[0].addEventListener('click', () => {
  1455. $('.apply-list').eq(0).empty();
  1456. getRecommend();
  1457. })
  1458. //点击了关闭按钮
  1459. $('.apply-close')[0].addEventListener('click', () => {
  1460. localStorage.setItem('isShowRecommend', true);
  1461. $('.apply-wrap').eq(0).hide();
  1462. })
  1463. // 点击下载按钮
  1464. $('.apply-wrap')[0].addEventListener('click', (e) => {
  1465. let id = e.target.dataset.id;
  1466. let downloadUrl = e.target.dataset.url;
  1467. let className = e.target.className;
  1468. if (className === 'apply-down-btn') {
  1469. var pings2 = {
  1470. type: 'downAndInstallApk',
  1471. data: {
  1472. apkUrl: downloadUrl,
  1473. taskUid: id
  1474. },
  1475. };
  1476. wsss.send(JSON.stringify(pings2));
  1477. }
  1478. })
  1479. // 点击了我知道了
  1480. $('.countdown-btn')[0].addEventListener('click', () => {
  1481. $('.countdown-wrap').eq(0).hide();
  1482. getRecommend();
  1483. })
  1484. // 点击了续时长
  1485. $('.time-lang-btn')[0].addEventListener('click', () => {
  1486. $('.time-lang-wrap').eq(0).hide();
  1487. if (window.__wxjs_environment === 'miniprogram') {
  1488. wx.miniProgram.navigateTo({
  1489. url: `/packageA/order/renew/index?record=` + userCardId
  1490. });
  1491. } else {
  1492. uni.webView.navigateTo({
  1493. url: '/pages/order/renew?record=' + userCardId
  1494. })
  1495. }
  1496. })
  1497. /**
  1498. * 初始化广告
  1499. * 因移动端video无法自动播放,play()方法不能异步调用。
  1500. * 解决方案,初始化时预先请求广告数据,在用户对云手机touchmove事件中去播放广告并请求下一次广告数据。
  1501. */
  1502. function initAD() {
  1503. console.log(
  1504. '🚀 ~ file: WXtrialInterface.html ~ line 1052 ~ initAD ~ sourceType',
  1505. sourceType,
  1506. );
  1507. (function () {
  1508. switch (sourceType) {
  1509. case 1: {
  1510. return getSetmealList().then(function (res) {
  1511. intervalTime =
  1512. res.intervalSwitch === 1
  1513. ? res.intervalAdvertDuration * 1000 * 60
  1514. : 0;
  1515. if (res.pushFlowAdvert === 1) {
  1516. adType = 15;
  1517. adTime = 0;
  1518. } else if (intervalTime > 0) {
  1519. adType = 16;
  1520. adTime = date.now();
  1521. }
  1522. });
  1523. }
  1524. case 2: {
  1525. return getConfigByPhoneType().then(function (res) {
  1526. if (res.isDisconnectionTime === 1) {
  1527. var time = res.disconnectionTime * 60 * 1000;
  1528. setTimeout(() => {
  1529. disconnectionFlag = true;
  1530. $('.buy-phone-wrap').eq(0).show();
  1531. }, time);
  1532. }
  1533. intervalTime =
  1534. res.isIntervalPlayAd === 1
  1535. ? res.intervalPlayAdTime * 1000 * 60
  1536. : 0;
  1537. if (res.isShowAd === 1) {
  1538. adType = 15;
  1539. adTime = 0;
  1540. } else if (intervalTime > 0) {
  1541. adType = 16;
  1542. adTime = date.now();
  1543. }
  1544. });
  1545. }
  1546. default: {
  1547. return Promise.reject();
  1548. }
  1549. }
  1550. })().then(function () {
  1551. console.log(adType);
  1552. this.$('#playCanvas').on('touchstart', playAD);
  1553. // this.$('#playCanvas').on('touchmove', playAD);
  1554. getAD();
  1555. });
  1556. }
  1557. // 观看广告次数上报1
  1558. function reportFrequency() {
  1559. $.ajax({
  1560. url: baseUrl + '/api/resoures/v1/trial/reportFrequency/' + userCardId,
  1561. headers: {
  1562. Authorization: token,
  1563. },
  1564. type: 'post',
  1565. contentType: 'application/json',
  1566. dataType: 'json',
  1567. success: function (res) { },
  1568. });
  1569. }
  1570. //间隔广告上报
  1571. function report(type) {
  1572. $.ajax({
  1573. url: baseUrl + '/api/resources/v1/trial/report',
  1574. headers: {
  1575. Authorization: token,
  1576. },
  1577. data: JSON.stringify({
  1578. userCardId: userCardId,
  1579. reportType: type,
  1580. }),
  1581. type: 'POST',
  1582. dataType: 'json',
  1583. contentType: 'application/json;charset=UTF-8',
  1584. success: function (res) { },
  1585. });
  1586. }
  1587. //关闭广告
  1588. $('.time-close-wrap')[0].addEventListener('click', () => {
  1589. if (videoTime == 0) {
  1590. reportFrequency();
  1591. }
  1592. $('.buy-phone-wrap').eq(0).show();
  1593. });
  1594. // 点击取消
  1595. $('.cannel-btn')[0].addEventListener('click', () => {
  1596. $('.buy-phone-wrap').eq(0).hide();
  1597. if (disconnectionFlag || getDate) {
  1598. //设置了断线时间,取消直接退出
  1599. systemBuriedPoint('激活码-断线-取消');
  1600. quit();
  1601. return;
  1602. }
  1603. let pointName = '';
  1604. if (sourceType == 1) {
  1605. pointName =
  1606. videoTime == 0 ? '免费试用-关闭-取消' : '免费试用-强制关闭-取消';
  1607. } else {
  1608. pointName =
  1609. videoTime == 0 ? '激活码-关闭-取消' : '激活码-强制关闭-取消';
  1610. }
  1611. systemBuriedPoint(pointName);
  1612. if (videoTime == 0) {
  1613. if (adType === 16 && sourceType == 1) {
  1614. report(1);
  1615. }
  1616. $('.try-use-wrap').eq(0).hide();
  1617. $('#source')[0].pause();
  1618. return;
  1619. }
  1620. $('.look-wrap').eq(0).show();
  1621. });
  1622. // 点击去购买
  1623. $('.go-bug')[0].addEventListener('click', () => {
  1624. let pointName = '';
  1625. if (disconnectionFlag) {
  1626. pointName = '激活码-断线-去购买';
  1627. } else if (sourceType == 1) {
  1628. pointName =
  1629. videoTime == 0
  1630. ? '免费试用-关闭-去购买'
  1631. : '免费试用-强制关闭-去购买';
  1632. } else {
  1633. pointName =
  1634. videoTime == 0 ? '激活码-关闭-去购买' : '激活码-强制关闭-去购买';
  1635. }
  1636. systemBuriedPoint(pointName);
  1637. if (getDate) {
  1638. if (window.__wxjs_environment === 'miniprogram') {
  1639. wx.miniProgram.navigateTo({
  1640. url: '/packageA/order/buy/index?buyType=试用界面购买',
  1641. });
  1642. } else {
  1643. if (userCardType === 1) {
  1644. uni.webView.navigateTo({
  1645. url: '/pages/order/renewTime',
  1646. });
  1647. } else {
  1648. uni.webView.navigateTo({
  1649. url: '/pages/order/order',
  1650. });
  1651. }
  1652. }
  1653. } else {
  1654. if (window.__wxjs_environment === 'miniprogram') {
  1655. wx.miniProgram.navigateTo({
  1656. url:
  1657. `/packageA/order/renew/index?buyType=${sourceType == 1
  1658. ? '试用弹窗购买按钮进入-普通试用'
  1659. : '试用弹窗购买按钮进入-激活码试用'
  1660. }&record=` + userCardId,
  1661. });
  1662. } else {
  1663. if (userCardType === 1) {
  1664. uni.webView.navigateTo({
  1665. url: '/pages/order/renewTime',
  1666. });
  1667. } else {
  1668. uni.webView.navigateTo({
  1669. url: '/pages/order/order',
  1670. });
  1671. }
  1672. }
  1673. }
  1674. });
  1675. window.onbeforeunload = function () {
  1676. wsss.close();
  1677. decodeWoker.postMessage('close');
  1678. decodeWoker.terminate();
  1679. };
  1680. // 埋点
  1681. function systemBuriedPoint(pointName) {
  1682. $.ajax({
  1683. url: baseUrl + '/api/public/v1/systemBuriedPoint/stat',
  1684. headers: {
  1685. Authorization: token,
  1686. },
  1687. type: 'post',
  1688. data: JSON.stringify({
  1689. pointName: pointName,
  1690. }),
  1691. contentType: 'application/json',
  1692. dataType: 'json',
  1693. success: function (res) { },
  1694. });
  1695. }
  1696. function quit() {
  1697. if (navigator.userAgent.toLowerCase().includes('toutiaomicroapp')) {
  1698. tt.miniProgram.switchTab({
  1699. url: '/pages/home/home',
  1700. });
  1701. } else if (window.__wxjs_environment === 'miniprogram') {
  1702. wx.miniProgram.switchTab({
  1703. url: '/pages/home/home',
  1704. });
  1705. } else {
  1706. uni.webView.navigateBack({
  1707. delta: 1,
  1708. });
  1709. }
  1710. }
  1711. function updatePhoneSizeListHtml() {
  1712. const templatePhoneSizeItem = doT.template(
  1713. $('#template-phone-size-item').html().replace(/&amp;/g, '&'),
  1714. );
  1715. // console.log({
  1716. // list: window.phoneSizeList,
  1717. // active: window.activePhoneSize,
  1718. // resolving,
  1719. // });
  1720. const phoneSizeListItemsHtml = templatePhoneSizeItem({
  1721. list: window.phoneSizeList,
  1722. active: window.activePhoneSize,
  1723. resolving,
  1724. });
  1725. $('#phone-size-list').html(phoneSizeListItemsHtml);
  1726. }
  1727. $('#open-set-phone-size-dialog-btn').on('click', async function (e) {
  1728. !window.phoneSizeList.length && (await getPhoneSizeList());
  1729. window.activePhoneSize = window.currentPhoneSize;
  1730. updatePhoneSizeListHtml();
  1731. $('#set-phone-size-dialog').addClass('show');
  1732. });
  1733. // $('#set-phone-size-dialog').addClass('show');
  1734. $('.dialog .dialog-mask')
  1735. .add('.dialog .dialog-btn.cancel')
  1736. .on('click', function (e) {
  1737. $(e.currentTarget).parents('.dialog').removeClass('show');
  1738. });
  1739. // 分辨率列表
  1740. window.phoneSizeList = [];
  1741. // 当前生效的分辨率
  1742. // 选中的分辨率
  1743. // window.activePhoneSize = window.currentPhoneSize;
  1744. async function getPhoneSizeList() {
  1745. const response = await $.ajax({
  1746. url:
  1747. baseUrl + '/api/resources/v5/machine/resolution/getResolvingPower',
  1748. headers: {
  1749. Authorization: token,
  1750. },
  1751. type: 'get',
  1752. dataType: 'json',
  1753. data: {
  1754. userCardId,
  1755. },
  1756. });
  1757. const phoneSizeList = response.data.map(function (v) {
  1758. return {
  1759. id: v.id,
  1760. dpi: v.dpi,
  1761. width: v.width,
  1762. height: v.high,
  1763. };
  1764. });
  1765. window.phoneSizeList = phoneSizeList;
  1766. // 关联上当前云机分辨率
  1767. const currentPhoneSize = phoneSizeList.find(function (v) {
  1768. return (
  1769. window.currentPhoneSize &&
  1770. v.width === window.currentPhoneSize.width &&
  1771. v.height === window.currentPhoneSize.height &&
  1772. v.dpi === window.currentPhoneSize.dpi
  1773. );
  1774. });
  1775. window.currentPhoneSize = currentPhoneSize || window.currentPhoneSize;
  1776. }
  1777. /*
  1778. getPhoneSizeList().then(function (phoneSizeList) {
  1779. window.phoneSizeList = phoneSizeList;
  1780. // window.phoneSizeListBack = phoneSizeList; // 备份下数据,用户横竖切换时。
  1781. const currentPhoneSize = window.phoneSizeList.find(function (v) {
  1782. return (
  1783. window.currentPhoneSize &&
  1784. v.width === window.currentPhoneSize.width &&
  1785. v.height === window.currentPhoneSize.height &&
  1786. v.dpi === window.currentPhoneSize.dpi
  1787. );
  1788. });
  1789. window.currentPhoneSize = currentPhoneSize || window.currentPhoneSize;
  1790. // return updatePhoneSizeListHtml();
  1791. });
  1792. */
  1793. // const phoneSizeListSwiper = new Swiper('#phone-size-list-swiper', {
  1794. // direction: 'vertical',
  1795. // slidesPerView: 'auto',
  1796. // loop: false,
  1797. // centeredSlides: true,
  1798. // });
  1799. let lastSetPhone = 0;
  1800. function setPhoneSize(config) {
  1801. if (config.id === currentPhoneSize.id) {
  1802. return;
  1803. }
  1804. if (Date.now() <= lastSetPhone + 1000 * 5) {
  1805. throw new Error('请勿频繁操作');
  1806. }
  1807. lastSetPhone = Date.now();
  1808. // config = Object.assign({}, config, {
  1809. // width: config.width,
  1810. // height: config.height,
  1811. // });
  1812. // 修改云机分辨率
  1813. wsss.send(
  1814. JSON.stringify({
  1815. type: 'setPhoneSize',
  1816. data: {
  1817. id: config.id,
  1818. width: config.width,
  1819. height: config.height,
  1820. dpi: config.dpi,
  1821. },
  1822. }),
  1823. );
  1824. // XXX: 去除了,改为中台发送
  1825. // 通知其他在线端
  1826. // wsss.send(
  1827. // JSON.stringify({
  1828. // type: 'forwardMsg',
  1829. // data: {
  1830. // code: 'phoneSizeChange',
  1831. // id: config.id,
  1832. // width: config.width,
  1833. // height: config.height,
  1834. // dpi: config.dpi,
  1835. // desc: '分辨率修改', // 可选
  1836. // },
  1837. // }),
  1838. // );
  1839. // 上报分辨率
  1840. window.currentPhoneSize = config;
  1841. }
  1842. // wsss.addEventListener('message', function (event) {
  1843. // console.log(
  1844. // '🚀 ~ file: WXtrialInterface.html ~ line 1476 ~ event',
  1845. // event,
  1846. // );
  1847. // });
  1848. $('#phone-size-list').on('click', '.phone-size-item', function (e) {
  1849. const data = $(e.currentTarget).data();
  1850. // console.log(
  1851. // '🚀 ~ file: WXtrialInterface.html ~ line 1494 ~ data',
  1852. // data,
  1853. // );
  1854. window.activePhoneSize = data;
  1855. updatePhoneSizeListHtml();
  1856. // setPhoneSize(data.width, data.height);
  1857. });
  1858. $('#set-phone-size-dialog .dialog-btn.confirm').on('click', function (e) {
  1859. try {
  1860. setPhoneSize(window.activePhoneSize);
  1861. $('#set-phone-size-dialog').removeClass('show');
  1862. } catch (error) {
  1863. $.toast(error.message, 'text');
  1864. }
  1865. });
  1866. </script>
  1867. <script type="text/javascript" src="WXdraw.js"></script>
  1868. <script type="text/javascript" src="aac.js"></script>
  1869. <script type="text/javascript" src="./timer.js"></script>
  1870. </body>
  1871. </html>