import { Component, ElementRef, inject, LOCALE_ID, ViewChild } from '@angular/core';
import Phaser from 'phaser';
import { MapScene } from './scene/map.scene';
import { MatDialog, MatDialogModule } from '@angular/material/dialog';
import { GameService } from './service/game.service';
import { ShipDialogComponent } from './components/dialog/ship-dialog/ship-dialog.component';
import { PlanetDialogComponent } from './components/dialog/planet-dialog/planet-dialog.component';
import { DragDropModule } from '@angular/cdk/drag-drop';
import { StatusBarComponent } from './components/status-bar/status-bar.component';
import { BuyComponent } from './components/ships/buy/buy.component';

import { registerLocaleData } from '@angular/common';
import localeDe from '@angular/common/locales/de';
import localeDeExtra from '@angular/common/locales/extra/de';
import { WelcomeComponent } from './components/tutorial/welcome/welcome.component';

registerLocaleData(localeDe, 'de-DE', localeDeExtra);

@Component({
  selector: 'app-root',
  imports: [MatDialogModule, ShipDialogComponent, PlanetDialogComponent, DragDropModule, StatusBarComponent, BuyComponent, WelcomeComponent],
  providers: [{ provide: LOCALE_ID, useValue: 'de-DE' }],
  templateUrl: './app.component.html',
  styleUrl: './app.component.scss'
})
export class AppComponent {

  public dialog = inject(MatDialog);
  public gameService = inject(GameService);

  @ViewChild('gameContainer', { static: true }) gameContainer!: ElementRef;

  ngAfterViewInit(): void {
    const scene = new MapScene();
    scene.gameService = this.gameService;

    const config: Phaser.Types.Core.GameConfig = {
      type: Phaser.AUTO,
      width: window.innerWidth,
      height: window.innerHeight,
      disableContextMenu: true,
      scale: {
        mode: Phaser.Scale.EXPAND,
        autoCenter: Phaser.Scale.CENTER_BOTH,

      },
      parent: this.gameContainer.nativeElement,
      backgroundColor: '#0c0e1a',
      scene: [scene],
      render: {
        pixelArt: false,
        antialias: true,
      },

      physics: {
        default: 'arcade',
        arcade: {
          debug: false,
          timeScale: 1
        }
      }
    };

    const game = new Phaser.Game(config);
  }

  stopPropagation(event: any) {
    event.stopPropagation();
  }
}
