import "./phaser";
import { NinePatchPlugin } from "../src";

export default class Game extends Phaser.Game {
    public centerX: number;
    public centerY: number;
    constructor(width?: string | number, height?: string | number, renderer?: number, parent?: any, state?: any) {
        super(width, height, renderer, parent, state, false, false);
    }
}
function init() {
    // this.game.renderer.renderSession.roundPixels = true;
    // this.game.stage.smoothed = true;
}

function preload() {
    console.log("preload");
    this.game.plugins.add(NinePatchPlugin);

    this.load.ninePatch("metalPanel_blueCorner", "static/assets/metalPanel_blueCorner.png", 32, 11, 53, 11);
    this.load.ninePatch("metalPanel_yellowCorner", "static/assets/metalPanel_yellowCorner.png", 32, 11, 53, 11);
    this.load.atlas("assets", "static/assets/assets.png", "static/assets/assets.json");
    this.load.atlas("assets-alter", "static/assets/assets-alter.png", "static/assets/assets-alter.json");
}

function create() {
    Phaser.Canvas.setSmoothingEnabled(this.game.context, true); //also for Canvas, legacy approach
    // console.warn((this.game.renderer.renderSession.roundPixels = true));
    this.cache.addNinePatch("squareGreen", {
        bottom: 14, // Amount of pixels for bottom
        left: 6, // Amount of pixels for left
        right: 6, // Amount of pixels for right
        top: 10 // Amount of pixels for top
    });
    const metalPanel = this.add.ninePatch(200, 200, "metalPanel_blueCorner", null, 300, 300);
    this.squareGreen = this.add.ninePatch(100, 100, "assets", "squareGreen", 100, 50);

    setTimeout(() => {
        console.warn(this.squareGreen.width, this.squareGreen.height, this.squareGreen.getBounds());
        console.warn(this.squareGreen);
    }, 100);
    setTimeout(() => {
        this.squareGreen.setAnchor(0.5, 0.5);
        console.warn(this.squareGreen.width, this.squareGreen.height, this.squareGreen.getBounds());
    }, 2000);
    setTimeout(() => {
        this.squareGreen.resize(200, 100);
        this.squareGreen.frameName = "squareYellow";
        // console.warn(this.squareGreen.width, this.squareGreen.height, this.squareGreen.getBounds());
    }, 5000);
    setTimeout(() => {
        metalPanel.loadTexture("metalPanel_yellowCorner");
        metalPanel.resize(200, 100);
    }, 5000);
    setTimeout(() => {
        this.squareGreen.loadTexture("assets-alter", "squareWhite");
        metalPanel.resize(200, 250);
        // console.warn(this.squareGreen.width, this.squareGreen.height, this.squareGreen.getBounds());
    }, 10000);
}

function update() {
    this.squareGreen.rotation += 1/100;
}

document.onreadystatechange = () => {
    if (document.readyState === "complete") {
        //@ts-ignore
        (window as any).game = new Game(800, 600, Phaser.CANVAS, null, { create, preload, update, init });
    }
};
