# 6089902c6151f35f45c60588b5b4e0b503651546c975f620d5178fb76127f510 Elan 2.0.0-alpha4 valid

main
  variable score set to 0
  while true
    variable holes set to new List<of Hole>()
    call holes.intialise(10, Hole.vacant)
    variable hole set to Hole.vacant
    if random() > 0.5 then
      assign hole to Hole.mole
    end if
    variable html set to htmlForFullGame(holes, score)
    call displayHtml(html)
    variable limit set to clock() + 1000
    while clock() < limit
      call processKey(hole, score)
    end while
  end while
end main

procedure processKey(ho as Hole, score as Int)
  variable n set to getNumericKey()
  if n isnt -1 then
    if ho is Hole.mole then
      assign ho to Hole.hit
      assign score to score + 1
    elif ho is Hole.vacant then
      assign ho to Hole.miss
      assign score to score - 1
    end if
    variable html set to htmlForSimpleGame(ho, score)
    call displayHtml(html)
  end if
end procedure

enum Hole vacant, mole, hit, miss

function htmlForSimpleGame(h as Hole, score as Int) returns String
  variable core set to htmlForHole(h, "hole")
  return $"<style>{styleSheet}</style><div class='game'>{core}</div><div class='score'>Score: {score}</score>"
end function

function htmlForFullGame(holes as List<of Hole>, score as Int) returns String
  variable core set to ""
  for i in range(0, holes.length())
    assign core to core + htmlForHole(holes[i], i.toString())
  end for
  return $"<style>{styleSheet}</style><div class='game'>{core}</div><div class='score'>Score: {score}</score>"
end function

function htmlForHole(ho as Hole, label as String) returns String
  variable img set to imageForStatus()[ho]
  return $"<div class='hole'><img src='{img}'><div class='label'>{label}</div></div>"
end function

# Acknowledgement:  mole icon source https://www.flaticon.com/
constant vacantImg set to "https://elan-lang.org/documentation/worksheets/whack-a-mole/vacant.png"

constant moleImg set to "https://elan-lang.org/documentation/worksheets/whack-a-mole/mole.png"

constant hitImg set to "https://elan-lang.org/documentation/worksheets/whack-a-mole/hit.png"

constant missImg set to "https://elan-lang.org/documentation/worksheets/whack-a-mole/miss.png"

function imageForStatus() returns Dictionary<of Hole, String>
  return [Hole.vacant:vacantImg, Hole.mole:moleImg, Hole.hit:hitImg, Hole.miss:missImg]
end function

constant styleSheet set to "\n.game { display: flex; flex-direction: row; }\n.hole { display: flex; flex-direction: column; width: 50px; height: 50px; border: 10px solid white;}\n.label {width: 40px; text-align: center;}\n.hole img {height: 40px; width: 40px}\n.score{ margin-top: 20px;}"
