// originalWindowWidth: window.innerWidth,
  // originalWindowHeight: window.innerHeight,
  // }, {

    // originalWindowWidth: window.innerWidth,
    // originalWindowHeight: window.innerHeight,

import * as Pixi from "pixi.js";
import { IVector2, Vector2 } from "../util/geometry/vector2";
export function PixiPointFrom(p: IVector2): Pixi.Point {
  return new Pixi.Point(p.x, p.y);
}

import createBunnyExample from "./BunnyExample";

      this.isMounted = true;

import { FpsComponent } from "./components/FpsComponent";

  state!: RootApplicationState;
  staleProps!: RootApplicationProps;
  container!: Pixi.Container;

  state: RootApplicationState;
  staleProps: RootApplicationProps;
  container: Pixi.Container;

  public fixedCameraStage!: Pixi.Container;

  public fixedCameraStage: Pixi.Container;

  public actionStage!: Pixi.Container;

  public actionStage: Pixi.Container;

  public backdropStage!: Pixi.Container;

  public backdropStage: Pixi.Container;

  public fpsTracker!: FpsTracker;

  public fpsTracker: FpsComponent;

    this.state = {
      pointNodeTexture: new Lazy(() => generatePointNodeTexture(props.args.renderer))
    };

    this.state = {
      pointNodeTexture: new Lazy(() => generatePointNodeTexture(props.args.renderer))
    };

    // let textFpsHud = new Pixi.Text('', {
    //   fontFamily: 'PixelMix',
    //   fontSize: 12,
    //   // align: 'right'
    // });
    // this.app.ticker.add(() => {
    //   textFpsHud.text = this.fpsTracker.getFpsString() + " FPS\n" + this.fpsTracker.getUpsString() + " UPS\n" + 
    //   this.app.screen.width + "x" + this.app.screen.height;
    // })
    // textFpsHud.x = this.app.screen.width;
    // this.onResize.push(() => { textFpsHud.x = this.app.screen.width; });
    // textFpsHud.anchor.x = 1; // right justify
    // textFpsHud.x = 0;
    // textFpsHud.y = 0;
    // this.fixedCameraStage.addChild(textFpsHud);
    this.fpsTracker = new FpsComponent({
      delta: props.delta,
      position: new Vector2(0, 0),
      appSize: props.appSize,
    })
    this.fixedCameraStage.addChild(this.fpsTracker.container);
    const backdrop = new Pixi.Graphics();
    this.backdropStage.addChild(backdrop);
    backdrop.beginFill(0xabcdef, 1);
    // backdrop.alpha = 0.5; // if alpha == 0, Pixi does not register this as a hittable area
    backdrop.interactive = true;
    // backdrop.interactiveChildren = true; // not sure what this does
    // backdrop.buttonMode = true; // changes the mouse cursor on hover to pointer; not desirable for the entire backdrop
    backdrop.drawRect(0, 0, props.appSize.x, props.appSize.y);

    this.fpsTracker.update({
      delta: props.delta,
      position: new Vector2(0, 0),
      appSize: props.appSize,
    })

import * as Pixi from "pixi.js";
import { FpsTracker } from "../../lib/util/fpsTracker";
import { Vector2 } from "../../lib/util/geometry/vector2";
import { PixiPointFrom } from "../../lib/pixi/pixify";
type FpsComponentProps = {
  delta: number;
  position: Vector2;
  appSize: Vector2;
}
export class FpsComponent {
  public container: Pixi.Text;
  staleProps: FpsComponentProps;
  state: FpsTracker;
  constructor(props: FpsComponentProps) {
    this.container = new Pixi.Text('', {
      fontFamily: 'PixelMix',
      fontSize: 12,
      // align: 'right'
    });
    this.state = new FpsTracker();
    this.staleProps = props;
    this.container.position = PixiPointFrom(props.position);
    // this.app.ticker.add(() => {
    //   textFpsHud.text = this.fpsTracker.getFpsString() + " FPS\n" + this.fpsTracker.getUpsString() + " UPS\n" + 
    //   this.app.screen.width + "x" + this.app.screen.height;
    // })
    // textFpsHud.x = this.app.screen.width;
    // this.onResize.push(() => { textFpsHud.x = this.app.screen.width; });
    // textFpsHud.anchor.x = 1; // right justify
    // textFpsHud.x = 0;
    // textFpsHud.y = 0;
    // this.fixedCameraStage.addChild(textFpsHud);
  }
  public update(props: FpsComponentProps) {
    this.updateSelf(props);
    this.renderSelf(props);
  }
  updateSelf(props: FpsComponentProps) {
    this.state.tick(props.delta);
  }
  renderSelf(props: FpsComponentProps) {
    this.container.text = this.state.getFpsString() + " FPS\n" + this.state.getUpsString() + " UPS\n" +
      props.appSize.x + "x" + props.appSize.y;
    this.container.position = PixiPointFrom(props.position);
  }
}