修改创建方式
yin5th
parent
59e8a672d6
commit
d31cd6d4be
18
dancing.html
18
dancing.html
|
|
@ -6,8 +6,9 @@
|
|||
<link rel="stylesheet" type="text/css" href="css/animate.css" />
|
||||
<link rel="stylesheet" type="text/css" href="css/style.css" />
|
||||
<link rel="stylesheet" type="text/css" href="css/style-jq.css" />
|
||||
<script src="js/jquery-3.4.1.min.js" type="text/javascript" charset="utf-8"></script>
|
||||
<script src="js/jquery-3.4.1.min.js" type="text/javascript" charset="utf-8"></script>
|
||||
<script src="./js/custom.js" type="text/javascript" charset="utf-8"></script>
|
||||
<script src="./js/handle.js" type="text/javascript" charset="utf-8"></script>
|
||||
<body>
|
||||
<!--灯光-->
|
||||
<div class="Lighting">
|
||||
|
|
@ -51,17 +52,22 @@
|
|||
<!--大航海介绍-->
|
||||
<div class="types">
|
||||
<!-- <div class="name">
|
||||
<p>送任意电池可获得荧光棒！<br />
大航海排名前三可成为领舞!<br />
领舞特权：切歌，镜头，统一动作”跳跃，旋转，向左，向右，向左抖腿，向右抖腿”，
一起喊“任意文字”
|
||||
<p>送任意电池可获得荧光棒！<br />
|
||||
大航海排名前三可成为领舞!<br />
|
||||
领舞特权：切歌，镜头，统一动作”跳跃，旋转，向左，向右，向左抖腿，向右抖腿”，
|
||||
一起喊“任意文字”
|
||||
</p>
|
||||
</div> -->
|
||||
<!-- <div class="list">
|
||||
<p>1：最炫民族风</p>
<p>2：爱情买卖</p>
<p>3：两只蝴蝶</p>
|
||||
<p>1：最炫民族风</p>
|
||||
<p>2：爱情买卖</p>
|
||||
<p>3：两只蝴蝶</p>
|
||||
</div> -->
|
||||
</div>
|
||||
<!--舞池-->
|
||||
|
||||
<!--当前舞池动作： dancing-left, dancing-right,dancing-down,dancing-UP,dancing-Wobble,dancing-Wobble-right-->
|
||||
<div class="dance-floor-box">
|
||||
<!--当前舞池动作： dancing-left, dancing-right,dancing-down,dancing-UP,dancing-Wobble,dancing-Wobble-right-->
|
||||
<div class="dance-floor-box">
|
||||
<div class="dance-floor">
|
||||
<!-- <div class="dance-people" style="top: 40%; left: 50%;">
|
||||
<div class="people-img people-img02 dancing-UP">
|
||||
|
|
@ -138,7 +144,7 @@
|
|||
</div>
|
||||
<!--舞池 end-->
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--小纸片氛围js-->
|
||||
|
|
|
|||
74
js/custom.js
74
js/custom.js
|
|
@ -199,43 +199,43 @@ $(function(){
|
|||
// } else {
|
||||
// peopleObj(nameArr[nameIndex],sayArr[sayIndex],actionArr[actionIndex],moveArr[moveIndex]);
|
||||
// num++;
|
||||
$.ajax({
|
||||
method: 'get',
|
||||
url: 'https://bili.dothis.top/src/fetch.php',
|
||||
data: '',
|
||||
contentType: false,
|
||||
processData: false,
|
||||
crossDomain:true,
|
||||
success: (res)=>{
|
||||
console.log(res);
|
||||
if(res.data.dm.length!=0){
|
||||
res.data.dm.forEach((item,index)=>{
|
||||
var nameIndex = Math.floor(Math.random()*nameArr.length);
|
||||
var sayIndex = Math.floor(Math.random()*sayArr.length);
|
||||
var actionIndex = Math.floor(Math.random()*actionArr.length);
|
||||
var moveIndex = Math.floor(Math.random()*moveArr.length);
|
||||
peopleObj(item.uname,item.text,actionArr[actionIndex],moveArr[moveIndex]);
|
||||
num++;
|
||||
})
|
||||
$('.lingname').text(res.data.leader.uname);
|
||||
if(res.data.leader.event=='scale-left' || res.data.leader.event=='scale-right' || res.data.leader.event=='scale-bottom-left' ||
|
||||
res.data.leader.event=='scale-bottom-right'){
|
||||
$('.ground-bg').addClass(res.data.leader.event);
|
||||
} else {
|
||||
setTimeout(()=>{
|
||||
console.log(res.data.leader.event);
|
||||
// 显示领舞说话
|
||||
$('.speak-pink').text(res.data.leader.text);
|
||||
$('.speak-pink').fadeIn();
|
||||
setTimeout(()=>{//关闭领舞说话
|
||||
$('.speak-pink').fadeOut();
|
||||
},3000)
|
||||
allDancing(res.data.leader.event);
|
||||
},3000)
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
// $.ajax({
|
||||
// method: 'get',
|
||||
// url: 'https://bili.dothis.top/src/fetch.php',
|
||||
// data: '',
|
||||
// contentType: false,
|
||||
// processData: false,
|
||||
// crossDomain:true,
|
||||
// success: (res)=>{
|
||||
// console.log(res);
|
||||
// if(res.data.dm.length!=0){
|
||||
// res.data.dm.forEach((item,index)=>{
|
||||
// var nameIndex = Math.floor(Math.random()*nameArr.length);
|
||||
// var sayIndex = Math.floor(Math.random()*sayArr.length);
|
||||
// var actionIndex = Math.floor(Math.random()*actionArr.length);
|
||||
// var moveIndex = Math.floor(Math.random()*moveArr.length);
|
||||
// peopleObj(item.uname,item.text,actionArr[actionIndex],moveArr[moveIndex]);
|
||||
// num++;
|
||||
// })
|
||||
// $('.lingname').text(res.data.leader.uname);
|
||||
// if(res.data.leader.event=='scale-left' || res.data.leader.event=='scale-right' || res.data.leader.event=='scale-bottom-left' ||
|
||||
// res.data.leader.event=='scale-bottom-right'){
|
||||
// $('.ground-bg').addClass(res.data.leader.event);
|
||||
// } else {
|
||||
// setTimeout(()=>{
|
||||
// console.log(res.data.leader.event);
|
||||
// // 显示领舞说话
|
||||
// $('.speak-pink').text(res.data.leader.text);
|
||||
// $('.speak-pink').fadeIn();
|
||||
// setTimeout(()=>{//关闭领舞说话
|
||||
// $('.speak-pink').fadeOut();
|
||||
// },3000)
|
||||
// allDancing(res.data.leader.event);
|
||||
// },3000)
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// });
|
||||
// }
|
||||
// },1000)
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,103 @@
|
|||
// uid列表 TODO 优化查询性能
|
||||
let uidList = {}
|
||||
// 事件列表-中文
|
||||
let eventTextList = ['切歌', '跳跃', '向左', '向右', '左抖腿', '右抖腿', '抖动', '一起喊', '镜头']
|
||||
|
||||
// 根据事件文字 获取事件名
|
||||
function getEvent(name) {
|
||||
let map = {
|
||||
'切歌' : 'change_song',
|
||||
'跳跃' : 'dancing-down',
|
||||
'向左' : 'dancing-left',
|
||||
'向右' : 'dancing-right',
|
||||
'左抖腿' : 'dancing-wobble',
|
||||
'右抖腿' : 'dancing-wobble-right',
|
||||
'抖动' : 'dancing-up',
|
||||
'一起喊' : 'all_shout',
|
||||
'镜头' : scale()
|
||||
}
|
||||
}
|
||||
|
||||
// 随机选择镜头
|
||||
function scale() {
|
||||
let list = ['scale-left', 'scale-right', 'scale-bottom-left', 'scale-bottom-right']
|
||||
return list[Math.floor(Math.random() * list.length)];
|
||||
}
|
||||
|
||||
// 字符串包含的事件 （仅取第一个）
|
||||
function getFirstEventKeyword(name) {
|
||||
let event = ''
|
||||
$.each(eventTextList, function (index, item) {
|
||||
if (name.indexOf(item) != -1) {
|
||||
event = item
|
||||
return false
|
||||
}
|
||||
})
|
||||
return event
|
||||
}
|
||||
|
||||
// 接受消息处理
|
||||
function receiveMessage(event)
|
||||
{
|
||||
console.log(event.data, 'event test')
|
||||
// 我们能信任信息来源吗？
|
||||
if (event.origin !== "https://live.bilibili.com") {
|
||||
return false
|
||||
}
|
||||
|
||||
let data = JSON.parse(event.data)
|
||||
|
||||
if (data.length <= 0) {
|
||||
return false
|
||||
}
|
||||
|
||||
// 当前直播间 自己的弹幕 无法获取到ct和type值 就暂时过滤
|
||||
if (data.ct === '') {
|
||||
return false
|
||||
}
|
||||
|
||||
let random1 = uid in uidList ? 1 : 0
|
||||
let random2 = Math.floor(Math.random() + 0.5)
|
||||
let dm = {text: data.danmaku, uid: data.uid, uname: data.uname,
|
||||
event: getFirstEventKeyword(data.danmaku), is_new: random1, is_admin: 0, is_exit: random2}
|
||||
|
||||
let leader = {
|
||||
uid: '1111', uname: '大帅比', text: '6666', event: ''
|
||||
}
|
||||
|
||||
let actionIndex = Math.floor(Math.random()*actionArr.length);
|
||||
let moveIndex = Math.floor(Math.random()*moveArr.length);
|
||||
peopleObj(dm.uname,dm.text,actionArr[actionIndex],moveArr[moveIndex]);
|
||||
num++;
|
||||
|
||||
$('.lingname').text(leader.uname);
|
||||
if(leader.event=='scale-left' || leader.event=='scale-right' || leader.event=='scale-bottom-left' || leader.event=='scale-bottom-right'){
|
||||
$('.ground-bg').addClass(leader.event);
|
||||
} else {
|
||||
setTimeout(()=>{
|
||||
console.log(leader.event);
|
||||
// 显示领舞说话
|
||||
$('.speak-pink').text(leader.text);
|
||||
$('.speak-pink').fadeIn();
|
||||
setTimeout(()=>{//关闭领舞说话
|
||||
$('.speak-pink').fadeOut();
|
||||
},3000)
|
||||
allDancing(leader.event);
|
||||
},3000)
|
||||
}
|
||||
|
||||
// event.source 就当前弹出页的来源页面
|
||||
// event.data 是 "hello there!"
|
||||
|
||||
// 假设你已经验证了所受到信息的origin (任何时候你都应该这样做), 一个很方便的方式就是把event.source
|
||||
// 作为回信的对象，并且把event.origin作为targetOrigin
|
||||
// event.source.postMessage("hi there yourself! the secret response " +
|
||||
// "is: rheeeeet!",
|
||||
// event.origin);
|
||||
|
||||
// 数据是否为空
|
||||
// 弹幕类型判断 事件弹幕、内容弹幕
|
||||
|
||||
}
|
||||
|
||||
window.addEventListener("message", receiveMessage, false);
|
||||
Loading…
Reference in New Issue