/** @format */
import {UI} from '../enums/UI'
import {BaseUI} from './BaseUI'
import {Data, Mgr} from '../GameControl'
import {ccUtils} from '../utils/ccUtils'
import {observer, render, node, label, editBox, list} from '../mobx/observer'
import List from '../uiutils/List'
import {idNum} from '../proto/typedef'
import {EVENT} from '../enums/Enum'
import {GoodsConfig} from '../config/GoodsConfig'
import {CenterGridCell} from '../cell/CenterGridCell'
import {IReward, IRewardNty, ItemUICfg} from '../interface/UIInterface'
import {SOUND} from '../enums/Sound'

const {ccclass, property} = cc._decorator

@ccclass
@observer
export class RewardUI extends BaseUI {
    @list('goodsList')
    goodsList: List
    @node('centerGird')
    centerGirdNode: cc.Node
    @node('bottom_obtain')
    bgFrame: cc.Node
    @node('streamer_title')
    title: cc.Node
    @node('quickShow')
    quickShow: cc.Node
    goods: idNum[] = []
    itemUICfgArr: ItemUICfg[]
    centerNodes: cc.Node[]
    curShowNodes: cc.Node[] //当前界面显示的物品
    defaultIntervalTime: number = 0.15 //每个物品显示的间隔时间
    curIntervalTime: number = this.defaultIntervalTime //当前每个物品显示的间隔时间

    async onShow(args: IReward, fromUI: number) {
        this.curIntervalTime = this.defaultIntervalTime
        this.quickShow.active = true
        Mgr.audio.playSFX(SOUND.reward)
        this.goods = args.idNumArr
        this.itemUICfgArr = args.itemUICfgArr
        let centerGird: CenterGridCell = this.centerGirdNode.getComponent(CenterGridCell)
        let showList = this.goods.length > centerGird.getMaxNum()
        this.goodsList.node.active = showList
        this.centerGirdNode.active = !showList
        let nodes: cc.Node[]
        this.centerNodes = []
        if (showList) {
            this.goodsList.numItems = this.goods.length
            nodes = this.goodsList.getInsideItem()
        } else {
            nodes = centerGird.init(this.goods.length)
            nodes.forEach((v, index) => {
                v['goodsID'] = this.goods[index].id
                let itemUICfg: ItemUICfg =
                    this.itemUICfgArr && this.itemUICfgArr[index] ? this.itemUICfgArr[index] : {showDetails: true}
                Mgr.goods.initOneGoods(this.goods[index], cc.find('goods', v), this, itemUICfg)
                Mgr.goods.showRectAni(v, v['goodsID'], this)
            })
            this.centerNodes = nodes
        }
        this.curShowNodes = nodes
        if (nodes[0] && nodes[0].active) {
            for (let i = 0; i < nodes.length; i++) {
                cc.find('goods', nodes[i]).active = false
                cc.find('light_effect_2', nodes[i]).active = false
                cc.find('rectAni', nodes[i]).opacity = 0
            }
        }
        let t = cc.tween
        this.bgFrame.stopAllActions()
        this.bgFrame.scaleY = 0.7
        this.title.stopAllActions()
        this.title.scale = 1
        t(this.bgFrame)
            .then(t().to(0.1, {scaleY: 1}))
            .start()
        t(this.title)
            .then(t().to(0.1, {scale: 1.2}).to(0.1, {scale: 1}).union())
            .start()
        t(this.bgFrame)
        for (let i = 0; i < nodes.length; i++) {
            let aniNode = cc.find('goods', nodes[i])
            let rectAni = cc.find('rectAni', nodes[i])
            let lightNode = cc.find('light_effect_2', nodes[i])
            aniNode.active = true
            lightNode.active = true
            aniNode.stopAllActions()
            lightNode.stopAllActions()
            aniNode.scale = 0
            lightNode.width = 0
            lightNode.height = 0
            lightNode.opacity = 255
            await new Promise(resolve => {
                setTimeout(resolve, this.curIntervalTime * 1000)
            })
            t(aniNode)
                .then(t().to(0.25, {opacity: 255, scale: 0.9}))
                .call(() => {
                    rectAni.opacity = 255
                })
                .start()
            t(lightNode)
                .then(t().to(0.25, {width: 190, height: 190}).to(0.2, {opacity: 0}).union())
                .start()
            if (i >= nodes.length - 1) {
                this.quickShow.active = false
            }
        }
    }

    initGoodsItem(node: cc.Node, index: number) {
        node['goodsID'] = this.goods[index].id
        let itemUICfg: ItemUICfg =
            this.itemUICfgArr && this.itemUICfgArr[index] ? this.itemUICfgArr[index] : {showDetails: true}
        Mgr.goods.initOneGoods(this.goods[index], cc.find('goods', node), this, itemUICfg)
        Mgr.goods.showRectAni(node, node['goodsID'], this)
    }

    onHide() {
        //防止RewardUI被重复打开两次，会执行onHide再执行onShow
        if (!this.curShowNodes || !this.goods) return
        for (let i = 0; i < this.curShowNodes.length; i++) {
            cc.find('goods', this.curShowNodes[i]).active = false
            cc.find('light_effect_2', this.curShowNodes[i]).active = false
        }
        this.goods.forEach(idNum => {
            let nodes = this.centerNodes.length > 0 ? this.centerNodes : this.goodsList.content.children
            let node = nodes.find(v => v['goodsID'] == idNum.id)
            if (!node) return
            let starPos = ccUtils.convertToWorldSpaceCanvasAR(node)
            let minY = this.goodsList.node.y - this.goodsList.node.height / 2
            if (starPos.y < minY) starPos.y = minY
            Mgr.goods.flyGoods(idNum.id, starPos, () => {
                Mgr.event.trigger(EVENT.goodsChangeSync, idNum.id, idNum.num)
            })
        })
        this.goods.length = 0
        if (!Mgr.global.tryOpenNextReadyBox()) Mgr.event.trigger(EVENT.mainPopAnyUI)
    }

    //第一次快速显示、然后再次点击触发quickClose
    quickShowItem(event) {
        this.curIntervalTime = 0
        this.quickShow.active = false
    }
}