tangdehang
/
android-cloud-H5


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990
							<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title></title>
		<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>
		<style>

			body {
				font-size: .2592592593rem;
				margin: 0 auto;
				width: 100%;
				min-width: 320px;
			}
			
			.h-player {
				height: 100%;
				overflow: hidden;
				background: #000;
			}
			
			.container {
				width: 100%;
				height: 100%;
				position: relative;
				user-select: none;
			}
			
			#video1 {
				display: block;
				width: 100%;
				height: 100%;
				top: 0px;
				left: 0px;
				opacity: 1;
			}
			
			#box {
				width: 100%;
				height: 100%;
				position: absolute;
				left: 0;
				top: 0;
				z-index: 9999;
				/*width: 667px;
    height: 375px; http://192.168.31.8:8848/cloudmMobilePhone1.11/Player/trialInterface2.html
    position: absolute;
    left: -146px;
    top: 146px;
   background: red;*/
				/*    transform: rotate(-90deg);*/
				/* opacity: 0.3;*/
			}
			
			.scroll {
				position: absolute;
				overflow: scroll;
				-webkit-overflow-scrolling: touch;
				top: 0;
				left: 0;
				bottom: 0;
				right: 0;
			}
			
			body:before {
				width: 100%;
				height: 100%;
				content: ' ';
				position: fixed;
				z-index: -1;
				top: 0;
				left: 0;
				background: #000;
			}
			
			#wine {
				user-select: none;
				-webkit-user-drag: none;
				position: absolute;
				z-index: 0;
				/*  visibility: hidden;*/
			}
			
			#video1 {
				/*	 transform: rotate(180deg);*/
			}
			
			canvas {
				display: block;
				width: 100%;
				height: 100%;
				z-index: 999;
			}
			/*主屏*/
			
			.control {
				width: 900px;
				overflow: hidden;
				margin: 0 auto;
				margin-top: 90px;
				margin-bottom: 17px;
			}
			
			.control-left-img {
				width: 26px;
				height: 26px;
			}
			
			.control-left-img img {
				width: 100%;
				height: 100%;
			}
			
			#mainScreen-main {
				/* overflow: hidden; */
				user-select: none;
				-webkit-user-drag: none;
				position: relative;
				z-index: 0;
				width: 100%;
				height: 100%;
				top: 0px;
				/* left: 652.667px; */
				/* left: 270PX; */
				/* transform-origin: 0% 0%; */
				background: #000;
			}
			
			#mocan {
				position: absolute;
				left: -269px;
				top: 2px;
				/* opacity: 0.2; */
				width: 901px;
				height: 555px;
				z-index: 9999;
				opacity: 0.7;
			}
			
			#no-ne {
				width: 100%;
				height: 100%;
				position: absolute;
				top: 0;
				background: #000000;
				z-index: 99999;
				font-size: 18px;
				color: #FFFFFF;
				text-align: center;
			}
			
			.no-ne-text {
				margin-top: 60%;
			}
			
			.no-ne-an {
				width: 171px;
				height: 47px;
				background: #eb6100;
				line-height: 47px;
				text-align: center;
				color: #FFFFFF;
				margin: 0 auto;
				margin-top: 20px;
			}
			
			.container .muted {
				position: absolute;
				right: .46296rem;
				top: .46296rem;
				z-index: 9999999;
				/*background: #000;*/
				border-radius: 50%;
				   /* opacity: 0.5;*/
			}
			
			.muted {
				width: 2.62963rem;
				height: 2.62963rem;
				background-position: -1.78704rem -8.43519rem;
			}
			
			html {
				height: 100%
			}
			
			.control-right-img {
				width: 42px;
				height: 42px;
				margin: 0 auto;
				/* margin: 1rem; */
				margin-top: 0.6rem;
			}
			
			.control-right-img img {
				width: 100%;
				height: 100%;
			}
			
			.leftmains {
				width: 3.5rem;
				height: 100%;
				background: #333333;
				position: fixed;
				right: 0rem;
				top: 0;
					
transition: all 0.2s ease-in;
			}
			
			.PictureQualityMain {
				margin-top: 3rem;
			}
			
			.PictureQuality {
				margin: 0 auto;
				width: 2.5rem;
				height: 1.8rem;
				line-height: 1.8rem;
				color: #fff;
				text-align: center;
				font-size: 15px;
				margin-top: 1rem;
			}
			
			.avit {
				background: rgba(255, 255, 255, 1);
				color: #000 !important;
				border-radius: 3px;
			}
			
			.upload {
				margin: 0 auto;
				width: 3rem;
				height: 1.8rem;
				line-height: 1.8rem;
				color: #fff;
				text-align: center;
				font-size: 16px;
				margin-top: 3rem;
			}
			
			.upload img {
				width: 1.5rem;
				height: 1.5rem;
			}
			
			.upload div {
				margin-top: -0.5rem;
				font-size: 14px;
			}
			
			.operation {
				margin-top: 9rem;
			}
			
			.bottommains {
				width: 100%;
				height: 50px;
				background: #333333;
				position: fixed;
				left: 0;
				bottom: 0;
			}
			
			.botmat1 {
				width: 33%;
				float: left;
			}
			
			.botmat1img {
				margin: 0 auto;
				width: 1.5rem;
				height: 1.5rem;
				margin-top: 0.5rem;
			}
			
			.botmat1img img {
				width: 100%;
				height: 100%;
			}
			
			.mainbox {
				width: 18rem;
				height: 10rem;
				background: #fff;
				position: fixed;
				top: 38%;
				left: 5%;
				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;
			}
			
			.sboxbu {
				text-align: right;
				color: #0886F5;
				font-size: 16px;
				margin-right: 2rem;
			}
			
			.boximg {
				position: absolute;
				width: 1rem;
				height: 1rem;
				left: 45%;
				bottom: -22%;
			}
			#showsuss{
				display: none;
			}
		</style>
	</head>

	<body class="scroll h-player" style="overscroll-behavior: contain;overflow:scroll;overflow-y: hidden;overflow-x: hidden;">

		<div class="container" id="player">
			<div class="muted" id="btnMuted">
				<div class="control-right-img" data-id="1">
					<img src="../static/img/xuanfu_icon.png">
				</div>
			</div>

			<div id="wine">
				<!-- <video id="video1" muted="muted" x5-video-orientation="landscape" playsinline="true" autoplay="true" webkit-playsinline="true" x5-playsinline="true" x5-video-player-type="h5" x5-video-player-fullscreen="false" style="pointer-events: none;"></video>
			 -->

				<div id="box"></div>

			</div>
			<div class="leftmains">
				<div class="PictureQualityMain">
					<div class="PictureQuality " data-id="3072000">高清</div>
					<div class="PictureQuality avit" data-id="2243000">标清</div>
					<div class="PictureQuality" data-id="400000">极速</div>
					<div class="PictureQuality" data-id="400000">自动</div>
				</div>

				<div class="operation">
					<div class="upload" id="showsuss" data-text="uploads">
						<img src="../static/img/wx/shangchuan_icon.png">
						<div>上传</div>
					</div>
					<div class="upload" onclick="cp(document.getElementById('user_ref_id'));" data-text="Shearplate">
						<img src="../static/img/wx/jianqieban_icon.png">
						<div>剪切板</div>
					</div>
					<div class="upload" id="upload" data-text="Signout">
						<img src="../static/img/wx/tuichu_icon.png">
						<div>退出</div>
					</div>
				</div>

			</div>
			<div class="bottommains">
				<div class="botmat1">
					<div class="botmat1img" data-text="gengduo">
						<img src="../static/img/wx/gengduo_icon.png">
					</div>

				</div>
				<div class="botmat1">
					<div class="botmat1img" data-text="home">
						<img src="../static/img/wx/home_icon.png">
					</div>

				</div>
				<div class="botmat1">
					<div class="botmat1img" data-text="return">
						<img src="../static/img/wx/fanhui_icon.png">
					</div>

				</div>
			</div>

			<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="boximg"><img src="../static/img/wx/guanbi_icon.png"></div>
			</div>

			<div class="sbox" style="display: none;">
				<div class="sboxText">下载地址已复制到剪切板</div>
				<div class="sboxbu">确定</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.2.js"></script>
		<!--  音频-->
		<script src="../static/js/classlist.js"></script>
		<script src="../static/js/players.js"></script>
		<script src="../static/js/auroraplayer.js"></script>
		<script src="../static/js/aurora.js"></script>
		<script src="../static/js/aac.js"></script>
		<script src="../static/js/web.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.bootcss.com/vConsole/3.2.0/vconsole.min.js"></script>
		<script src="../static/distss/WXdraw.js"></script>
		<script>
			var topwinHeight = window.screen.height - window.innerHeight + 30; //计算title top 头部
			$('#wine').css({
				"width": window.screen.width,
				"height": window.screen.height - topwinHeight - 20,
				"position": "absolute",

			})
			var winese = document.createElement("wine");
			wine.style.top = "-" + winese + 'px';

			var url = window.location.href;
			url = url.split('/')
			// var baseUrl = window.location.href; //"http://192.168.31.20"
			// var baseUrl = "http://192.168.31.20"
			var baseUrl = "https://test.androidscloud.com"
			// var baseUrl = 'https://' + url[2] //url[2] //'http://192.168.31.159'//'http://' + url[2] 
			var query = window.location.search.substring(1);
			// query = "clientType=1&cardIp=14.215.128.96&port=2012&sn=RK3930C2301900012&demoTime=3600&id=377&diskName=SC93mBww"
			var vars = query.split("&");
			console.log(vars)
			var data = {}
			//			 审核
			$.ajax({
				url: baseUrl + "/api/user/v1/config/download/isShow",
				data: {},
				type: 'get',
				dataType: 'json',
				success: function(data) {
					if (data.data) {
						$("#showsuss").show()
					} else {
						$("#showsuss").hide()
					}
					//                       
				}
			})
			var clientType = vars.find(e => {
				return e.startsWith('clientType')
			}) || ''
			// console.log(clientType)
			data.clientType = clientType.substring(11, clientType.length)
			//			小程序直接进入
			var diskName = vars.find(e => {
				return e.startsWith('diskName')
			}) || ''

			data.diskName = diskName.substring(9, diskName.length)
			$(".leftmains").css({
				"right": "-4rem"
			})
			$('.leftmains').hide()
			$('.bottommains').hide()
			$('#btnMuted').hide()
			// document.title = decodeURI(data.diskName)
			if (data.clientType == 1) {
				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')
				}) || ''


				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)

			} else if (data.clientType == 2) { //分享屏幕
				$(".leftmains").css({
					"right": "-4rem"
				})
				$('.leftmains').hide()
				$('.bottommains').hide()
				$('#btnMuted').hide()
				let ip = vars.find(e => {
					return e.startsWith('ip')
				}) || ''
				var username = vars.find(e => {
					return e.startsWith('username')
				}) || ''
				var id = vars.find(e => {
					return e.startsWith('id')
				}) || ''
				var userCardId = vars.find(e => {
					return e.startsWith('userCardId')
				}) || ''
				data.id = id.substring(3, id.length)
				data.username = username.substring(9, username.length)
				data.ip = ip.substring(3, ip.length)
				data.userCardId = userCardId.substring(11, userCardId.length)
				// console.log(data.ip)
				// alert("测试3")
				// alert("data.userCardId"，data.userCardId, "data.ip",data.ip)
			} else {
				// $(".leftmains").css({
				// 					"right":"-4rem"
				// 				})
				// 	$('.leftmains').hide()
				// 	$('.bottommains').hide()
				// 	$('#btnMuted').hide()
				var username = vars.find(e => {
					return e.startsWith('username')
				}) || ''

				var userCardId = vars.find(e => {
					return e.startsWith('userCardId')
				}) || ''
				data.username = username.substring(9, username.length)
				data.userCardId = userCardId.substring(11, userCardId.length)
				console.log(data.ip)
			}


			//           心跳
			//			var time = 1000 * 30;
			//			var interval;
			//			fun()
			//
			//			function run() {
			//
			//				interval = setInterval(fun, time);
			//			}
			//
			//			function fun() {
			//				$.ajax({
			//					url: baseUrl + "/api/game/v1/cloudGame/dev/get/cardSn",
			//					data: {
			//						sn: data.sn
			//					},
			//					type: 'get',
			//					dataType: 'json',
			//					success: function(data) {
			//
			//					}
			//				})
			//
			//			};
			//			run();
			// data.clientType=1
			// data.sn="RK3930C2301900044"
			// data.cardIp="14.215.128.96"
			// data.port=2044

			var orientation = 0 //0 竖屏，1横屏
			var winHeight = window.screen.height - window.innerHeight
			var urlss = url[2]
			document.body.addEventListener('touchmove', function(e) {
				e.preventDefault()
			}, {
				passive: false
			})

			// 
			// urlss = "14.215.128.96"
			// console.log()
			// data.clientType = 1
			// data.sn="RK3930C2301900044"
			// data.cardIp="14.215.128.96"
			// data.port=2044
			var strhost="";
			var players = AV.Player.fromWebSocket("wss://test.androidscloud.com:9105");
			// if (data.clientType == 3) {
			// 	var players = AV.Player.fromWebSocket("wss://" + urlss + '/authVideoWebSocket?' + "clientType=" + data.clientType +
			// 		"&username=" + data.username + "&userCardId=" + data.userCardId);
			// } else if (data.clientType == 2) {
			// 	var players = AV.Player.fromWebSocket("wss://" + urlss + '/shareWebSocket?' + "clientType=" + data.clientType +
			// 		"&username=" + data.username + "&userCardId=" + data.userCardId + "&ip=" + data.ip);

			// } else {
			// 	var players = AV.Player.fromWebSocket("wss://" + urlss + '/videoWebSocket?' + "clientType=" + data.clientType +
			// 		"&cardIp=" + data.cardIp + "&port=" + data.port + "&sn=" + data.sn);
			// }
			// // 			debugger
			// var players = AV.Player.fromWebSocket('ws://14.215.128.96/authVideoWebSocket?clientType=3&username=WqXTc1593762177&userCardId=377');
			players.play();
			players.volume = 100
			//var players = AV.Player.fromWebSocket('ws://14.215.128.96/videoWebSocket?clientType=0&cardIp=30.30.30.58&port=9100&sn=RK3930C2301900060');

			var warid = {
				id: data.id,
				type: 1,
				sn: data.sn
			}
			//结束时间 type=2
			var warids = {
				id: data.id,
				type: 2,
				sn: data.sn
			}

			//			$.ajax({})

			// 关闭浏览器
			//			window.onbeforeunload = function() {}

			//撤销的array
			var cancelList = new Array();
			//撤销的次数
			var cancelIndex = 0;
			var inputType = 0 //输入类型 0:手写，1:键盘输入
			//判断是否ie
			var IE_HACK = (/msie/i.test(navigator.userAgent) &&
				!/opera/i.test(navigator.userAgent));
			//			云手机相关逻辑	 
			var player = new Player({
				size: {
					width: 1280,
					height: 720
				}
			});
			var secanv = document.getElementById("wine");
			secanv.appendChild(player.canvas);

			//             &cardIp="+data.data.extranetIp+"&port="+data.data.extranetPort+"&sn="+data.data.sn

			$(function() {
				initCanvas();
			});
			//初始化
			var initCanvas = function() {

			}

			window.onload = function() {};

			$("#voew").on("click", function() {})

			$("#box").on("click", function() {
				//				draw_graph('pencil', this)

			})

			console.log(player)
			$('#mocan').on('click', function() {
				draw_graph('pencil', this)

			})

			// //初始化一下就可以了，
			//			 let vConsole = new VConsole();
			//			 //你打印的数据 比如
			//			 console.log('test');
			//就可像小程序一样的看了和调试了。
			$('.no-ne-an').on('click', function() {
				//结束时间 type=2
				let warids = {
					id: data.id,
					type: 2,
					sn: data.sn
				}
				$.ajax({
					url: baseUrl + "/api/game/v1/cloudGame/dev/getSn",
					data: warid,
					type: 'get',
					dataType: 'json',
					success: function(data) {
						history.go(-1)
						if (data.status == 0) {

						} else {
							alert(data.msg)
						}
						//
					}
				})
			})

			var btnMuted = document.querySelector("#btnMuted");
			btnMuted && (function() {
				var setHistory = function(left, top) {
					try {
						localStorage.setItem("muted-btn-loc", JSON.stringify({
							left: left,
							top: top
						}));
					} catch (ex) {}
				};
				var getHistory = function() {
					try {
						var value = localStorage.getItem("muted-btn-loc");
						if (!value) return null;
						value = JSON.parse(value);
						if (!value) return null;
						return value;
					} catch (ex) {
						return null
					}
				};
				var fixLoc = function(loc) {
					var rect = btnMuted.getBoundingClientRect();
					rect = {
						top: rect.top,
						left: rect.left,
						width: rect.width,
						height: rect.height
					}; //部分低版本浏览器,该属性为只读
					if (loc) {
						rect.left = loc.left;
						rect.top = loc.top;
					}
					var minX = 0;
					var minY = 0;
					var docRect = document.documentElement.getBoundingClientRect();
					var maxY = docRect.height - rect.height;
					var maxX = docRect.width - rect.width;
					var left = rect.left;
					var top = rect.top;
					left = Math.min(left, maxX);
					left = Math.max(left, minX);
					top = Math.min(top, maxY);
					top = Math.max(top, minY);
					console.log(rect.top, top, loc);
					if (loc || top !== rect.top || left !== rect.left) {
						btnMuted.style.cssText += "left:" + left + "px;top:" + top + "px;";
					}
				}
				window.addEventListener("resize", function() {
					fixLoc();
				});
				var touchPoint = {
					pageY: 0,
					pageX: 0
				};
				var currentLoc = {
					top: 0,
					left: 0,
					curTop: 0,
					curLeft: 0
				};
				var toMove = false;
				var touchmove = function(e) {
					e.preventDefault();
					var point = e.changedTouches[0];
					var top = -touchPoint.pageY + point.pageY;
					var left = -touchPoint.pageX + point.pageX;
					if (toMove) {
						top += currentLoc.top;
						left += currentLoc.left;
						currentLoc.curLeft = left;
						currentLoc.curTop = top;
						btnMuted.style.cssText += "left:" + left + "px;top:" + top + "px;";
					} else {
						if (Math.abs(top) >= 5 || Math.abs(left) >= 5) {
							toMove = true;
						}
					}

				};
				var touchend = function() {
					window.removeEventListener("touchmove", touchmove, {
						passive: false
					});
					window.removeEventListener("touchend", touchend, {
						passive: false
					});

					if (toMove) {
						setHistory(currentLoc.curLeft, currentLoc.curTop);
						fixLoc();
					} else {
						//按点击处理

						var set = $('.control-right-img').attr("data-id")
						if (set == '1') {
							$('.control-right-img').attr({
								"data-id": "2"
							})
							//							$('.control-right-img').find('img').attr({
							//								"src": "../static/img/musicturn.png"
							//							})
							players.volume = 100
							$(".leftmains").css({
								"right": "-4rem"
							})
							// console.log(players)
							// players.play();
						} else {

							$('.control-right-img').attr({
								"data-id": "1"
							})

							$(".leftmains").css({
								"right": "0rem"
							})
							//							$('.control-right-img').find('img').attr({
							//								"src": "../static/img/musicfalse.png"
							//							})
							players.volume = 0
							// players.off('pause');
							// players.pause();
							// var embed = document.embedPlay;
							console.log(players, "fdsfdsf")
						}
					}
				}
				btnMuted.addEventListener("touchstart", function(e) {
					e.preventDefault();
					toMove = false;
					var point = e.changedTouches[0];
					touchPoint.pageX = point.pageX;
					touchPoint.pageY = point.pageY;
					var rect = e.target.getBoundingClientRect();
					currentLoc.top = rect.top;
					currentLoc.left = rect.left;
					window.addEventListener("touchmove", touchmove, {
						passive: false
					});
					window.addEventListener("touchend", touchend, {
						passive: false
					});

				}, {
					passive: false
				});
				var history = getHistory();
				if (history) {
					fixLoc(history);
				}
				btnMuted.classList.remove("hide");
			})();

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

			//			剪切板
			$(".sboxbu").on("click", function() {
				$(".sbox").css({
					"display": "none"
				})
			})
			//			剪切板
			$(".uploadss").on("click", function() {
				$(".sbox").css({
					"display": "none"
				})
			})

			$("#upload").on("click", function() {
				wx.miniProgram.switchTab({
					url: '/pages/home/home'
				})
			})


			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");

			}
		</script>

	</body>

</html>