// Learn TypeScript:
//  - https://docs.cocos.com/creator/manual/en/scripting/typescript.html
// Learn Attribute:
//  - https://docs.cocos.com/creator/manual/en/scripting/reference/attributes.html
// Learn life-cycle callbacks:
//  - https://docs.cocos.com/creator/manual/en/scripting/life-cycle-callbacks.html

const { ccclass, property } = cc._decorator;

@ccclass
export default class NewClass extends cc.Component {
    @property(cc.Label)
    label: cc.Label = null;

    private list: Array<{ img, name, id }>;
    //TODO:入口方法
    public setData(val) {
        this.list = val.eventList.concat();
        this.initView();
        // img: 'http://staging-teach.cdn.ireadabc.com/0d332cb2b167feb4204b1d77a6f02ed6.jpg',
        // name: '小红帽历险记',
        // totalIcon: 100,
        // locked: false,
        // id: 1234,
    }
    //TODO:点击事件
    public onTouchItem(e) {
        let data = e.target.data;
        console.log(data);
        if (data.locked) return;
        let event = new cc.Event.EventCustom('page2_btn_click', true);
        event.setUserData(data);
        this.node.dispatchEvent(event);
    }

    private layout: cc.Node;
    private item: cc.Node;
    onLoad() {
        this.layout = this.node.getChildByName("layout");
        this.item = this.node.getChildByName("item");
        this.item.active = false;
    }
    initView() {
        this.list.forEach((data, index) => {
            let item = cc.instantiate(this.item);
            this.updateItem(item, data);
            this.layout.addChild(item)
        })
    }
    updateItem(item: any, data) {
        item.active = true;
        item.data = data;
        // img: 'http://staging-teach.cdn.ireadabc.com/0d332cb2b167feb4204b1d77a6f02ed6.jpg',
        // name: '小红帽历险记',
        // totalIcon: 100,
        // locked: false,
        // id: 1234,
        let icon = item.getChildByName("icon")
        let title = item.getChildByName("title")
        let bg_0 = item.getChildByName("bg_0")
        let bg_1 = item.getChildByName("bg_1")
        let num = item.getChildByName('num')
        let lock = item.getChildByName('lock')
        this.setNetImg(icon, data.img, { w: 320, h: 370 })
        title.getComponent(cc.Label).string = data.name;
        num.getComponent(cc.Label).string = `${data.totalIcon}`;
        num.active = data.totalIcon != 0
        bg_0.active = data.totalIcon == 0
        bg_1.active = data.totalIcon != 0
        lock.active = data.locked;
        item.on(cc.Node.EventType.TOUCH_END, this.onTouchItem, this);
    }


    setNetImg(item, url, { w, h }) {
        return new Promise((resolve, reject) => {
            if (!item) return console.log("图片更换失败,传入了错误的item");
            let node = item.node ? item.node : item;
            if (!url) {
                if (node) node.active = false;
                return console.log("图片更换失败,传入了错误的res");
            }
            if (!node) return console.log("图片更换失败,传入了错误的item");
            if (node.net_url == url) return;
            node.active = false;//
            cc.loader.load({ url }, (err, texture) => {
                if (err && !texture) return;
                if (!cc.isValid(node)) return console.log("节点已销毁");
                let nw = node.width = texture.width;
                let nh = node.height = texture.height;
                let component = node.getComponent(cc.Sprite);
                let spriteFrame = new cc.SpriteFrame(texture);
                component.spriteFrame = spriteFrame;
                node.net_url = url;
                if (!cc.isValid(node)) return console.log("节点已销毁");
                if (!node) return console.log("节点已销毁");
                if (w && h) {
                    let scaleX = w / nw;
                    let scaleY = h / nh;
                    let scale = scaleX <= scaleY ? scaleX : scaleY;
                    node.width = nw * scale;
                    node.height = nh * scale;
                }
                node.active = true;
                resolve({ w: nw, h: nh });
            });
        })
    }
}
