ucfopen#9 Interaction with the pre-submit alert dialog is a lot bette…

…r now.

src/player.coffee

@@ -500,7 +500,6 @@ Namespace('Crossword').Engine = do ->
 		if preventDefault then keyEvent.preventDefault()
 
 	_cluesFocused = (e) ->
-		console.log 'clue list focused'
 		e.preventDefault()
 		_dom('clue-reader').innerHTML = ''
 		_updateClueReader()
@@ -942,11 +941,13 @@ Namespace('Crossword').Engine = do ->
 		ab.find('.submit').unbind('click').click ->
 			_hideAlert()
 			action()
+		ab.focus()
 
 	# hide it
 	_hideAlert = ->
 		_dom('alertbox').classList.remove 'show'
 		_dom('backgroundcover').classList.remove 'show'
+		_dom('clues').focus()
 
 	# called after confirm dialog
 	_getHint = (index) ->

src/player.html

@@ -31,10 +31,11 @@
 				aria-label='Use the Tab key to select the list of clues.'></h1>
 			<div class='icon-print' id='printbtn' title='Print' aria-hidden></div>
 			<div class='icon-zoomout' id='zoomout' title='Zoom Out' aria-hidden></div>
-			<div id='submit-progress-reader' class='reader-instructions'>There are empty letter tiles.</div>
 			<div class='submitholder'>
-				<input type='button' id='checkBtn'
-					class='button submit'
+				<div id='submit-progress-reader' class='reader-instructions'>There are empty letter tiles.</div>
+				<input id='checkBtn'
+					type='button'
+					class='submit button'
 					value='Submit Answers'
 					aria-describedby='submit-progress-reader'
 					tabindex='3'>
@@ -97,10 +98,13 @@
 		</div>
 
 		<div id='backgroundcover' class='fade'></div>
-		<div id='alertbox' class='fade'>
+		<div id='alertbox' class='fade' tabindex='4'>
 			<div id='alertcaption'></div>
 			<input id='cancelbtn' class='cancel button' type='button'>
-			<input id='okbtn' class='submit button' type='button'>
+			<input id='okbtn'
+				type='button'
+				class='submit button'
+				aria-describedby='submit-progress-reader'>
 		</div>
 
 		<div id='t_hints' style='display:none' class="clue">

src/player.scss

@@ -432,7 +432,7 @@ input {
 	z-index: 10000;
 	box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
 	text-align: center;
-	opacity: 0;
+	display: none;
 	z-index: -5;
 
 	.button {
@@ -451,7 +451,7 @@ input {
 	}
 
 	&.show {
-		opacity: 1;
+		display: block;
 		z-index: 10000;
 	}
 }