const STAGE1_TIME = 30 const STAGE2_TIME = 3 const STAGE3_TIME = 8 const STAGE4_TIME = 5 let currentWeaponIndex = 0 //神器列表的索引值 let currentWeaponIndex_top //上方神器列表的索引值 let isSelectWeapon = true //是否选择神器 let drawInfo let img //第三阶段的中奖img let $countDown // 显示哪个界面 let urlPrefix = getUrlPrefix() let browser = checkVersion() let env = EnvCheck(); if (env == 'test') { new VConsole(); } console.log($(window).width()); console.log($(window).height()); // 封装layer消息提醒框 let layerIndex const showLoading = (content = '加載中...') => { layer.open({ type: 2, shadeClose: false, content, success (e) { layerIndex = $(e).attr('index') } }) } const hideLoading = (index) => { layer.close(index) } const toastMsg = (content = '操作完成', time = 2) => { layer.open({ content, time, skin: 'msg' }) } if (!browser.app) {//false toastMsg('请在app内打开!'); } else { $('body').removeClass('no-in-app') } // 获取礼包列表 let listMap = [] const getListPack = () => { networkRequest({ type: 'GET', url: urlPrefix + '/act/callBattle/listPack', success (res) { if (res.code === 200) { res.data.map((item, index) => { listMap[index] = { imgUrl: item.imgUrl, name: item.name, ticketNum: item.ticketNum, sellingPrice: item.sellingPrice, id: item.id } }) window.sessionStorage.setItem('listMap', JSON.stringify(listMap)) } }, error (err) { toastMsg('網絡錯誤') } }) } // 获取用户相关信息 let myFragment //道具数量 let userDiamonds //鉆石数量 const getUserInfo = (param) => { networkRequest({ type: 'GET', url: urlPrefix + '/act/callBattle/getUserActInfo', success (res) { if (res.code === 200) { $('.info-bottom').find('.avatar img').attr('src', res.data.avatar) if (res.data.todayReward.toString().length >= 5) { res.data.todayReward = (Math.floor((res.data.todayReward / 100)) / 100).toFixed(2) + 'w' } $('.info-bottom').find('.award span').html(res.data.todayReward) if (param) { $('.info-bottom').find('.fragment span')[0].innerHTML = parseInt($('.info-bottom').find('.fragment span')[0].innerHTML) + param myFragment = $('.info-bottom').find('.fragment span')[0].innerHTML } else { $('.info-bottom').find('.fragment span').html(res.data.pieceNum) myFragment = res.data.pieceNum } userDiamonds = res.data.diamonds } else { return toastMsg(res.message) } }, error (err) { toastMsg('網絡錯誤,請退出重進') } }) } let userComeinTime //用户进入游戏界面时间,后端返回的timestamp let startTime, drawStageStartTime, showResultStageStartTime, endTime //4个时间戳判断落于哪个界面 let timer2 let roundId let roundIdArr = [] let arrTime = [], arrTime2 = [], arrTime3 = [] const getNewestAct = () => { networkRequest({ type: 'GET', url: urlPrefix + '/act/callBattle/getNewestAct', success (res) { if (res.code === 200) { if ($.isEmptyObject(res.data) || res.data.status === 4) { return showLoading('服务器正在维护中...') } else { console.log(res.timestamp > res.data.endTime); if (res.timestamp >= res.data.endTime) { //请求的还是上一轮的数据,重新请求 console.log('请求的还是上一轮的数据,重新请求'); showLoading() timer2 = setTimeout(() => { getNewestAct() }, 600); } else { clearTimeout(timer2) hideLoading(layerIndex) roundId = res.data.roundId getListItem(roundId) // 进行下一轮时,arrTime重新置为空数组,不然在下一轮开始的时候也会执行location.reload() if (roundIdArr.length < 2) { roundIdArr = [roundId, roundId] } else { roundIdArr[0] = roundIdArr[1] roundIdArr[1] = roundId if (roundIdArr[0] != roundIdArr[1]) { arrTime = [] arrTime2 = [] arrTime3 = [] } } userComeinTime = res.timestamp startTime = res.data.startTime drawStageStartTime = res.data.drawStageStartTime showResultStageStartTime = res.data.showResultStageStartTime endTime = res.data.endTime console.log('获取5个时间戳的值-----', 'timestamp:', userComeinTime, 'startTime:', startTime, 'drawStageStartTime:', drawStageStartTime, 'showResultStageStartTime:', showResultStageStartTime, 'endTime:', endTime); showView(res.data, res.data.drawRestraintImageUrl, res.data.drawId) //带参数以供第三阶段所用 } } } else { return toastMsg(res.message) } }, error (err) { toastMsg('網絡錯誤,請退出重進') } }) } //不为3继续请求 为3拿数据 为4弹窗 let responStatus //区分倒计时到0时的区别处理的字段,处于第二阶段时isStatus2为真,处于第三阶段时isStatus3为真 let isStatus2 let isStatus3 let fragmentNum let reg = /^[0-9]*$/ const showView = (data, monsterImg, drawId) => { if (startTime <= userComeinTime && userComeinTime < drawStageStartTime) { // 第一阶段 console.log('进入第一阶段'); $('.count-down-text').html('下一轮进攻即将开始') $countDown = $('.header .count-down-num') isStatus2 = false isStatus3 = false // 可以召唤 $('.confitm-btn').addClass('active') $('.confitm-btn').removeClass('inactive') $('.confitm-btn').removeClass('prepare') $('.confitm-btn img').attr('src', "./images/main/confirm-btn.png") $('.popup-confitm-btn').addClass('active') $('.popup-confitm-btn').removeClass('inactive') $('.popup-confitm-btn').removeClass('prepare') $('.popup-confitm-btn img').attr('src', "./images/popup/confirm-btn.png") // 清空神器和怪兽名字和图片 $('.restrain .weapon-pic img').attr('src', '') $('.restrain .monster-pic img').attr('src', '') $('.restrain .weapon-name').html('') $('.restrain .monster-name').html('') // 清空input数量 $('.select-num input').val(0) $('.select-num .ipt-wrap main i').html(0) $('.select-num .ipt-wrap p i').html(0) if (currentWeaponIndex != undefined) { // restrainArr[currentWeaponIndex]['num'] = 0 } $('.popup-summon').hide() $('.popup-summon input').val(0) $('.popup-select-num .ipt-wrap main i').html(0) $('.popup-select-num .ipt-wrap p i').html(0) if (currentWeaponIndex_top != undefined) { restrainArr[currentWeaponIndex_top]['num_top'] = 0 } // 清空神器选择状态 isSelectWeapon = true currentWeaponIndex = 0 $('.weapon-wrap p').removeClass('active') $('.weapon-wrap p').eq(0).addClass('active') // 隐藏结果弹窗和进攻怪兽 $('.popup-result').hide() $('.monster-position').hide() showCountDown(userComeinTime, startTime, drawStageStartTime) getUserInfo() } else if (drawStageStartTime <= userComeinTime && userComeinTime < showResultStageStartTime) { // 第二阶段 console.log('进入第二阶段'); $countDown = $('.header .count-down-num') isStatus2 = true //处于第二阶段的标识 console.log('isStatus2的值------------', isStatus2); // 怪兽进攻中按钮 不可召唤 $('.confitm-btn').removeClass('active') $('.confitm-btn').removeClass('prepare') $('.confitm-btn').addClass('inactive') $('.confitm-btn img').attr('src', "./images/main/confirm-disable-btn.png") $('.popup-confitm-btn').removeClass('active') $('.popup-confitm-btn').removeClass('prepare') $('.popup-confitm-btn').addClass('inactive') $('.popup-confitm-btn img').attr('src', "./images/popup/confirm-disable-btn.png") // showCountDown(userComeinTime, drawStageStartTime, showResultStageStartTime) judgeStatus() getUserInfo() // 播放过场动画 $('.monster-svga').show() let player1 = new SVGA.Player('.monster-svga'); let parser1 = new SVGA.Parser('.monster-svga'); parser1.load('./images/monster.svga', function (videoItem) { player1.clearsAfterStop = false; player1.setVideoItem(videoItem); player1.startAnimation(); player1.setContentMode('AspectFill') }) setTimeout(() => { $('.monster-svga').hide() $('.count-down-text').html('怪兽进攻中') getNewestAct() }, (showResultStageStartTime - drawStageStartTime) - (userComeinTime - drawStageStartTime)) console.log('过场动画时长------', (showResultStageStartTime - drawStageStartTime) - (userComeinTime - drawStageStartTime)); } else if (showResultStageStartTime <= userComeinTime && userComeinTime < endTime) { // 第三阶段 console.log('进入第三阶段'); console.log('第三阶段时长', endTime - userComeinTime); console.log('-------', endTime - showResultStageStartTime, userComeinTime - showResultStageStartTime); // showCountDown(userComeinTime, showResultStageStartTime, endTime) $countDown = $('.header .count-down-num') isStatus3 = true //处于第三阶段的标识 console.log('isStatus3的值------------', isStatus3); // 判断处于怪兽进攻动画阶段还是结果弹窗展示阶段 if (userComeinTime - showResultStageStartTime > STAGE3_TIME * 1000) { console.log('结果弹窗展示阶段'); // 准备中 不可召唤 $('.confitm-btn').removeClass('active') $('.confitm-btn').removeClass('inactive') $('.confitm-btn').addClass('prepare') $('.confitm-btn img').attr('src', "./images/main/confirm-prepare-btn.png") $('.popup-confitm-btn').removeClass('active') $('.popup-confitm-btn').removeClass('inactive') $('.popup-confitm-btn').addClass('prepare') $('.popup-confitm-btn img').attr('src', "./images/popup/confirm-prepare-btn.png") $('.monster-position').hide() drawInfo = data //结果弹窗所需信息 setTimeout(() => { $('.count-down-text').html('准备中') showResultPopup() showCountDown(userComeinTime, showResultStageStartTime, endTime) }, 500) } else { console.log('怪兽进攻动画阶段'); $('.count-down-text').html('怪兽进攻中') img = monsterImg //进攻怪兽图片 $('.sign-wrap div').eq(drawId - 1).addClass('active') monsterAnimation() showCountDown(userComeinTime, showResultStageStartTime, endTime - 4000) } // judgeStatus() getUserInfo() } } // 显示倒计时 let countDownTime let deltaT let timer let delayTime let interval const showCountDown = (timestamp, startTime, endTime) => { deltaT = ((endTime - startTime) - (timestamp - startTime)) / 1000 //12.361 if (deltaT >= 1) { interval = 1 } else { interval = 0 } console.log('deltaT----------', deltaT); countDownTime = Math.floor(deltaT) //12.361 => 12 delayTime = deltaT - countDownTime //请求接口的延迟时间 $countDown.html(countDownTime + 'S') timer = setInterval(() => { // if(browser.ios){ // if(!isStatus3 && !isStatus2){ // // 处理第一阶段 // if(arrTime.length < 2){ // arrTime = [new Date().getTime(), new Date().getTime()] // }else{ // arrTime[0] = arrTime[1] // arrTime[1] = new Date().getTime() // if((arrTime[1] - arrTime[0])/1000 > 1.5){ // console.log('不会是走到这里了吧11111111111'); // setTimeout(()=>{ // window.location.reload() // }, 2000) // // window.location.reload() // } // } // }else if(isStatus2){ // // 第二阶段也要处理 // if(arrTime2.length < 2){ // arrTime2 = [new Date().getTime(), new Date().getTime()] // }else{ // arrTime2[0] = arrTime2[1] // arrTime2[1] = new Date().getTime() // if((arrTime2[1] - arrTime2[0])/1000 > 1.5){ // console.log('不会是走到这里了吧22222222222'); // setTimeout(()=>{ // window.location.reload() // }, 2000) // } // } // }else if(isStatus3){ // // 第三阶段也要处理 // if(arrTime3.length < 2){ // arrTime3 = [new Date().getTime(), new Date().getTime()] // }else{ // arrTime3[0] = arrTime3[1] // arrTime3[1] = new Date().getTime() // if((arrTime3[1] - arrTime3[0])/1000 > 1.5){ // console.log('不会是走到这里了吧3333333333333'); // setTimeout(()=>{ // window.location.reload() // }, 2000) // // window.location.reload() // } // } // } // } countDownTime-- if (countDownTime <= 0) { console.log('isStatus2--', isStatus2); console.log('isStatus3--', isStatus3); $countDown.html('0S') clearInterval(timer) if (isStatus2) { // 倒计时为0时,处于第二阶段的处理 if (responStatus) { // hideLoading(layerIndex) setTimeout(() => { getNewestAct() }, delayTime * 1000) isStatus2 = false } else { showLoading() // toastMsg('服务器繁忙,请稍等') console.log('status的值-----------', responStatus); judgeStatus() } } else if (isStatus3) { //倒计时为0时,处于第三阶段的处理 setTimeout(() => { getNewestAct() // getListItem(roundId) }, delayTime * 1000) // getNewestAct() // getListItem() isStatus3 = false } else { setTimeout(() => { getNewestAct() }, delayTime * 1000) } } else { $countDown.html(countDownTime + 'S') } }, interval * 1000) } //判断status的状态 let timer4 const judgeStatus = () => { console.log('进入二阶段时轮询查看结果是否已经出了'); networkRequest({ type: 'GET', url: urlPrefix + '/act/callBattle/getNewestAct', success (res) { if (res.code === 200) { console.log('res.data的值------------', res.data); if ($.isEmptyObject(res.data) || res.data.status === 4) { console.log('程序崩了!!!'); return showLoading('服务器正在维护中...') } else if (res.data.status === 3) { clearTimeout(timer4) responStatus = true // if(isStatus2 && countDownTime <= 0){ // showCountDown(userComeinTime, drawStageStartTime, showResultStageStartTime) // } // hideLoading(layerIndex) console.log('status为3时返回的数据--------------', res.data); drawInfo = res.data img = res.data.drawRestraintImageUrl // if(isStatus3){ // getPreviousResults(11, roundId) // } // renderDrawInfo() } else { timer4 = setTimeout(() => { judgeStatus() }, 1000) } } else { toastMsg(res.message) } }, error (err) { toastMsg('網絡錯誤,請退出重進') } }) } // 获取每一轮抽奖的相关配置 let listItem = [] const getListItem = (roundId) => { networkRequest({ type: 'GET', url: urlPrefix + '/act/callBattle/listItem', data: { roundId }, success (res) { if (res.code === 200) { listItem = res.data renderListItem() } else { toastMsg(res.message) } }, error (err) { toastMsg('網絡錯誤,請退出重進') } }) } let restrainArr = [] //神器与怪兽的克制关系 // 渲染神器列表 const renderListItem = () => { listItem.map((item, index) => { $('.weapon-wrap p').eq(index).find('img').attr('src', item.imgUrl) $('.sign-wrap div').eq(index).find('img').attr('src', item.imgUrl) $('.sign-wrap div').eq(index).find('p').html(`${item.costPieceNum === 0 ? '' : '+' + item.costPieceNum}`) restrainArr[index] = { imgUrl: item.imgUrl, name: item.name, restraintImageUrl: item.restraintImageUrl, restraintName: item.restraintName, multiple: item.multiple, id: item.id, costPieceNum: item.costPieceNum, num: 0, num_top: 0 } // 渲染默认神器和怪兽名字和图片 $('.restrain .weapon-pic img').attr('src', restrainArr[currentWeaponIndex].imgUrl) $('.restrain .monster-pic img').attr('src', restrainArr[currentWeaponIndex].restraintImageUrl) $('.restrain .weapon-name').html(restrainArr[currentWeaponIndex].name) $('.restrain .monster-name').html(restrainArr[currentWeaponIndex].restraintName) }) console.log('restrainArr--------', restrainArr); } // 怪兽进攻动画 const monsterAnimation = () => { if (isStatus3) { $('.monster-position').attr('src', img) $('.monster-position').show() $('.monster-position').animate({ top: '0.64rem' }, 75.6 / 500.3 * STAGE3_TIME * 1000, 'linear', () => { $('.monster-position').animate({ left: '8.16rem' }, 139.1 / 500.3 * STAGE3_TIME * 1000, 'linear', () => { $('.monster-position').animate({ top: `${90 / 75 * 2}rem` }, 31.4 / 500.3 * STAGE3_TIME * 1000, 'linear', () => { $('.monster-position').animate({ left: `${98 / 75 * 2}rem` }, 103.8 / 500.3 * STAGE3_TIME * 1000, 'linear', () => { $('.monster-position').animate({ top: '4rem' }, 29.9 / 500.3 * STAGE3_TIME * 1000, 'linear', () => { $('.monster-position').animate({ left: `${8.16}rem` }, 103.8 / 500.3 * STAGE3_TIME * 1000, 'linear', () => { $('.monster-position').animate({ top: '4.8rem' }, 16.7 / 500.3 * STAGE3_TIME * 1000, 'linear', () => { $('.monster-position').hide() $('.monster-position').css({ top: '4.8rem', left: `${28 * 2 / 75}rem` }) // 准备中 不可召唤 $('.confitm-btn').removeClass('active') $('.confitm-btn').removeClass('inactive') $('.confitm-btn').addClass('prepare') $('.confitm-btn img').attr('src', "./images/main/confirm-prepare-btn.png") $('.popup-confitm-btn').removeClass('active') $('.popup-confitm-btn').removeClass('inactive') $('.popup-confitm-btn').addClass('prepare') $('.popup-confitm-btn img').attr('src', "./images/popup/confirm-prepare-btn.png") }) }) }) }) }) }) }) } } // 结果弹窗 const showResultPopup = () => { console.log('结果------', drawInfo); $('.sign-wrap div').removeClass('active') $('.result-content .result-award').hide() $('.result-title span').html(drawInfo.drawName) $('.result-weapon-pic').attr('src', drawInfo.drawImageUrl) $('.result-monster-pic').attr('src', drawInfo.drawRestraintImageUrl) $('.result-weapon-name').html(drawInfo.drawName) $('.result-monster-name').html(drawInfo.drawRestraintName) if (drawInfo.userDrawResult.drawStatus === 1) { $('.result-award span').html(drawInfo.userDrawResult.prizeDiamonds * 10) $('.result-award').show() $('.result-content').removeClass('not-join-bg') $('.result-content').removeClass('failure-bg') $('.result-content').addClass('success-bg') } else if (drawInfo.userDrawResult.drawStatus === 2) { $('.result-content .result-award').hide() $('.result-content').removeClass('not-join-bg') $('.result-content').removeClass('success-bg') $('.result-content').addClass('failure-bg') } else if (drawInfo.userDrawResult.drawStatus === 3) { $('.result-content .result-award').hide() $('.result-content').removeClass('success-bg') $('.result-content').removeClass('failure-bg') $('.result-content').addClass('not-join-bg') } // 渲染前三名 topThreeArr = drawInfo.rankUserList let str = '' if (topThreeArr.length === 0) { $('.top-three img').attr('src', './images/main/default-hui.png') } else { topThreeArr.map((item, index) => { $('.top-three img').eq(index).attr('src', item) }) if (topThreeArr.length === 1) { $('.top-three img').eq(1).attr('src', './images/main/default-hui.png') $('.top-three img').eq(2).attr('src', './images/main/default-hui.png') } else if (topThreeArr.length === 2) { $('.top-three img').eq(2).attr('src', './images/main/default-hui.png') } } $('.popup-result').show() } // 发送用户抽奖数量 const sendUserDrawInfo = (itemId, num) => { networkRequest({ type: 'POST', url: urlPrefix + '/act/callBattle/draw', contentType: 'application/json', data: `[ { "itemId":${itemId}, "num":${num} }]`, success (res) { if (res.code === 200) { toastMsg('召唤成功!') $('.select-num input').val(0) $('.select-num .ipt-wrap main i').html(0) $('.select-num .ipt-wrap p i').html(0) if (currentWeaponIndex != undefined) { restrainArr[currentWeaponIndex]['num'] = 0 } $('.popup-summon').hide() $('.popup-summon input').val(0) $('.popup-select-num .ipt-wrap main i').html(0) $('.popup-select-num .ipt-wrap p i').html(0) if (currentWeaponIndex_top != undefined) { restrainArr[currentWeaponIndex_top]['num_top'] = 0 } } else { toastMsg(res.message) } }, error (err) { toastMsg('網絡錯誤,請退出重進') } }) } /************************************************** 我的记录 start ***************************************************/ // 获取用户的游戏记录 let recordList = [] let page = 1 let pageSize = 10 let canNextUserRecord let isLockUserRecord = true const getUserRecord = () => { networkRequest({ type: 'GET', url: urlPrefix + '/act/callBattle/listDrawRecord', data: { page, pageSize }, success (res) { if (res.code === 200) { if (res.data.length === pageSize) { // 能够继续请求下一页 canNextUserRecord = true } else { canNextUserRecord = false } recordList.push(...res.data) renderRecord() isLockUserRecord = true } else { toastMsg(res.message) } }, error (err) { toastMsg('網絡錯誤') } }) } // 渲染游戏记录 const renderRecord = () => { if (recordList.length === 0) { $('.record-list').html('
  • 暂未参与守护星球活动~
  • ') } else { let str = '' recordList.map((item, index) => { let drawId = item.drawId // 渲染li里面的ul let str1 = '' let userCostPiece = '' //用户投注情况 let userReward = '' //用户奖励情况 item.results.map((item1, index) => { userCostPiece = '*' + item1.costPiece str1 += `
  • ${userCostPiece}
  • ` }) // 渲染li let text = '' if (item.drawStatus === 1) { text = '成功克制怪兽' } else { text = '未能克制怪兽' } str += `
  • ${dateFormat(item.drawTime, "yyyy-MM-dd hh:mm:ss")}
    召唤神器 进攻怪兽 ${item.restraintName}
    ${text}

    奖励 ${item.reward}

  • ` }) $('.record-list').html(str) } $('.popup-record-list').show() $('body').css('overflow', 'hidden') } // 监听滚动 $('.record-list').scroll(function () { let scrollTop = $(this).scrollTop() let scrollHeight = $('ul')[0].scrollHeight let ulHeight = $(this).innerHeight() if (scrollTop + ulHeight + 100 >= scrollHeight) { if (isLockUserRecord) { // 请求下一页 if (canNextUserRecord) { getUserRecord(page++) isLockUserRecord = false } } } }) /************************************************** 我的记录 over ***************************************************/ /************************************************** 守护记录 start ***************************************************/ // 获取往轮游戏结果 let previousResults = [] const getPreviousResults = (count, roundId) => { networkRequest({ type: 'GET', url: urlPrefix + '/act/callBattle/listActInfo', data: { count, roundId }, success (res) { if (res.code === 200) { previousResults = res.data renderPreviousResults() } }, error (err) { toastMsg('網絡錯誤,請退出重進') } }) } // 渲染往轮游戏结果 const renderPreviousResults = () => { let str = '' previousResults.map((item, index) => { str += `
  • ${index ? index + 1 : '最近一次'}

    ${item.drawRestraintName}

    ${item.drawName}

  • ` }) $('.previous-result-list').html(str) $('.pupop-previous-result').show() $('body').css('overflow', 'hidden') } /************************************************** 守护记录 over ***************************************************/ /************************************************** 排行榜 start ***************************************************/ // 榜单类型,1是鉆石榜,2是欧皇榜 let type = 1 let pageSizeRank = 30 // 鉆石榜单 let pageD = 1 let myInfoD = [] let rankListD = [] // 欧皇榜单 let pageN = 1 let myInfoN = [] let rankListN = [] let clickTabCanNetworkN = true let isLockD = true let isLockN = true let isLock = true let canRequsetNextPageD = true let canRequsetNextPageN = true const getListRank = (type, page) => { networkRequest({ type: 'GET', url: urlPrefix + '/act/callBattle/listRank', data: { type, page, pageSize: pageSizeRank }, success (res) { if (res.code === 200) { if (type === 1) { // 鉆石榜单 rankListD.push(...res.data.rankList) myInfoD = res.data.myRankInfo renderMyInfo() renderRankList() isLockD = true } else { rankListN.push(...res.data.rankList) myInfoN = res.data.myRankInfo renderMyInfo() renderRankList() isLockN = true } } else { toastMsg(res.message) } }, error (err) { toastMsg('網絡錯誤') } }) } // 渲染底部个人信息 const renderMyInfo = () => { if (type === 1) { // 鉆石榜单 let erbanNo = myInfoD.erbanNo let myIndex = rankListD.findIndex((item, index) => { return item.erbanNo === erbanNo }) if (myIndex === -1) { $('.mine-rank').html('未上榜') } else { $('.mine-rank').html(myIndex + 1) } $('.mine-info').find('img').attr('src', myInfoD.avatar) if (myInfoD.nick) { myInfoD.nick.length > 5 ? myInfoD.nick.slice(0, 5) + '...' : myInfoD.nick } else { myInfoD.nick = '未知' } $('.mine-info').find('.mine-nick').html(myInfoD.nick) let tostr = myInfoD.num.toString() let num if (tostr.length >= 5) { num = (Math.floor((myInfoD.num / 100)) / 100).toFixed(2) + 'w' } else { num = myInfoD.num } $('.mine-diamond-num').html(num) } else { let erbanNo = myInfoN.erbanNo let myIndex = rankListN.findIndex((item, index) => { return item.erbanNo === erbanNo }) if (myIndex === -1) { $('.mine-rank').html('未上榜') } else { $('.mine-rank').html(myIndex + 1) } $('.mine-info').find('img').attr('src', myInfoN.avatar) if (myInfoN.nick) { myInfoN.nick.length > 5 ? myInfoN.nick.slice(0, 5) + '...' : myInfoN.nick } else { myInfoN.nick = '未知' } $('.mine-info').find('.mine-nick').html(myInfoN.nick) $('.mine-diamond-num').html('击退怪兽' + myInfoN.num + '次') } } // 渲染榜单信息 const renderRankList = () => { if (type === 1) { // 鉆石榜单 // 渲染前3 let topThreeArr = rankListD.slice(0, 3) if (rankListD.length < 3) { let len = 3 - rankListD.length let arr = new Array(len).fill({ nick: '虚位以待', avatar: './images/main/default.png', num: '' }) topThreeArr.push(...arr) } let topThreeStr = '' console.log('topThreeArr---', topThreeArr); topThreeArr.map((item, index) => { let tostr = item.num.toString() let num if (tostr.length >= 5) { num = (item.num / 10000).toFixed(2) + 'w' } else { num = item.num } topThreeStr += `

    ${item.nick.length > 4 ? item.nick.slice(0, 4) + '...' : item.nick}

    ${index ? `距上${num}` : ''}

    ` }) $('.topthree-wrap').html(topThreeStr) // 渲染非前3 let othersArr = rankListD.slice(3) let others = '' othersArr.map((item, index) => { let tostr = item.num.toString() let num if (tostr.length >= 5) { num = (item.num / 10000).toFixed(2) + 'w' } else { num = item.num } others += `
  • ${index + 4}
    ${item.nick.length > 5 ? item.nick.slice(0, 5) + '...' : item.nick}
    距上${num}
  • ` }) $('.other-rank').html(others) } else { // 欧皇榜单 // 渲染前3 let topThreeArr = rankListN.slice(0, 3) if (rankListN.length < 3) { let len = 3 - rankListN.length let arr = new Array(len).fill({ nick: '虚位以待', avatar: './images/main/default.png' }) topThreeArr.push(...arr) } let topThreeStr = '' topThreeArr.map((item) => { let num = '' if (item.erbanNo) { num = '击退怪兽' + item.num + '次' } topThreeStr += `

    ${item.nick.length > 4 ? item.nick.slice(0, 4) + '...' : item.nick}

    ${num}

    ` }) $('.topthree-wrap').html(topThreeStr) // 渲染非前3 let othersArr = rankListN.slice(3) console.log(othersArr); let others = '' othersArr.map((item, index) => { let num if (item.erbanNo) { num = '击退怪兽' + item.num + '次' } others += `
  • ${index + 4}
    ${item.nick.length > 5 ? item.nick.slice(0, 5) + '...' : item.nick}
    ${num}
  • ` }) $('.other-rank').html(others) } } /************************************************** 排行榜 over ***************************************************/ $(function () { getInfoFromClient() setTimeout(function () { getUserInfo() // getListItem() getNewestAct() getListPack() }, 50) // 跳转商城 $('.mall').click(() => { location.href = './mall.html' }) $('.mine-prop-num .add').click(() => { location.href = './mall.html' }) // 我的记录弹窗 $('.mine-record').click(() => { getUserRecord() }) // 怪兽进攻记录弹窗 $('.record').click(() => { getPreviousResults(50, roundId) }) // 排行榜弹窗 $('.rank').click(() => { getListRank(type, pageD) $('.popup-rank').show() $('body').css('overflow', 'hidden') }) // 排行榜弹窗tab点击 $('.tab-wrap').on('click', 'p', function () { if ($(this).index()) { $(this).find('img').attr('src', "./images/popup/rank-tab2-active.png") $(this).siblings().find('img').attr('src', "./images/popup/rank-tab1.png") } else { $(this).find('img').attr('src', "./images/popup/rank-tab1-active.png") $(this).siblings().find('img').attr('src', "./images/popup/rank-tab2.png") } if (type === $(this).index() + 1) return type = $(this).index() + 1 $('.other-rank').scrollTop(0) if (type === 1) { renderRankList() renderMyInfo() } else { if (clickTabCanNetworkN) { getListRank(type, pageN) } else { renderRankList() renderMyInfo() } clickTabCanNetworkN = false } }) // 关闭排名弹窗 $('.popup-rank').on('click', function () { $(this).hide() type = 1 pageD = 1 pageN = 1 myInfoD = [] myInfoN = [] rankListD = [] rankListN = [] clickTabCanNetworkN = true $('.other-rank').html('') $('.tab-wrap p').eq(0).find('img').attr('src', "./images/popup/rank-tab1-active.png") $('.tab-wrap p').eq(1).find('img').attr('src', "./images/popup/rank-tab2.png") $('body').css('overflow', 'auto') }) $('.rank-content').on('click', function (e) { e.stopPropagation() }) $('.tab-wrap').on('click', function (e) { e.stopPropagation() }) // 打开规则弹窗 let currentRuleWeaponIndex = 0 $('.rule').click(() => { restrainArr.map((item, index) => { $('.rule-weapon-wrap p').eq(index).find('img').attr('src', item.imgUrl) }) $('.rule-summon-weapon div img').attr('src', restrainArr[currentRuleWeaponIndex].imgUrl) $('.rule-summon-weapon p span').eq(0).html(restrainArr[currentRuleWeaponIndex].name) $('.rule-summon-weapon p span i').html(restrainArr[currentRuleWeaponIndex].multiple) $('.rule-summon-monster div img').attr('src', restrainArr[currentRuleWeaponIndex].restraintImageUrl) $('.rule-summon-monster span').html(restrainArr[currentRuleWeaponIndex].restraintName) $('.shade-mask').show() $('body').css('overflow', 'hidden') }) $('.rule-weapon-wrap').on('click', 'p', function () { let index = $(this).index() $(this).addClass('active').siblings().removeClass('active') currentRuleWeaponIndex = index $('.rule-summon-weapon div img').attr('src', restrainArr[index].imgUrl) $('.rule-summon-weapon p span').eq(0).html(restrainArr[index].name) $('.rule-summon-weapon p span i').html(restrainArr[index].multiple) $('.rule-summon-monster div img').attr('src', restrainArr[index].restraintImageUrl) $('.rule-summon-monster span').html(restrainArr[index].restraintName) }) // 召唤神器动图 let player = new SVGA.Player('.call-weapon'); let parser = new SVGA.Parser('.call-weapon'); parser.load('./images/call-weapon.svga', function (videoItem) { player.clearsAfterStop = false; player.setVideoItem(videoItem); player.startAnimation(); }) // 神器列表的点击 $('.weapon-wrap').on('click', 'p', function () { let index = $(this).index() currentWeaponIndex = index $(this).addClass('active').siblings().removeClass('active') // 渲染神器和怪兽名字和图片 $('.restrain .weapon-pic img').attr('src', restrainArr[index].imgUrl) $('.restrain .monster-pic img').attr('src', restrainArr[index].restraintImageUrl) $('.restrain .weapon-name').html(restrainArr[index].name) $('.restrain .monster-name').html(restrainArr[index].restraintName) // 切换时清空数量 $('.select-num .ipt-wrap input').val(0) $('.select-num .ipt-wrap main i').html(0) $('.select-num .ipt-wrap p i').html(0) restrainArr[index]['num'] = 0 isSelectWeapon = true }) // 选择数量 $('.select-num .increment').on('click', function () { if (!isSelectWeapon) { return toastMsg('请先选择神器') } restrainArr[currentWeaponIndex]['num']++ console.log(restrainArr[currentWeaponIndex]); let awardNum = restrainArr[currentWeaponIndex]['num'] * restrainArr[currentWeaponIndex]['multiple'] * 10 $('.select-num .ipt-wrap input').val(restrainArr[currentWeaponIndex]['num']) $('.select-num .ipt-wrap main i').html(restrainArr[currentWeaponIndex]['num']) $('.select-num .ipt-wrap p i').html(awardNum) }) $('.select-num .increment-ten').on('click', function () { if (!isSelectWeapon) { return toastMsg('请先选择神器') } restrainArr[currentWeaponIndex]['num'] += 10 let awardNum = restrainArr[currentWeaponIndex]['num'] * restrainArr[currentWeaponIndex]['multiple'] * 10 $('.select-num .ipt-wrap input').val(restrainArr[currentWeaponIndex]['num']) $('.select-num .ipt-wrap main i').html(restrainArr[currentWeaponIndex]['num']) $('.select-num .ipt-wrap p i').html(awardNum) }) $('.select-num .decrement').on('click', function () { if (!isSelectWeapon) { return toastMsg('请先选择神器') } restrainArr[currentWeaponIndex]['num']-- if (restrainArr[currentWeaponIndex]['num'] < 0) { toastMsg('数量不能少于0') restrainArr[currentWeaponIndex]['num'] = 0 return } let awardNum = restrainArr[currentWeaponIndex]['num'] * restrainArr[currentWeaponIndex]['multiple'] * 10 $('.select-num .ipt-wrap input').val(restrainArr[currentWeaponIndex]['num']) $('.select-num .ipt-wrap main i').html(restrainArr[currentWeaponIndex]['num']) $('.select-num .ipt-wrap p i').html(awardNum) }) $('.select-num .decrement-ten').on('click', function () { if (!isSelectWeapon) { return toastMsg('请先选择神器') } restrainArr[currentWeaponIndex]['num'] -= 10 if (restrainArr[currentWeaponIndex]['num'] < 0) { toastMsg('数量不能少于0') restrainArr[currentWeaponIndex]['num'] = parseInt($('.select-num .ipt-wrap input').val()) return } let awardNum = restrainArr[currentWeaponIndex]['num'] * restrainArr[currentWeaponIndex]['multiple'] * 10 $('.select-num .ipt-wrap input').val(restrainArr[currentWeaponIndex]['num']) $('.select-num .ipt-wrap main i').html(restrainArr[currentWeaponIndex]['num']) $('.select-num .ipt-wrap p i').html(awardNum) }) $('.select-num input').on('input', function () { if (!isSelectWeapon) { return toastMsg('请先选择神器') } let exp = /^[0-9]+$/ if (!exp.test($(this).val())) { $(this).val(0) return toastMsg('请输入数字') } restrainArr[currentWeaponIndex]['num'] = $(this).val() - 0 let awardNum = restrainArr[currentWeaponIndex]['num'] * restrainArr[currentWeaponIndex]['multiple'] * 10 $('.select-num .ipt-wrap input').val(restrainArr[currentWeaponIndex]['num']) $('.select-num .ipt-wrap main i').html(restrainArr[currentWeaponIndex]['num']) $('.select-num .ipt-wrap p i').html(awardNum) }) // 确认召唤 $('.confitm-btn').click(function () { if (!$(this).hasClass('active')) { return; } if (!isSelectWeapon) { return toastMsg('请先选择神器') } if ($('.select-num input').val() == 0) { return toastMsg('数量不能少于0') } if (parseInt(myFragment) < $('.select-num input').val()) { console.log('myFragment----', myFragment); console.log($('.select-num input').val()); let distance = $('.select-num input').val() - myFragment // let listArr = JSON.parse( window.sessionStorage.getItem('listMap')) // console.log(JSON.parse( window.sessionStorage.getItem('listMap') )); let packItem = {} let giveNum = '' if (distance == 1) { packItem = listMap[0] giveNum = 1 } else if (distance <= 10) { packItem = listMap[1] giveNum = '7~10' } else if (distance <= 100) { packItem = listMap[2] giveNum = '70~100' } else { packItem = listMap[3] giveNum = '700~1000' } console.log(packItem); $('.popup-not-enough .headwear-pic').attr('src', packItem.imgUrl) $('.popup-not-enough .headwear-name').html(packItem.name + '/天') $('.popup-not-enough .headwear-award').html(`获赠魔法石${giveNum}个`) $('.popup-not-enough .headwear-price span').html(packItem.sellingPrice) $('.popup-not-enough .diamond-num span').html(userDiamonds) $('.popup-not-enough .buy-btn').data('id', packItem.id) $('.popup-not-enough').show() return } // 每个标志位上的数量 restrainArr[currentWeaponIndex].costPieceNum += parseInt($('.select-num input').val()) $('.sign-wrap div').eq(currentWeaponIndex).find('img') .stop(true, true) .animate({ scale: 1.2 }, 200) .animate({ scale: 1 }, 200, function () { $('.sign-wrap div').eq(currentWeaponIndex).find('p').html('+' + restrainArr[currentWeaponIndex].costPieceNum).hide().fadeIn(200) setTimeout(() => { getUserInfo() }, 100) }) console.log('costPieceNum---', restrainArr[currentWeaponIndex].costPieceNum); console.log('id----', restrainArr[currentWeaponIndex].id); sendUserDrawInfo(restrainArr[currentWeaponIndex].id, $('.select-num input').val()) }) // let isSelectTopWeapon // 游戏区域神器的点击 $('.sign-wrap').on('click', 'div', function () { let index = $(this).index() currentWeaponIndex_top = index // 渲染神器和怪兽名字和图片 $('.popup-summon .summon-title span').html(restrainArr[index].name) $('.popup-summon .summon-weapon-pic').attr('src', restrainArr[index].imgUrl) $('.popup-summon .summon-monster-pic').attr('src', restrainArr[index].restraintImageUrl) $('.popup-summon .summon-weapon-name').html(restrainArr[index].name) $('.popup-summon .summon-monster-name').html(restrainArr[index].restraintName) $('.popup-summon .multiple span').html(restrainArr[index].multiple) $('.popup-summon .mine-prop-num span').html(myFragment) $('.popup-summon').show() }) // 弹窗的选择数量 $('.popup-select-num .increment').on('click', function () { // if (!isSelectTopWeapon) { // return toastMsg('请先选择神器') // } restrainArr[currentWeaponIndex_top]['num_top']++ console.log(restrainArr[currentWeaponIndex_top]); let awardNum = restrainArr[currentWeaponIndex_top]['num_top'] * restrainArr[currentWeaponIndex_top]['multiple'] * 10 $('.popup-select-num .ipt-wrap input').val(restrainArr[currentWeaponIndex_top]['num_top']) $('.popup-select-num .ipt-wrap main i').html(restrainArr[currentWeaponIndex_top]['num_top']) $('.popup-select-num .ipt-wrap p i').html(awardNum) }) $('.popup-select-num .increment-ten').on('click', function () { // if (!isSelectTopWeapon) { // return toastMsg('请先选择神器') // } restrainArr[currentWeaponIndex_top]['num_top'] += 10 console.log(restrainArr[currentWeaponIndex_top]); let awardNum = restrainArr[currentWeaponIndex_top]['num_top'] * restrainArr[currentWeaponIndex_top]['multiple'] * 10 $('.popup-select-num .ipt-wrap input').val(restrainArr[currentWeaponIndex_top]['num_top']) $('.popup-select-num .ipt-wrap main i').html(restrainArr[currentWeaponIndex_top]['num_top']) $('.popup-select-num .ipt-wrap p i').html(awardNum) }) $('.popup-select-num .decrement').on('click', function () { // if (!isSelectTopWeapon) { // return toastMsg('请先选择神器') // } restrainArr[currentWeaponIndex_top]['num_top']-- if (restrainArr[currentWeaponIndex_top]['num_top'] < 0) { toastMsg('数量不能少于0') restrainArr[currentWeaponIndex_top]['num_top'] = 0 return } let awardNum = restrainArr[currentWeaponIndex_top]['num_top'] * restrainArr[currentWeaponIndex_top]['multiple'] * 10 $('.popup-select-num .ipt-wrap input').val(restrainArr[currentWeaponIndex_top]['num_top']) $('.popup-select-num .ipt-wrap main i').html(restrainArr[currentWeaponIndex_top]['num_top']) $('.popup-select-num .ipt-wrap p i').html(awardNum) }) $('.popup-select-num .decrement-ten').on('click', function () { // if (!isSelectTopWeapon) { // return toastMsg('请先选择神器') // } restrainArr[currentWeaponIndex_top]['num_top'] -= 10 if (restrainArr[currentWeaponIndex_top]['num_top'] < 0) { toastMsg('数量不能少于0') restrainArr[currentWeaponIndex_top]['num_top'] = parseInt($('.popup-select-num .ipt-wrap input').val()) return } let awardNum = restrainArr[currentWeaponIndex_top]['num_top'] * restrainArr[currentWeaponIndex_top]['multiple'] * 10 $('.popup-select-num .ipt-wrap input').val(restrainArr[currentWeaponIndex_top]['num_top']) $('.popup-select-num .ipt-wrap main i').html(restrainArr[currentWeaponIndex_top]['num_top']) $('.popup-select-num .ipt-wrap p i').html(awardNum) }) $('.popup-select-num input').on('input', function () { // if (!isSelectWeapon) { // return toastMsg('请先选择神器') // } let exp = /^[0-9]+$/ if (!exp.test($(this).val())) { $(this).val(0) return toastMsg('请输入数字') } restrainArr[currentWeaponIndex_top]['num_top'] = $(this).val() - 0 let awardNum = restrainArr[currentWeaponIndex_top]['num_top'] * restrainArr[currentWeaponIndex_top]['multiple'] * 10 $('.popup-select-num .ipt-wrap input').val(restrainArr[currentWeaponIndex_top]['num_top']) $('.popup-select-num .ipt-wrap main i').html(restrainArr[currentWeaponIndex_top]['num_top']) $('.popup-select-num .ipt-wrap p i').html(awardNum) }) // 弹窗的确认召唤 $('.popup-confitm-btn').click(function () { if (!$(this).hasClass('active')) { return; } // if (!isSelectWeapon) { // return toastMsg('请先选择神器') // } if ($('.popup-select-num input').val() == 0) { return toastMsg('数量不能少于0') } if (parseInt(myFragment) < $('.popup-select-num input').val()) { console.log(1); let distance = $('.popup-select-num input').val() - myFragment // let listArr = JSON.parse( window.sessionStorage.getItem('listMap')) // console.log(JSON.parse( window.sessionStorage.getItem('listMap') )); let packItem = {} let giveNum = '' if (distance == 1) { packItem = listMap[0] giveNum = 1 } else if (distance <= 10) { console.log(2); packItem = listMap[1] giveNum = '7~10' } else if (distance <= 100) { packItem = listMap[2] giveNum = '70~100' } else { packItem = listMap[3] giveNum = '700~1000' } console.log(packItem); $('.popup-not-enough .headwear-pic').attr('src', packItem.imgUrl) $('.popup-not-enough .headwear-name').html(packItem.name + '/天') $('.popup-not-enough .headwear-award').html(`获赠魔法石${giveNum}个`) $('.popup-not-enough .headwear-price span').html(packItem.sellingPrice) $('.popup-not-enough .diamond-num span').html(userDiamonds) $('.popup-not-enough .buy-btn').data('id', packItem.id) // 召唤神器弹窗关闭 $('.popup-summon').hide() $('.popup-summon input').val(0) $('.popup-select-num .ipt-wrap main i').html(0) $('.popup-select-num .ipt-wrap p i').html(0) restrainArr[currentWeaponIndex_top]['num_top'] = 0 $('.popup-not-enough').show() return } // 每个标志位上的数量 restrainArr[currentWeaponIndex_top].costPieceNum += parseInt($('.popup-select-num input').val()) $('.sign-wrap div').eq(currentWeaponIndex_top).find('img') .stop(true, true) .animate({ scale: 1.2 }, 200) .animate({ scale: 1 }, 200, function () { $('.sign-wrap div').eq(currentWeaponIndex_top).find('p').html('+' + restrainArr[currentWeaponIndex_top].costPieceNum).hide().fadeIn(200) setTimeout(() => { getUserInfo() }, 100) }) console.log('costPieceNum---', restrainArr[currentWeaponIndex_top].costPieceNum); console.log('id----', restrainArr[currentWeaponIndex_top].id); sendUserDrawInfo(restrainArr[currentWeaponIndex_top].id, $('.popup-select-num input').val()) }) // 购买魔法石 $('.popup-not-enough .buy-btn').click(function () { networkRequest({ type: 'POST', url: urlPrefix + '/activity/pack/buy', data: { uid: pubInfo.uid, packId: $(this).data('id'), packNum: 1, ticket: pubInfo.ticket }, success (res) { if (res.code === 200) { $('.popup-not-enough').hide() toastMsg('购买成功!') getUserInfo(res.data) } else if (res.code === 2103) { $('.popup-not-enough').hide() $('.shade-mask-no-money').show() } else { toastMsg(res.message) } }, error (err) { toastMsg('網絡錯誤') } }) }) // 跳转充值 $('.no-money-recharge').on('click', function () { if (browser.app) { if (browser.android) { // window.androidJsObj.openChargePage() tools.nativeUtils.jumpAppointPage('RECHARGE_PAGE') } else if (browser.ios) { window.webkit.messageHandlers.openChargePage.postMessage(null) } } else { toastMsg('请在app内打开') } }) // 关闭弹窗 $('.popup-not-enough .close').click(() => { $('.popup-not-enough').hide() }) $('body').click(() => { $('.shade-mask-no-money').hide() }) $('.shade-content-no-money').click((e) => { e.stopPropagation() }) $('.popup-summon .close').click(() => { $('.popup-summon').hide() $('.popup-summon input').val(0) $('.popup-select-num .ipt-wrap main i').html(0) $('.popup-select-num .ipt-wrap p i').html(0) restrainArr[currentWeaponIndex_top]['num_top'] = 0 }) $('.popup-record-list .close').click(() => { page = 1; recordList = []; $('.wrap .popup-record-list .record-list-content ul li').remove(); $('.wrap .popup-record-list .record-list-content ul').scrollTop(0); $('.popup-record-list').hide(); $('body').css('overflow', 'auto') }) $('.pupop-previous-result .close').click(() => { $('.pupop-previous-result').hide() $('body').css('overflow', 'auto') }) $('.shade-mask .close').click(() => { $('.shade-mask').hide() $('body').css('overflow', 'auto') }) }) // 安卓去到后台或者锁屏后再回来倒计时不准确 let leftTime, deltaTime, startTime1, endTime1 document.addEventListener('visibilitychange', function () { if (browser.android) { if (document.visibilityState == 'hidden') { leftTime = countDownTime startTime1 = new Date().getTime() } else if (document.visibilityState == 'visible') { endTime1 = new Date().getTime() deltaTime = Math.floor((endTime1 - startTime1) / 1000) //出去了多久 if (deltaTime > 3000) { window.location.reload() } countDownTime = leftTime - deltaTime if (countDownTime < 0) { countDownTime = 0 } $countDown.html(countDownTime + 'S') } } }) //返回页面 重新请求接口 var hiddenProperty = 'hidden' in document ? 'hidden' : 'webkitHidden' in document ? 'webkitHidden' : 'mozHidden' in document ? 'mozHidden' : null; var visibilityChangeEvent = hiddenProperty.replace(/hidden/i, 'visibilitychange'); var onVisibilityChange = function () { if (!document[hiddenProperty]) { location.reload(); } } document.addEventListener(visibilityChangeEvent, onVisibilityChange);