import { Label, Label2, LabelText, Line, MySprite, ShapeCircle, ShapeRect } from "./Unit";

export class Exercises {
    data;

    images;

    indexBgColor;

    index: number;

    bg: ShapeRect;

    answer: ShapeRect;

    answerFill : ShapeRect;

    answerLabel: Label2;

    showLetterArr: Array<Label> = [];

    scaleX = 1;

    scaleY = 1;

    answered: Boolean = false;

    indexLabel: Label;

    indexLabelBg: ShapeCircle;

    init(images, indexBgColor, data, scaleX = 1, scaleY = 1) {

        this.images = images;

        this.data = data;

        this.scaleX = scaleX;

        this.scaleY = scaleY;

        this.indexBgColor = indexBgColor;

        this.initBg();

        this.initIndex();

        this.initAnswer();
    }

    initBg() {
        let height = 48 * this.scaleY;

        let width = 284 * this.scaleX;

        const bg = new ShapeRect();
        bg.setSize(width, height);
        bg.alpha = 0;
        this.bg = bg;
    }

    initIndex() {
        let indexBg = new ShapeCircle();
        let r = 23 * this.scaleX;
        indexBg.setRadius(r);
        indexBg.fillColor = this.indexBgColor;
        indexBg.x = r;
        indexBg.y = this.bg.height / 2;
        indexBg.alpha = 0.7;
        this.bg.addChild(indexBg);
        this.indexLabelBg = indexBg;

        let index = new Label();
        index.text = this.index + "";
        index.textAlign = 'center';
        index.fontSize = 36;
        index.fontName = "FuturaB";
        index.fontColor = "#ffffff";     
        index.setScaleXY(this.scaleX);
        index.refreshSize();
        index.x = 0;
        index.y = 0 +4 * this.scaleY;
        indexBg.addChild(index);
        index.alpha = 1;
        this.indexLabel = index;
    }

    initAnswer() {

        let startX = 46 * this.scaleX + 6 * this.scaleX;

        let answer = this.getAnswerView(this.data.answer);
        answer.x = startX;
        this.answer = answer;

        this.bg.addChild(answer);

        let answerFill = this.getAnswerFillView(this.data.answer);
        answerFill.x = startX;
        this.answerFill= answerFill;
        this.bg.addChild(answerFill);
    }

    getAnswerView(answerData) {
        const getLabelText = (letter) => {
            const text = new LabelText();
            text.val = letter.val;
            if (letter.isFill == '1') {
                text.fontColor = "#c8161d";
            }
            else {
                text.fontColor = "#000000";
            }
            text.underLine = false;

            return text;
        }



        let labelTextArr = [];

        for (let i = 0; i < answerData.letterArr.length; ++i) {

            var letter = answerData.letterArr[i];

            let label = getLabelText(letter);

            labelTextArr.push(label);
        }

        const answer = new Label2();
        answer.textArr = labelTextArr;
        answer.fontSize = 48;
        answer.fontName = "MMB";
        answer.setScaleXY(this.scaleX);
        answer.refreshSize();
        this.answerLabel = answer;

        const answerBg = new ShapeRect();
        answerBg.alpha = 0;
        answerBg.setSize(answer.getBoundingBox().width, answer.getBoundingBox().height);
        answerBg.y = (this.bg.height - answerBg.height) / 2;

        answer.y = answerBg.height / 2;
        answer.x = 0;
        answerBg.addChild(answer);

        answerBg.visible = false;

        this.bg.addChild(answerBg);


        return answerBg;
    }

    private getAnswerFillView(answerData) {    

        const getLetterLabel = (letter) => {

            const label = new Label();
            label.fontName = "MMB";
            label.fontSize = 48;
            label.text = letter.val;
            if (letter.isFill == '1') {
                label.fontColor = "#c8161d";
            }
            else {
                label.fontColor = "#000000";
            }
            label.scaleX = this.scaleX;
            label.scaleY = this.scaleY;
            label.refreshSize();

            return label;
        }

        const answerFillBg = new ShapeRect();
        answerFillBg.alpha = 0;
        answerFillBg.height = this.bg.height;

        let totalWidth = 0;

        let startX = 0;

        for (let i = 0; i < answerData.letterArr.length; ++i) {

            var letter = answerData.letterArr[i];

            let label = getLetterLabel(letter);
            label.y = answerFillBg.height  / 2;

            let w = Math.ceil(label.getBoundingBox().width);

            let dw = Math.ceil(4 * this.scaleX);

            //如果是填空，则增加下划线
            if (letter.isFill == '1') {

                startX += dw;

                let width = Math.ceil(80 * this.scaleX);

                label.x = startX + (width - label.getBoundingBox().width) / 2;

                let underLine = new Line();
                underLine.lineColor = "#949494";
                underLine.lineWidth = 3 * this.scaleX;
                underLine.y = this.bg.height;
                underLine.x = startX;
                underLine.setLine(width);
                answerFillBg.addChild(underLine);

                w = width;

                label.alpha = 0;
                this.showLetterArr.push(label);

            }
            else {

                if (answerData.letterArr[i - 1] && answerData.letterArr[i - 1].isFill == '1') {
                    startX += dw;
                }

                label.x = startX;
            }

            answerFillBg.addChild(label);

            startX += w;

            totalWidth += w;
        }

        answerFillBg.width = totalWidth;
        answerFillBg.y = (this.bg.height - answerFillBg.height) / 2;

        this.bg.addChild(answerFillBg);


        return answerFillBg;

    }

    showLetter() {

        if(!this.answered){
            this.answered = true;

           if(this.answerFill.visible){

                for(let i = 0; i < this.showLetterArr.length; ++ i){
                    this.showLetterArr[i].alpha = 1;
                }

           }
        }
        
        return true;
    }
} 