import { WALLET_SHOW_ACCOUNT_LIST, WALLET_SHOW_QR } from "../common/WalletEvent";
import ChainTab from "./ChainTab";
import { IQRCfg } from "./comp/QRCodeComp";
import ListNode from "./ListNode";
import WalletBase from "./WallerBase";

const {ccclass, property} = cc._decorator;

@ccclass
export default class WalletMainPanel extends WalletBase {
    
    @property({
        type: ChainTab
    })
    chainTab: ChainTab = null

    @property({
        type: ListNode
    })
    listNode: ListNode = null

    @property(cc.Prefab)
    menuPreb: cc.Prefab = null

    @property(cc.Prefab)
    accountPreb: cc.Prefab = null

    @property(cc.Prefab)
    qrPreb: cc.Prefab = null

    subNodeMap: Map<string, cc.Node> = new Map()


    // LIFE-CYCLE CALLBACKS:

    // onLoad () {}

    start () {
        super.start()
        this.wallet.uiHandlers.on(WALLET_SHOW_QR, this.showQrNode.bind(this))
        this.wallet.uiHandlers.on(WALLET_SHOW_ACCOUNT_LIST, this.showAccountList.bind(this))
    }

    // update (dt) {}
    
    hideWallet() {
        this.node.active = false
    }

    updateChainList() {
        const chains = this.wallet.chainList
        if (!chains || chains.length === 0) {
            return;
        }
        for (const chain of chains) {

        }
    }
    private fetchNode(tag: string, preb: cc.Prefab) {
        if (!this.subNodeMap.has(tag)) {
            const node = cc.instantiate(preb)
            node.x = 0
            node.y = 0
            this.node.addChild(node)
            this.subNodeMap.set(tag, node)
        }
        return this.subNodeMap.get(tag)
    }

    onMenuClick() {
        const tag = 'menu-node'
        const node = this.fetchNode(tag, this.menuPreb)
        node.active = true
    }

    showQrNode(data: IQRCfg) {
        const tag = 'qr-node'
        const node = this.fetchNode(tag, this.qrPreb)
        node.getComponent('QrNode').showQr(data)
        node.active = true
    }

    showAccountList() {
        const tag = 'account-list-node'
        const node = this.fetchNode(tag, this.accountPreb)
        node.active = true
    }
}