"use strict"

let activeModal = null;

const newline = String.fromCharCode(160);
const version = "0.1.1";

let state;

let refreshHook;

function print(lines) {
  (lines.concat([newline])).forEach(line => {
    const log = document.querySelector("#log");
    const div = document.createElement("div");

    div.textContent = line;

    log.appendChild(div);
  });

  log.scrollTop = log.scrollHeight;
}

function refresh() {
  updateRoom(state);
  updateStatDisplay(state.info, "world");
  updateStatDisplay(state.player.stats, "player");
  updateStatDisplay(state.world[state.player.location].data.stats, "area");

  if (refreshHook) {
    refreshHook(state)
  }
}

function switchModal(to) {
  closeModal(activeModal);
  openModal(to);
}

function closeModal(modal) {
  const div = document.querySelector("#" + modal);
  div.classList.remove("modal");
  div.classList.add("hidden-modal");
}

function openModal(modal) {
  const div = document.querySelector("#" + modal);
  div.classList.remove("hidden-modal");
  div.classList.add("modal");

  activeModal = modal;
}

function returnToStart() {
  stopAllSound();
  stopAllTimers(state);
  setBackgroundColor(0, 0, 0);

  log.innerHTML = "";

  document.querySelector("#game").classList.remove("scene");
  document.querySelector("#game").classList.add("hidden-scene");
  document.querySelector("#pick").classList.remove("hidden-scene");
  document.querySelector("#pick").classList.add("scene");
}

// set up the game

function init(story) {
  state = {
    player: {
      items: {
        keys: [

        ]
      },
      rooms: {

      },
      flags: {

      }
    },
  };

  initWorld(story, state);
  initGame(story, state);

  story.intro.setup(state);

  initGamePostSetup(state);

  refreshHook = story.refresh;

  story.intro.intro(state);

  goToRoom(story.intro.start, state);
}

// set up the load screen

function initStart() {
  const versionFields = document.querySelectorAll(".version");
  const select = document.querySelector("#game-select");
  const options = {};

  versionFields.forEach(field => {
    field.textContent = "Version: " + version;
  });

  stories.forEach(story => {
    const option = document.createElement("option");
    option.value = story.id;
    option.textContent = story.name;
    select.appendChild(option);
    options[story.id] = story;
  })

  select.addEventListener("change", event => {
    const holder = document.querySelector("#tags");

    holder.innerHTML = "";

    const story = stories.filter(s => s.id == [event.target.value])[0];
    const tags = story.tags;

    initAudio(story);

    story.preload.forEach(sound => loadAudio(sound));

    tags.forEach(tag => {
      const div = document.createElement("div");
      div.textContent = tag;
      div.classList.add("tag");
      holder.appendChild(div);
    })
  });

  const start = document.querySelector("#start-button");

  start.addEventListener("click", (event) => {
    init(options[select.value]);
    document.querySelector("#pick").classList.remove("scene");
    document.querySelector("#pick").classList.add("hidden-scene");
    document.querySelector("#game").classList.remove("hidden-scene");
    document.querySelector("#game").classList.add("scene");
  });

  const gameMenuButton = document.querySelector("#game-menu-button");

  const menuSettings = document.querySelector("#menu-button-settings");
  const menuQuit = document.querySelector("#menu-button-quit");
  const menuResume = document.querySelector("#menu-button-resume");

  const menuSettingsVolume = document.querySelector("#menu-slider-volume");
  const menuSettingsClose = document.querySelector("#menu-button-settings-close");

  const menuQuitYes = document.querySelector("#menu-button-quit-yes");
  const menuQuitNo = document.querySelector("#menu-button-quit-no");

  gameMenuButton.addEventListener("click", () => openModal("menu"));

  menuSettings.addEventListener("click", () => switchModal("settings"));
  menuQuit.addEventListener("click", () => switchModal("quit"));
  menuResume.addEventListener("click", () => closeModal("menu"));

  menuSettingsVolume.addEventListener("input", () => {
    setVolume(parseFloat(menuSettingsVolume.value));
  })
  menuSettingsClose.addEventListener("click", () => switchModal("menu"));

  menuQuitYes.addEventListener("click", () => {
    closeModal("quit");
    returnToStart();
  });
  menuQuitNo.addEventListener("click", () => switchModal("menu"));
}

window.addEventListener("load", initStart);