Skip to content

libai / footseen-large-website

Go to a project
Commit c88beddb by libai
Options

测试

parent 66d49068
Inline Side-by-side
Showing with 219 additions and 24 deletions
room/css/index.css
...@@ -15,9 +15,20 @@ ...@@ -15,9 +15,20 @@
.body-lang1 .hot-box { .body-lang1 .hot-box {
background: url(../images/hot-box2-en.png?v=20220801) no-repeat; background: url(../images/hot-box2-en.png?v=20220801) no-repeat;
} }
.body-lang1 .hot-box2 {
background: url(../images/interac-box-en.png?v=20220801) no-repeat;
}
.body-lang1 .rich-box { .body-lang1 .rich-box {
background: url(../images/rich-box-en.png?v=20220801) no-repeat; background: url(../images/rich-box-en.png?v=20220801) no-repeat;
} }
.body-lang1 .list-floor-left,
.body-lang1 .list-floor-left2 {
display: none;
}
.body-lang1 .list-floor-right,
.body-lang1 .list-floor-right2 {
display: none;
}
.body-lang1 .day-task-content-ul li { .body-lang1 .day-task-content-ul li {
min-height: 54px; min-height: 54px;
height: auto; height: auto;
......
room/css/index.less
...@@ -16,10 +16,18 @@ ...@@ -16,10 +16,18 @@
.hot-box{ .hot-box{
background: url(../images/hot-box2-en.png?v=20220801) no-repeat; background: url(../images/hot-box2-en.png?v=20220801) no-repeat;
} }
.hot-box2{
background: url(../images/interac-box-en.png?v=20220801) no-repeat;
}
.rich-box{ .rich-box{
background: url(../images/rich-box-en.png?v=20220801) no-repeat; background: url(../images/rich-box-en.png?v=20220801) no-repeat;
} }
.list-floor-left,.list-floor-left2{
display: none;
}
.list-floor-right,.list-floor-right2{
display: none;
}
.day-task-content-ul li{ .day-task-content-ul li{
min-height: 54px; min-height: 54px;
height: auto; height: auto;
......
room/css/room.css
...@@ -184,6 +184,19 @@ html * { ...@@ -184,6 +184,19 @@ html * {
float: left; float: left;
position: relative; position: relative;
} }
.hot-box2 {
position: relative;
width: 174px;
height: 86px;
background: url(../images/interac-box.png?v=20220801) no-repeat;
margin: 0 auto;
margin-top: 10px;
color: #55E4D8;
font-size: 18px;
font-weight: 700;
text-align: center;
line-height: 120px;
}
.hot-box { .hot-box {
position: relative; position: relative;
width: 174px; width: 174px;
...@@ -197,6 +210,18 @@ html * { ...@@ -197,6 +210,18 @@ html * {
text-align: center; text-align: center;
line-height: 120px; line-height: 120px;
} }
.hot-list-box2 {
display: none;
width: 240px;
height: 634px;
background: linear-gradient(to bottom, #FFF4FA, #FFF8FB, #FFFFFF);
border-radius: 8px;
z-index: 50;
position: absolute;
top: -118px;
left: 206px;
box-shadow: 2px 0px 20px rgba(0, 0, 0, 0.3);
}
.hot-list-box { .hot-list-box {
display: none; display: none;
width: 240px; width: 240px;
...@@ -274,12 +299,14 @@ html * { ...@@ -274,12 +299,14 @@ html * {
top: 261px; top: 261px;
left: -5px; left: -5px;
} }
.list-floor-left { .list-floor-left,
.list-floor-left2 {
position: absolute; position: absolute;
left: 52px; left: 52px;
top: 18px; top: 18px;
} }
.list-floor-right { .list-floor-right,
.list-floor-right2 {
position: absolute; position: absolute;
right: 52px; right: 52px;
top: 18px; top: 18px;
...@@ -1276,18 +1303,31 @@ input::-webkit-input-placeholder { ...@@ -1276,18 +1303,31 @@ input::-webkit-input-placeholder {
font-size: 18px; font-size: 18px;
text-shadow: none; text-shadow: none;
} }
.hot-list-ul { .hot-list-box-top2 {
height: 50px;
width: 240px;
text-align: center;
line-height: 50px;
color: #55E4D8;
font-weight: 700;
font-size: 18px;
text-shadow: none;
}
.hot-list-ul,
.hot-list-ul2 {
width: 240px; width: 240px;
height: 578px; height: 578px;
overflow-y: scroll; overflow-y: scroll;
-webkit-overflow-scrolling: touch; -webkit-overflow-scrolling: touch;
} }
.hot-list-ul li { .hot-list-ul li,
.hot-list-ul2 li {
height: 62px; height: 62px;
width: 210px; width: 210px;
margin: 0 auto; margin: 0 auto;
} }
.hot-list-ul .hot-list-li-box1 { .hot-list-ul .hot-list-li-box1,
.hot-list-ul2 .hot-list-li-box1 {
width: 30px; width: 30px;
height: 62px; height: 62px;
line-height: 62px; line-height: 62px;
...@@ -1297,13 +1337,15 @@ input::-webkit-input-placeholder { ...@@ -1297,13 +1337,15 @@ input::-webkit-input-placeholder {
text-shadow: none; text-shadow: none;
color: #939199; color: #939199;
} }
.hot-list-ul .hot-list-li-box2 { .hot-list-ul .hot-list-li-box2,
.hot-list-ul2 .hot-list-li-box2 {
width: 180px; width: 180px;
height: 62px; height: 62px;
position: relative; position: relative;
float: left; float: left;
} }
.hot-list-ul .hot-list-li-box2 .rich-list-face { .hot-list-ul .hot-list-li-box2 .rich-list-face,
.hot-list-ul2 .hot-list-li-box2 .rich-list-face {
width: 44px; width: 44px;
height: 44px; height: 44px;
border-radius: 50%; border-radius: 50%;
...@@ -1311,13 +1353,15 @@ input::-webkit-input-placeholder { ...@@ -1311,13 +1353,15 @@ input::-webkit-input-placeholder {
top: 8px; top: 8px;
left: 4px; left: 4px;
} }
.hot-list-ul .hot-list-li-box2 .rich-list-king { .hot-list-ul .hot-list-li-box2 .rich-list-king,
.hot-list-ul2 .hot-list-li-box2 .rich-list-king {
position: absolute; position: absolute;
left: 3px; left: 3px;
z-index: 2; z-index: 2;
top: 6px; top: 6px;
} }
.hot-list-ul .hot-list-li-box2 .hot-list-p1 { .hot-list-ul .hot-list-li-box2 .hot-list-p1,
.hot-list-ul2 .hot-list-li-box2 .hot-list-p1 {
font-size: 14px; font-size: 14px;
text-indent: 55px; text-indent: 55px;
font-weight: 400; font-weight: 400;
...@@ -1330,7 +1374,8 @@ input::-webkit-input-placeholder { ...@@ -1330,7 +1374,8 @@ input::-webkit-input-placeholder {
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
} }
.hot-list-ul .hot-list-li-box2 .hot-list-p2 { .hot-list-ul .hot-list-li-box2 .hot-list-p2,
.hot-list-ul2 .hot-list-li-box2 .hot-list-p2 {
font-size: 14px; font-size: 14px;
text-indent: 55px; text-indent: 55px;
font-weight: 400; font-weight: 400;
...@@ -1348,6 +1393,15 @@ input::-webkit-input-placeholder { ...@@ -1348,6 +1393,15 @@ input::-webkit-input-placeholder {
.hot-list-ul::-webkit-scrollbar-thumb { .hot-list-ul::-webkit-scrollbar-thumb {
background: #E53985 !important; background: #E53985 !important;
} }
.hot-list-ul2::-webkit-scrollbar {
width: 3px !important;
}
.hot-list-ul2::-webkit-scrollbar-track {
background: #FFF4FA !important;
}
.hot-list-ul2::-webkit-scrollbar-thumb {
background: #E53985 !important;
}
.online-list-box { .online-list-box {
position: relative; position: relative;
width: 400px; width: 400px;
......
room/css/room.less
...@@ -206,6 +206,20 @@ html{ ...@@ -206,6 +206,20 @@ html{
position: relative; position: relative;
} }
.hot-box2{
position: relative;
width: 174px;
height: 86px;
background: url(../images/interac-box.png?v=20220801)no-repeat;
margin: 0 auto;
margin-top: 10px;
color: #55E4D8;
font-size: 18px;
font-weight: 700;
text-align: center;
line-height: 120px;
// text-shadow: 1px 2px 2px #D38167;
}
.hot-box{ .hot-box{
position: relative; position: relative;
width: 174px; width: 174px;
...@@ -220,6 +234,18 @@ html{ ...@@ -220,6 +234,18 @@ html{
line-height: 120px; line-height: 120px;
// text-shadow: 1px 2px 2px #D38167; // text-shadow: 1px 2px 2px #D38167;
} }
.hot-list-box2{
display: none;
width: 240px;
height: 634px;
background: linear-gradient(to bottom, #FFF4FA, #FFF8FB, #FFFFFF);
border-radius: 8px;
z-index: 50;
position: absolute;
top: -118px;
left: 206px;
box-shadow: 2px 0px 20px rgba(0,0,0,0.3);
}
.hot-list-box{ .hot-list-box{
display: none; display: none;
width: 240px; width: 240px;
...@@ -298,12 +324,12 @@ html{ ...@@ -298,12 +324,12 @@ html{
top: 261px; top: 261px;
left: -5px; left: -5px;
} }
.list-floor-left{ .list-floor-left,.list-floor-left2{
position: absolute; position: absolute;
left: 52px; left: 52px;
top: 18px; top: 18px;
} }
.list-floor-right{ .list-floor-right,.list-floor-right2{
position: absolute; position: absolute;
right: 52px; right: 52px;
top: 18px; top: 18px;
...@@ -1337,7 +1363,17 @@ input::-webkit-input-placeholder{ ...@@ -1337,7 +1363,17 @@ input::-webkit-input-placeholder{
font-size: 18px; font-size: 18px;
text-shadow: none; text-shadow: none;
} }
.hot-list-ul{ .hot-list-box-top2{
height: 50px;
width: 240px;
text-align: center;
line-height: 50px;
color: #55E4D8;
font-weight: 700;
font-size: 18px;
text-shadow: none;
}
.hot-list-ul,.hot-list-ul2{
width: 240px; width: 240px;
height: 578px; height: 578px;
overflow-y: scroll; overflow-y: scroll;
...@@ -1411,6 +1447,15 @@ input::-webkit-input-placeholder{ ...@@ -1411,6 +1447,15 @@ input::-webkit-input-placeholder{
.hot-list-ul::-webkit-scrollbar-thumb{ .hot-list-ul::-webkit-scrollbar-thumb{
background: #E53985 !important; background: #E53985 !important;
} }
.hot-list-ul2::-webkit-scrollbar{
width: 3px !important;
}
.hot-list-ul2::-webkit-scrollbar-track{
background: #FFF4FA !important;
}
.hot-list-ul2::-webkit-scrollbar-thumb{
background: #E53985 !important;
}
.online-list-box{ .online-list-box{
position: relative; position: relative;
width: 400px; width: 400px;
......
room/lib/roomLang.js
...@@ -52,6 +52,7 @@ var langList=[ ...@@ -52,6 +52,7 @@ var langList=[
room48:'receive', room48:'receive',
room49:'home', room49:'home',
room50:'he', room50:'he',
room51:'Interactive Rank',
msg1:"Already paid, will enter the live room soon", msg1:"Already paid, will enter the live room soon",
msg2:"Please enter the content to send", msg2:"Please enter the content to send",
msg3:"Followed", msg3:"Followed",
...@@ -186,6 +187,7 @@ var langList=[ ...@@ -186,6 +187,7 @@ var langList=[
room48:'收到', room48:'收到',
room49:'主頁', room49:'主頁',
room50:'他', room50:'他',
room51:'互動榜',
msg1:'已付費，即將進入直播間', msg1:'已付費，即將進入直播間',
msg2:'請輸入要發送的內容', msg2:'請輸入要發送的內容',
msg3:'關注成功', msg3:'關注成功',
......
room/liveRoom.html
...@@ -20,8 +20,8 @@ ...@@ -20,8 +20,8 @@
<link rel="stylesheet" href="../css/base.css?v=2023053101"> <link rel="stylesheet" href="../css/base.css?v=2023053101">
<link rel="stylesheet" href="../css/layer.css"> <link rel="stylesheet" href="../css/layer.css">
<link rel="stylesheet" href="../css/swiper.min.css"> <link rel="stylesheet" href="../css/swiper.min.css">
<link rel="stylesheet" href="css/index.css?v=2023060101"> <link rel="stylesheet" href="css/index.css?v=2023060601">
<link rel="stylesheet" href="css/room.css?v=2023053101"> <link rel="stylesheet" href="css/room.css?v=2023060601">
<link rel="stylesheet" href="../css/login.css?v=2023053101"> <link rel="stylesheet" href="../css/login.css?v=2023053101">
<script src="../lib/flv.js"></script> <script src="../lib/flv.js"></script>
<script src="https://accounts.google.com/gsi/client" async defer></script> <script src="https://accounts.google.com/gsi/client" async defer></script>
...@@ -155,15 +155,15 @@ ...@@ -155,15 +155,15 @@
</ul> </ul>
</div> </div>
</div> </div>
<div style="display: none;" class="hot-box2"> <div class="hot-box2">
<span></span> <span></span>
<div class="hot-list-box"> <div class="hot-list-box2">
<div style="top: 168px;" class="rich-list-box-jiao"></div> <div style="top: 168px;" class="rich-list-box-jiao"></div>
<img class="list-floor-left" src="images/list-floor.png" alt=""> <img class="list-floor-left2" src="images/list-floor.png" alt="">
<img class="list-floor-right" src="images/list-floor.png" alt=""> <img class="list-floor-right2" src="images/list-floor.png" alt="">
<div class="hot-list-box-top">人氣榜</div> <div class="hot-list-box-top2">互動榜</div>
<ul class="hot-list-ul2"> <ul class="hot-list-ul2">
<!-- <li> <li>
<div class="hot-list-li-box1">4</div> <div class="hot-list-li-box1">4</div>
<div class="hot-list-li-box2"> <div class="hot-list-li-box2">
<img class="rich-list-king" src="images/r1.png" alt=""> <img class="rich-list-king" src="images/r1.png" alt="">
...@@ -173,7 +173,7 @@ ...@@ -173,7 +173,7 @@
<p class="hot-list-p1">Mlonghoursus</p> <p class="hot-list-p1">Mlonghoursus</p>
<p class="hot-list-p2">123124</p> <p class="hot-list-p2">123124</p>
</div> </div>
</li> --> </li>
</ul> </ul>
</div> </div>
</div> </div>
...@@ -629,6 +629,7 @@ $(function () { ...@@ -629,6 +629,7 @@ $(function () {
$(".roomLang-txt23").text(langList[sessionStorage.lang].room23) $(".roomLang-txt23").text(langList[sessionStorage.lang].room23)
$(".guard-btn").text(langList[sessionStorage.lang].room24) $(".guard-btn").text(langList[sessionStorage.lang].room24)
$(".hot-list-box-top").text(langList[sessionStorage.lang].room25) $(".hot-list-box-top").text(langList[sessionStorage.lang].room25)
$(".hot-list-box-top2").text(langList[sessionStorage.lang].room51)
$(".roomLang-txt26").text(langList[sessionStorage.lang].room26) $(".roomLang-txt26").text(langList[sessionStorage.lang].room26)
$(".roomLang-txt27").text(langList[sessionStorage.lang].room27) $(".roomLang-txt27").text(langList[sessionStorage.lang].room27)
$(".roomLang-txt28").text(langList[sessionStorage.lang].room28) $(".roomLang-txt28").text(langList[sessionStorage.lang].room28)
...@@ -850,7 +851,7 @@ $(function () { ...@@ -850,7 +851,7 @@ $(function () {
layer.closeAll() layer.closeAll()
}) })
$(".layer-gift-btn2").unbind("click").on("click",function(){ $(".layer-gift-btn2").unbind("click").on("click",function(){
window.open("https://www.footseen.com/footseen/phonepay/applepay.html?lang="+sessionStorage.lang+"&gofrom=web&cidStr="+sessionStorage.myCid+"&uid="+localStorage.uid+"&token="+localStorage.token+"&os=h5&appversion=7&osStr=h5") window.open("../reg/index.html")
}) })
}else{ }else{
setTimeout(function(){ setTimeout(function(){
...@@ -887,6 +888,7 @@ $(function () { ...@@ -887,6 +888,7 @@ $(function () {
} }
} }
$(".hot-box >span").text(data.roomOtherInfo.popularNum) $(".hot-box >span").text(data.roomOtherInfo.popularNum)
$(".hot-box2 >span").text(data.roomOtherInfo.interacNum)
$(".rich-box >span").text(data.roomOtherInfo.charm) $(".rich-box >span").text(data.roomOtherInfo.charm)
$(".mc-tips div").text(data.roomBaseInfo.sign.replace("Firefly Live","Footseen")) $(".mc-tips div").text(data.roomBaseInfo.sign.replace("Firefly Live","Footseen"))
var html = []; var html = [];
...@@ -944,6 +946,7 @@ $(function () { ...@@ -944,6 +946,7 @@ $(function () {
}) })
loginGo() loginGo()
hotList() hotList()
popular()
richGuard(0) richGuard(0)
giftList(1) giftList(1)
richMouse() richMouse()
...@@ -956,6 +959,7 @@ $(function () { ...@@ -956,6 +959,7 @@ $(function () {
online() online()
richGuard(richType) richGuard(richType)
hotList() hotList()
popular()
},60000) },60000)
if(localStorage.uid!=undefined){ if(localStorage.uid!=undefined){
myDiamond() myDiamond()
...@@ -1675,6 +1679,17 @@ $(function () { ...@@ -1675,6 +1679,17 @@ $(function () {
$(".hot-list-box").fadeOut(150) $(".hot-list-box").fadeOut(150)
}, 350) }, 350)
}) })
var tHot2 = null
$(".hot-box2").on("mouseover", function () {
clearInterval(tHot2)
$(".hot-list-box2").fadeIn(150)
$(".rich-list-box2").fadeOut(0)
})
$(".hot-box2").on("mouseout", function () {
tHot2 = setTimeout(function () {
$(".hot-list-box2").fadeOut(150)
}, 350)
})
} }
function richGuard(e) { function richGuard(e) {
$.ajax({ $.ajax({
...@@ -1746,6 +1761,65 @@ $(function () { ...@@ -1746,6 +1761,65 @@ $(function () {
} }
}) })
} }
function hotList() {
$.ajax({
url: $ip + 'rank/popular/list',
data: {
pageID: localStorage.canvasCode,
},
success: function (data) {
//console.log("热门榜单", data)
var html = [];
for (var i = 0; i < data.rankList.length; i++) {
var list=data.rankList[i]
if(list.uid==sessionStorage.roomId)html += '<a href="javascript:;"><li>';
else html += '<a target="_blank" href="https://www.footseen.xyz/room/liveRoom.html?roomId='+list.uid+'"><li>';
html += '<div class="hot-list-li-box1">' + (i + 1) + '</div>';
html += '<div class="hot-list-li-box2">';
if (i < 3) html += '<img class="rich-list-king" src="images/r' + (i + 1) + '.png" alt="">';
html += '<img class="rich-list-face" src="https://zhibocdn.yabolive.net/comm' + list.face + '?x-oss-process=image/resize,w_44" alt="">';
html += '<p class="hot-list-p1">' + list.nickname + '</p>';
html += '<p class="hot-list-p2">' + list.score + '</p>';
html += '</div>';
html += '</li></a>';
}
$(".hot-list-ul").html(html)
$(".rich-list-face").on("error",function(){
$(this).attr("src","images/face.png")
})
}
})
}
function popular(){
$.ajax({
url:$ip+'rank/interac/list',
data:{
pageID: localStorage.canvasCode,
},
success:function(data){
// console.log('人氣榜单',data)
var html = [];
for (var i = 0; i < data.rankList.length; i++) {
var list=data.rankList[i]
if(list.uid==sessionStorage.roomId)html += '<a href="javascript:;"><li>';
else html += '<a target="_blank" href="https://www.footseen.xyz/room/liveRoom.html?roomId='+list.uid+'"><li>';
html += '<div class="hot-list-li-box1">' + (i + 1) + '</div>';
html += '<div class="hot-list-li-box2">';
if (i < 3) html += '<img class="rich-list-king" src="images/r' + (i + 1) + '.png" alt="">';
html += '<img class="rich-list-face" src="https://zhibocdn.yabolive.net/comm' + list.face + '?x-oss-process=image/resize,w_44" alt="">';
html += '<p class="hot-list-p1">' + list.nickname + '</p>';
html += '<p class="hot-list-p2">' + list.score + '</p>';
html += '</div>';
html += '</li></a>';
}
$(".hot-list-ul2").html(html)
$(".rich-list-face").on("error",function(){
$(this).attr("src","images/face.png")
})
}
})
}
function backPack(){ function backPack(){
$.ajax({ $.ajax({
...@@ -3419,6 +3493,7 @@ $(function () { ...@@ -3419,6 +3493,7 @@ $(function () {
if(obj.cid == 4700){ if(obj.cid == 4700){
var list=JSON.parse(obj.content) var list=JSON.parse(obj.content)
if(list.content.popularNum>0)$(".hot-box >span").text(list.content.popularNum) if(list.content.popularNum>0)$(".hot-box >span").text(list.content.popularNum)
if(list.content.interacNum>0)$(".hot-box2 >span").text(list.content.interacNum)
} }
//主播直播状态 //主播直播状态
if (obj.cid == 4300){ if (obj.cid == 4300){
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment