import { asyncDelay, onHomeworkFinish } from "../script/util";
import { MyCocosSceneComponent } from "../script/MyCocosSceneComponent";
import pg from "./tool/pg";
import { Block, BLOCK_TYPE, GameNGT14, Question, Option } from "./tool/Game";

const { ccclass, property } = cc._decorator;

@ccclass
export default class SceneComponent extends MyCocosSceneComponent {

    addPreloadImage() {
        // TODO 根据自己的配置预加载图片资源
        this._imageResList.push({ url: this.data.pic_url });
        this._imageResList.push({ url: this.data.pic_url_2 });
    }

    addPreloadAudio() {
        // TODO 根据自己的配置预加载音频资源
        this._audioResList.push({ url: this.data.audio_url });
    }

    addPreloadAnima() {

    }

    onLoadEnd() {
        // TODO 加载完成后的逻辑写在这里, 下面的代码仅供参考
        this.initData();
        this.initView();
        this.initListener();
        this.gameStart();
    }

    _cantouch = null;
    initData() {
        // 所有全局变量 默认都是null 
        this._cantouch = true;
        GameNGT14.getIns().initData(this.data);
        GameNGT14.getIns().reset();
        let data = GameNGT14.getIns().getCurrent();
        console.log('gamestart', data)
    }

    initView() {
        this.initBlocks();
    }

    initListener() {

    }

    gameStart() {
        this.updateQuestion();
        this.updateHightLight();
        this.updateWords();
    }

    //----------------------------------------右上题目部分-----------------------------------
    private layout_question: cc.Node;
    updateQuestion() {
        let data = GameNGT14.getIns().getCurrent();
        this.layout_question = pg.view.find(this, 'layout_question');
        // 需要处理数据
        this.updateItem(this.layout_question, data);
    }

    getLayByOption(option: Option, base, { onlyImg, showCenter }) {
        if (onlyImg) {
            return cc.instantiate(pg.view.find(base, 'layout_full'))
        } else if (showCenter) {
            return cc.instantiate(pg.view.find(base, 'layout_center'))
        } else {
            return option.isDoubleLine() ? cc.instantiate(pg.view.find(base, 'layout_double')) : cc.instantiate(pg.view.find(base, 'layout_single'));
        }
    }
    getNodeByBlock(block: Block, base, { onlyImg }) {
        switch (block.type) {
            case BLOCK_TYPE.IMG:
                if (onlyImg) {
                    return cc.instantiate(pg.view.find(base, 'img_big'))
                } else {
                    return cc.instantiate(pg.view.find(base, 'img'))
                }
            case BLOCK_TYPE.TXT:
                return cc.instantiate(pg.view.find(base, 'label'))
            case BLOCK_TYPE.LINE:
                return cc.instantiate(pg.view.find(base, 'line'))
            case BLOCK_TYPE.TAG:
                return cc.instantiate(pg.view.find(base, 'tag'))
        }
    }
    updateItem(item, data: Question) {
        pg.view.visible(item, true);
        item.data = data;

        // let board = pg.view.find(item, 'board');
        let base = pg.view.find(item, 'base');
        // 确定基础layout
        let layout = pg.view.find(item, 'layout');
        let list: Array<Option> = data.getList();
        list.forEach(option => {
            let blocks = option.getList();
            let showCenter = blocks.length == 1 && blocks[0].type == BLOCK_TYPE.IMG;
            let onlyImg = list.length == 1 && showCenter;
            //确定使用的单双行
            let lay = this.getLayByOption(option, base, { onlyImg, showCenter });
            pg.view.addChild(layout, lay);
            blocks.forEach(block => {
                //确定使用哪种节点
                let node = this.getNodeByBlock(block, base, { onlyImg });
                node.y = 0;
                pg.view.addChild(lay, node);
                this.updateNode(node, block)
            })
        })
        setTimeout(() => {
            let height = layout.height;
            item.height = height + 15;
        }, 0);
    }
    updateNode(item, block: Block) {
        item.data = block;
        switch (block.type) {
            case BLOCK_TYPE.IMG:
                this.updateImg(item, block)
                break
            case BLOCK_TYPE.TXT:
                this.updateLabel(item, block)
                break
            case BLOCK_TYPE.LINE:
                this.updateLine(item, block)
                break
            case BLOCK_TYPE.TAG:
                this.updateTag(item, block)
                break
        }
    }
    updateImg(item, block: Block) {
        pg.view.setNetImg(item, block.img, { w: item.width, h: item.height })
    }
    updateLine(item, block: Block) {
        item.width = block.line * 30;
        // pg.view.visible(pg.view.find(item, 'label/input_cursor'), false)
        // pg.view.touchOn(item, this.onTouchLine, this);
    }
    updateLabel(item, block: Block) {
        pg.view.setString(item, block.text)
    }
    updateTag(item, block: Block) {
        let tag_default = pg.view.find(item, 'tag_default')
        let tag_input = pg.view.find(item, 'tag_input')
        pg.view.setString(pg.view.find(tag_default, 'label'), block.tag)
        pg.view.setString(pg.view.find(tag_input, 'label'), block.tag)
    }
    //----------------------------------------左侧方块部分-----------------------------------
    private layout_blocks: cc.Node;
    initBlocks() {
        this.layout_blocks = pg.view.find(this, 'layout_blocks');
        this.layout_blocks.removeAllChildren()
        let block = pg.view.find(this, 'block');
        //动态创建，并给每一个打上编号
        let space = { x: 9 + 80, y: 10 + 80 }
        for (let y = 0; y < 9; y++) {
            for (let x = 0; x < 12; x++) {
                let node = cc.instantiate(block);
                let data = { x, y, val: '', rightVal: '' };
                node.data = data;
                node.x = -495 + space.x * x;
                node.y = 365 - space.y * y;
                node.active = !!GameNGT14.getIns().getBlockVal(x, y);
                this.layout_blocks.addChild(node);
            }
        }
    }
    // 更新面板高亮
    updateHightLight() {
        let list = GameNGT14.getIns().getHightList();
        let first = null;
        this.layout_blocks.children.forEach(node => {
            let point = node.data;
            let li = list.find(li => li.compare(point))
            if (li) {
                point.rightVal = li.rightVal
                pg.view.visible(pg.view.find(node, 'img_undone'), false)
                pg.view.visible(pg.view.find(node, 'img_focus'), true)
                if (!point.val && !first) {
                    first = true;
                    pg.view.visible(pg.view.find(node, 'img_focus2'), true)
                }
            } else {
                pg.view.visible(pg.view.find(node, 'img_undone'), true)
                pg.view.visible(pg.view.find(node, 'img_focus'), false)
                pg.view.visible(pg.view.find(node, 'img_focus2'), false)
            }
        })
    }
    // 更新当前面板颜色
    updateCurrentNodeColor(node, data) {
        let label = node.getChildByName('label')
        pg.view.visible(label, true)
        pg.view.setString(label, data.word)
        for (let i = 1; i <= 5; i++) {
            pg.view.visible(pg.view.find(node, 'img_keyboard_' + i), data.color == i);
        }
        let block = node.data;
        block.val = data.word;
    }

    getBlockNodeByPos(x, y) {
        return this.layout_blocks.children.find(node => node.data.x == x && node.data.y == y)
    }
    //----------------------------------------右下角单词部分-----------------------------------

    private layout_words: cc.Node;
    updateWords() {
        let word = pg.view.find(this, 'word');
        this.layout_words = pg.view.find(this, 'layout_words');
        this.layout_words.removeAllChildren()
        let words = GameNGT14.getIns().getCurrent().getWords();
        let space = { x: 150, y: 150 }
        words.forEach((w, index) => {
            let node = cc.instantiate(word);
            let data = w;
            if (index < 5) {
                node.x = 280 + space.x * index
                node.y = -110
            } else if (index < 9) {
                node.x = 355 + space.x * (index - 5)
                node.y = -110 - space.y;
            } else {
                node.x = 280 + space.x * (index - 9)
                node.y = -110 - space.y * 2;
            }
            data.pos = cc.v2(node)
            this.layout_words.addChild(node);
            this.updateWord(node, data);
        });
    }
    updateWord(node, data) {
        node.data = data;
        node.rotation = data.rotation
        pg.view.setString(pg.view.find(node, 'label'), data.word);
        for (let i = 1; i <= 5; i++) {
            pg.view.visible(pg.view.find(node, 'img_keyboard_' + i), data.color == i);
        }
        node.on(cc.Node.EventType.TOUCH_START, this.onItemTouchStart, this);
        node.on(cc.Node.EventType.TOUCH_MOVE, this.onItemTouchMove, this);
        node.on(cc.Node.EventType.TOUCH_END, this.onItemTouchEnd, this);
        node.on(cc.Node.EventType.TOUCH_CANCEL, this.onItemTouchCancel, this);
    }
    private setTouchPos(e) {
        let item = e.target;
        let location = e.getLocation();
        cc.Tween.stopAllByTarget(item);
        let pos = location.sub(cc.v2(1920 / 2, 1080 / 2));
        item.x = pos.x;
        item.y = pos.y;
    }
    private touching: any;
    onItemTouchStart(e) {
        if (this.touching) return;
        let target: cc.Node = e.target;
        let data: string = target.data;
        this.setTouchPos(e);
        this.touching = data;
    }
    onItemTouchMove(e) {
        let target: cc.Node = e.target;
        let data = target.data;
        if (!this.touching) return;
        if (this.touching != data) return;
        this.setTouchPos(e);
    }
    onItemTouchEnd(e) {
        let target: cc.Node = e.target;
        let data = target.data;
        if (!this.touching) return;
        if (this.touching != data) return;
        // let rect = cc.rect(target.x, target.y, target.width, target.height);
        let rect = cc.rect(target.x, target.y, 1, 1);
        //坐标转换
        console.log("1123123123")
        let collNode = null;
        this.layout_blocks.children.forEach(node => {
            // 开始做碰撞
            // 坐标转换
            let nodeWP = node.convertToWorldSpaceAR(cc.v2(-40, -40));
            let nodeNP = this.layout_words.convertToNodeSpaceAR(nodeWP);
            let nodeRect = cc.rect(nodeNP.x, nodeNP.y, node.width, node.height);
            if (rect.intersects(nodeRect)) {
                collNode = node;
            }
        })
        //是否碰撞
        if (!collNode) {
            this.touching = null;
            target.x = target.data.pos.x;
            target.y = target.data.pos.y;
            return;
        }
        //是否正确
        this.playLocalAudio('move').then(() => { })
        let item = target;
        cc.tween(target).to(0.15, { scale: 0.9, rotation: 0 }).call(() => {
            // block需要显示内容
            this.updateCurrentNodeColor(collNode, data);
            target.active = false;
            this.touching = null;
            item.off(cc.Node.EventType.TOUCH_START, this.onItemTouchStart, this);
            item.off(cc.Node.EventType.TOUCH_MOVE, this.onItemTouchMove, this);
            item.off(cc.Node.EventType.TOUCH_END, this.onItemTouchEnd, this);
            item.off(cc.Node.EventType.TOUCH_CANCEL, this.onItemTouchCancel, this);

            // 判断此行是否完成
            let lineFull = true;
            if (lineFull) {

            } else {

                // 下一个格子刷新聚焦
                this.updateHightLight();
            }
        }).start();
        // this.playLocalAudio('right').then(() => {
        //     if (data.audioUrl) {
        //         pg.audio.playAudioByUrlThen(data.audioUrl).then(() => {
        //             this.touching = null;
        //         })
        //     } else {
        //         this.touching = null;
        //     }
        // })
        //     this.touching = null;
        //     target.x = target.data.pos.x;
        //     target.y = target.data.pos.y;
        // 检测一行是否完成， 完成加星星

        // pg.event.emit('mouse_05_add')
        return;


        // if (isRight) {
        //     let item = target;
        //     let lastArea = 100;
        //     // this.playLocalAudio('right').then(() => {
        //     //     if (data.audioUrl) {
        //     //         pg.audio.playAudioByUrlThen(data.audioUrl).then(() => {
        //     //             this.touching = null;
        //     //         })
        //     //     } else {
        //     //         this.touching = null;
        //     //     }
        //     // })

        //     if (item.scaleX == -1) {
        //         // 计算当前坐标距离最左侧的距离
        //         let space = currentRect.width - ((rect.x + rect.width) - currentRect.x) - lastArea / 5;
        //         let time = space / 10;
        //         cc.tween(item).by(time, { x: space }).start();
        //     } else {
        //         // 计算当前坐标距离最左侧的距离
        //         let space = rect.x - currentRect.x - lastArea;
        //         let time = space / 10;
        //         cc.tween(item).by(time, { x: -space }).start();
        //     }
        //     item.off(cc.Node.EventType.TOUCH_START, this.onItemTouchStart, this);
        //     item.off(cc.Node.EventType.TOUCH_MOVE, this.onItemTouchMove, this);
        //     item.off(cc.Node.EventType.TOUCH_END, this.onItemTouchEnd, this);
        //     item.off(cc.Node.EventType.TOUCH_CANCEL, this.onItemTouchCancel, this);
        //     pg.event.emit('mouse_05_add')
        // } else {
        //     this.playLocalAudio('error').then(() => {
        //         this.touching = null;
        //         // this.updateItem(target, data);
        //     })
        // }
        //判断是否结束了
        // if (Game.getIns().boatLeft.isAllRight() && Game.getIns().boatRight.isAllRight()) {
        //     this.showGameOver();
        // }
    }
    onItemTouchCancel() {

    }














    playLocalAudio(audioName) {
        const audio = cc.find(`Canvas/res/audio/${audioName}`).getComponent(cc.AudioSource);
        return new Promise((resolve, reject) => {
            const id = cc.audioEngine.playEffect(audio.clip, false);
            cc.audioEngine.setFinishCallback(id, () => {
                resolve(id);
            });
        })
    }
}
