import { Application, Container, Graphics } from "pixi.js";

async function setup(app: Application) {
  await app.init({ background: "#111111", resizeTo: window, antialias: true });
  document.getElementById("pixi-container")!.appendChild(app.canvas);
}

(async () => {
  const app = new Application();
  await setup(app);

  const box = new Graphics();
  const width = 100;
  box.rect(-width / 2, -width / 2, width, width).fill(0x00ff00);
  box.x = 0;
  box.y = 0;
  const world = new Container();
  world.addChild(box);
  // one way
  world.x = app.screen.width / 2;
  world.y = app.screen.height / 2;

  // other way
  // app.stage.x = app.screen.width / 2;
  // app.stage.y = app.screen.height / 2;

  app.stage.addChild(world);
})();