let urlPrefix = getUrlPrefix()
let browser = checkVersion()
let env = EnvCheck();
if (env == 'test') {
    new VConsole();
}
// 封裝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'
    })
}
var diamonds = 0;//存储当前用户钻石余额
var gearPosition = 100;//当前档位;
var roundId;//当前进行轮的roundId;
var timer;//定时器存储
var countupTimes;//存储每个阶段倒计时剩余时间戳;
var userComeinTime, startTime, drawStageStartTime, showResultStageStartTime, endTime;
var circulate = 0;//等待开奖中动效计时
var circulateTime;//存储开奖中动效计时器
// 榜單類型，1是鉆石榜，2是歐皇榜
let type = 1
let pageSize = 20
// 鉆石榜單
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
$(function () {
    getInfoFromClient()
    setTimeout(function () {
        getNewestAct();
        getUserInfo();
    }, 100)
})
// 獲取用戶相關信息
function getUserInfo () {
    networkRequest({
        type: 'GET',
        url: urlPrefix + '/act/luckySea/getUserActInfo',
        success (res) {
            if (res.code === 200) {
                diamonds = res.data.diamonds;
                $('.my .right b').text(`今日獎勵: ${unitProcessing(res.data.todayReward, 100000, 1, 'w')}`);
                $('.my .left b').text(`鉆石余額: ${unitProcessing(res.data.diamonds, 100000, 1, 'w')}`);
            } else {
                toastMsg(res.message)
                return
            }
        },
        error (err) {
            toastMsg('網絡錯誤，請退出重進')
        }
    })
}
// 获取最新一次的深海奇缘活动信息
function getNewestAct () {
    showLoading()
    networkRequest({
        type: 'GEt',
        url: urlPrefix + '/act/luckySea/getNewestAct',
        data: { count: 10 },
        success (res) {
            if (res.code === 200) {
                // 处理往轮结果传参
                roundId = res.data.roundId;
                listLuckySeaActInfo(roundId);
                if ($.isEmptyObject(res.data) || res.data.status === 4) {
                    return showLoading('服務器正在維護中...')
                } else {
                    if (res.timestamp >= res.data.endTime) { //請求的還是上一輪的數據，重新請求
                        console.log('請求的還是上一輪的數據，必須重新請求');
                        showLoading()
                        timer = setTimeout(() => {
                            getNewestAct()
                        }, 600);
                    } else {//活动状态(1: 选择阶段 2:正在开奖 3:已经开奖)
                        userComeinTime = res.timestamp
                        startTime = res.data.startTime
                        drawStageStartTime = res.data.drawStageStartTime
                        showResultStageStartTime = res.data.showResultStageStartTime
                        endTime = res.data.endTime
                        clearInterval(circulateTime);
                        listItem(roundId);
                        if (startTime <= userComeinTime && userComeinTime < drawStageStartTime) {
                            // 第一阶段
                            console.log("第一阶段");
                            countupTimes = Math.floor(((drawStageStartTime - startTime) - (userComeinTime - startTime)) / 1000 + 1);
                            countup(1);
                            $('.masks').hide();
                            $('.result_popup').hide();
                        } else if (drawStageStartTime <= userComeinTime && userComeinTime < showResultStageStartTime) {
                            // 第二阶段
                            console.log("第二阶段");
                            countupTimes = Math.floor(((showResultStageStartTime - drawStageStartTime) - (userComeinTime - drawStageStartTime)) / 1000 + 1);
                            countup(2);
                            circulateTime = setInterval(function () {
                                circulate = circulate > 8 ? 0 : circulate;
                                circulate++;
                                $('.box .box_in .sBox .sBox1').removeClass('sBox_active');
                                $(`.box .box_in .item${circulate} .sBox1`).addClass('sBox_active');
                                $('.box .box_in .sBox .qp').hide();
                                $('.masks').show();
                            }, 100);
                        } else if (showResultStageStartTime <= userComeinTime && userComeinTime < endTime) {
                            // 第三阶段
                            console.log("第三阶段");
                            countupTimes = Math.floor(((endTime - showResultStageStartTime) - (userComeinTime - showResultStageStartTime)) / 1000 + 1);
                            countup(3);
                            // 渲染本轮结果
                            var str = '';
                            $('.result_popup .result_popup_in .resultList li').remove();
                            res.data.drawItemList.forEach(res => {
                                str += `
                                    <li>
                                        <img src="${res.drawName == '洋蔥' ? './images/1.png' : res.drawName == '番茄' ? './images/2.png' : res.drawName == '蘑菇' ? './images/3.png' : res.drawName == '土豆' ? './images/4.png' : res.drawName == '大閘蟹' ? './images/5.png' : res.drawName == '魚' ? './images/6.png' : res.drawName == '雞肉' ? './images/7.png' : res.drawName == '龍蝦' ? './images/8.png' : res.drawImageUrl}" alt="">
                                        <div class="name">${res.drawName}</div>
                                    </li>
                                `
                            })
                            $('.result_popup .result_popup_in .resultList').append(str);
                            // 渲染本轮投入和产出
                            var costPieceNum = 0;
                            res.data.userDrawResult.drawRecords.forEach((res, i) => {
                                costPieceNum = costPieceNum + res.costPieceNum;
                            })
                            $('.result_popup .result_popup_in .income .p1 b').text(costPieceNum);
                            $('.result_popup .result_popup_in .income .p2 b').text(res.data.userDrawResult.prizeDiamonds);
                            // 處理前三
                            var top3 = res.data.rankUserList.slice(0, 3);
                            if (top3.length < 3) {
                                let arr = new Array(3 - top3.length).fill({
                                    avatar: './images/logo.png',
                                    nick: '虛位以待',
                                    prizeDiamonds: ""
                                })
                                top3.push(...arr)
                            }
                            // 渲染前三
                            top3.forEach((res, i) => {
                                $(`.result_popup .result_popup_in .no .no${i + 1} .tx`).attr('src', res.avatar);
                                $(`.result_popup .result_popup_in .no .no${i + 1} .tx`).attr('uid', res.uid);
                                $(`.result_popup .result_popup_in .no .no${i + 1} .name`).text(res.nick);
                                $(`.result_popup .result_popup_in .no .no${i + 1} p b`).text(res.prizeDiamonds);
                            })
                            $('.result_popup').show();
                        }
                    }
                }
            } else {
                toastMsg(res.message)
            }
            hideLoading(layerIndex)
        },
        error (err) {
            hideLoading(layerIndex)
            toastMsg('網絡錯誤，請退出重進')
        }
    })
}
// 倒計時
function countup (status) {
    timer = setInterval(() => {
        countupTimes--
        if (countupTimes <= 0) {
            if (status == 1) {
                $('.box .boxTitle').html(`請選擇：<b>${countupTimes}</b> 秒`);
            } else if (status == 2) {
                circulate = 0;
                $('.box .boxTitle').html(`开奖中：<b>${countupTimes}</b> 秒`);
            } else {
                $('.box .boxTitle').html(`下一轮：<b>${countupTimes}</b> 秒`);
                $('.result_popup .result_popup_in .result_popup_inTitle b').html(`${countupTimes}`);
            }
            getNewestAct();
            clearInterval(timer);
        } else {
            if (status == 1) {
                $('.box .boxTitle').html(`請選擇：<b>${countupTimes}</b> 秒`);
            } else if (status == 2) {
                $('.box .boxTitle').html(`开奖中：<b>${countupTimes}</b> 秒`);
            } else {
                $('.box .boxTitle').html(`下一轮：<b>${countupTimes}</b> 秒`);
                $('.result_popup .result_popup_in .result_popup_inTitle b').html(`${countupTimes}`);
            }
        }

    }, 1000);
}
// 渲染抽奖列表
function listItem (roundId) {
    showLoading()
    networkRequest({
        type: 'GEt',
        url: urlPrefix + '/act/luckySea/listItem',
        data: { roundId },
        success (res) {
            if (res.code === 200) {
                res.data.forEach((res, i) => {
                    $(`.box .box_in .item${i + 1}`).attr('id', res.id);
                    $(`.box .box_in .item${i + 1} .sBox1 img`).attr('src', res.name == '洋蔥' ? './images/1.png' : res.name == '番茄' ? './images/2.png' : res.name == '蘑菇' ? './images/3.png' : res.name == '土豆' ? './images/4.png' : res.name == '大閘蟹' ? './images/5.png' : res.name == '魚' ? './images/6.png' : res.name == '雞肉' ? './images/7.png' : res.name == '龍蝦' ? './images/8.png' : res.imgUrl);
                    $(`.box .box_in .item${i + 1} .qp p b`).text(res.costPieceNum);
                    $(`.box .box_in .item${i + 1} .bei`).text('x' + res.multiple);
                    $(`.box .box_in .item${i + 1} .SboxText`).text(res.name);
                    if (res.costPieceNum > 0) {
                        $(`.box .box_in .item${i + 1} .qp`).show();
                        $(`.box .box_in .item${i + 1} .sBox1 `).addClass('sBox_active');
                    } else {
                        $(`.box .box_in .item${i + 1} .qp`).hide();
                        $(`.box .box_in .item${i + 1} .sBox1 `).removeClass('sBox_active');
                    }
                })
                $('.box .box_in .sBox').show();
            } else {
                toastMsg(res.message)
            }
            hideLoading(layerIndex)
        },
        error (err) {
            hideLoading(layerIndex)
            toastMsg('網絡錯誤，請退出重進')
        }
    })
}
// 获取往轮结果
function listLuckySeaActInfo (roundId) {
    showLoading()
    networkRequest({
        type: 'GEt',
        url: urlPrefix + '/act/luckySea/listLuckySeaActInfo',
        data: { count: 10, roundId },
        success (res) {
            if (res.code === 200) {
                res.data.forEach((res, i) => {
                    if (res.drawItemList.length > 1) {
                        if (res.drawName == '荤菜狂欢') {
                            $(`.resultOut .sqp_in${i + 1} `).attr('src', './images/rou.png');
                        } else {
                            $(`.resultOut .sqp_in${i + 1} `).attr('src', './images/su.png');
                        }
                    } else {
                        // $(`.resultOut .sqp_in${i + 1} `).attr('src', res.drawItemList[0].drawImageUrl);
                        $(`.resultOut .sqp_in${i + 1} `).attr('src', res.drawItemList[0].drawName == '洋蔥' ? './images/1.png' : res.drawItemList[0].drawName == '番茄' ? './images/2.png' : res.drawItemList[0].drawName == '蘑菇' ? './images/3.png' : res.drawItemList[0].drawName == '土豆' ? './images/4.png' : res.drawItemList[0].drawName == '大閘蟹' ? './images/5.png' : res.drawItemList[0].drawName == '魚' ? './images/6.png' : res.drawItemList[0].drawName == '雞肉' ? './images/7.png' : res.drawItemList[0].drawName == '龍蝦' ? './images/8.png' : res.drawItemList[0].drawImageUrl);
                    }
                });
                $('.resultOut .sqp_in').show();
            } else {
                toastMsg(res.message)
            }
            hideLoading(layerIndex)
        },
        error (err) {
            hideLoading(layerIndex)
            toastMsg('網絡錯誤，請退出重進')
        }
    })
}
// 档位切换
$('.box .tab div').click(function () {
    var i = $(this).index() + 1;
    $(this).addClass('active').siblings().removeClass('active');
    gearPosition = i == 1 ? 100 : i == 2 ? 1000 : 10000;
})
// 抽奖接口
function draw (itemId, tais) {
    // showLoading()
    networkRequest({
        type: 'POST',
        url: urlPrefix + '/act/luckySea/draw',
        data: { itemId, num: gearPosition },
        success (res) {
            if (res.code === 200) {
                listItem(roundId);
                getUserInfo();
            } else {
                toastMsg(res.message)
            }
            hideLoading(layerIndex)
        },
        error (err) {
            hideLoading(layerIndex)
            toastMsg('網絡錯誤，請退出重進')
        }
    })
}
// 选择食材按钮
$('.box .box_in .sBox').click(function () {
    var id = $(this).attr('id');
    draw(id, $(this));
})
// 去充值按钮
$('.my div .add').click(function () {
    if (browser.app) {
        if (browser.android) {
            let channel = pubInfo.deviceInfo.channel;
            console.log(pubInfo.deviceInfo);
            if (channel == "google") {
                window.androidJsObj.openChargePage(6);
            } else {
                window.androidJsObj.openChargePage(6);
                window.location.href = urlPrefix + '/peko/modules/pay/index.html?channelType=4';
            }
        } else if (browser.ios) {
            let channel = pubInfo.deviceInfo.channel;
            if (channel == "appstore") {
                window.webkit.messageHandlers.openChargePage.postMessage(null);
            } else {
                window.webkit.messageHandlers.chargePayClickPage.postMessage(6);
                window.location.href = urlPrefix + '/peko/modules/pay/index.html?channelType=4';
            }
        }
    } else {
        toastMsg('請在app內打開')
    }
})
// 打开规则弹窗
$('.header .rule_icon').click(function () {
    $('.shade-mask').show()
})
// 关闭规则弹窗
$('.shade-mask').click(function () {
    $('.shade-mask').hide()
})
// 打开游戏记录
$('.header .record_icon').click(function () {
    window.location.href = './record.html'
})
// 关闭排行榜
$('.shade-mask-rank').click(function () {
    $('.shade-mask-rank').hide()
    return false;
})
// 監聽今日排名按鈕點擊事件
$('.header .rank_icon').click(function () {
    getListRank(type, pageD)
    $('.shade-mask-rank').show()
})
// 監聽今日排名tab
$('.tab-wrap').on('click', 'span', function () {
    $(this).addClass('active').siblings().removeClass('active')
    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
    }

    return false;
})
function getListRank (type, page) {
    networkRequest({
        type: 'GET',
        url: urlPrefix + '/act/luckySea/listRank',
        data: {
            type,
            page,
            pageSize
        },
        success (res) {
            if (res.code === 200) {
                if (type === 1) {
                    // 鉆石榜單
                    if (res.data.rankList.length === pageSize) {
                        // 可以請求下一頁
                        canRequsetNextPageD = true
                    } else {
                        // 不再請求下一頁
                        canRequsetNextPageD = false
                    }
                    rankListD.push(...res.data.rankList)
                    myInfoD = res.data.myRankInfo
                    renderMyInfo()
                    renderRankList()
                    isLockD = true
                } else {
                    if (res.data.rankList.length === pageSize) {
                        // 可以請求下一頁
                        canRequsetNextPageN = true
                    } else {
                        // 不再請求下一頁
                        canRequsetNextPageN = false
                    }
                    rankListN.push(...res.data.rankList)
                    myInfoN = res.data.myRankInfo
                    renderMyInfo()
                    renderRankList()
                    isLockN = true
                }
            } else {
                toastMsg(res.message)
            }
        },
        error (err) {
            toastMsg('網絡錯誤')
        }
    })
}
// 渲染底部個人信息
function 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 = (myInfoD.num / 10000).toFixed(2) + 'w'
        } else {
            num = myInfoD.num
        }
        // $('.mine-diamond-num').html('今日獎勵' + num)
        $('.mine-diamond-num').html(num == 0 ? '—— ——' : 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('猜中<b> ' + myInfoN.num + ' </b>次')
    }
}
// 渲染榜單信息
function renderRankList () {
    if (type === 1) {
        // 鉆石榜單
        // 渲染前3      
        let topThreeArr = rankListD.slice(0, 1)
        if (rankListD.length === 0) {
            let len = 1 - rankListD.length
            let arr = new Array(len).fill({
                nick: '虛位以待',
                avatar: './images/default.png',
                num: ''
            })
            topThreeArr.push(...arr)
        }
        let topThreeStr = ''
        topThreeArr.map((item) => {
            let tostr = item.num.toString()
            let num
            if (tostr.length >= 5) {
                num = (item.num / 10000).toFixed(2) + 'w'
            } else {
                num = item.num
            }

            topThreeStr = `
                <div class="info-wrap" uid="${item.uid}">
                    <div class="avatar">
                        <p></p>
                        <img src="${item.avatar}" alt="">
                    </div>
                    <p class="diamond-num">${num}</p>
                    <p class="nick">${item.nick.length > 5 ? item.nick.slice(0, 5) + '...' : item.nick}</p>
                </div>
            `
        })
        $('.topthree-wrap').html(topThreeStr)
        $('.topthree-wrap .info-wrap').click(function () {
            let uid = $(this).attr('uid')
            openPerson(uid)
        })


        // 渲染非前3
        let othersArr = rankListD.slice(1)
        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 += `
                <li uid="${item.uid}">
                    <span class="index">${index + 2}</span>
                    <div class="others-info">
                        <img src="${item.avatar}" alt="">
                        <span class="others-nick">${item.nick.length > 5 ? item.nick.slice(0, 5) + '...' : item.nick}</span>
                    </div>
                    <span class="others-diamond-num">${num}</span>
                </li>
            `
        })
        $('.other-rank').html(others)
        $('.other-rank li').click(function () {
            let uid = $(this).attr('uid')
            openPerson(uid)
        })
    } else {
        // 歐皇榜單
        // 渲染前3
        let topThreeArr = rankListN.slice(0, 1)
        if (rankListN.length === 0) {
            let len = 1 - rankListN.length
            let arr = new Array(len).fill({
                nick: '虛位以待',
                avatar: './images/default.png'
            })
            topThreeArr.push(...arr)
        }
        let topThreeStr = ''
        topThreeArr.map((item) => {
            let num = ''
            if (item.erbanNo) {
                num = '猜中' + item.num + '次'
            }
            topThreeStr = `
                <div class="info-wrap" uid="${item.uid}">
                    <div class="avatar">
                        <p></p>
                        <img src="${item.avatar}" alt="">
                    </div>
                    <p class="diamond-num" style="display:block">${num}</p>
                    <p class="nick">${item.nick.length > 5 ? item.nick.slice(0, 5) + '...' : item.nick}</p>
                </div>
            `
        })
        $('.topthree-wrap').html(topThreeStr)
        $('.topthree-wrap .info-wrap').click(function () {
            let uid = $(this).attr('uid')
            openPerson(uid)
        })

        // 渲染非前3
        let othersArr = rankListN.slice(1)
        console.log(othersArr);
        let others = ''
        othersArr.map((item, index) => {
            let num
            if (item.erbanNo) {
                num = '猜中<b> ' + item.num + ' </b>次'
            }
            others += `
                <li uid="${item.uid}">
                    <span class="index">${index + 2}</span>
                    <div class="others-info">
                        <img src="${item.avatar}" alt="">
                        <span class="others-nick">${item.nick.length > 5 ? item.nick.slice(0, 5) + '...' : item.nick}</span>
                    </div>
                    <span class="others-diamond-num">${num}</span>
                </li>
            `
        })
        $('.other-rank').html(others)
        $('.other-rank li').click(function () {
            let uid = $(this).attr('uid')
            openPerson(uid)
        })
    }

}
// 取消余额不足弹窗
$('.cancel-btn').click(function () {
    $('.shade-mask-fragmentNum').hide();
})
// 取消余额不足跳转弹窗按钮
$('.shade-mask-fragmentNum .shade-content-fragmentNum .fragmentNum-btn-wrap .confirm-btn').click(function () {
    if (browser.app) {
        if (browser.android) {
            let channel = pubInfo.deviceInfo.channel;
            console.log(pubInfo.deviceInfo);
            if (channel == "google") {
                window.androidJsObj.openChargePage(6);
            } else {
                window.androidJsObj.openChargePage(6);
                window.location.href = urlPrefix + '/peko/modules/pay/index.html?channelType=4';
            }
        } else if (browser.ios) {
            let channel = pubInfo.deviceInfo.channel;
            if (channel == "appstore") {
                window.webkit.messageHandlers.openChargePage.postMessage(null);
            } else {
                window.webkit.messageHandlers.chargePayClickPage.postMessage(6);
                window.location.href = urlPrefix + '/peko/modules/pay/index.html?channelType=4';
            }
        }
    } else {
        toastMsg('請在app內打開')
    }
    $('.shade-mask-fragmentNum').hide()
})