import { Item } from './Item';
import { ShapeRect, Label, MySprite, tweenChange, getPosByAngle, scaleItem, hideItem, moveItem } from './Unit';
import TWEEN from '@tweenjs/tween.js';

export class Timer extends Item {

    timeLabel: Label;

    stopwatch: MySprite;

    seconds = 0;

    stopFlag = false;

    started = false;

    initX = 0;

    initY = 0;

    timeY = 0;

    stopwatchY = 0;

    _standby = false;

    starArr: Array<MySprite> = [];

    init() {

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

        const bgPic = this.getPic('timer');
        this.width = bgPic.width;
        this.height = bgPic.height;
        bgPic.x = this.width / 2;
        bgPic.y = this.height / 2;
        bg.addChild(bgPic);


        const stopwatch = this.getPic('stopwatch', 0, 1);
        stopwatch.x = 42 * this.scaleX;
        stopwatch.y = this.height - 3 * this.scaleY;
        this.stopwatchY = stopwatch.y;
        bg.addChild(stopwatch);
        this.stopwatch = stopwatch;

        let timeLabel = new Label();
        this.timeLabel = timeLabel;
        timeLabel.text = "00:00";
        timeLabel.textAlign = 'middle';
        timeLabel.fontSize = 50;
        timeLabel.fontName = "BRLNSDB";
        timeLabel.fontColor = "#63bb00";
        timeLabel.scaleX = this.scaleX;
        timeLabel.scaleY = this.scaleY;
        timeLabel.refreshSize();
        bg.addChild(timeLabel);
        timeLabel.x = 99 * this.scaleX;
        timeLabel.y = stopwatch.y - timeLabel.getBoundingBox().height / 2 - 7 * this.scaleY;
        this.timeY = timeLabel.y;

        this.initStar();
    }

    private initStar() {
        const star1 = this.getPic('star1', 0.5, 1);
        star1.alpha = 0;
        star1.x = 0;
        star1.y = this.height - 35 * this.scaleY;
        this.bg.addChild(star1);
        this.starArr.push(star1);

        const star2 = this.getPic('star2', 0.5, 1);
        star2.alpha = 0;
        star2.x = this.width;
        star2.y = this.height;
        this.bg.addChild(star2);
        this.starArr.push(star2);

        const star3 = this.getPic('star3', 0.5, 1);
        star3.alpha = 0;
        star3.x = 4 * this.scaleX;
        star3.y = this.height - 62 * this.scaleY;
        this.bg.addChild(star3);
        this.starArr.push(star3);

        const star4 = this.getPic('star4', 0.5, 1);
        star4.alpha = 0;
        star4.x = this.width;
        star4.y = this.height - 30 * this.scaleY;
        this.bg.addChild(star4);
        this.starArr.push(star4);

        const star5 = this.getPic('star5', 1, 1);
        star5.alpha = 0;
        star5.x = this.width - 8 * this.scaleX;
        star5.y = this.height - 83 * this.scaleY;
        this.bg.addChild(star5);
        this.starArr.push(star5);
    }

    start(callback = null) {


        if (this.started) {
            return;
        }

        this._standby = false;

        this.started = true;

        const showTime = () => {

            if (this.stopFlag) {
                return;
            }

            setTimeout(() => {
                this.seconds += 1;
                this.timeLabel.text = this.getTimeStr(this.seconds);
                showTime();
            }, 1000);
        }

        showTime();

        if (callback) {
            callback();
        }

    }

    stop(callback = null) {
        this.stopFlag = true;
        this.started = false;
    }

    showStar() {
        this.showPopParticle({ x: this.width / 2, y: this.height / 2 + 60 * this.scaleY }, this.bg, 5, 60 * this.scaleX, 100 * this.scaleX);
    }

    hideStar() {

    }

    reset(callback = null) {

        this.timeLabel.text = "00:00";

        tweenChange(this.timeLabel, { y: this.timeY }, 0.3);

        tweenChange(this.stopwatch, { y: this.stopwatchY }, 0.3);

        tweenChange(this.bg, { y: this.initY }, 0.3, () => {

            this._y = this.initY;

            this.stopFlag = false;

            this.started = false;

            this.seconds = 0;

            this.hideStar();

            if (callback) {
                callback();
            }
        })


    }

    standby() {

        const show = () => {
            tweenChange(this.stopwatch, { scaleX: this.scaleX * 1.1, scaleY: this.scaleY * 1.1 }, 0.5, () => {

                tweenChange(this.stopwatch, { scaleX: this.scaleX, scaleY: this.scaleY }, 0.5, () => {

                    if (this._standby) {
                        show();
                    }
                });
            });
        }

        this._standby = true;

        show();
    }

    private getTimeStr(time: number) {
        if (!time) {
            return "00:00";
        }

        let sec = Math.ceil(time % 60);

        let minute = Math.floor(time / 60);

        let timeStr = (minute < 10 ? "0" + minute : minute) + ":" + (sec < 10 ? "0" + sec : sec);

        return timeStr;
    }

    showPopParticle(pos, parent, num = 20, minLen = 40, maxLen = 80, showTime = 0.4, kinds = 5) {


        for (let i = 0; i < num; i++) {

            const particle = new MySprite();
            const id = Math.ceil(Math.random() * kinds);
            particle.init(this.images.get('star' + id));
            particle.x = pos.x;
            particle.y = pos.y;
            parent.addChild(particle);

            const randomR = 360 * Math.random();
            particle.rotation = randomR;

            const randomS = (0.3 + Math.random() * 1.2) * this.scaleX;
            particle.setScaleXY(randomS * 0.3);

            const randomX = Math.random() * 20 - 10;
            particle.x += randomX;

            const randomY = Math.random() * 20 - 10;
            particle.y += randomY;

            const randomL = minLen + Math.random() * (maxLen - minLen);
            const randomA = 360 * Math.random();
            const randomT = getPosByAngle(randomA, randomL);
            moveItem(particle, particle.x + randomT.x, particle.y + randomT.y, showTime, () => {



            }, TWEEN.Easing.Exponential.Out);

            // scaleItem(particle, 0, 0.6, () => {
            //
            // });

            scaleItem(particle, randomS, 0.6, () => {

            }, TWEEN.Easing.Exponential.Out);

            setTimeout(() => {

                hideItem(particle, 0.4, () => {

                }, TWEEN.Easing.Cubic.In);

            }, showTime * 0.5 * 1000);


        }
    }
}