Kanji Reading

{{FrontSide}}
<p class="english">{{FocusReading}}</p>
<div class="box">

<div class="notes" class="animated fadeInUp"><blockquote class="webkit-indent-blockquote" style="margin: 0 0 0 40px; border: none; padding: 0px;">
<span style="font-family: Century Gothic;">on:</font> <span style=" font-size: 1.25em;">{{Onyomi (WK)}}</span><br>
<span style="font-family: Century Gothic;">kun:</font> <span style=" font-size: 1.25em;">{{Kunyomi (WK)}}</span>
</blockquote></div><br/>

<p class="alt-english"><span style="font-size: 25px">{{Meaning}}</span></p>{{#Subtitle}}
<p id="altmean" class="alt-english">{{Subtitle}}</p>{{/Subtitle}}<br/>

<div class="english-notes" class="animated fadeInUp">
radicals: {{Radicals}}{{#Components}} | elements: {{Components}}{{/Components}}</div><hr/>
<details><summary><span class="english-notes">Nanori & Reading Compounds</span></summary>
<p><div class="english-notes" class="animated fadeInUp">
<blockquote style="text-align: left" class="webkit-indent-blockquote" style="margin: 0 0 0 40px; border: none; padding: 0px;">nanori: {{Nanori}}<br/><br/>
{{furigana:Examples}}</blockquote></div></p></p></details>{{#Examples}}<hr/>{{/Examples}}

{{#Meaning Mnemonic}}<div class="mnemonics"><details><summary>Mnemonics</summary><p style="text-align: left; margin: 30px;">
<font color="#764EBE"><b>Meaning</b>:</font> {{Meaning Mnemonic}}<br>
<font color="#764EBE"><b>Meaning Info</b>:</font> {{Meaning Info}}<br>
<font color="#764EBE"><b>Reading</b>:</font> {{Reading Mnemonic}}
</details></details></div>{{/Meaning Mnemonic}}

<div class="animated fadeIn" style="padding: 10px;">
<font size="4"><a  id="button_1" href = 'http://jisho.org/search/{{Kanji}}'>Jisho</a> </font>
<font size="4"><a   id="button_1" href="http://ejje.weblio.jp/content/{{Kanji}}">Weblio</a></font>
<font size="3"><a  id="button_1"  href="http://ejje.weblio.jp/sentence/content/{{Kanji}}">Weblio Examples</a></font>
<font size="4"><a   id="button_1" href="http://eow.alc.co.jp/search?q={{Kanji}}&ref=sa">ALC</a></font>
<font size="4"><a   id="button_1" href="http://dictionary.goo.ne.jp/srch/all/{{Kanji}}/m0u/">goo</a></font>
<font size="4"><a   id="button_1" href="http://tangorin.com/general/{{Kanji}}">Tangorin</a></font>
<font size="3"><a   id="button_1" href="http://tangorin.com/examples/{{Kanji}}">Tangorin Examples</a></font><br/>
</div></div>

<p class="smallnotes">tags:  {{Tags}}</p>
</div>

<div id="correctAnswer" style="display:none">{{FocusReading}}</div>
<script>
//Script for modifying 'Show Answer' behavior for Input types.
var htmlTextNodes = [];
var innerHTMLText = [];
var htmlNodeLength =document.getElementById('typeans').childNodes.length;
var typedAnswer;
var correctAnswer;
var firstBr = null;
var secondBr;

//capture each node to array
for (i = 0; i < htmlNodeLength; i++) {

 htmlTextNodes[i] = document.getElementById('typeans').childNodes[i];
 innerHTMLText[i] = document.getElementById('typeans').childNodes[i].innerHTML;

 //locate <br> tags for output change markers
 if (document.getElementById('typeans').childNodes[i].nodeName == "BR") {
  console.log("Runs if BR");
  if (firstBr != null) {
   secondBr = i;
  } else {
   firstBr = i;
  };
 };
};

//If answer is correct, firstBr will still be null, so must set to length of typeans.childNode
if (firstBr == null) {
 firstBr = htmlNodeLength;
};
//assemble typed and correct answer strings

typedVar = innerHTMLText.slice(0,firstBr).join("");


var typeParse = typedVar.replace(/\s|\-|\~|\～/g, '');


typedAnswer = typedVar.replace(/\~|\～|-|\s/g,' ');

if (typedVar.slice(-1) === 'n') {
typedAnswer = typedVar.substr(0, typedVar.length-1);
typedAnswer += "ん";
} else {
typedAnswer = typedVar.replace(/\~|\～|-/g,' ');
};


var corr = document.getElementById('correctAnswer');
str = corr.innerHTML;
var correctParse = str.replace(/\s|\-|\~|\～/g, '');
var correctAnswer = correctParse



var kanjisr = document.getElementById('kanjise');
var kanjise = kanjisr.innerHTML;


//split alternative answers into array

var getalt = document.getElementById('altread');
var altmean = getalt.innerHTML;

altmean += ", "
altmean += correctAnswer;


altmean += ", "
altmean += kanjise;

var array = altmean.split(", ");



for ( var i = 0; i < array.length; i++ ) {
    array[i] = "" + array[i].toUpperCase() + "";
array[i] = "" + array[i].replace(/\s|\-|\~|\～/g, '');; + "";
}


//Modify answer output
if ((array.indexOf(typeParse) > -1) &&  (!(typeParse== "" ))) {
 var c = "<div class=\"animated fadeIn\"  id='correct'>"+typedAnswer+"</div>";
 var d = document.getElementById('typeans');
 d.innerHTML =  c;
} else {
if(typeParse == "") {
typeParse = "BITTERNESS INTENSIFIES!!!";
}
 var e = "<div class=\"animated fadeIn\" id='incorrect'>"+typeParse+"</div>";
 var f = document.getElementById('typeans');
 f.innerHTML =  e;
};
</script>