// update su posizione del mouse
// quando viene mollato il mouse decide in che direzione andare automaticamente
// una volta mollato il mouse e una volta raggiunta la posizione definitiva va a dispatchare l'evento che fa partire la nuova pagina

// e fatta da un quad
//si occupa anche di updatare la maschera usata per nascondere la pagina sotto

import Phaser from 'phaser'
import LU from '../display/layout';

export default class PageTurn extends Phaser.Group {
    constructor(game, parent, name) {
        super(game, parent, name);

        this.onTurnedPage = new Phaser.Signal();

        this.dragging = false;
        this.padding = 15;

        this.pageWidth = 950;
        this.pageHeight = 640;

        this.running = false;
        this.autoTurn = null;

        this.create();
        this.reset();
    }

    stop() {
        this.running = false;
        this.game.input.onDown.remove(this.beginDrag, this);
        this.game.input.onUp.remove(this.endDrag, this);
    }

    start() {
        this.running = true;
        this.game.input.onDown.add(this.beginDrag, this);
        this.game.input.onUp.add(this.endDrag, this);
    }

    reset() {
        this.pageX = this.pageWidth;
    }

    create() {
        //oggetto graphics rettangolo
        this.turningPage = game.add.graphics(0, 0);
        this.add(this.turningPage);
    }

    beginDrag() {
        if (!this.autoTurn || !this.autoTurn.isRunning) {
            this.dragging = true;
        }
    }

    endDrag() {
        if (this.dragging) {
            this.dragging = false;

            //iniziare effetto auto turn, verso destra o verso sinistra che sia
            let desiredX = this.pageWidth;
            let flipPageWhenDone = false;

            if (this.pageX < this.pageWidth * 0.5) {
                desiredX = -this.pageWidth;
                flipPageWhenDone = true;
            }

            this.autoTurn = this.game.add.tween(this).to({ pageX: desiredX }, 400, Phaser.Easing.Quadratic.In, true);

            if (flipPageWhenDone) {
                this.autoTurn.onComplete.add(() => {
                    this.reset();
                    this.onTurnedPage.dispatch();
                }, this);
            }
        }
    }

    update() {
        if (this.dragging) {
            this.pageX = LU.LEFT_OFFSET + Math.min(-LU.LEFT_OFFSET + this.pageWidth, this.pageX + (this.game.input.x - this.pageX) * 0.25);
            this.updatePage();
        }
        if (this.autoTurn && this.autoTurn.isRunning) {
            this.updatePage();
        }
    }

    updatePage() {
        super.update();
        //aggiungere un po' di dolcezza
        this.turningPage.clear();

        if (this.running && this.pageX > -this.pageWidth && this.pageX < this.pageWidth) {
            let pageTurnWidth = (this.pageWidth - this.pageX) * 0.35;
            // let bezierHeight = (1 / Math.pow(Math.abs(this.pageX - this.pageWidth * 0.5) / (this.pageWidth * 0.5), 2)) * this.padding;
            let bezierHeight = (1 - Math.pow(this.pageX / this.pageWidth, 2)) * this.padding * 2;

            let xLeft = this.pageX;
            let ytopRight = this.padding - bezierHeight * 0.5;
            let xRight = this.pageX + pageTurnWidth;
            let yBottomRight = this.pageHeight - this.padding + bezierHeight * 0.5;

            let xBezier = xLeft + (xRight - xLeft) * 0.75;
            let yTopBezier = ytopRight - bezierHeight;
            let yBottomBezier = yBottomRight + bezierHeight;
            let ytopLeft = yTopBezier - 5;
            let yBottomLeft = yBottomBezier + 5;

            this.turningPage.lineStyle(2, 0x000000, 0.5);
            this.turningPage.beginFill(0xdccfad);
            this.turningPage.moveTo(xLeft, ytopLeft);
            this.turningPage.quadraticCurveTo(xBezier, yTopBezier, xRight, ytopRight);
            this.turningPage.lineTo(xRight, yBottomRight);
            this.turningPage.quadraticCurveTo(xBezier, yBottomBezier, xLeft, yBottomLeft);
            this.turningPage.lineTo(xLeft, ytopLeft);
            this.turningPage.endFill();
        }
    }
}
