tangdehang
/
android-cloud-H5


			
							12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094
							<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="initial-scale=1,maximum-scale=1, minimum-scale=1,user-scalable=no">
		<meta name="x5-orientation" content="portrait" />
		<meta name="screen-orientation" content="portrait" />
		<meta name="viewport" content="width=device-width, minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">

		<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<meta name="format-detection" content="telephone=no, email=no">
		<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<!-- 删除苹果默认的工具栏和菜单栏 -->
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<!-- 设置苹果工具栏颜��? -->
		<meta name="format-detection" content="telphone=no, email=no">
		<!-- 忽略页面中的数字识别为电话，忽略email识别 -->
		<!-- 启用360浏览器的极速模��?(webkit) -->
		<meta name="renderer" content="webkit">
		<!-- 避免IE使用兼容模式 -->
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<!-- 针对手持设备优化，主要是针对一些老的不识别viewport的浏览器，比如黑��? -->
		<meta name="HandheldFriendly" content="true">
		<!-- 微软的老式浏览��? -->
		<meta name="MobileOptimized" content="320">
		<!-- uc强制竖屏 -->
		<!-- <meta name="screen-orientation" content="portrait"> -->
		<!-- QQ强制竖屏 -->
		<!-- <meta name="x5-orientation" content="portrait"> -->
		<!-- 不能旋转，问题出在这 -->
		<!-- UC强制全屏 -->
		<meta name="full-screen" content="yes">
		<!-- QQ强制全屏 -->
		<meta name="x5-fullscreen" content="true">
		<!-- UC应用模式 -->
		<meta name="browsermode" content="application">
		<!-- QQ应用模式 -->
		<meta name="x5-page-mode" content="app">
		<!-- windows phone 点击无高��? -->
		<meta name="msapplication-tap-highlight" content="no">

		<title></title>
		<link rel="stylesheet" href="../static/css/homeNew.css?id=103">
		<link rel="stylesheet" type="text/css" href="../static/css/swiper-bundle.min.css" />
		<script src="../static/css/swiper-bundle.min.js"></script>
		<style>
			canvas {
				display: block;
				width: 100%;
				height: 100%;
				z-index: 999;
				border-radius: 1.25rem;
			}
			.wine{
				width: 100%;
				height: 100%;
			}
			.mainbox {
			    width: 18rem;
    height: 10rem;
    background: #fff;
    position: fixed;
    top: 38%;
    left: 12%;
    border-radius: 5px;
			}
			
			.boxTitle {
				text-align: center;
				font-size: 18px;
				padding: 10px 0px;
			}
			
			.boxText {
				text-align: center;
				font-size: 16px;
			}
			
			.boxbt {
				width: 60%;
				height: 2.5rem;
				background: #0886F5;
				margin: 0 auto;
				font-size: 16px;
				text-align: center;
				line-height: 2.5rem;
				color: #fff;
				border-radius: 5px;
				margin-top: 1rem;
			}
			
			.sbox {
				width: 18rem;
				height: 5.5rem;
				background: #fff;
				position: fixed;
				top: 38%;
				left: 5%;
				border-radius: 5px;
			}
			
			.sboxText {
				padding: 17px;
				font-size: 16px;
			}
			
			.boximg {
				position: absolute;
				width: 1rem;
				height: 1rem;
				left: 45%;
				bottom: -22%;
			}
			.maxs{
				width: 100%;
				height: 100%;
				position: fixed;
				background:rgba(0,0,0,0.5);
               
			}
			.helps{
				    width: 35px;
    height: 30px;
    background: rgba(187,187,187,1);
    border-radius: 30px 0px 0px 30px;
    font-size: 13px;
    line-height: 30px;
    color: rgba(255,255,255,1);
    position: absolute;
    right: 0;
    bottom: 181px;
    text-align: center;
			}
			
			.helps-img{
				width: 50%;
    height: 50%;
    margin: 0 auto;
    margin-top: 0.5rem;
			}
			
			.diskName{
				margin-left: 6px;
			}
			#showsuss{
				display: none;
			}
			.swiper-container {
			  width: 100%;
			  height: 100%;
			}
			
			.swiper-slide {
				    /* padding: 43px 53px; */
					padding: 12% 14%;
				    box-sizing: border-box;
			  text-align: center;
			  font-size: 18px;
			  /* background: #fff; */
			  /* height: 667px; */
			  height:100%;
			  /* Center slide text vertically */
			  display: -webkit-box;
			  display: -ms-flexbox;
			  display: -webkit-flex;
			  display: flex;
			  -webkit-box-pack: center;
			  -ms-flex-pack: center;
			  -webkit-justify-content: center;
			  justify-content: center;
			  -webkit-box-align: center;
			  -ms-flex-align: center;
			  -webkit-align-items: center;
			  align-items: center;
			}
			.swiper-button-next{
				width: 15px;
				height: 15px;
				background: url(../static/img/xia_icon.png);
				right: 15px;
			}
			.swiper-button-prev{
				width: 15px;
				height: 15px;
				background: url(../static/img/shang_icon.png);
				left: 15px;
			}
			.swiper-button-next:after, .swiper-container-rtl .swiper-button-prev:after{
				content: "" !important;
			}
			.swiper-button-prev:after, .swiper-container-rtl .swiper-button-next:after{
				content: "" !important;
			}
			.thl-time{
				    text-align: left;
				    margin-left: -0.4rem !important;
			}
    </style>
	</head>
	<body style="background: #F8F9FA;overflow:scroll;overflow-y: hidden;overflow-x: hidden;">
		<div style="width: 100%;height: 100%;" id="homeapp">
			<!-- <div class="canvas" style="display: none;">
				<div id="wine" style="height: 90%;">
				</div>
				<div class="camvas-head">
					<div class="vip">
						<img class="vipimg" src="../static/img/vip_icon.png"></img>
						<text class="diskName"></text>
			
					</div>
					<div class="canvastime"></div>
				</div>
			</div> -->
			<!-- Swiper -->
			<div class="newhelp" style="z-index: 50;">
				<div class="helpImg">
					<img src="../static/img/bangzu_icon.png" />
				</div>
				<div class="font helpfont">使用帮助？</div>
			</div>
			<div class="buyIcon" style="z-index: 50;">
				<img src="../static/img/goumai_icon.png" />
			</div>

			<div class="swiper-container">
				<div class="swiper-wrapper">
					<div class="swiper-slide" v-for="(item,index) in homeList" :key="item.id" :class="[index==0 ? 'swiper-slide-active' : '' , index==1 ? 'swiper-slide-next' : '']">
						<div class="canvas" style="z-index: 1;" @click="homeinfo(item)">
							<div style="height: 100%;" class="wine" :id="'wine'+index">
							</div>
							<div class="camvas-head" style="z-index: 5555;">
								<div class="tophead">
									<div class="th_left">
										<!-- {{item.buyVipType}} -->
										<img src="../static/img/xingyao_icon.png" v-if="item.buyVipType='SVIP'" />
										<img src="../static/img/xingdong_icon.png" v-else />
									</div>
									<div class="th_right">
										<div class="thl-font">{{item.diskName}}</div>
										<div class="thl-time">{{remainTime(item.ctime,item.exceptTime)}}</div>
									</div>
								</div>
								<div class="th_renew homeRenew" style="z-index: 5000;" @click="renew(item)">
									续费
								</div>
							</div>
						</div>
					</div>
					<div class="swiper-slide">
						<div class="canvas" style="display: none;">
							<div style="height: 100%;" class="kongWine">
								<div class="kphone">
									<div class="kp_img">
										<img src="../static/img/goumai_pic.png" />
									</div>
									<div class="kp_btn" style="z-index: 5000;">
										购买云手机
									</div>
								</div>
							</div>

						</div>
					</div>
				</div>
				<!-- Add Arrows -->
				<div class="swiper-button-next" @click="swiperNext()"></div>
				<div class="swiper-button-prev" @click="swiperPrev()"></div>
			</div>


			<!-- 没登录状态 -->
			<div class="canvasfalse" style="display: none;">
				<div class="notLoggedin">
					<image src="../static/img/tianjiashouji_pic.png"></image>
				</div>

				<!--    审核-->
				<div id="showsuss">
					<div class="notLoggedin-text">
						<div>下载云手机</div>
						<div>体验更多功能</div>
					</div>

					<div class="notLoggedin-bt">
						立即下载
					</div>
				</div>

			</div>

			<!--<div class="addto">
        <img class="addto-img" src="../static/img/tianjia_icon.png"></img>
    </div>-->

			<!-- <div class="help">使用帮助?</div>
			<div class="helps" data-id="1">
				<img class="helps-img" src="../static/img/bangzu_icon.png">
			</div> -->

			<div class="maxs" style="display: none;">
				<div class="mainbox" style="display: none;">
					<div class="boxTitle">提示</div>
					<div class="boxText">
						<div>由于小程序的功能限制，此功能暂时</div>
						<div>无法使用，请下载APP使用更多功能</div>

					</div>
					<!--<div class="boxbt" onclick="cp(document.getElementById('user_ref_id'));">立即前往下载</div>-->
					<div class="boxbt" onclick="cp(document.getElementById('user_ref_id'));">立即前往下载</div>
					<div class="boximg"><img src="../static/img/wx/guanbi_icon.png"></div>
				</div>
			</div>

		</div>

		<div id="copy-txt" style="position: absolute;opacity: 0;">
			<span id="user_ref_id">www.androidsCloud.com</span>
		</div>
		<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.0.js"></script>
		<!--  视频-->
		<script src="../static/js/jquery-1.11.0.min.js"></script>
		<script type="text/javascript" src="../static/js/Decoder.js"></script>
		<script type="text/javascript" src="../static/js/YUVCanvas.js"></script>
		<script type="text/javascript" src="../static/js/Player.js"></script>
		<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
		<script src="https://cdn.bootcss.com/vConsole/3.2.0/vconsole.min.js"></script>
		<script type="text/javascript">
			var app = new Vue({
				el: '#homeapp',
				data: {
					message: 'Hello Vue!',
					homeList: [],
					urlData: {},
					rbdData: {},
					activeIndexData: "",
					swipeDirection: "",
				},
				mounted() {
					// //初始化一下就可以了，
					let vConsole = new VConsole();
					//			 //你打印的数据 比如
					console.log('test');
					//就可像小程序一样的看了和调试了。
					this.$nextTick(function() {
						this.gethomeList();
					});
					var that = this;
					var swiper = new Swiper('.swiper-container', {
						observer: true, //修改swiper自己或子元素时，自动初始化swiper 
						observeParents: true, //修改swiper的父元素时，自动初始化swiper
						navigation: {
							nextEl: '.swiper-button-next',
							prevEl: '.swiper-button-prev',
						},
						on: {

							touchEnd: function(event) {
								console.log('触摸停止');
								console.log(swiper.swipeDirection);
								this.swipeDirection = swiper.swipeDirection;
							},
							transitionStart: function() {
								console.log("transitionStart", this.activeIndex)
								this.activeIndexData = this.activeIndex;
							},
							slideChangeTransitionStart: function() {
								console.log("slideChangeTransitionStart", this.activeIndex)
								this.activeIndexData = this.activeIndex;
							},
							slideChangeTransitionEnd: function() {
								console.log("slideChangeTransitionEnd", this.activeIndex)
								this.activeIndexData = this.activeIndex;
								if (this.swipeDirection == "next") {
									that.getSwiperInfo("nextSlide");
								} else if (this.swipeDirection == "prev") {
									that.getSwiperInfo("prevSlide");
								}
							},
							// slideChangeStart: function() {
							// 	alert(this.activeIndext);
							// },
							// slideChangeEnd: function() {
							// 	console.log("下标啊", this)
							// },
							// ransitionStart: function(activeIndex) {
							// 	console.log("下标啊", this, activeIndex)
							// },
							// slideChangeEnd: function(swiperHere) {
							// 	var txt = $('.swiper-slide-active').html();
							// 	console.log("打印索引值", txt)
							// }
						}

					});
				},
				methods: {
					homeinfo(data) {
						wx.miniProgram.navigateTo({
							url: '/pages/trialInterface/trialInterface?record=' + JSON.stringify(data),
						})
					},
					renew(data) {
						console.log("续费啊", data);
						wx.miniProgram.navigateTo({
							url: '/pages/order/renew/index?record=' + JSON.stringify(data),
						})
					},
					remainTime(ctime, exceptTime) {
						var date1 = ctime;
						var date2 = exceptTime; //结束时间
						var date3 = new Date(date2.replace(/-/g, '/')).getTime() - new Date(date1.replace(/-/g, '/')).getTime(); //时间差的毫秒数      
						console.log("时间戳===========》", date3)
						//------------------------------
						var tmiss = ''
						//计算出相差天数
						var days = Math.floor(date3 / (24 * 3600 * 1000))
						// console.log(days + "天");
						//计算出小时数

						var leave1 = date3 % (24 * 3600 * 1000) //计算天数后剩余的毫秒数
						var hours = Math.floor(leave1 / (3600 * 1000))
						//计算相差分钟数
						var leave2 = leave1 % (3600 * 1000) //计算小时数后剩余的毫秒数
						var minutes = Math.floor(leave2 / (60 * 1000))
						//计算相差秒数
						var leave3 = leave2 % (60 * 1000) //计算分钟数后剩余的毫秒数
						var seconds = Math.round(leave3 / 1000)
						var times = ""
						if (Number(days) == 0) {
							// console.log(hours + "小时" + minutes + "分")
							tmiss = Number(hours) + "小时" + Number(minutes) + "分"
						} else {
							if (Number(hours) == 0 && Number(minutes) == 0) {
								// console.log(days + "天")
								tmiss = Number(days) + "天"
							} else {
								// console.log(days + "天" + hours + "小时 ")
								tmiss = Number(days) + "天" + Number(hours) + "小时 "
							}
						}
						// console.log("tmiss>>>>>>", tmiss);
						return tmiss
					},
					swiperNext(data) {

						this.getSwiperInfo("next");


					},
					swiperPrev() {

						this.getSwiperInfo("prev");

					},
					getSwiperInfo(data) {
						console.log("方向=======", data, $('.swiper-slide-active').index());
						// return
						if (data == "next") {
							var activeIndex = $('.swiper-slide-active').index() + 1;
						} else if (data == "prev") {
							var activeIndex = $('.swiper-slide-active').index() - 1;

						} else if (data == "prevSlide") {
							var activeIndex = $('.swiper-slide-active').index();

						} else if (data == "nextSlide") {
							var activeIndex = $('.swiper-slide-active').index();

						}
						var ids = "#wine" + $('.swiper-slide-active').index();
						var domprev = $(ids);
						console.log("下标id======", activeIndex);
						domprev.empty();
						let rbdData = {
							"userCardId": this.homeList[activeIndex].id,
							"deviceStatus": 1,
						};
						// var baseUrl = "http://192.168.31.20";
						var baseUrl = "https://test.androidscloud.com";
						var urlss = 'test.androidscloud.com'
						let that = this;
						var player = new Player({
							size: {
								width: 768,
								height: 1024
							}
						});
						var id = 'wine' + activeIndex;
						var secanv = document.getElementById(id);
						secanv.appendChild(player.canvas);


						// setTimeout(() => {
						$.ajax({
							url: baseUrl + "/api/storage/v1/cardStatus/getRbd",
							data: JSON.stringify(rbdData),
							type: 'post',
							dataType: 'json',
							// async: false,
							contentType: "application/json;charset=UTF-8",
							headers: {
								'token': tokens.substring(6, tokens.length),
								"Authorization": tokens.substring(6, tokens.length)
							},
							success: function(data) {

								that.urlData = data.data;
								console.log("挂载安卓卡成功", that.urlData);
								//                       
							}
						})
						// var strhost = "wss://" + urlss + "/videoWebSocket?clientType=1&cardIp=" +
						// 	that.urlData.exIp +
						// 	"&port=" + that.urlData.exPort + "&sn=" + that.urlData.sn;
						// var strhost = "ws://192.168.11.66:9101";
						// var strhost = "ws://" + that.urlData.exIp + ":" + that.urlData.exPort
						// var strhost="wss://www.ted2018.com:9101";
						var strhost = "wss://test.androidscloud.com:9105";
						// var strhost="wss://test.androidscloud.com/videoWebSocket?clientType=1&cardIp=14.215.128.96&port=2005&sn=RK3930C2301900005";
						var client = new WebSocket(strhost);
						console.log('wsssss==============', client)

						client.binaryType = 'arraybuffer';
						// debugger
						client.onopen = function(evt) {
							// onOpen(evt) 
							console.log("开始链接==============", evt);
						};
						client.onclose = function(evt) {
							// onClose(evt) 
						};
						client.onmessage = function(evt) {
							// onMessage(evt)
							// console.log("onMessage==============", evt);
							var messageData = new Uint8Array(evt.data);

							player.decode(messageData);
						};
						client.onerror = function(evt) {
							// onError(evt) 
						};
						// }, 1)

					},
					gethomeList() {
						var baseUrl = 'https://test.androidscloud.com';
						// var baseUrl = "http://192.168.31.20";
						var query = window.location.search.substring(1);
						var vars = query.split("&");
						var tokens = vars.find(e => {
							return e.startsWith('token')
						}) || ''
						var data = {}

						var clientType = vars.find(e => {
							return e.startsWith('clientType')
						}) || ''
						var cardIp = vars.find(e => {
							return e.startsWith('cardIp')
						}) || ''
						var port = vars.find(e => {
							return e.startsWith('port')
						}) || ''

						var sn = vars.find(e => {
							return e.startsWith('sn')
						}) || ''
						var demoTime = vars.find(e => {
							return e.startsWith('demoTime')
						}) || ''
						var id = vars.find(e => {
							return e.startsWith('id')
						}) || ''
						var vip = vars.find(e => {
							return e.startsWith('vip')
						}) || ''
						var diskName = vars.find(e => {
							return e.startsWith('diskName')
						}) || ''
						var times = vars.find(e => {
							return e.startsWith('times')
						}) || ''
						var username = vars.find(e => {
							return e.startsWith('username')
						}) || ''
						var userCardId = vars.find(e => {
							return e.startsWith('userCardId')
						}) || ''
						var ip = vars.find(e => {
							return e.startsWith('ip')
						}) || ''
						var windowHeight = vars.find(e => {
							return e.startsWith('windowHeight')
						}) || ''
						var tokens = vars.find(e => {
							return e.startsWith('token')
						}) || ''

						data.clientType = clientType.substring(11, clientType.length)

						data.cardIp = cardIp.substring(7, cardIp.length)

						data.port = port.substring(5, port.length)

						data.sn = sn.substring(3, sn.length)

						data.demoTime = demoTime.substring(9, demoTime.length)
						data.id = id.substring(3, id.length)
						data.vip = vip.substring(4, vip.length)
						data.diskName = diskName.substring(9, diskName.length)
						data.times = times.substring(6, times.length)
						data.username = username.substring(9, username.length)
						data.userCardId = userCardId.substring(11, userCardId.length)
						data.ip = ip.substring(3, ip.length)
						console.log("data====", data);
						this.urlData = data;
						let that = this;

						$.ajax({
							url: baseUrl + "/api/user/v1/client/disk/info",
							data: {},
							type: 'get',
							dataType: 'json',
							headers: {
								'token': tokens.substring(6, tokens.length),
								"Authorization": tokens.substring(6, tokens.length)
							},
							success: function(data) {
								console.log("云手机信息=======", data);
								if (data.data) {
									that.homeList = data.data.diskInfo;
									console.log("云手机this.homeListthis.homeListthis.homeList=======", that.homeList);
									var urlss = 'test.androidscloud.com'

									let rbdData = {
										"userCardId": that.homeList[0].id,
										"deviceStatus": 1,
									};

									let activeIndex = $('.swiper-slide-active').index();

									// let that = this;
									setTimeout(() => {
										$.ajax({
											url: baseUrl + "/api/storage/v1/cardStatus/getRbd",
											data: JSON.stringify(rbdData),
											// data:rbdData,
											type: 'post',
											dataType: 'json',
											contentType: "application/json;charset=UTF-8",
											async: false,
											headers: {
												'token': tokens.substring(6, tokens.length),
												"Authorization": tokens.substring(6, tokens.length)
											},
											success: function(data) {
												that.urlData = data.data;
												console.log("挂载安卓卡成功", that.urlData);
												//                       
											}
										})
										console.log("that.urlDatathat.urlDatathat.urlDatathat.urlData", that.urlData);
										var player = new Player({
											size: {
												width: 768,
												height: 1024
											}
										});
										var id = 'wine' + activeIndex;
										console.log("首页=====", id);
										var secanv = document.getElementById(id);
										secanv.appendChild(player.canvas);
										console.log("首页=====", secanv);

										// var strhost = "wss://" + urlss + "/videoWebSocket?clientType=1&cardIp=" +
										// 	that.urlData.exIp +
										// 	"&port=" + that.urlData.exPort + "&sn=" + that.urlData.sn;
										// var strhost = "ws://192.168.11.66:9101";
										// var strhost="wss://192.168.11.242:9104";
										// var strhost="wss://www.ted2018.com:9101";
										var strhost = "wss://test.androidscloud.com:9105";
										// var strhost="wss://test.androidscloud.com/videoWebSocket?clientType=1&cardIp=14.215.128.96&port=2005&sn=RK3930C2301900005";
										// var strhost="ws://192.168.11.242:9101";
										// var strhost="ws://"+that.urlData.exIp+":"+that.urlData.exPort
										// var client = new WebSocket(strhost.replace("wss","ws"));
										var client = new WebSocket(strhost);
										console.log('wsssss==============', client)

										client.binaryType = 'arraybuffer';
										// debugger
										client.onopen = function(evt) {
											// onOpen(evt) 
											console.log("开始链接==============", evt);
										};
										client.onclose = function(evt) {
											// onClose(evt) 
										};
										client.onmessage = function(evt) {
											// onMessage(evt)
											// console.log("onMessage==============", evt);
											var messageData = new Uint8Array(evt.data);

											player.decode(messageData);
										};
										client.onerror = function(evt) {
											// onError(evt) 
										};
									}, 1)


								} else {

								}
								//                       
							}
						})
					}
				}
			})
			var homeList = []; //云手机列表信息
			var url = window.location.href;

			url = url.split('/')
			console.log(url)
			// var baseUrl = 'https://' + url[2] //'http://192.168.31.159'//'http://' + url[2] 
			// var baseUrl = 'http://192.168.31.20'
			var baseUrl = 'https://test.androidscloud.com';
			var query = window.location.search.substring(1);

			var vars = query.split("&");
			//						 var urls = "https://xcx.androidscloud.com"
			//			 审核
			$.ajax({
				url: baseUrl + "/api/user/v1/config/download/isShow",
				data: {},
				type: 'get',
				dataType: 'json',
				contentType: "application/json;charset=UTF-8",
				success: function(data) {
					if (data.data) {
						$("#showsuss").show()
					} else {
						$("#showsuss").hide()
					}
					//                       
				}
			})

			// var baseUrl = window.location.href; //"http://192.168.31.20"

			document.body.addEventListener('touchmove', function(e) {
				e.preventDefault()
			}, {
				passive: false
			})
			var data = {}

			var clientType = vars.find(e => {
				return e.startsWith('clientType')
			}) || ''
			var cardIp = vars.find(e => {
				return e.startsWith('cardIp')
			}) || ''
			var port = vars.find(e => {
				return e.startsWith('port')
			}) || ''

			var sn = vars.find(e => {
				return e.startsWith('sn')
			}) || ''
			var demoTime = vars.find(e => {
				return e.startsWith('demoTime')
			}) || ''
			var id = vars.find(e => {
				return e.startsWith('id')
			}) || ''
			var vip = vars.find(e => {
				return e.startsWith('vip')
			}) || ''
			var diskName = vars.find(e => {
				return e.startsWith('diskName')
			}) || ''
			var times = vars.find(e => {
				return e.startsWith('times')
			}) || ''
			var username = vars.find(e => {
				return e.startsWith('username')
			}) || ''
			var userCardId = vars.find(e => {
				return e.startsWith('userCardId')
			}) || ''
			var ip = vars.find(e => {
				return e.startsWith('ip')
			}) || ''
			var windowHeight = vars.find(e => {
				return e.startsWith('windowHeight')
			}) || ''
			var tokens = vars.find(e => {
				return e.startsWith('token')
			}) || ''
			$(".swiper-container").css("height", windowHeight.substring(13, windowHeight.length));
			console.log("获取网页高度", windowHeight.substring(13, windowHeight.length));
			//				$(".aaa").text(clientType.substring(11, clientType.length))
			// let cardIp = getUrlParam('cardIp');
			// console.log(cardIp)
			$.ajax({
				url: baseUrl + "/api/user/v1/client/disk/info",
				data: {},
				type: 'get',
				dataType: 'json',
				headers: {
					'token': tokens.substring(6, tokens.length),
					"Authorization": tokens.substring(6, tokens.length)
				},
				success: function(data) {
					console.log("云手机信息=======", data);
					if (data.data) {
						homeList = data.data.diskInfo;
					} else {

					}
					//                       
				}
			})
			getQueryString: (name) => {
				let reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
				let r = window.location.search.substr(1).match(reg);
				console.log(name)
				if (r != null) {
					return unescape(decodeURI(r[2]));
					return null;
				}
			}

			data.clientType = clientType.substring(11, clientType.length)

			data.cardIp = cardIp.substring(7, cardIp.length)

			data.port = port.substring(5, port.length)

			data.sn = sn.substring(3, sn.length)

			data.demoTime = demoTime.substring(9, demoTime.length)
			data.id = id.substring(3, id.length)
			data.vip = vip.substring(4, vip.length)
			data.diskName = diskName.substring(9, diskName.length)
			data.times = times.substring(6, times.length)
			data.username = username.substring(9, username.length)
			data.userCardId = userCardId.substring(11, userCardId.length)
			data.ip = ip.substring(3, ip.length)
			let timestext = "剩" + decodeURI(data.times) || data.demoTime / 3600 + "小时"
			$(".diskName").text(decodeURI(data.diskName) || data.username)
			console.log("timestext>>>>>>", timestext);
			$(".canvastime").text(timestext)


			if (data.vip == "0") {
				$(".canvasfalse").css({
					"display": "block"
				})
				$(".canvas").css({
					"display": "none"
				})
			} else {
				$(".canvas").css({
					"display": "block"
				})
				$(".canvasfalse").css({
					"display": "none"
				})
			}

			// //			云手机相关逻辑	 
			// var player = new Player({
			// 	size: {
			// 		width: 768,
			// 		height: 1024
			// 	}
			// });
			// console.log("player====", player, player.canvas);
			// //		document.body.appendChild(player.canvas);
			// // var urlss = url[2]
			// var urlss = 'test.androidscloud.com'
			// for (var i = 0; i <= homeList; i++) {
			//                console.log("i=============",i,homeList);
			// }
			// var secanv = document.getElementById("wine");
			// secanv.appendChild(player.canvas);
			// // var strhost = Number(data.clientType) ===2? "wss://"+ urlss +"/shareWebSocket?clientType=2&username="+data.username+"&userCardId="+data.userCardId+"&ip="+data.ip : Number(data.clientType) ===3?"wss://"+ urlss +"/authVideoWebSocket?clientType=3&username="+data.username+"&userCardId="+data.userCardId :"wss://"+ urlss +"/videoWebSocket?clientType="+ data.clientType +"&cardIp="+data.cardIp  +"&port="+ data.port +"&sn="+data.sn;
			// var strhost = "wss://" + urlss + "/videoWebSocket?clientType=" + data.clientType + "&cardIp=" + data.cardIp +
			// 	"&port=" + data.port + "&sn=" + data.sn;
			// var client = new WebSocket(strhost);
			// console.log('wsssss==============', client)

			// client.binaryType = 'arraybuffer';
			// // debugger
			// client.onopen = function(evt) {
			// 	// onOpen(evt) 
			// };
			// client.onclose = function(evt) {
			// 	// onClose(evt) 
			// };
			// client.onmessage = function(evt) {
			// 	onMessage(evt)
			// };
			// client.onerror = function(evt) {
			// 	// onError(evt) 
			// };


			function onMessage(evt) {
				console.log("onMessage==============", evt);
				var messageData = new Uint8Array(evt.data);

				player.decode(messageData);
			}


			$("canvas").on("click", function() {
				client.close()
				// 		    	?clientType=0&cardIp=30.30.30.42&port=9100&sn=RK3930C2301900042&demoTime=3600&id=3
				setTimeout(() => {
					wx.miniProgram.navigateTo({
						url: '/pages/trialInterface/trialInterface?clientType=' + data.clientType + "&cardIp=" + data.cardIp +
							"&port=" + data.port + "&sn=" + data.sn + "&username=" + data.username + "&userCardId=" + data.userCardId +
							"&demoTime=3600&id=" + data.id + "&diskName=" + decodeURI(data.diskName)
					})
				}, 100);

			})

			$(".helps").click(function() {

				// wx.miniProgram.navigateTo({
				// 	url: '/pages/viewurl/viewurl'
				// })
				//按点击处理		
				var set = $('.helps').attr("data-id")
				if (set == '1') {
					$('.helps').attr({
						"data-id": "2"
					})

					$(".helps").hide();
					$(".help").css({
						"right": "0"
					})
				} else {
					$('.helps').attr({
						"data-id": "1"
					})
					$(".help").css({
						"right": "-4rem"
					})

				}
			});

			function stopPropagation(e) {
				if (e.stopPropagation)
					e.stopPropagation();
				else
					e.cancelBubble = true;
			}

			$(document).bind('click', function() {
				$(".help").css({
					"right": "-4rem"
				})
				$('.helps').attr({
					"data-id": "1"
				})
				$(".helps").show();
			});

			$('.helpfont').bind('click', function(e) {
				console.log("帮助啊啊");
				// stopPropagation(e);
				wx.miniProgram.navigateTo({
					url: '/pages/viewurl/viewurl'
				})
			});

			$('.buyIcon,.kp_btn').bind('click', function(e) {
				console.log("购买");
				// stopPropagation(e);
				wx.miniProgram.navigateTo({
					url: '/pages/order/buy/index'
				})
			});
			// $('.homeRenew').bind('click', function(e) {
			// 	console.log("续费啊");
			// 	// stopPropagation(e);
			// 	wx.miniProgram.navigateTo({
			// 		url: '/pages/order/buy/index'
			// 	})
			// });
			$(".homeRenew").on("click", function() {
				console.log("续费啊");
				wx.miniProgram.navigateTo({
					url: '/pages/order/renew/index'
				})
			});
			$('.helps').bind('click', function(e) {
				stopPropagation(e);
			});


			// 		    
			// 		    var player = new Player({
			//				size: {
			//					width: 1280,
			//					height: 720
			//				}
			//			});
			//			var secanv = document.getElementById("wine");
			//			secanv.appendChild(player.canvas);
			// 		    var players = AV.Player.fromWebSocket("ws://" + urlss + '/videoWebSocket?' + "clientType=" + data.clientType +
			//				"&cardIp=" + data.cardIp + "&port=" + data.port + "&sn=" + data.sn);
			//              players.play();

			$(".boximg").on("click", function() {
				$(".mainbox").css({
					"display": "none"
				})
				$(".maxs").css({
					"display": "none"
				})
			})
			$(".maxs").on("click", function() {
				$(".mainbox").css({
					"display": "none"
				})
				$(".maxs").css({
					"display": "none"
				})
			})
			$(".addto").on("click", function() {
				$(".mainbox").css({
					"display": "block"
				})
				$(".maxs").css({
					"display": "block"
				})
			})

			$(".notLoggedin-bt").on("click", function() {
				//				$(".mainbox").css({
				//					"display": "block"
				//				})
				//				$(".maxs").css({
				//					"display": "block"
				//				})
			})


			function selectText(x) {
				if (document.selection) {
					var range = document.body.createTextRange();
					range.moveToElementText(x);
					range.select();
				} else if (window.getSelection) {
					var selection = window.getSelection();
					var range = document.createRange();
					selection.removeAllRanges();
					range.selectNodeContents(x);
					selection.addRange(range);
				}
			}

			function cp(x) {
				$(".mainbox").css({
					"display": "none"
				})
				$(".sbox").css({
					"display": "block"
				})
				selectText(x);
				document.execCommand("copy");
				alert("复制成功")
			}
		</script>


	</body>
</html>