var WindowSize
var ColorCount = 11, ClassCount = 3, ClassName = ["hippo", "fleder", "hepta"]
colorkey = ((0, 0, 1), (1, 0, 0), (1, 0.5, 0.), (0.6, 0.6, 0.6), (0.5, 0, 0.5),
  (1, 0.6, 0.9), (1, 1, 0), (0.75, 0.4, 0), (1, 1, 1), (0.2, 0.2, 0.2), (0, 1, 0))
var ColorCode = ["#00F", "#F00", "#F81", "#888", "#707", "#F8D", "#FF0", "#840", "#FFF", "#333", "#0F0"]
var ColorName = ["a", "b", "c", "d", "e", "f", "g", "h", "i", "j", "k"]
var CurrentColor
var DefaultPlayerKey = [[ 37, 38, 39 ],  // Left, Up, Right arrows
                       [[49,97], [50,98], [51,99]],  // 1, 2, 3
                       [[74,72], [75,84], [76,78]],  // J, K, L, or H, T, N
                       [[55,103], [56,104], [57,105]]]  // 7, 8, 9
var BackgroundPos = [0, 0]

function returnfalse() { return false }

function iskey(key, who, what) {
  var i
  keycomp = DefaultPlayerKey[who][what]
  if (key == keycomp) return true
  for (i in keycomp) {
    if (key == keycomp[i]) return true
  }
  return false
}

// Step 1 - automatically set the window size
function SetWindowSize() {
  ChangeStatus("Determining window size....")
  WindowSize = [document.body.clientWidth, document.body.clientHeight]
  if (WindowSize[0] < 100) WindowSize[0] = document.documentElement.clientWidth
  if (WindowSize[1] < 100) WindowSize[1] = document.documentElement.clientHeight
  if (WindowSize[0] < 100 || WindowSize[1] < 100) {
    document.onmouseup = ClickWindowSize
    alert("Close this box, and then click on the lower-right corner of your browser window.")
  } else {
    ChangeStatus("Window size: " + WindowSize[0] + " by " + WindowSize[1] + " pixels")
    setTimeout("GetPlayerCount()", 100)
  }
}
function ClickWindowSize(what) {
  if (typeof event != 'undefined') WindowSize = [event.clientX, event.clientY]
  else if (what.clientX) WindowSize = [what.clientX, what.clientY]
  if (WindowSize[0] < 100 || WindowSize[1] < 100) {
    WindowSize = [400, 400]
    alert("Window size set to default: 400 by 400 pixels")
  }
  ChangeStatus("Window size: " + WindowSize[0] + " by " + WindowSize[1] + " pixels")
  setTimeout("GetPlayerCount()", 100)
  return false
}

// Step 2 - get the number of players from the user
function GetPlayerCount() {
  ChangeStatus("Select Number of Players.")
  document.getElementById("info1").style.visibility = "visible"
  document.getElementById("pc").style.left = (WindowSize[0] / 2 - 160) + "px"
  PlayerCount = 2
  document.onmouseup = returnfalse
  document.onkeydown = KeyPlayerCount
  UpdatePlayerCount()
}
function UpdatePlayerCount() {
  for (i = 2; i <= 4; ++i)
    document.getElementById("pc" + i).style.borderWidth = ((i == PlayerCount) ? "4px" : "0")
}
function KeyPlayerCount(what) {
  Key = ((typeof event != "undefined") ? event.keyCode : what.which)
  SelectionDone = false
  switch(Key) {
    case 37: case 57387: PlayerCount = (PlayerCount == 4 ? 3 : 2); break;
    case 39: case 57388: PlayerCount = (PlayerCount == 2 ? 3 : 4); break;
    case 50: case 51: case 52: PlayerCount = Key - 48;
    case 13: SelectionDone = true; break;
  }
  UpdatePlayerCount()
  if (SelectionDone) {
    document.onkeydown = returnfalse
    setTimeout("ChooseColors()", 200)
  }
  return false;
}


// Step 3 - Choose colors
function ChooseColors() {
  document.getElementById("pc").style.display = "none"
  for (i = 0; i < ColorCount; ++i)
    document.getElementById("col" + i).style.background = ColorCode[i]
  document.getElementById("cols").style.left = WindowSize[0] / 2 - 300 + "px"
  document.getElementById("cols").style.visibility = "visible"
  document.onkeydown = KeyColor
  PlayerColor = new Array(PlayerCount)
  WhichPlayer = 0
  ChooseColorSetup()
  document.getElementById("info1").style.visibility = "hidden"
  document.getElementById("info2").style.visibility = "visible"
}
function ChooseColorSetup() {
  document.getElementById("key" + (WhichPlayer + 1)).style.visibility = "visible"
  document.getElementById("key" + (WhichPlayer + 1)).style.left = WindowSize[0] / 2 - 72 + "px"
  ChangeStatus("Player " + (WhichPlayer + 1) + " choose color.")
  if (WhichPlayer) document.getElementById("col" + PlayerColor[WhichPlayer - 1]).style.display = "none"
  CurrentColor = -1
  do {
    ++CurrentColor
    Okay = true
    for (x in PlayerColor) if (CurrentColor == PlayerColor[x]) Okay = false
  } while (!Okay)
  UpdateColor();
}
function UpdateColor() {
  for (i = 0; i < ColorCount; ++i) {
    document.getElementById("col" + i).style.width = ((i == CurrentColor) ? 64 : 32) + "px"
    document.getElementById("col" + i).style.height = ((i == CurrentColor) ? 64 : 32) + "px"
  }
}
function KeyColor(what) {
  Key = ((typeof event != "undefined") ? event.keyCode : what.which)
  SelectionDone = false
  ChangeStatus(Key)
  if (iskey(Key, WhichPlayer, 1)) {
    SelectionDone = true
  } else if (iskey(Key, WhichPlayer, 0)) {
    do {
      CurrentColor = (CurrentColor || ColorCount) - 1
      Okay = true
      for (x in PlayerColor) if (CurrentColor == PlayerColor[x]) Okay = false
    } while (!Okay);
  } else if (iskey(Key, WhichPlayer, 2)) {
    do {
      CurrentColor = (CurrentColor == ColorCount - 1 ? 0 : CurrentColor + 1)
      Okay = true
      for (x in PlayerColor) if (CurrentColor == PlayerColor[x]) Okay = false
    } while (!Okay);
  }
  UpdateColor()
  if (SelectionDone) {
    document.getElementById("key" + (WhichPlayer + 1)).style.visibility = "hidden"
    PlayerColor[WhichPlayer] = CurrentColor
    if (++WhichPlayer == PlayerCount) {
      document.getElementById("cols").style.display = "none"
      document.onkeydown = returnfalse
      setTimeout("ChooseShips()", 200)
    } else
      setTimeout("ChooseColorSetup()", 10)
  }
  return false
}

// Step 4 - Choose ships
function ChooseShips() {
  ChangeStatus("Choose your ships. Use left and right to cycle between ships, and thrust to select")
  document.getElementById("info2").style.visibility = "hidden"
  document.getElementById("info3").style.visibility = "visible"
  ShipClass = new Array(PlayerCount)
  DescripImage = new Array(ClassCount)
  SelectionDone = new Array(PlayerCount)
  SelectCount = PlayerCount
  for (i = 0; i < ClassCount; ++i)
    (DescripImage[i] = new Image()).src = ClassName[i] + "/description.png"
  for (i = 0; i < PlayerCount; ++i) {
    Box = document.getElementById("ps" + i)
    Box.style.borderColor = ColorCode[PlayerColor[i]]
    Box.style.left = ((WindowSize[0] - PlayerCount * 160) / 2 + i * 160) + "px"
    Box.style.visibility = "visible"
    Keys = document.getElementById("key" + (i + 1))
    Keys.style.borderColor = ColorCode[PlayerColor[i]]
    Keys.style.left = Box.style.left
    Keys.style.top = "400px"
    Keys.style.visibility = "visible"
    ShipClass[i] = 0;
    UpdateShipSelect(i)
    SelectionDone[i] = false
  }
  for (i = PlayerCount; i < 4; ++i)
    document.getElementById("ps" + i).style.display = "none"
  document.onkeydown = KeyShipChoose
}
function UpdateShipSelect(Whose) {
  document.getElementById("pi" + Whose).src = ClassName[ShipClass[Whose]] + "/" + ColorName[PlayerColor[Whose]] + "0.png"
  document.getElementById("pd" + Whose).src = DescripImage[ShipClass[Whose]].src
}
function KeyShipChoose(what) {
  Key = ((typeof event != "undefined") ? event.keyCode : what.which)
  for (i = 0; i < PlayerCount; ++i) {
    if (iskey(Key, i, 0) && !SelectionDone[i]) {
      ShipClass[i] = (ShipClass[i] || ClassCount) - 1
      UpdateShipSelect(i)
    }
    if (iskey(Key, i, 1)) {
      if (SelectionDone[i]) {
        SelectionDone[i] = false
        document.getElementById("ps" + i).style.visibility = "visible"
        ++SelectCount
      } else {
        SelectionDone[i] = true
        document.getElementById("ps" + i).style.visibility = "hidden"
        if (--SelectCount == 0) setTimeout("BeginGame()", 10)
      }
    }
    if (iskey(Key, i, 2) && !SelectionDone[i]) {
      ShipClass[i] = ((ShipClass[i] == ClassCount - 1) ? 0 : ShipClass[i] + 1)
      UpdateShipSelect(i)
    }
  }
  return false;
}

function BeginGame() {
  ChangeStatus("Ready to begin the game!")
  ScrollingBackground = false
  ParameterString = PlayerCount + ""
  for (x in PlayerColor) ParameterString += PlayerColor[x]
  for (x in ShipClass) ParameterString += ShipClass[x]
  ParameterString += "-" + WindowSize[0] + "-" + WindowSize[1]
  window.location = "game.html?" + ParameterString
}


function ScrollBackground() {
  if (ScrollingBackground) setTimeout("ScrollBackground()", 100)
  BackgroundPos[0]--, BackgroundPos[1]++
  document.body.style.backgroundPosition = BackgroundPos[0] + "px " + BackgroundPos[1] + "px"
}

function go() {
  ScrollingBackground = true; ScrollBackground()
  SetWindowSize();
}

function ChangeStatus(Message) {
  window.status = Message
}