242 lines
6.8 KiB
JavaScript
242 lines
6.8 KiB
JavaScript
// 总条数
|
||
var num = 0;
|
||
var timer = null;
|
||
var actionTimer = null;
|
||
var moveTimer = null;
|
||
var dancerTimer = null;
|
||
// 经过几秒关闭一起喊
|
||
var allSayTimer = 5000;
|
||
// 动作
|
||
var actionArr = ['dancing-left','dancing-right','dancing-down','dancing-up','dancing-wobble','dancing-wobble-right'];
|
||
// 人物位移动画
|
||
var moveArr = ['run-right','run-left','run-right-top','run-left-top','run-right-bottom','run-left-bottom'];
|
||
// 随机荧光棒动画
|
||
var fluoArr = ['stick-go','stickcome'];
|
||
var peopleId = 0;
|
||
// 窗体宽度
|
||
var winWidth = $(window).width();
|
||
// 窗体高度
|
||
var winheight = $(window).height();
|
||
//控制速度1px
|
||
var speed = 1;
|
||
var startIndex = 0;
|
||
// 领舞关闭时间
|
||
var dancingTime = 6000;
|
||
// 6秒钟检测移动位置
|
||
var runTime = 6000;
|
||
// 随机移动的定时器
|
||
var upTimer = null;
|
||
// 荧光棒关闭时间
|
||
var fluoTime = 6000//默认6秒关闭
|
||
// 集体舞ji
|
||
function allDancing(dangcing){
|
||
if(dangcing!=''){
|
||
actionArr.forEach((item,index)=>{
|
||
var haveDan = $(`.people-dancins`).is(`.${item}`);
|
||
if(haveDan){
|
||
$(`.people-dancins`).removeClass(item);
|
||
// $(`.people-img`).addClass(actionArr[Math.floor(Math.random()*actionArr.length)]);
|
||
$(`.people-dancins`).addClass(dangcing);
|
||
$(`.leading-dancer`).removeClass(item);
|
||
$(`.leading-dancer`).addClass(dangcing);
|
||
}
|
||
})
|
||
setTimeout(()=>{
|
||
startIndex = 0;
|
||
var allPeople = $('.dance-floor').find('.people-dancins').length;
|
||
$(`.people-dancins`).removeClass(dangcing);
|
||
var suiDanTimer = setInterval(()=>{
|
||
if(startIndex==allPeople){
|
||
clearInterval(suiDanTimer);
|
||
} else {
|
||
startIndex++;
|
||
$(`.data${startIndex} .people-dancins`).addClass(actionArr[Math.floor(Math.random()*actionArr.length)]);
|
||
}
|
||
},3000)
|
||
},10000)
|
||
}
|
||
}
|
||
// 创建人物时随机分配舞蹈
|
||
function randomDancing(id){
|
||
$(`.data${id} .people-dancins`).addClass(actionArr[Math.floor(Math.random()*actionArr.length)]);
|
||
}
|
||
// 荧光棒动画事件
|
||
function fluoEv(id,fluoEvent){
|
||
$(`#${id} .stick`).addClass(fluoEvent);
|
||
setTimeout(()=>{
|
||
$(`#${id} .stick`).removeClass(fluoEvent);
|
||
},fluoTime)
|
||
}
|
||
// 个人动作舞
|
||
function peopleAction(id,aevent){
|
||
actionArr.forEach((item,index)=>{
|
||
var haveDan = $(`#${id} .people-dancins`).is(`.${item}`);
|
||
if(haveDan){
|
||
$(`#${id} .people-dancins`).removeClass(item);
|
||
$(`#${id} .people-dancins`).addClass(aevent);
|
||
} else {
|
||
$(`#${id} .people-dancins`).addClass(aevent);
|
||
}
|
||
})
|
||
}
|
||
// 位移事件
|
||
function upMove(id){
|
||
var odivu = document.getElementById(`${id}`);
|
||
upTimer = setInterval(()=>{
|
||
$(`#${id}`).animate({top:`${Math.floor(Math.random()*90)}%`,left:`${Math.floor(Math.random()*90)}%`},Math.floor(Math.random()*40000+10000));
|
||
},runTime)
|
||
}
|
||
// 随机位移
|
||
function moveEv(id){
|
||
upMove(id);
|
||
}
|
||
// 关闭说话
|
||
function closeSay(index){
|
||
$(`.data${index} .speak`).addClass("dn");
|
||
}
|
||
// 开启说话
|
||
function sayIng(index){
|
||
$(`.data${index} .speak`).removeClass("dn");
|
||
setTimeout(()=>{
|
||
closeSay(index);
|
||
},6000)
|
||
}
|
||
// 一起喊
|
||
function allSay(val){
|
||
$(`.dance-people .speak`).removeClass("dn");
|
||
$(`.dance-people .speak`).html(val);
|
||
setTimeout(()=>{
|
||
$(`.dance-people .speak`).addClass("dn");
|
||
},allSayTimer)
|
||
}
|
||
// 退出广场
|
||
function exitEv(id){
|
||
$(`${id}`).remove();
|
||
}
|
||
// 进入广场
|
||
function peopleObj(name,uid,say,action,active_time, is_admin, decoration){
|
||
// console.log(name + ' ' + uid + ' ' + say + ' ' + action + ' ' + active_time + ' ' + is_admin, 'sssss')
|
||
let yspHtml = '';
|
||
let yspData = [
|
||
{
|
||
id:'',
|
||
uid:uid,
|
||
top:`${Math.random()*500}px`,
|
||
left:`${Math.random()*1500}px`,
|
||
name:name,//用户名
|
||
say:say,//说话内容
|
||
peopleImg:`people-img0${Math.floor(Math.random()*6+1)}`,//人物图片
|
||
ying_guang:`stick-0${Math.floor(Math.random()*5+1)}`,//荧光棒
|
||
dancin:action,
|
||
active_time: active_time,
|
||
is_admin: is_admin
|
||
}
|
||
]
|
||
|
||
let decorationHat = ''
|
||
let decorationStick = ''
|
||
let decorationWing = ''
|
||
if (decoration != undefined && decoration.length > 0) {
|
||
// console.log(decoration, '装饰品')
|
||
// console.log(decoration.indexOf('people-hat'), '是否有帽子')
|
||
// 添加帽子
|
||
if (decoration.indexOf('people-hat') != -1) {
|
||
decorationHat = 'people-hat'
|
||
// console.log(decorationHat, '我的帽子')
|
||
}
|
||
|
||
// 添加棒子
|
||
if (decoration.indexOf('stick-christmas') != -1) {
|
||
decorationStick = 'stick-christmas'
|
||
// console.log(decorationStick, '我的棒子')
|
||
}
|
||
|
||
// 添加翅膀
|
||
if (decoration.indexOf('people-wing') != -1) {
|
||
decorationWing = 'people-wing'
|
||
// console.log(decorationWing, '我的翅膀')
|
||
}
|
||
}
|
||
|
||
$.each(yspData, function (commentIndex, comment) {
|
||
let bigStick = comment.is_admin == 1 ? 'stick-swing-big-tow' : ''
|
||
if (decorationStick != '') {
|
||
bigStick = ''
|
||
}
|
||
yspHtml += `
|
||
<div id="${comment.uid}" data-time="${comment.active_time}" class="dance-people ${decorationWing} data${peopleId}" style="top: ${comment.top}; left: ${comment.left};">
|
||
<div class="speak ">${comment.say}</div>
|
||
<div class="people-dancins ${comment.dancin} ">
|
||
<div class="people-img ${comment.peopleImg} ${decorationHat} ">
|
||
<div class="stick stick-swing ${decorationStick} ${bigStick} ${comment.ying_guang}"></div>
|
||
<div class="people-name ">${comment.name}</div>
|
||
</div>
|
||
<div class="people-wing "> </div>
|
||
</div>
|
||
</div>`
|
||
});//如果是舰长需要加上stick-swing-big-tow，充值用户加上stick-christmas，同时去掉stick-swing-big-tow
|
||
//增加圣诞帽子，在people-img那层增加people-hat。
|
||
//翅膀在people-wing 增加people-block
|
||
$('.dance-floor').prepend(yspHtml);
|
||
moveEv(uid);
|
||
// 随机舞
|
||
randomDancing(peopleId);
|
||
// 开始说话
|
||
sayIng(peopleId);
|
||
peopleId++
|
||
// 执行退出事件
|
||
// exitEv(`#peopleId${peopleId-1}`)
|
||
}
|
||
// 领舞者个人说话的动作
|
||
function dancerOwn(dancing){
|
||
actionArr.forEach((item,index)=>{
|
||
var haveDan = $(`.leading-dancer`).is(`.${item}`);
|
||
if(haveDan){
|
||
$(`.leading-dancer`).removeClass(item);
|
||
$(`.leading-dancer`).addClass(dancing);
|
||
}
|
||
})
|
||
setTimeout(()=>{
|
||
dancerRandom();
|
||
},6000)
|
||
}
|
||
// 领舞者随机的动作
|
||
function dancerRandom(){
|
||
// 领舞者随机动效
|
||
dancerTimer = setInterval(()=>{
|
||
actionArr.forEach((item,index)=>{
|
||
var haveDan = $(`.leading-dancer`).is(`.${item}`);
|
||
if(haveDan){
|
||
$(`.leading-dancer`).removeClass(item);
|
||
$(`.leading-dancer`).addClass(actionArr[Math.floor(Math.random()*actionArr.length)]);
|
||
} else {
|
||
$(`.leading-dancer`).addClass(actionArr[Math.floor(Math.random()*actionArr.length)]);
|
||
}
|
||
})
|
||
},dancingTime)
|
||
}
|
||
$(function(){
|
||
dancerRandom();
|
||
// 自动切歌
|
||
//changeMusic();
|
||
var audio=document.getElementById('music');
|
||
if(audio){
|
||
audio.loop = false;
|
||
audio.addEventListener('ended', function () {
|
||
changeMusic()
|
||
}, false);
|
||
}
|
||
|
||
// 60s检测一次 十分钟没发言的删除
|
||
setInterval(function () {
|
||
delExpireDiv()
|
||
}, 60000)
|
||
|
||
//烟花
|
||
// setInterval(()=>{
|
||
// setTimeout(function() {
|
||
// $('.w3-agilefireworks').fireworks();
|
||
// });
|
||
// },6000)
|
||
|
||
}) |