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 @@
.body-lang1 .hot-box {
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 {
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 {
min-height: 54px;
height: auto;
......
room/css/index.less
......@@ -16,10 +16,18 @@
.hot-box{
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{
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{
min-height: 54px;
height: auto;
......
room/css/room.css
......@@ -184,6 +184,19 @@ html * {
float: left;
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 {
position: relative;
width: 174px;
......@@ -197,6 +210,18 @@ html * {
text-align: center;
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 {
display: none;
width: 240px;
......@@ -274,12 +299,14 @@ html * {
top: 261px;
left: -5px;
}
.list-floor-left {
.list-floor-left,
.list-floor-left2 {
position: absolute;
left: 52px;
top: 18px;
}
.list-floor-right {
.list-floor-right,
.list-floor-right2 {
position: absolute;
right: 52px;
top: 18px;
......@@ -1276,18 +1303,31 @@ input::-webkit-input-placeholder {
font-size: 18px;
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;
height: 578px;
overflow-y: scroll;
-webkit-overflow-scrolling: touch;
}
.hot-list-ul li {
.hot-list-ul li,
.hot-list-ul2 li {
height: 62px;
width: 210px;
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;
height: 62px;
line-height: 62px;
......@@ -1297,13 +1337,15 @@ input::-webkit-input-placeholder {
text-shadow: none;
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;
height: 62px;
position: relative;
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;
height: 44px;
border-radius: 50%;
......@@ -1311,13 +1353,15 @@ input::-webkit-input-placeholder {
top: 8px;
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;
left: 3px;
z-index: 2;
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;
text-indent: 55px;
font-weight: 400;
......@@ -1330,7 +1374,8 @@ input::-webkit-input-placeholder {
white-space: nowrap;
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;
text-indent: 55px;
font-weight: 400;
......@@ -1348,6 +1393,15 @@ input::-webkit-input-placeholder {
.hot-list-ul::-webkit-scrollbar-thumb {
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 {
position: relative;
width: 400px;
......
room/css/room.less
......@@ -206,6 +206,20 @@ html{
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{
position: relative;
width: 174px;
......@@ -220,6 +234,18 @@ html{
line-height: 120px;
// 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{
display: none;
width: 240px;
......@@ -298,12 +324,12 @@ html{
top: 261px;
left: -5px;
}
.list-floor-left{
.list-floor-left,.list-floor-left2{
position: absolute;
left: 52px;
top: 18px;
}
.list-floor-right{
.list-floor-right,.list-floor-right2{
position: absolute;
right: 52px;
top: 18px;
......@@ -1337,7 +1363,17 @@ input::-webkit-input-placeholder{
font-size: 18px;
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;
height: 578px;
overflow-y: scroll;
......@@ -1411,6 +1447,15 @@ input::-webkit-input-placeholder{
.hot-list-ul::-webkit-scrollbar-thumb{
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{
position: relative;
width: 400px;
......
room/lib/roomLang.js
......@@ -52,6 +52,7 @@ var langList=[
room48:'receive',
room49:'home',
room50:'he',
room51:'Interactive Rank',
msg1:"Already paid, will enter the live room soon",
msg2:"Please enter the content to send",
msg3:"Followed",
......@@ -186,6 +187,7 @@ var langList=[
room48:'收到',
room49:'主頁',
room50:'他',
room51:'互動榜',
msg1:'已付費，即將進入直播間',
msg2:'請輸入要發送的內容',
msg3:'關注成功',
......
room/liveRoom.html
......@@ -20,8 +20,8 @@
<link rel="stylesheet" href="../css/base.css?v=2023053101">
<link rel="stylesheet" href="../css/layer.css">
<link rel="stylesheet" href="../css/swiper.min.css">
<link rel="stylesheet" href="css/index.css?v=2023060101">
<link rel="stylesheet" href="css/room.css?v=2023053101">
<link rel="stylesheet" href="css/index.css?v=2023060601">
<link rel="stylesheet" href="css/room.css?v=2023060601">
<link rel="stylesheet" href="../css/login.css?v=2023053101">
<script src="../lib/flv.js"></script>
<script src="https://accounts.google.com/gsi/client" async defer></script>
......@@ -155,15 +155,15 @@
</ul>
</div>
</div>
<div style="display: none;" class="hot-box2">
<div class="hot-box2">
<span></span>
<div class="hot-list-box">
<div class="hot-list-box2">
<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-right" src="images/list-floor.png" alt="">
<div class="hot-list-box-top">人氣榜</div>
<img class="list-floor-left2" src="images/list-floor.png" alt="">
<img class="list-floor-right2" src="images/list-floor.png" alt="">
<div class="hot-list-box-top2">互動榜</div>
<ul class="hot-list-ul2">
<!-- <li>
<li>
<div class="hot-list-li-box1">4</div>
<div class="hot-list-li-box2">
<img class="rich-list-king" src="images/r1.png" alt="">
......@@ -173,7 +173,7 @@
<p class="hot-list-p1">Mlonghoursus</p>
<p class="hot-list-p2">123124</p>
</div>
</li> -->
</li>
</ul>
</div>
</div>
......@@ -629,6 +629,7 @@ $(function () {
$(".roomLang-txt23").text(langList[sessionStorage.lang].room23)
$(".guard-btn").text(langList[sessionStorage.lang].room24)
$(".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-txt27").text(langList[sessionStorage.lang].room27)
$(".roomLang-txt28").text(langList[sessionStorage.lang].room28)
......@@ -850,7 +851,7 @@ $(function () {
layer.closeAll()
})
$(".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{
setTimeout(function(){
......@@ -887,6 +888,7 @@ $(function () {
}
}
$(".hot-box >span").text(data.roomOtherInfo.popularNum)
$(".hot-box2 >span").text(data.roomOtherInfo.interacNum)
$(".rich-box >span").text(data.roomOtherInfo.charm)
$(".mc-tips div").text(data.roomBaseInfo.sign.replace("Firefly Live","Footseen"))
var html = [];
......@@ -944,6 +946,7 @@ $(function () {
})
loginGo()
hotList()
popular()
richGuard(0)
giftList(1)
richMouse()
......@@ -956,6 +959,7 @@ $(function () {
online()
richGuard(richType)
hotList()
popular()
},60000)
if(localStorage.uid!=undefined){
myDiamond()
......@@ -1675,6 +1679,17 @@ $(function () {
$(".hot-list-box").fadeOut(150)
}, 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) {
$.ajax({
......@@ -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(){
$.ajax({
......@@ -3419,6 +3493,7 @@ $(function () {
if(obj.cid == 4700){
var list=JSON.parse(obj.content)
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){
......
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