<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"/> <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/> <meta name="apple-mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"> <meta content="telephone=no" name="format-detection"> <meta name="wap-font-scale" content="no"> <title>妹妹聽指揮</title> <script src="lib/fsize.js"></script> <link rel="stylesheet" href="css/base.css"> <link rel="stylesheet" href="css/layer.css"> <link rel="stylesheet" href="css/daily.css"> <link rel="stylesheet" href="css/index.css?v=2024080101"> <link rel="stylesheet" href="css/liMarquee.css"> <style> .layui-layer-shade { opacity: 0.7 !important; } .yourclass5 { border-radius: 0rem !important; background: rgba(0, 0, 0, 0) !important; } .yourclass5 .layui-layer-content { border-radius: 0rem !important; } </style> </head> <body c style="background:rgba(0,0,0,0)"> <div style="display: none;" class="act-room-bg "> <p class="act-room-p1">80000</p> <p class="act-room-p2"><i class="txt1">進度</i> : <span>18%</span></p> <p class="act-room-p3"><i class="txt2">排名</i> : <span>5</span></p> </div> <div class="room-bg1"> <div class="room-bg-top">人氣</div> <div class="room-targe">目標:</div> <div class="room-num"></div> <div class="room-bar-box"> <div class="room-bar"> <div></div> </div> </div> </div> <div class="room-bg2"> <div class="room-bg-top">互動</div> <div class="room-targe">目標:</div> <div class="room-num"></div> <div class="room-bar-box"> <div class="room-bar"> <div></div> </div> </div> </div> <div class="room-bg3"> <div class="room-bg-top">禮物</div> <div class="room-targe">目標:</div> <div class="room-num"></div> <div class="room-bar-box"> <div class="room-bar"> <div></div> </div> </div> </div> </body> <script src="lib/jquery-3.1.1.min.js"></script> <script src="layer-v3.1.0/layer/layer.js"></script> <script src="lib/default.js?v='2024061702'"></script> <script type="text/javascript" src="https://app.ixiulive.com/static/js/socket.io.js"></script> <script> $(function(){ var wsTimer=null var socketOk=null if(sessionStorage.lang!=2){ $("body").addClass("bg-en") $(".txt1").text("PROG") $(".txt2").text("rank") } //活動 $(".act-room-bg").on("click",function(){ var obj = { "cid": 12, "reqCode": new Date().getTime(), "data": { "msg": '跳转集合功能', "jumptype": 3, "url": $url + "/activeFt/luckyGod/index.html" + location.search+'&jump=1', } } var obj2 = JSON.stringify(obj); appCollaboration(obj2); }) function ActView(){ $.ajax({ url:$ip+'/actTheLuckFairy/getRoomPartData.html', success:function(data){ console.log('圖標數據',data) $(".act-room-bg").show() $(".act-room-p1").text(data.result.roomData.score) $(".act-room-p2 span").text(Math.floor(data.result.roomData.score/10000*100)+'%') $(".act-room-p3 span").text(data.result.roomData.rank) } }) } ActView() setInterval(function(){ ActView() },60000) function getData() { var opts = { reconnectionDelay: 5000, query: { 'uid': sessionStorage.uid, 'token': sessionStorage.token, 'room': sessionStorage.roomId } } socket = io.connect(_url3 + '/default', opts); socket.on('connect', function () { clearInterval(socketOk) console.log("连接成功"); }); socket.on('RaisingBeautifulGril', function (msg) { var data=JSON.parse(msg) if(data.rank>0){ console.log(data) $(".act-room-bg1").show() $(".room-title").text(titleArr[data.extra.stage]) $(".room-bg-p1 span").text(data.score) var barWidth=Math.floor(data.score/data.extra.stageScore*100) $(".room-bg-p2 span").text(barWidth+'%') $(".room-bg-p3 span").text(data.rank) }else{ $(".act-room-bg1").hide() } }); socket.on('disconnect', function () { clearInterval(socketOk) socketOk=setInterval(function(){ getData() },3000) console.log("已下线!"); }); socket.on('connect_error', function (error) { console.log("链接失败!"); }); } //活動 if(sessionStorage.uid==sessionStorage.roomId){ $(".room-bg1,.room-bg3").show() view() setInterval(function(){ view() },10000) } if(sessionStorage.lang==1){ $(".room-bg-top").css("font-size","12vw").css("top","12.5vw") $(".room-bg1 .room-bg-top").text('Pop Index') $(".room-bg2 .room-bg-top").text('Interactive') $(".room-bg3 .room-bg-top").text('income') $(".room-targe").css("top","41vw").css("right","9vw") } if(sessionStorage.lang==8){ $(".room-bg-top").css("font-size","10.5vw").css("top","12.5vw") $(".room-bg1 .room-bg-top").text('chỉ số nhạc pop') $(".room-bg2 .room-bg-top").text('chỉ số tương tác') $(".room-bg3 .room-bg-top").text('thu nhập') $(".room-targe").css("top","41vw").css("right","9vw") } function view(){ $.ajax({ url:$ip+'/actPopularInteractIndex/queryUserIndexPartInfo.html', data:{ roomId:sessionStorage.roomId, }, success:function(data){ // console.log('互動信息',data) //礼物 if(data.result.statusData.bondsStatus!=2){ $(".room-bg3").show() if(sessionStorage.lang!=2)$(".room-bg3 .room-targe").text(''+data.result.bondsData.bondsTarget1+'') else $(".room-bg3 .room-targe").text('目標:'+data.result.bondsData.bondsTarget1+'') var widthNum=Math.floor(data.result.bondsData.bonds/data.result.bondsData.bondsTarget1*100) if(widthNum>100)widthNum=100 $(".room-bg3 .room-num").text(widthNum+'%') $(".room-bg3 .room-bar div").css("width",widthNum+"%") } //人氣 if(data.result.popualrData.popualr<data.result.popualrData.popularTarget1&&data.result.statusData.popularStatus2==0){ if(sessionStorage.lang!=2) $(".room-bg1 .room-targe").text(''+data.result.popualrData.popularTarget1+'') else $(".room-bg1 .room-targe").text('目標:'+data.result.popualrData.popularTarget1+'') var widthNum=Math.floor(data.result.popualrData.popualr/data.result.popualrData.popularTarget1*100) if(widthNum>100)widthNum=100 $(".room-bg1 .room-num").text(widthNum+'%') $(".room-bg1 .room-bar div").css("width",widthNum+"%") }else{ if(sessionStorage.lang!=2) $(".room-bg1 .room-targe").text(''+data.result.popualrData.popularTarget2+'') else $(".room-bg1 .room-targe").text('目標:'+data.result.popualrData.popularTarget2+'') var widthNum=Math.floor(data.result.popualrData.popualr/data.result.popualrData.popularTarget2*100) if(widthNum>100)widthNum=100 $(".room-bg1 .room-num").text(widthNum+'%') $(".room-bg1 .room-bar div").css("width",widthNum+"%") } //完成后关闭 if(data.result.statusData.bondsStatus==2){ $(".room-bg3").hide() if(data.result.statusData.interactStatus2!=2){ $(".room-bg2").show() //互動 if(data.result.interactData.interact<data.result.interactData.interactTarget1&&data.result.statusData.interactStatus2==0){ if(sessionStorage.lang!=2) $(".room-bg2 .room-targe").text(''+data.result.interactData.interactTarget1+'') else $(".room-bg2 .room-targe").text('目標:'+data.result.interactData.interactTarget1+'') var widthNum=Math.floor(data.result.interactData.interact/data.result.interactData.interactTarget1*100) if(widthNum>100)widthNum=100 $(".room-bg2 .room-num").text(widthNum+'%') $(".room-bg2 .room-bar div").css("width",widthNum+"%") }else{ if(sessionStorage.lang!=2) $(".room-bg2 .room-targe").text(''+data.result.interactData.interactTarget2+'') else $(".room-bg2 .room-targe").text('目標:'+data.result.interactData.interactTarget2+'') var widthNum=Math.floor(data.result.interactData.interact/data.result.interactData.interactTarget2*100) if(widthNum>100)widthNum=100 $(".room-bg2 .room-num").text(widthNum+'%') $(".room-bg2 .room-bar div").css("width",widthNum+"%") } } } if(data.result.statusData.popularStatus2==2){ $(".room-bg1").hide() if(data.result.statusData.interactStatus2!=2){ $(".room-bg2").show() //互動 if(data.result.interactData.interact<data.result.interactData.interactTarget1&&data.result.statusData.interactStatus2==0){ if(sessionStorage.lang!=2) $(".room-bg2 .room-targe").text(''+data.result.interactData.interactTarget1+'') else $(".room-bg2 .room-targe").text('目標:'+data.result.interactData.interactTarget1+'') var widthNum=Math.floor(data.result.interactData.interact/data.result.interactData.interactTarget1*100) if(widthNum>100)widthNum=100 $(".room-bg2 .room-num").text(widthNum+'%') $(".room-bg2 .room-bar div").css("width",widthNum+"%") }else{ if(sessionStorage.lang!=2) $(".room-bg2 .room-targe").text(''+data.result.interactData.interactTarget2+'') else $(".room-bg2 .room-targe").text('目標:'+data.result.interactData.interactTarget2+'') var widthNum=Math.floor(data.result.interactData.interact/data.result.interactData.interactTarget2*100) if(widthNum>100)widthNum=100 $(".room-bg2 .room-num").text(widthNum+'%') $(".room-bg2 .room-bar div").css("width",widthNum+"%") } } } if(data.result.statusData.interactStatus2==2){ $(".room-bg2").hide() } } }) } $(".room-bg1 ,.room-bg2 ,.room-bg3").on("click",function(){ var obj = { "cid": 12, "reqCode": new Date().getTime(), "data": { "msg": '跳转集合功能', "jumptype": 3, "url":'https://fsactive.fusi.club/activeFt/liveData/index.html?uid='+sessionStorage.uid+'&token='+sessionStorage.token+'&roomid='+sessionStorage.roomId+'', } } var obj2 = JSON.stringify(obj); appCollaboration(obj2); }) }) </script> </html>