tangdehang
/
android-cloud-H5


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603
							<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title>云游戏</title>
    <link rel="stylesheet" href="../static/css/index.css">
    <style>
			.heads {
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				height: 60px;
				background: rgba(0, 0, 0, 0.3);
			}
			
			.heads-right {
				width: 280px;
				height: 60px;
			}
			
			.heads-img-left {
				width: 24px;
				height: 24px;
				margin-top: 18px;
				margin-right: 2rem;
			}
		}
		.heads-img-left img {
			width: 100%;
			height: 100%;
		}
		
    </style>
</head>

<body>
			<div class="heads">
			<div class="heads-right right">
				<div class="heads-img-left right">
					<img src="../static/img/home_icon.png">
				</div>
				
			</div>
		</div>
    <div class="containerse">
        <div class="main">
            <div class="head-title top-title">
                <div class="head-text">体验中心</div>
            </div>
        </div>

        <div class="site">
            <div class="wrapper horizontal demo1" ondragstart="return false">
                <ul class="container" id="containerse">

                </ul>

                <div class="kuan">
                    <div class="kuan-leth"></div>
                    <div class="kuan-right"></div>
                    <img src="../static/img/expenienceCenter/biankuang_tiyanzhongxin_pic.png">
                    <div class="bt-an">
                        <!--<img src="img/anniu_icon.png">-->
                        开始试玩
                    </div>
                </div>

                <i class="btn-direct btn-left" id="prev">
						<img src="../static/img/expenienceCenter/zuo2_icon.png">
					</i>
                <i class="btn-direct btn-right" id="nevr">
						<img src="../static/img/expenienceCenter/you2_icon.png">
					</i>
            </div>
        </div>

        <div class="nav">
            <!--<div class="nav-gse nav-gse-ave left">
					<div class="nav-bg ">
						<div class="nav-buseqw nav-mnaires"> </div>
						<div class="nav-img">
							<img src="img/expenienceCenter/youimg.png">
						</div>

					</div>
				</div>

				<div class="nav-gse left">
					<div class="nav-bg ">
						<div class="nav-buseqw nav-mnai"> </div>
						<div class="nav-img">
							<img src="img/expenienceCenter/youimg.png">
						</div>

					</div>
				</div>

				<div class="nav-gse left">
					<div class="nav-bg ">
						<div class="nav-buseqw nav-mnai"> </div>
						<div class="nav-img">
							<img src="img/expenienceCenter/youimg.png">
						</div>

					</div>
				</div>-->

            <!--<div class="nav-bg left">
					<div class="nav-mnai"> </div>
					 	<div class="nav-img">
						<img src="img/youimg.png">
					</div>

				</div>-->
        </div>

        <div class="mains">
            <div class="head-title">
                <div class="head-text">游戏说明</div>
            </div>
        </div>

        <div class="site sitenow">
            <div class="wrapper horizontal demo2 con-bottom" ondragstart="return false">
                <ul class="container containerss" id="contain2" style="">
                    <!--<li class="cards_list" n="6" style="position: absolute; left: 50%; transition: all 400ms ease 0s; margin-left: -40px; z-index: 4; opacity: 0.9; transform: scale(0.9, 0.9);">
							<div class="img" id="bottom_block_0">
								<img src="img/expenienceCenter/bg.png" alt="">
							</div>
						</li>
						<li class="cards_list" n="7" style="position: absolute; left: 50%; transition: all 400ms ease 0s; margin-left: 80px; z-index: 3; opacity: 0.81; transform: scale(0.81, 0.81);">
							<div class="img" id="bottom_block_1">
								<img src="img/expenienceCenter/bg2.png" alt="">
							</div>
						</li>
						<li class="cards_list" n="8" style="position: absolute; left: 50%; transition: all 400ms ease 0s; margin-left: 200px; z-index: 2; opacity: 0.729; transform: scale(0.729, 0.729);">
							<div class="img" id="bottom_block_2">
								<img src="img/expenienceCenter/bg2.png" alt="">
							</div>
						</li>-->

                </ul>
                <div class="kuan">
                    <div class="kuan-leths"></div>
                    <div class="kuan-rights"></div>
                    <img src="../static/img/expenienceCenter/biankuang_shuoming_pic.png">
                    <!--<div class="bt-an">-->
                    <!--<img src="img/anniu_icon.png">-->
                    <!--开始试玩-->
                    <!--</div>-->
                </div>
                <i class="btn-direct btn-left">
						<img src="../static/img/expenienceCenter/zuo2_icon.png">
					</i>
                <i class="btn-direct btn-right">
						<img src="../static/img/expenienceCenter/you2_icon.png">
					</i>
            </div>
        </div>

    </div>

    <script src="../static/js/jquery-1.10.2.js"></script>
    <script src="../static/js/jquery.min.js"></script>
    <script src="../static/js/carousel.js"></script>
    <script>
        var linkid
        var url = window.location.href;
        url = url.split('/')
            // var baseUrl = window.location.href; //"http://192.168.31.20"
        var baseUrl ='http://' + url[2]
        var $demo1 = $("div.demo1"),
            $demo2 = $("div.demo2"),
            $demo3 = $("div.demo3"),
            $demo4 = $("div.demo4");
        $(document).ready(function() {
            var srt = ''
            var sty = ''
            var sse = {
                id: 1,
                pageNum: 1,
                pageSize: 10
            }
            $.ajax({
                url: baseUrl + "/api/game/v1/client/gameInfo?id=1",
                type: 'get',
                contentType: "application/json",
                dataType: 'json',
                success: function(data) {
                    var dataList = data.data
                        // dataList = [dataList[0]]
                        // 测试多条数据
                        // dataList = [...dataList, ...dataList, ...dataList];
                    var visitType
                    var conType
                    linkid = data.data
                    if (data.status == 0) {
                        var srt2 = ""
                        var datalistse = dataList[0].visitImage

                        console.log(dataList)
                        for (var n = 0; n < datalistse.length; n++) {
                            var imgese = baseUrl + datalistse[n]
                                //						console.log(datalistse[n])
                            srt2 += '<li class="cards_list cards_lists cards_listsss" id="cards_list" n="' + i + '" data-n="' + i +
                                '" data-id="34" data-wareHouseId="59" >' +
                                '<div class="img">' +
                                '<img src="' + imgese + '" alt="">' +
                                '</div>' +
                                '</li>';
                        }
                        $("#contain2").append(srt2)

                        //						nav
                        for (var i = 0; i < dataList.length; i++) {
                            var imge = baseUrl + dataList[i].visitVideo
                            var iconImg = baseUrl + dataList[i].visitIcon
                            visitType = dataList[i].visitVideoType
                            if (visitType == 'image') {
                                srt += '<li class="cards_list cards_listnew" n="' + i + '" data-n="' + i +
                                    '" data-id="34" data-wareHouseId="59" style="">' +
                                    '<div class="img">' +
                                    '<img src="' + imge + '" alt="">' +
                                    '</div>' +
                                    '</li>';
                            } else {
                                srt += '<li class="cards_list cards_listnew" n="' + i + '" data-n="' + i +
                                    '" data-id="34" data-wareHouseId="59" style="">' +
                                    '<div class="img">' +
                                    '<video controls="controls" class="video-size"  autoplay muted loop>' +
                                    '  <source src="' + imge + '" type="video/ogg" />' +
                                    '  <source src="' + imge + '" type="video/mp4" />' +
                                    '</video>' +
                                    '</div>' +
                                    '</li>';
                            }

                            if (i == 0) {
                                sty += '<div class="nav-gse nav-gse-ave left" data-id=' + i + '>' +
                                    '<div class="nav-bg ">' +
                                    '<div class="nav-buseqw nav-mnaires"> </div>' +
                                    '<div class="nav-img">' +
                                    '<img src="' + iconImg + '">' +
                                    '</div>' +
                                    '</div>' +
                                    '</div>';
                            } else {
                                sty += '<div class="nav-gse left" data-id=' + i + '>' +
                                    '<div class="nav-bg ">' +
                                    '<div class="nav-buseqw nav-mnai"> </div>' +
                                    '<div class="nav-img">' +
                                    '<img src="' + iconImg + '">' +
                                    '</div>' +
                                    '</div>' +
                                    '</div>';
                            }

                        }
                        $('#containerse').append(srt)
                        $('.nav').append(sty)
                        console.log("111111111111.", dataList.length)
						// datalistse = datalistse.slice(0,3)
                        if (dataList.length == 1) {
                            $('.container .cards_listnew').css({
                                "margin-left": "-177%"
                            })
                        }
                        if (datalistse.length == 1) {


                            $('#containerse .cards_list').css({
                                "margin-left": "-177%"
                            })

                            $('.cards_listsss').css({
                                "margin-left": "-177%"
                            })


                        }

                        $('.nav-gse').on('click', function() {

                            console.log('黄飞》》》', $(this).attr("data-id"))


                            console.time("t");

                            var carousel1 = new Carousel($demo1.children("ul.container"), {
                                opacity: .9,
                                scale: [.9],
                                transition: "0ms",
                                switchBtn: $demo1.children("i.btn-direct"),
                                isClickCard: true,
                                isAuto: false,
                                interval: 4000,
                                dataList: dataList,
                                n: $(this).attr("data-id"),
                                nav: 1,
                                showPicNumber: 3
                            });


                            $(this).addClass('nav-gse-ave')
                            $(this).siblings().removeClass('nav-gse-ave')
                                //					css({"background":"red"})
                            $(this).find('.nav-bg').find('.nav-mnai').removeClass('nav-mnai')
                            $(this).siblings().find('.nav-bg').find('.nav-buseqw').addClass('nav-mnai')
                            commprev($(this).attr("data-id"))
                        })

                        $("div.wrapper").each(function(i, e) {
                            $(e).attr("ondragstart", "return false");
                        });


                        console.time("t");

                        var carousel1 = new Carousel($demo1.children("ul.container"), {
                            opacity: .9,
                            scale: [.9],
                            transition: "0ms",
                            switchBtn: $demo1.children("i.btn-direct"),
                            isClickCard: true,
                            isAuto: false,
                            interval: 4000,
                            dataList: dataList,
                            n: 0,
                            nav: 0,
                            showPicNumber: 3
                        });
                        var carousel2 = new Carousel($demo2.children("ul.container"), {
                            opacity: .6,
                            scale: [.9],
                            transition: "0ms",
                            switchBtn: $demo2.children("i.btn-direct"),
                            isClickCard: true,
                            isAuto: false,
                            interval: 4000,
                            dataList: dataList,
                            n: 0,
                            nav: 0,
                            // showPicNumber: 3
                        });

                    }
                    /* var CheckId = +findCheckId[1]
                    dataList.map( e => {
                    	linkid = e
                    	if (e.wareHouseId === CheckId) {
                    		bottomList = e.visitImage
                    		bottomList.map( (e, k) => {
                    			bottomId = '#bottom_block_' + k
                    			tip = `<img src="` + baseUrl + e + `" alt="">`
                    			$(bottomId).append(tip)
                    		})
                    	}
                    })*/

                    var perindex
                    $("#prev").on("click", function() {

                        setTimeout(() => {
                            commprev("prev")
                        }, 100);

                    })
                    $(document).on("click", "#nevr", function() {
                        // alert(2)
                        setTimeout(() => {
                            commprev("nevr")
                        }, 100);

                    })

                    function commprev(text) {
                        if (text >= 0) {

                            perindex = text
                        } else {
                            $("#containerse li").each(function(i, e) {
                                if ($(e).css("opacity") == 1) {
                                    perindex = i
                                }
                            });
                        }

                        //			             上一个
                        if (text == "prev") {

                            //								  alert(perindex);
                            $(".nav .nav-gse").eq(perindex).addClass('nav-gse-ave')
                            $(".nav .nav-gse").eq(perindex).siblings().removeClass('nav-gse-ave')

                            $(".nav .nav-gse").eq(perindex).find('.nav-bg').find('.nav-mnai').removeClass('nav-mnai')
                            $(".nav .nav-gse").eq(perindex).siblings().find('.nav-bg').find('.nav-buseqw').addClass('nav-mnai')

                        } else if (text == "nevr") {

                            //                              alert(perindex);
                            $(".nav .nav-gse").eq(perindex).addClass('nav-gse-ave')
                            $(".nav .nav-gse").eq(perindex).siblings().removeClass('nav-gse-ave')

                            $(".nav .nav-gse").eq(perindex).find('.nav-bg').find('.nav-mnai').removeClass('nav-mnai')
                            $(".nav .nav-gse").eq(perindex).siblings().find('.nav-bg').find('.nav-buseqw').addClass('nav-mnai')

                        } else {
                            //								alert()
                            $(".nav .nav-gse").eq(text).addClass('nav-gse-ave')
                            $(".nav .nav-gse").eq(text).siblings().removeClass('nav-gse-ave')

                            $(".nav .nav-gse").eq(text).find('.nav-bg').find('.nav-mnai').removeClass('nav-mnai')
                            $(".nav .nav-gse").eq(text).siblings().find('.nav-bg').find('.nav-buseqw').addClass('nav-mnai')

                        }


                        $("#contain2 li").remove()
                        var srt3 = ""
                        console.log(perindex)
                        var perindexs = perindex
                        var datalistse = dataList[perindexs].visitImage
                        console.log(perindexs)
                        for (var n = 0; n < datalistse.length; n++) {
                            var imgese = baseUrl + datalistse[n]

                            //						console.log(datalistse[n])
                            srt3 += '<li class="cards_list sss" n="' + i + '" data-n="' + i +
                                '" data-id="34" data-wareHouseId="59" style="">' +
                                '<div class="img">' +
                                '<img src="' + imgese + '" alt="">' +
                                '</div>' +
                                '</li>';
                        }
                        $("#contain2").append(srt3)
                        if (datalistse.length == 1) {
                            $('#cards_list').css({
                                "margin-left": "-53%"
                            })
                            $('.sss').css({
                                "margin-left": "-177%"
                            })
                        }


                        var carousel2 = new Carousel($demo2.children("ul.container"), {
                            opacity: .6,
                            scale: [.9],
                            transition: "400ms",
                            switchBtn: $demo2.children("i.btn-direct"),
                            isClickCard: true,
                            isAuto: false,
                            interval: 4000,
                            dataList: dataList,
                            // showPicNumber: 3
                        });

                        //			            console.log('dataList>>>',dataList[perindex])

                    }
                }
            })
        })

        $(".nav-mnai").on('click', function() {
            $('.cards_list').eq(0).attr('n', '2')
        })

        $('.bt-an').on('click', function() {
            var indexs
            $("#containerse li").each(function(i, e) {
                if ($(e).css("opacity") == 1) {
                    indexs = i
                }
            });
            //			alert(linkid[indexs].wareHouseId)
            //			return
            var warid = {
                id: linkid[indexs].wareHouseId,
                type: 0,
                sn: ""
            }

            $.ajax({
                url: baseUrl + "/api/game/v1/cloudGame/dev/getSn",
                data: warid,
                type: 'get',
                dataType: 'json',
                success: function(data) {

                    //                   return
                    if (data.status == 0) {
                        var trialInterface = {
                            id: linkid[indexs].wareHouseId,
                            type: 2,
                            sn: data.data.sn
                        }
                        localStorage.setItem("trialInterface", JSON.stringify(trialInterface))
                        console.log(data)
                        if (window.screen.width >= 1000) {
                        	localStorage.setItem("temps", 2)
                            window.location.href = "/api/game/center/trialInterface?clientType=0" + "&cardIp=" + data.data.androidcardIp +
                                "&port=" + data.data.androidcardPort + "&sn=" + data.data.sn + "&demoTime=" + data.data.demoTime + "&id=" +
                                linkid[indexs].wareHouseId;
                        } else {
                        	
var u = navigator.userAgent;
if (u.indexOf('Android') > -1 || u.indexOf('Linux') > -1) {//安卓手机
console.log("安卓手机");
window.location.href = "/api/game/center/trialInterface3?clientType=0" + "&cardIp=" + data.data.androidcardIp +"&port=" + data.data.androidcardPort + "&sn=" + data.data.sn + "&demoTime=" + data.data.demoTime + "&id=" +linkid[indexs].wareHouseId
  
} else if (u.indexOf('iPhone') > -1) {//苹果手机
window.location.href = "/api/game/center/trialInterface2?clientType=0" + "&cardIp=" + data.data.androidcardIp +"&port=" + data.data.androidcardPort + "&sn=" + data.data.sn + "&demoTime=" + data.data.demoTime + "&id=" +linkid[indexs].wareHouseId
                                linkid[indexs].wareHouseId;
} else if (u.indexOf('Windows Phone') > -1) {//winphone手机
window.location.href = "/api/game/center/trialInterface2?clientType=0" + "&cardIp=" + data.data.androidcardIp +"&port=" + data.data.androidcardPort + "&sn=" + data.data.sn + "&demoTime=" + data.data.demoTime + "&id=" +linkid[indexs].wareHouseId
 
}
                        	
                        	
                        }

                        //
                    } else {
                        // 为了兼容云手机
                        // 						var jsonsn =  localStorage.getItem("trialInterface")
                        // 						var jsonarr = JSON.parse(jsonsn)

                        // 						console.log(jsonarr.sn);
                        // 						$.ajax({
                        // 							url: baseUrl + "/api/game/v1/cloudGame/dev/getSn",
                        // 							data: jsonarr,
                        // 							type: 'get',
                        // 							dataType: 'json',
                        // 							success: function(data) {
                        // 								//                   return
                        // 								if(data.status == 0) {

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

                        // 							}
                        // 						})


                        alert(data.msg)
                    }

                }
            })
        })
        
        
        			var homeip = ""
			$.ajax({
				url: baseUrl + "/api/user/v1/promote/webUrl",
				data: {},
				type: 'get',
				async: false,

				success: function(data) {
					console.log("官网》》》", data)
					homeip = data
					//
				}
			})

			$(".heads-img-left").on("click", function() {  
				var newStr = homeip.indexOf("http");
				var urlhome   
				if(newStr == 0) {

					　　　　
					console.log("字符串是以http开头的！")
					urlhome = homeip
					$(window).attr('location', urlhome);　　
				}

				　　
				if(newStr == -1) {
					urlhome = 'http://' + homeip
					$(window).attr('location', urlhome);　　　　
					console.log("字符串不是以http开头的！")

					　　
				}

			})

    </script>

</body>

</html>