mirror of
				https://github.com/ZetaKebab/japanese-conjugation-drill.git
				synced 2025-10-31 06:19:49 +00:00 
			
		
		
		
	Added history view and question count.
This commit is contained in:
		| @@ -11,6 +11,7 @@ body { | |||||||
| #question { | #question { | ||||||
|   padding-top: 40px; |   padding-top: 40px; | ||||||
|   font-size: 40px; |   font-size: 40px; | ||||||
|  |   text-shadow: 2px 2px 4px #808080; | ||||||
|   padding-bottom: 40px; |   padding-bottom: 40px; | ||||||
|   margin-left: auto; |   margin-left: auto; | ||||||
|   margin-right: auto; |   margin-right: auto; | ||||||
|   | |||||||
| @@ -9,6 +9,8 @@ | |||||||
|   </head> |   </head> | ||||||
|   <body> |   <body> | ||||||
|  |  | ||||||
|  |     <div class="quizSection"> | ||||||
|  |  | ||||||
|       <div class="questionOuter"> |       <div class="questionOuter"> | ||||||
|         <div id="question"></div> |         <div id="question"></div> | ||||||
|       </div> |       </div> | ||||||
| @@ -33,6 +35,10 @@ | |||||||
|    |    | ||||||
|       </div> |       </div> | ||||||
|    |    | ||||||
|  |       <div id="history"> | ||||||
|  |       </div> | ||||||
|  |    | ||||||
|  |     </div> | ||||||
| <!-- | <!-- | ||||||
|     <h2>Conjugator</h2> |     <h2>Conjugator</h2> | ||||||
|  |  | ||||||
|   | |||||||
| @@ -127,6 +127,8 @@ var words = [ | |||||||
|   } |   } | ||||||
| ] | ] | ||||||
|  |  | ||||||
|  | var log = { "history": [] }; | ||||||
|  |  | ||||||
| Array.prototype.randomElement = function () { | Array.prototype.randomElement = function () { | ||||||
|   return this[Math.floor(Math.random() * this.length)] |   return this[Math.floor(Math.random() * this.length)] | ||||||
| } | } | ||||||
| @@ -399,6 +401,8 @@ function generateVerbQuestion() { | |||||||
|   console.log("Answer = " + answer); |   console.log("Answer = " + answer); | ||||||
|  |  | ||||||
|   $('#question').text(question); |   $('#question').text(question); | ||||||
|  |  | ||||||
|  |   window.question = question; | ||||||
|   window.answer = answer; |   window.answer = answer; | ||||||
|   window.answer2 = answer2; |   window.answer2 = answer2; | ||||||
|  |  | ||||||
| @@ -409,6 +413,10 @@ function generateVerbQuestion() { | |||||||
|   $('#proceed').hide(); |   $('#proceed').hide(); | ||||||
|   $('#input').show(); |   $('#input').show(); | ||||||
|   $('#answer').focus(); |   $('#answer').focus(); | ||||||
|  |  | ||||||
|  |   if (log.start == undefined) { | ||||||
|  |     log.start = Date.now(); | ||||||
|  |   } | ||||||
| } | } | ||||||
|  |  | ||||||
| function processAnswer() { | function processAnswer() { | ||||||
| @@ -417,6 +425,13 @@ function processAnswer() { | |||||||
|   var correct = ((response == window.answer) || (response == window.answer2)); |   var correct = ((response == window.answer) || (response == window.answer2)); | ||||||
|   var klass = correct ? "correct" : "incorrect"; |   var klass = correct ? "correct" : "incorrect"; | ||||||
|  |  | ||||||
|  |   log.history.push({ | ||||||
|  |     "question" : window.question, | ||||||
|  |     "response" : response, | ||||||
|  |     "answer"   : window.answer, | ||||||
|  |     "correct"  : correct | ||||||
|  |   }); | ||||||
|  |  | ||||||
|   $('#answer').val(""); |   $('#answer').val(""); | ||||||
|   $('#response').prop('class', klass).text(response); |   $('#response').prop('class', klass).text(response); | ||||||
|   $('#next').prop('disabled', false); |   $('#next').prop('disabled', false); | ||||||
| @@ -430,11 +445,61 @@ function processAnswer() { | |||||||
|   $('#input').hide(); |   $('#input').hide(); | ||||||
|   $('#proceed').show(); |   $('#proceed').show(); | ||||||
|   $('#proceed input').focus(); |   $('#proceed input').focus(); | ||||||
|  |  | ||||||
|  |   if (log.end == undefined) { | ||||||
|  |     log.end = Date.now(); | ||||||
|  |   } | ||||||
|  |  | ||||||
|  |   updateHistoryView(log); | ||||||
|  | } | ||||||
|  |  | ||||||
|  | function updateHistoryView(log) { | ||||||
|  |   var review = $('<table>'); | ||||||
|  |  | ||||||
|  |   var total = 0; | ||||||
|  |   var correct = 0; | ||||||
|  |  | ||||||
|  |   log.history.forEach(function (entry) { | ||||||
|  |  | ||||||
|  |     total++; | ||||||
|  |  | ||||||
|  |     if (entry.correct) { | ||||||
|  |       correct++; | ||||||
|  |     } | ||||||
|  |  | ||||||
|  |     var tr = $('<tr>'); | ||||||
|  |  | ||||||
|  |     var td1 = $('<td>');  | ||||||
|  |     var td2 = $('<td>');  | ||||||
|  |     var td3 = $('<td>');  | ||||||
|  |     var td4 = $('<td>');  | ||||||
|  |  | ||||||
|  |     td1.text(entry.question); | ||||||
|  |     td2.text(entry.answer); | ||||||
|  |     td3.text(entry.response); | ||||||
|  |     td4.text(entry.correct); | ||||||
|  |  | ||||||
|  |     tr.append(td1); | ||||||
|  |     tr.append(td2); | ||||||
|  |     tr.append(td3); | ||||||
|  |     tr.append(td4); | ||||||
|  |  | ||||||
|  |     review.append(tr); | ||||||
|  |   }); | ||||||
|  |  | ||||||
|  |   $('#history').empty().append(review); | ||||||
|  |  | ||||||
|  |   $('#history').append("<p>" + correct + " of " + total + " correct.</p>"); | ||||||
|  |   $('#history').append("<p>" + ((log.end - log.start) / 1000.0) + " seconds.</p>"); | ||||||
| } | } | ||||||
|  |  | ||||||
| function proceed() { | function proceed() { | ||||||
|  |   if (log.history.length == 10) { | ||||||
|  |     console.log("Finished."); | ||||||
|  |   } else { | ||||||
|     generateVerbQuestion(); |     generateVerbQuestion(); | ||||||
|   } |   } | ||||||
|  | } | ||||||
|  |  | ||||||
| $('window').ready(function() { | $('window').ready(function() { | ||||||
|   generateVerbQuestion(); |   generateVerbQuestion(); | ||||||
|   | |||||||
		Reference in New Issue
	
	Block a user
	 doncr
					doncr