import { generatePointNodeTexture } from "./textures/PointNodeTexture";
import { Reticle } from "./Reticle";

    const reticle = new Pixi.Graphics();
    reticle.lineStyle(2, 0x999999);
    reticle.drawCircle(0, 0, 6);
    reticle.x = this.app.screen.width / 2;
    reticle.y = this.app.screen.height / 2;

    const reticle = new Reticle({});
    this.fixedCameraStage.addChild(reticle.container);
    reticle.container.x = this.app.screen.width / 2;
    reticle.container.y = this.app.screen.height / 2;

    reticle.x = this.app.screen.width / 2;
    reticle.y = this.app.screen.height / 2;

      reticle.rerender({
        width: this.app.screen.width / 2,
        height: this.app.screen.height / 2,
      });

    reticle.interactive = true;
    this.fixedCameraStage.addChild(reticle);

    let texture = generatePointNodeTexture(this.app.renderer);

    // TODO(bowei): move this code outta here!!
    // generate a texture
    let g = new Pixi.Graphics();
    g.beginFill(0xff8080);
    g.drawRoundedRect(
      - RenderedChunk.NODE_SIZE_PX / 2,
      - RenderedChunk.NODE_SIZE_PX / 2,
      RenderedChunk.NODE_SIZE_PX,
      RenderedChunk.NODE_SIZE_PX,
      RenderedChunk.NODE_ROUNDED_PX
    );
    // g.x = 200;
    // g.y = 200;
    // this.app.stage.addChild(g);
    let texture = this.app.renderer.generateTexture(g, Pixi.SCALE_MODES.NEAREST, 1);
    // const sprite = new Pixi.Sprite(texture);
    // sprite.x = 300;
    // sprite.y = 300;
    // this.app.stage.addChild(sprite);

    return;

import * as Pixi from "pixi.js";
export class Reticle {
  public container: Pixi.Graphics;
  constructor(args: {
  }) {
    this.container = new Pixi.Graphics();
    this.container.lineStyle(2, 0x999999);
    this.container.drawCircle(0, 0, 6);
    // this.container.x = this.app.screen.width / 2;
    // this.container.y = this.app.screen.height / 2;
    this.container.interactive = true;
    // this.onResize.push(() => {
    //   this.container.x = this.app.screen.width / 2;
    //   this.container.y = this.app.screen.height / 2;
    // })
  }
  public rerender(props: {
    width: number,
    height: number
  }) {
    this.container.x = props.width;
    this.container.y = props.height;
  }
}

import * as Pixi from "pixi.js";
import { RenderedChunkConstants } from "../RenderedChunk";
export function generatePointNodeTexture(renderer: Pixi.Renderer) {
    let g = new Pixi.Graphics();
    g.beginFill(0xff8080);
    g.drawRoundedRect(
      - RenderedChunkConstants.NODE_SIZE_PX / 2,
      - RenderedChunkConstants.NODE_SIZE_PX / 2,
      RenderedChunkConstants.NODE_SIZE_PX,
      RenderedChunkConstants.NODE_SIZE_PX,
      RenderedChunkConstants.NODE_ROUNDED_PX
    );
    // g.x = 200;
    // g.y = 200;
    // this.app.stage.addChild(g);
    let texture = renderer.generateTexture(g, Pixi.SCALE_MODES.NEAREST, 1);
    // const sprite = new Pixi.Sprite(texture);
    // sprite.x = 300;
    // sprite.y = 300;
    // this.app.stage.addChild(sprite);
  return texture;
}