guillaume
/
nikoli
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Display error messages in a list below the grid

master
Guillaume Dott 2014-12-12 12:57:51 +01:00
parent f96725b822
commit ccf4492e88
2 changed files with 34 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
views/application.coffee
View File

@ -35,17 +35,41 @@ class Nikoli.Game
congratulations.classList.add 'hide'
@board.appendChild congratulations
errors = document.createElement 'ul'
errors.classList.add 'errors'
errors.classList.add 'hide'
@board.appendChild errors
check: ->
errors = @errors()
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')
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) ->
@game = game if game?
@board.querySelector('.congratulations').classList.remove('show')
@board.querySelector('.errors').classList.remove('show')
@grid.innerHTML = ''
@game.forEach((row, i) =>
row_elem = new Nikoli.Row().create()
@ -71,8 +95,6 @@ class Nikoli.Game
@newgame() unless @game?
newgame: ->
@board.querySelector('.congratulations').classList.remove('show')
xmlhttp = new XMLHttpRequest()
xmlhttp.open("GET", "#{@url}/#{@file}.json")

12
views/application.scss
View File

@ -62,15 +62,21 @@ ul {
font-size: 1.2em;
}
.congratulations {
background-color: #4a4;
color: #060;
.congratulations, .errors {
font-weight: bold;
padding: 20px 0;
margin: 10px 0;
border-radius: 3px;
display: none;
}
.congratulations {
background-color: #4a4;
color: #060;
}
.errors {
background-color: #a44;
color: #600;
}
.show {
display: block;