import {
    all_ItemConfig,
    playerConfig,
    skillConfig,
} from "../../game/gameConfig";
import NetManage, { getItemList } from "../../manages/NetManage";

import { UIUpdateHero } from "../Academy/UIUpdateHero";
import { UIBase } from "../UIBase";
import { uimanger, UIManger } from "../UIManger";

const { ccclass, property } = cc._decorator;

@ccclass
export class UIHeroinfo extends UIBase {
    @property(cc.Node) basicPage: cc.Node = null;
    @property(cc.Node) SkillsPage: cc.Node = null;
    @property(cc.Node) FilesPage: cc.Node = null;

    @property(cc.Node) heroTypeImg: cc.Node = null;
    @property(cc.Label) labName: cc.Label = null;
    @property(sp.Skeleton) heroSpine: sp.Skeleton = null;

    // basic
    @property(cc.Node) arrow_up: cc.Node = null;
    @property(cc.Node) arrow_down: cc.Node = null;
    @property(cc.ScrollView) infoScrollview: cc.ScrollView = null;
    // files
    @property(cc.Node) arrow_up_files: cc.Node = null;
    @property(cc.Node) arrow_down_files: cc.Node = null;
    @property(cc.ScrollView) infoScrollview_files: cc.ScrollView = null;

    // lab
    @property(cc.Label) lab_hp: cc.Label = null;
    @property(cc.Label) lab_returnBlood: cc.Label = null;
    @property(cc.Label) lab_attack: cc.Label = null;
    @property(cc.Label) lab_defence: cc.Label = null;
    @property(cc.Label) lab_speed: cc.Label = null;
    @property(cc.Label) lab_range: cc.Label = null;
    @property(cc.Label) lab_rateoffire: cc.Label = null;
    @property(cc.Label) lab_clip: cc.Label = null;
    @property(cc.Label) lab_vision: cc.Label = null;
    @property(cc.Label) lab_reload: cc.Label = null;

    @property(cc.Label) lab_lucky: cc.Label = null;
    @property(cc.Label) lab_successrate: cc.Label = null;

    // left btns
    @property(cc.Node) baseBtn: cc.Node = null;
    @property(cc.Node) skillBtn: cc.Node = null;
    @property(cc.Node) infoBtn: cc.Node = null;

    // skilss
    @property(cc.Node) icons: cc.Node = null;
    @property(cc.Label) skillDesc: cc.Label = null;

    // files info
    @property(cc.Label) infoName: cc.Label = null;
    @property(cc.Label) infoGender: cc.Label = null;
    @property(cc.Label) infoHeight: cc.Label = null;
    @property(cc.Label) infoBirth: cc.Label = null;
    @property(cc.Label) infoHobby: cc.Label = null;
    @property(cc.Label) infojob: cc.Label = null;
    @property(cc.Label) infoAnim: cc.Label = null;
    @property(cc.Label) infoSay: cc.Label = null;
    @property(cc.Label) infoStory: cc.Label = null;

    // buy
    @property(cc.Node) buyNode: cc.Node = null;
    @property(cc.Node) skinHead: cc.Node = null;
    @property(cc.Label) diamondNum: cc.Label = null;
    @property(cc.Label) goldNum: cc.Label = null;
    @property(cc.Node) buyBtn: cc.Node = null;

    @property(cc.Prefab) buyHero: cc.Prefab = null;

    @property(cc.ProgressBar) limitBar:cc.ProgressBar = null;

    @property(cc.Label) cegget:cc.Label = null;

    private hero_id = 0;
    private allSkins = [];
    private curentBuyId = 0;

    protected update(dt: number): void {
        if (this.infoScrollview.getScrollOffset().y <= 0) {
            this.arrow_down.active = true;
            this.arrow_up.active = false;
        } else {
            this.arrow_up.active = true;
            this.arrow_down.active = false;
        }
        //
        if (this.infoScrollview_files.getScrollOffset().y <= 0) {
            this.arrow_down_files.active = true;
            this.arrow_up_files.active = false;
        } else {
            this.arrow_up_files.active = true;
            this.arrow_down_files.active = false;
        }
    }

    init(data: any) {

         //
         var limit = data.ceg_uplimit
         var get = data.today_get_gold
       
         this.limitBar.progress =(limit-get)/limit
         this.cegget.string = `${limit-data.today_get_gold}/${data.ceg_uplimit}`

        this.hero_id = data.hero_id;
        // init map
        const infoMap = new Map([
            ["1", this.lab_hp], 
            ["2", this.lab_returnBlood], 
            ["3", this.lab_attack], 
            ["4", this.lab_defence], 
            ["5", this.lab_speed], 
            ["6", this.lab_range], 
            ["9", this.lab_rateoffire], 
            ["10", this.lab_clip], 
            ["13", this.lab_vision], 
            ["14", this.lab_reload], 
            ["34", this.lab_lucky], 
            ["35", this.lab_successrate], 
        ]);
        const cfg = playerConfig[data.hero_id];
        const hero_type = cfg.herotype;
        let url = "textures/heroType/ht_s_" + hero_type;
        cc.loader.loadRes(url, cc.SpriteFrame, (err, res) => {
            if (!err) {
                this.heroTypeImg.getComponent(cc.Sprite).spriteFrame = res;
            }
        });
        this.labName.string = cfg.name;
        var skinres = cc.playerData.getheroSkinbyId(data.hero_id, 0);
        cc.loader.loadRes(
            "spine/heropic/pic_hero" + skinres,
            sp.SkeletonData,
            (err, sp) => {
                this.heroSpine.skeletonData = sp;
                this.heroSpine._updateSkeletonData();
                this.heroSpine.setAnimation(0, "animation", true);
            }
        );
        // skills
        var skillarr = cc.playerData.getheroskill(data.hero_id);

        for (let i = 0; i < 3; i++) {
            var sklcfg = skillConfig[skillarr[i]];
            var icon = sklcfg.skill_icon;

            cc.loader.loadRes("icons/" + icon, cc.SpriteFrame, (err, res) => {
                if (!err) {
                    this.icons.children[i].children[0].getComponent(
                        cc.Sprite
                    ).spriteFrame = res;
                }
            });
            this.icons.children[i].children[1].getComponent(cc.Label).string =
                sklcfg.skill_name;
            if (i == 0) this.skillDesc.string = sklcfg.des;
        }

        // files
        this.infoSay.string = cfg.hero_say;
        this.infoName.string = cfg.name;
        this.infoStory.string = cfg.hero_story;
        this.infoGender.string = cfg.hero_sex;
        this.infoHeight.string = cfg.hero_tall;
        this.infoBirth.string = cfg.hero_brithday;
        this.infoHobby.string = cfg.hero_like;
        this.infojob.string = cfg.hero_job;
        this.infoAnim.string = cfg.hero_anmi;

        // basic info
        data.attr.forEach((element) => {
            if (element.type == 2) {
                infoMap.get(`${element.attr_id}`).string = `${element.val}%`;
            } else {
                infoMap.get(`${element.attr_id}`).string = `${element.val}`;
            }
        });

        infoMap.forEach((element) => {
            if (element.string === "000") {
                element.string = "Locked";
                element.node.color = cc.Color.GRAY;
            }
        });

        // skin
        var skinsarr = cc.playerData.getskinarrbyId(data.hero_id);

        for (let i = 0; i < skinsarr.length; i += 1) {
            this.allSkins.push(all_ItemConfig[skinsarr[i]]);
            this.initOneSkin(skinsarr[i], i);
            if (i == 0) {
                this.curentBuyId = skinsarr[i];
                this.diamondNum.string = all_ItemConfig[skinsarr[i]].diamond;
                this.goldNum.string = all_ItemConfig[skinsarr[i]].gold;
                if (!this.checkHasSkin(skinsarr[i])) {
                    this.buyNode.active = false;
                } else {
                    this.buyNode.active = false;
                }
            }
        }
    }

    private initOneSkin(skin_id, id) {
        const node = cc.instantiate(this.skinHead);
        cc.loader.loadRes(
            `itemicon/${all_ItemConfig[skin_id].icon}`,
            cc.SpriteFrame,
            (err, res) => {
                if (!err) {
                    node.children[1].getComponent(cc.Sprite).spriteFrame = res;
                }
            }
        );
        node.active = true;
        let event_handler = new cc.Component.EventHandler();
        event_handler.target = this.node;
        event_handler.component = "UIHeroinfo";
        event_handler.handler = "onClickChangeSkins";
        event_handler.customEventData = id;
        node.getComponent(cc.Toggle).clickEvents.push(event_handler);
        this.skinHead.parent.addChild(node);
    }

    onClickChangeSkins(data, event) {
        this.diamondNum.string = this.allSkins[event].diamond;
        this.goldNum.string = this.allSkins[event].gold;
        if (!this.checkHasSkin(this.allSkins[event].id)) {
            this.buyNode.active = false;
        } else {
            this.buyNode.active = false;
        }
    }

    checkHasSkin(skinId) {
        this.curentBuyId = skinId;
        let toReturn = false;
        getItemList((data) => {
            if (data.item_list.includes(skinId)) {
                toReturn = true;
            }
        });
        return toReturn;
    }

    onClickChangeSkills(data, event) {
        var skillarr = cc.playerData.getheroskill(this.hero_id);
        var sklcfg = skillConfig[skillarr[event - 1]];
        this.skillDesc.string = sklcfg.des;
    }

    onclose() {
        this.node.destroy();
    }

    resetBtns() {
        this.baseBtn.getChildByName("pick_status").opacity = 0;
        this.infoBtn.getChildByName("pick_status").opacity = 0;
        this.skillBtn.getChildByName("pick_status").opacity = 0;
    }

    onClickBasic() {
        this.resetBtns();
        this.baseBtn.getChildByName("pick_status").opacity = 255;
        this.basicPage.active = true;
        this.FilesPage.active = false;
        this.SkillsPage.active = false;
    }

    onClickSkills() {
        this.resetBtns();
        this.skillBtn.getChildByName("pick_status").opacity = 255;
        this.SkillsPage.active = true;
        this.FilesPage.active = false;
        this.basicPage.active = false;
    }

    onClickFiles() {
        this.resetBtns();
        this.infoBtn.getChildByName("pick_status").opacity = 255;
        this.FilesPage.active = true;
        this.SkillsPage.active = false;
        this.basicPage.active = false;
    }

    onClickBuy() {
        uimanger.showUI(this.buyHero, this.curentBuyId);
    }

    onClickAdvance() {
        const data = {};
        data["current"] = "advance";
        uimanger.showUI(UIUpdateHero.prefabPath, data);
    }

    onClickUpgrade() {
        uimanger.showUI(UIUpdateHero.prefabPath, {});
    }
}