/**
 * Usage:
 * class RenderedChunk {
 *  constructor(stateUpdaterQueue) {
 *    this.nodes = 0...10.map(i => new RenderedPointNode({texture, new NodeRef(i), stateUpdaterQueue}))
 *    // this.nodes[0].render({ some, stuff })
 *    this.nodes[0] should listen to gameState.playerUI.selectedPointNode and allocatedPointNodes, and
 *    updating gameState.playerUI.selectedPointNode or gameState.playerSave.allocatedPointNodes or their 
 *       parents should trigger queueing of the rerender
 *    or rather, rerendering
 *  }
 * }
 */

  constructor(args: { texture: Pixi.Texture, selfPointNodeRef: PointNodeRef }) {

  // args here will never change, and changing this will NOT force a rerender
  constructor(args: {
    texture: Pixi.Texture,
    selfPointNodeRef: PointNodeRef,
    stateUpdaterQueue: [Function],
    ticker: Pixi.Ticker
  }) {

    this.sprite.buttonMode = true;

      this.justClicked = true;

      args.stateUpdaterQueue.push(this.onClick.bind(this));
      // this.justClicked = true;
      // do 3 things:
      // 1. queue up the necessary state changes, to be executed on tick
      // 2. mark other components that need rerendering based on state change
      // 3. do all the rerenders

    args.ticker.add(this.animate.bind(this));

  private setTint(args: { isSelected: boolean, isAllocated: boolean }) {
    if (args.isAllocated) {
      this.sprite.tint = 0x00AAFF;

  public animate(delta: number) {      
    // TODO(bowei): make the (0,0) node in a chunk shimmer? or somehow visually distinguish it
  }
  public onClick(args: { gameState: GameState, gameStateUpdater: UpdaterGeneratorType<GameState>, entityUpdaterQueue: [any] }) {
    // 1. update the state(s)
    if (args.gameState.playerUI.selectedPointNode?.pointNodeId == this.selfPointNodeRef.pointNodeId) {
      // if we were already selected, allocate us
      // TODO(bowei): this code block should be somewhere else????
      args.gameStateUpdater.playerSave.allocatedPointNodeSet.update(set => {
        set.put(this.selfPointNodeRef);
        return set;
      })
      args.gameStateUpdater.playerSave.allocatedPointNodeHistory.update(history => {
        history.push(this.selfPointNodeRef);
        return history;
      })

      if (args.isSelected) {
        this.sprite.tint = 0xBBBBBB;
      } else {
        this.sprite.tint = 0xFFFFFF;
      }

      // otherwise, set selected node to us
      args.gameStateUpdater.playerUI.selectedPointNode.set(this.selfPointNodeRef);

  }

    // 2. manually mark necessary changed components?? or autodeduce based on dependencies??

  private isSelected(gameState: DeepReadonly<GameState>): boolean {
    return gameState.playerUI.selectedPointNode?.pointNodeId == this.selfPointNodeRef.pointNodeId;

    // 3. do the rerenders (someone else handles this...)

  private isAllocated(gameState: DeepReadonly<GameState>): boolean {
    return gameState.playerSave.allocatedPointNodeSet.get(this.selfPointNodeRef)

  public rerender(props: { isSelected: boolean, isAllocated: boolean }) {
    this.setTint(props);

  public update(args: {
    gameState: DeepReadonly<GameState>, gameStateUpdater: UpdaterGeneratorType<GameState>,
    renderedNodeMap: DeepReadonly<HashMap<PointNodeRef, RenderedPointNode>>
  }) {
    let { gameState, gameStateUpdater } = args;
    // sync ourselves with state
    let isSelected = this.isSelected(gameState);
    let isAllocated = this.isAllocated(gameState);

    if (this.justClicked) {
      if (!gameState.playerUI.selectedPointNode) {
      // if nothing is is selected, select ourselves;
        isSelected = true;
        this.setTint({ isSelected, isAllocated });
        gameStateUpdater.playerUI.selectedPointNode.set(this.selfPointNodeRef);
      } else if (gameState.playerUI.selectedPointNode.pointNodeId == this.selfPointNodeRef.pointNodeId) {
        // if we were already selected, try to allocate ourselves

  // public rerenderFromState(gameState: DeepReadonly<GameState>) {
  //   this.rerender({
  //     isSelected: this.isSelected(gameState),
  //     isAllocated: this.isAllocated(gameState)
  //   })
  // }

        if (!isAllocated) {
          isAllocated = true;
          // save our allocation to state
          // TODO(bowei): this code block should be somewhere else????
          gameStateUpdater.playerSave.allocatedPointNodeSet.update(set => {
            set.put(this.selfPointNodeRef);
            return set;
          })
          gameStateUpdater.playerSave.allocatedPointNodeHistory.update(history => {
            history.push(this.selfPointNodeRef);
            return history;
          })
        }
        this.setTint({ isSelected, isAllocated });

  private setTint(args: { isSelected: boolean, isAllocated: boolean }) {
    if (args.isAllocated) {
      this.sprite.tint = 0x00AAFF;
    } else {
      if (args.isSelected) {
        this.sprite.tint = 0xBBBBBB;

        // if something other than ourselves is selected, unselect it and select ourselves;
        isSelected = true;
        let otherNode = args.renderedNodeMap.get(gameState.playerUI.selectedPointNode);
        gameStateUpdater.playerUI.selectedPointNode.set(this.selfPointNodeRef);
        otherNode.setTint({
          isSelected: false,
          isAllocated: otherNode.isAllocated(gameState)
        });
        this.setTint({ isSelected: true, isAllocated})

        this.sprite.tint = 0xFFFFFF;

    // don't forget to reset state!
    this.justClicked = false;

//  public isSelected(gameState: DeepReadonly<GameState>): boolean {
//    return gameState.playerUI.selectedPointNode?.pointNodeId == this.selfPointNodeRef.pointNodeId;
//  }
//
//  public isAllocated(gameState: DeepReadonly<GameState>): boolean {
//    return gameState.playerSave.allocatedPointNodeSet.get(this.selfPointNodeRef)
//  }
// 
//   public update(args: {
//     gameState: DeepReadonly<GameState>, gameStateUpdater: UpdaterGeneratorType<GameState>,
//     renderedNodeMap: DeepReadonly<HashMap<PointNodeRef, RenderedPointNode>>
//   }) {
//     let { gameState, gameStateUpdater } = args;
//     // sync ourselves with state
//     let isSelected = this.isSelected(gameState);
//     let isAllocated = this.isAllocated(gameState);
// 
//     if (this.justClicked) {
//       if (!gameState.playerUI.selectedPointNode) {
//       // if nothing is is selected, select ourselves;
// 
//         isSelected = true;
//         this.setTint({ isSelected, isAllocated });
//         gameStateUpdater.playerUI.selectedPointNode.set(this.selfPointNodeRef);
// 
//       } else if (gameState.playerUI.selectedPointNode.pointNodeId == this.selfPointNodeRef.pointNodeId) {
//         // if we were already selected, try to allocate ourselves
// 
//         if (!isAllocated) {
//           isAllocated = true;
//           // save our allocation to state
//           // TODO(bowei): this code block should be somewhere else????
//           gameStateUpdater.playerSave.allocatedPointNodeSet.update(set => {
//             set.put(this.selfPointNodeRef);
//             return set;
//           })
//           gameStateUpdater.playerSave.allocatedPointNodeHistory.update(history => {
//             history.push(this.selfPointNodeRef);
//             return history;
//           })
//         }
//         this.setTint({ isSelected, isAllocated });
//       } else {
//         // if something other than ourselves is selected, unselect it and select ourselves;
// 
//         isSelected = true;
//         let otherNode = args.renderedNodeMap.get(gameState.playerUI.selectedPointNode);
//         gameStateUpdater.playerUI.selectedPointNode.set(this.selfPointNodeRef);
//         otherNode.setTint({
//           isSelected: false,
//           isAllocated: otherNode.isAllocated(gameState)
//         });
//         this.setTint({ isSelected: true, isAllocated})
//       }
//     }
//     // don't forget to reset state!
//     this.justClicked = false;
//   }