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: '' };
                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;
            if (list.some(li => li.compare(point))) {
                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)
            }
        })
    }
    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;
            }
            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, 50, 50);
        //坐标转换
        console.log("1123123123")
        return;


        let boat_left = pg.view.find(this, 'layout_bottom/boat_left')
        let boat_right = pg.view.find(this, 'layout_bottom/boat_right')
        let leftRect = cc.rect(boat_left.x - boat_left.width / 2, boat_left.y - boat_left.height / 2, boat_left.width, boat_left.height);
        let rightRect = cc.rect(boat_right.x - boat_right.width / 2, boat_right.y - boat_right.height / 2, boat_right.width, boat_right.height);

        let isRight = false;
        let currentRect = null;
        // if (rect.intersects(leftRect)) {
        //     isRight = !!Game.getIns().boatLeft.isChild(data);
        //     Game.getIns().boatLeft.setRight(data);
        //     currentRect = leftRect;
        // } else if (rect.intersects(rightRect)) {
        //     isRight = !!Game.getIns().boatRight.isChild(data);
        //     Game.getIns().boatRight.setRight(data);
        //     currentRect = rightRect;
        // }
        if (!currentRect) {
            this.touching = null;
            this.playLocalAudio('error').then(() => {
                this.touching = null;
                // this.updateItem(target, data);
            })
            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);
            });
        })
    }
}
