import { Component, OnInit, inject } from '@angular/core';
import { CurrentLocationConnection } from '../../core/api/game-api.models';
import { LocationNodeComponent } from './location-node.component';
import { TravelPanelComponent } from './travel-panel.component';
import { WorldStore } from './world.store';

@Component({
  selector: 'app-world-page',
  imports: [LocationNodeComponent, TravelPanelComponent],
  templateUrl: './world-page.component.html',
  styleUrl: './world-page.component.scss',
})
export class WorldPageComponent implements OnInit {
  protected readonly worldStore = inject(WorldStore);
  protected readonly mapBackground =
    "url('/images/backgrounds/runtime/map_ashen_realm-1440.jpg'), url('/images/backgrounds/map_ashen_realm.png')";

  ngOnInit(): void {
    void this.worldStore.load();
  }

  protected selectConnection(connection: CurrentLocationConnection): void {
    if (!this.worldStore.loading() && this.worldStore.currentTravel()?.status === 'IDLE') {
      this.worldStore.selectConnection(connection);
    }
  }

  protected retry(): void {
    void this.worldStore.load();
  }
}
