'use strict';
import { PhaserScene } from '../../common/utils/const/phaser-scene-enum';
import Phaser from 'phaser';

import LoginDivPage from './menu-pages/login-div-page';
import OnlineRoomDivPage from './menu-pages/online-room-div-page';
import GameCreationDivPage from './menu-pages/game-creation-div-page';

import MenuPages from '../../assets/html/main-menu.html';
import Cover from '../../assets/twelveHeroes_cover.png';

export default class MainMenuScene extends Phaser.Scene {

  constructor(menuEventListener) {
    super({ key: PhaserScene.MAIN_MENU, active: false });
    this.menuEventListener = menuEventListener;

    this.username = '';
    this.previousPages = new Array();
  }

  preload() {
    this.load.image('game-cover', Cover);
  }


  // create is call automatically by Phaser engine
  create() {
    let background = this.add.image(0, 0, 'game-cover');
    background.setOrigin(0, 0);

    // Add main-menu HTML
    let element = this.add.dom(250, 0).createFromHTML(MenuPages);
    element.setPerspective(800);

    // Menu div pages
    this.loginDivPage = new LoginDivPage(element,this.loginPageListener());
    this.onlineRoomDivPage = new OnlineRoomDivPage(element, this.onlineRoomPageListener());
    this.gameCreationDivPage = new GameCreationDivPage(element, this.gameCreationPageListener());


    setTimeout(() => {
      this.loginDivPage.show();
      this.tweens.add({
        targets: element,
        y: 190,
        duration: 2300,
        ease: 'Power3'

      });

     }, 700);



    // TODO : Display main menu
    // Create new scenes : Local player room / Multi player room
    // Pass to them the event listener
    // On local player room, user can enter player names, selected color, game deck mode & rules

  }

  update() {
  }


  // Listener for login page events
  loginPageListener() {
    return {
      onRequestConnection: this.onRequestConnection.bind(this),
      onRequestDisconnection: this.onRequestDisconnection.bind(this),
      onGoOnlineRoom: this.onGoOnlineRoom.bind(this)
    };
  }

  // Listener for online room page events
  onlineRoomPageListener() {
    return {
      onRequestOnlineGamesList: this.onRequestOnlineGamesList.bind(this),
      onGoGameCreation: this.onGoGameCreation.bind(this),
      onGoPreviousPage: this.onGoPreviousPage.bind(this),
      onSetNewGameListenerCb: this.onSetNewGameListenerCb.bind(this),
      onUnsetNewGameListenerCb: this.onSetNewGameListenerCb.bind(this)
    };
  }

  // Listener for game creation page events
  gameCreationPageListener() {
    return {
      onGoPreviousPage: this.onGoPreviousPage.bind(this),
      onValidGameCreation: this.onValidGameCreation.bind(this),
      onGameCreated:this.onGameCreated.bind(this)
    };
  }

  // Callbacks implementation
  onGoPreviousPage(fromPage) {
    fromPage.hide();
    this.previousPages.pop().show();
  }

  // Login page specific
  onGoOnlineRoom() {

    this.loginDivPage.hide();
    this.previousPages.push(this.loginDivPage);
    this.onlineRoomDivPage.setConnectionStatus(this.loginDivPage.getConnectionStatus());
    this.onlineRoomDivPage.show();
  }
  onRequestConnection(username) {
    this.username=username;
    return this.menuEventListener.onTryConnect(username);
  }
  onRequestDisconnection() {
    this.menuEventListener.onRequestDisconnection();
  }

  // Online room specific
  onRequestOnlineGamesList() {
    return this.menuEventListener.onOnlineGamesListRequested(this.username);
  }

  onGoGameCreation() {
    this.onlineRoomDivPage.hide();
    this.previousPages.push(this.onlineRoomDivPage);
    this.gameCreationDivPage.show();
  }

  onSetNewGameListenerCb(callback) {
    this.menuEventListener.onSetNewGameListenerCb(callback);
  }
  onUnsetNewGameListenerCb() {
    this.menuEventListener.onUnsetNewGameListenerCb();
  }


  // Game cration div page specific

  onValidGameCreation(deckModeSelected, advancedOptions) {
    return this.menuEventListener.onGameCreationRequest(this.username, deckModeSelected, advancedOptions);
  }

  onGameCreated() {
    console.log('Game created, send user to game scene');
    this.gameCreationDivPage.hide();
    setTimeout(() => {
      alert('Sorry nothing more ! we are still coding the game part :)');
    }, 1000);
    // let gameDeckMode = "factions";
    // let advancedRules = [];
    // console.log("Calling listener");
    // this.menuEventListener.onNewPnpGame(pBlueName, pRedName, gameDeckMode, advancedRules)
  }

}