import {
    Label,
    MySprite, ShapeRectNew,
    ShapeCircle,
    tweenChange,
    ShapeRect
} from './Unit';

import {
    Exercises
} from './Exercises';

export class Skin {

    skinType;

    images;

    scaleX = 1;

    scaleY = 1;

    bg;

    intervalHeight = 0;

    intervalWidth = 0;

    contentBgWidth = 0;

    minMarginTop = 0;


    constructor(skinType, images) {
        this.skinType = skinType;

        this.images = images;


    }

    setScaleXY(sacle: number) {
        this.scaleX = this.scaleY = sacle;

        if (this.skinType == 'B') {
            this.intervalHeight = 117 * this.scaleY;

            this.intervalWidth = 28 * this.scaleX;

            this.contentBgWidth = 348 * this.scaleX;

            this.minMarginTop = 160 * this.scaleY;
        }
        else {
            this.intervalHeight = 56 * this.scaleY;

            this.intervalWidth = 63 * this.scaleX;

            this.contentBgWidth = 320 * this.scaleX;

            this.minMarginTop = 77 * this.scaleY;
        }
    }

    initBg(renderArr, canvasWidth: number, canvasHeight: number) {

        if (this.skinType == 'A') {
            const bg = new MySprite();
            bg.init(this.images.get('skin_2_bg'));
            let bgScale = Math.max(canvasWidth / bg.width, canvasHeight / bg.height);
            bg.setScaleXY(bgScale);
            bg.x = canvasWidth / 2;
            bg.y = canvasHeight / 2;

            this.bg = bg;

            renderArr.push(bg);

            const grass = new MySprite();
            grass.init(this.images.get('grass'));
            grass.scaleX = this.scaleX;
            grass.scaleY = this.scaleY;
            grass.x = canvasWidth - grass.getBoundingBox().width / 2;
            grass.y = canvasHeight - grass.getBoundingBox().height / 2;
            renderArr.push(grass);

        }

    }

    initExercises(exercises: Exercises, i) {

        if (this.skinType == 'A') {
            this.setExercisesSkinA(exercises);
        }
        else {
            this.setExercisesSkinB(exercises, i);

        }

    }

    private setExercisesSkinB(exercises: Exercises, i) {
        const getColor = (i) => {
            if (i % 2 == 0) {
                return { bgColor: "#E5E4E3" };
            }
            else {
                return { bgColor: "#C7C8CB" };
            }
        }

        //背景
        const bg = new ShapeRect();
        exercises.bg = bg;
        bg.fillColor = getColor(i).bgColor;

        bg.setSize(320 * this.scaleX, 88 * this.scaleY);

        const textLabel = new Label();
        exercises.textLabel = textLabel;
        textLabel.text = exercises.exercisesData.text;
        textLabel.textAlign = 'middle';
        textLabel.fontSize = 48;
        textLabel.fontName = "FUTURABM";
        textLabel.fontColor = "#626262";
        textLabel.setMaxSize(bg.width - 20 * this.scaleY);
        textLabel.refreshSize();
        textLabel.x = (bg.width - textLabel.getBoundingBox().width) / 2;
        textLabel.y = bg.height / 2;
        bg.addChild(textLabel);


        const indexPic = new MySprite();
        indexPic.init(this.images.get('skin_2_index_bg'));
        indexPic.scaleX = this.scaleX;
        indexPic.scaleY = this.scaleY;
        indexPic.x = indexPic.getBoundingBox().width / 2;
        indexPic.y = indexPic.getBoundingBox().height / 2;

        const indexBg = new ShapeRect();
        indexBg.setSize(indexPic.getBoundingBox().width, indexPic.getBoundingBox().height);
        indexBg.x = (bg.width - indexBg.width) / 2;
        indexBg.y = - (indexBg.height - 14 * this.scaleY);
        indexBg.alpha = 0;
        exercises.indexBg = indexBg;
        bg.addChild(indexBg);
        indexBg.addChild(indexPic);

        const indexLabel = new Label();
        exercises.indexLabel = indexLabel;
        indexLabel.text = exercises.exercisesData.index;
        indexLabel.textAlign = 'middle';
        indexLabel.fontSize = 48;
        indexLabel.fontName = "BRLNSDB";
        indexLabel.fontColor = "#000000";
        indexLabel.setMaxSize(indexBg.getBoundingBox().width);
        indexLabel.refreshSize();
        indexLabel.x = (indexBg.width - indexLabel.getBoundingBox().width) / 2 + 2 * this.scaleX;
        indexLabel.y = indexBg.height / 2 - 4 * this.scaleY;
        indexLabel.alpha = 0;
        indexBg.addChild(indexLabel);
    }

    private setExercisesSkinA(exercises: Exercises) {
        console.log(this.scaleX, this.scaleY);
        const textLabel = new Label();
        exercises.textLabel = textLabel;
        textLabel.text = exercises.exercisesData.text;
        textLabel.textAlign = 'middle';
        textLabel.fontSize = 48;
        textLabel.fontName = "GOTHIC";
        textLabel.fontColor = "#000000";
        textLabel.refreshSize();


        const indexLabel = new Label();
        exercises.indexLabel = indexLabel;
        indexLabel.text = exercises.exercisesData.index;
        indexLabel.textAlign = 'middle';
        indexLabel.fontSize = 36;
        indexLabel.fontName = "BRLNSDB";
        indexLabel.fontColor = "#316900";
        indexLabel.alpha = 0;
        indexLabel.setMaxSize(40 * this.scaleX);
        indexLabel.refreshSize();

        const indexBg = new ShapeRect();
        indexBg.setSize(40 * this.scaleX, 40 * this.scaleY);
        indexBg.visible = false;
        indexBg.childDepandVisible = false;
        indexBg.addChild(indexLabel);
        exercises.indexBg = indexBg;
        indexLabel.x = (indexBg.width - indexLabel.getBoundingBox().width) / 2;
        indexLabel.y = indexBg.height / 2

        //树桩
        const stump = new MySprite();

        //默认大树桩
        let imageKey = "stump_b";


        let textMargin = { marginTop: 29 * this.scaleY, marginLeft: 70 * this.scaleX, maxWidth: 219 * this.scaleX };

        let indexMargin = { marginTop: 92 * this.scaleY, marginLeft: 161 * this.scaleX };

        let textLabelWidth = textLabel.width;
        if (textLabelWidth < 110) {

            //取小树桩
            imageKey = "stump_s"
            indexMargin.marginLeft = 106 * this.scaleX;
            indexMargin.marginTop = 92 * this.scaleY;

            textMargin.marginLeft = 71 * this.scaleX;
            textMargin.marginTop = 31 * this.scaleY;
            textMargin.maxWidth = 110 * this.scaleX;



        }
        else if (textLabelWidth <= 153) {

            //取中等树桩
            imageKey = "stump_m"

            indexMargin.marginLeft = 147 * this.scaleX;
            indexMargin.marginTop = 92 * this.scaleY;

            textMargin.marginLeft = 89 * this.scaleX;
            textMargin.marginTop = 28 * this.scaleY;
            textMargin.maxWidth = 153 * this.scaleX;
        }

        //设置最大宽度
        textLabel.setMaxSize(textMargin.maxWidth - 5 * this.scaleX);
        textLabel.refreshSize();

        stump.init(this.images.get(imageKey));
        stump.scaleX = this.scaleX;
        stump.scaleY = this.scaleY;

        let width = stump.getBoundingBox().width;

        let height = stump.getBoundingBox().height;

        const bg = new ShapeRect();
        bg.setSize(width, height);
        bg.alpha = 0;
        exercises.bg = bg;
        stump.x = bg.width / 2;
        stump.y = bg.height / 2;
        bg.addChild(stump);

        let textWidth = textLabel.getBoundingBox().width;

        textLabel.x = textMargin.marginLeft + (textMargin.maxWidth - textWidth) / 2;
        textLabel.y = textMargin.marginTop + textLabel.height * this.scaleY / 2;
        bg.addChild(textLabel);

        indexBg.x = indexMargin.marginLeft;
        indexBg.y = indexMargin.marginTop;
        bg.addChild(indexBg);


    }

    getIntervalHeight() {
        return this.intervalHeight;
    }

    getIntervalWidth() {
        return this.intervalWidth;
    }

    getContentBgWidth() {
        return this.contentBgWidth;
    }

    getMinMarginTop(){
        return this.minMarginTop;
    }
}