Display error messages in a list below the grid
parent
f96725b822
commit
ccf4492e88
|
@ -35,17 +35,41 @@ class Nikoli.Game
|
||||||
congratulations.classList.add 'hide'
|
congratulations.classList.add 'hide'
|
||||||
@board.appendChild congratulations
|
@board.appendChild congratulations
|
||||||
|
|
||||||
|
errors = document.createElement 'ul'
|
||||||
|
errors.classList.add 'errors'
|
||||||
|
errors.classList.add 'hide'
|
||||||
|
@board.appendChild errors
|
||||||
|
|
||||||
check: ->
|
check: ->
|
||||||
errors = @errors()
|
errors = @errors()
|
||||||
|
|
||||||
if errors.length == 0
|
if errors.length == 0
|
||||||
|
[].forEach.call @board.querySelectorAll('.error'), (cell) ->
|
||||||
|
cell.classList.remove 'error'
|
||||||
|
@board.querySelector('.errors').classList.remove('show')
|
||||||
@board.querySelector('.congratulations').classList.add('show')
|
@board.querySelector('.congratulations').classList.add('show')
|
||||||
else
|
else
|
||||||
alert errors.map((el) -> el.message).join()
|
errors_elem = @board.querySelector('.errors')
|
||||||
|
errors_elem.innerHTML = ''
|
||||||
|
|
||||||
|
errors.forEach (error) =>
|
||||||
|
error_cell = @board.querySelector("[data-row=\"#{error.row}\"][data-column=\"#{error.column}\"]")
|
||||||
|
error_cell.classList.add 'error'
|
||||||
|
|
||||||
|
li = document.createElement('li')
|
||||||
|
li.innerHTML = error.message
|
||||||
|
|
||||||
|
errors_elem.appendChild li
|
||||||
|
|
||||||
|
@board.querySelector('.congratulations').classList.remove('show')
|
||||||
|
errors_elem.classList.add('show')
|
||||||
|
|
||||||
generate: (game, solution = false, cell_class = Nikoli.Cell) ->
|
generate: (game, solution = false, cell_class = Nikoli.Cell) ->
|
||||||
@game = game if game?
|
@game = game if game?
|
||||||
|
|
||||||
|
@board.querySelector('.congratulations').classList.remove('show')
|
||||||
|
@board.querySelector('.errors').classList.remove('show')
|
||||||
|
|
||||||
@grid.innerHTML = ''
|
@grid.innerHTML = ''
|
||||||
@game.forEach((row, i) =>
|
@game.forEach((row, i) =>
|
||||||
row_elem = new Nikoli.Row().create()
|
row_elem = new Nikoli.Row().create()
|
||||||
|
@ -71,8 +95,6 @@ class Nikoli.Game
|
||||||
@newgame() unless @game?
|
@newgame() unless @game?
|
||||||
|
|
||||||
newgame: ->
|
newgame: ->
|
||||||
@board.querySelector('.congratulations').classList.remove('show')
|
|
||||||
|
|
||||||
xmlhttp = new XMLHttpRequest()
|
xmlhttp = new XMLHttpRequest()
|
||||||
xmlhttp.open("GET", "#{@url}/#{@file}.json")
|
xmlhttp.open("GET", "#{@url}/#{@file}.json")
|
||||||
|
|
||||||
|
|
|
@ -62,15 +62,21 @@ ul {
|
||||||
font-size: 1.2em;
|
font-size: 1.2em;
|
||||||
}
|
}
|
||||||
|
|
||||||
.congratulations {
|
.congratulations, .errors {
|
||||||
background-color: #4a4;
|
|
||||||
color: #060;
|
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
padding: 20px 0;
|
padding: 20px 0;
|
||||||
margin: 10px 0;
|
margin: 10px 0;
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
.congratulations {
|
||||||
|
background-color: #4a4;
|
||||||
|
color: #060;
|
||||||
|
}
|
||||||
|
.errors {
|
||||||
|
background-color: #a44;
|
||||||
|
color: #600;
|
||||||
|
}
|
||||||
|
|
||||||
.show {
|
.show {
|
||||||
display: block;
|
display: block;
|
||||||
|
|
Loading…
Reference in New Issue