Good day everyone,
I have trouble when render cloze typing for learn German.
My intention is, from specific text, I will generate random cloze words using below script:
<div id="cloze-text", class="cloze"></div>
<ul>
<li><span class="part-of-speech">{{Part-of-Speech 1}}</span> <span class="definition">{{Definition 1}}</span><div class="english">{{English 1}}</div></li>
<li><span class="part-of-speech">{{Part-of-Speech 2}}</span> <span class="definition">{{Definition 2}}</span><div class="english">{{English 2}}</div></li>
<li><span class="part-of-speech">{{Part-of-Speech 3}}</span> <span class="definition">{{Definition 3}}</span><div class="english">{{English 3}}</div></li>
</ul>
<script>
function randomTyping(text) {
var words = text.split(' ');
var choices = Array.from({ length: words.length }, () => Math.random() < 0.5);
// Ensure no two consecutive words are selected
for (var i = 1; i < choices.length; i++) {
if (choices[i] && choices[i - 1]) {
choices[i] = false;
}
}
for (var i = 0; i < words.length; i++) {
if (choices[i]) {
words[i] = "\{\{c1::" + words[i] + "}}"; // Correctly formatted cloze
}
}
return words.join(' ');
}
// Get text from the "German 1" field and apply the randomTyping function
var germanText = '{{German 1}}'; // Accessing the "German 1" field
var typing = randomTyping(germanText); // Generate cloze text
document.getElementById('cloze-text').innerHTML = clozeText;
var articles = ['der', 'die', 'das'];
var elements = document.getElementsByClassName('part-of-speech');
Array.from(elements).forEach(function(element) {
var outer_div = element.parentElement.parentElement.parentElement;
if (outer_div.id !== 'back-side') {
if (articles.includes(element.innerHTML)) {
element.innerHTML = 'noun';
}
}
});
</script>
<hr>
For example with Die Eltern und Kinder essen und sprechen über ihren Tag. it will generate {{c1::Die}} Eltern {{c1::und}} Kinder {{c1::essen}} und {{c1::sprechen}} über ihren {{c1::Tag.}}.
When I put it to {{type:cloze:<div id="cloze-text"></div>}} it cause:
Front template has a problem:
Found '<U+2068>{{type:cloze:<div id="cloze-text"></div>}}<U+2069>', but there is no field called '<U+2068><div id="cloze-text"></div><U+2069>'
I know that Anki is detect divcontent as note filed and because note have no field so I cause error.
I try to find way to fix by custom cloze script, but cannot find it.
Have anyone have same idea and solve it successfully, It would be nice if you guys can help me solve this problem. Many thanks