Forked from hgiesel/AnkiMultipleChoiceBackTemplate.html
Created
July 12, 2019 16:07
-
-
Save josephmisiti/b744912fa33582b1234751e887226270 to your computer and use it in GitHub Desktop.
A Multiple Choice Template for Anki Cards
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<script> | |
// MULTIPLE CHOICE TEMPLATE v1.2 {{{ | |
// https://gist.github.com/hgiesel/2e8361afccca5713414a6a4ee66b7ece | |
const query = 'div#thecard' | |
const colors = ['orange', 'olive', 'maroon', 'aqua', 'fuchsia', 'navy', 'lime'] | |
const fieldPadding = '4px' | |
const syntax = { | |
openDelim: '(^', | |
closeDelim: '^)', | |
fieldSeparator: '::', | |
} | |
const output = { | |
openDelim: '〔', | |
closeDelim: '〕', | |
fieldSeparator: '', | |
} | |
//// | |
function escapeString(str) { | |
return str.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&'); | |
} | |
const exprRegex = RegExp(`(?:${escapeString(syntax.openDelim)})(.*?)(?:${escapeString(syntax.closeDelim)})`, 'gm') | |
const refRegex = /^\^\d$/ | |
function shuffle(array) { | |
let currentIndex = array.length, temporaryValue, randomIndex | |
// While there remain elements to shuffle... | |
while (0 !== currentIndex) { | |
// Pick a remaining element... | |
randomIndex = Math.floor(Math.random() * currentIndex) | |
currentIndex -= 1 | |
// And swap it with the current element. | |
temporaryValue = array[currentIndex] | |
array[currentIndex] = array[randomIndex] | |
array[randomIndex] = temporaryValue | |
} | |
return array; | |
} | |
let results = [] | |
const theBody = document.querySelector(query).innerHTML | |
let m = exprRegex.exec(theBody) | |
while (m) { | |
results.push(m[1]) | |
m = exprRegex.exec(theBody) | |
} | |
if (results.length > 0) { | |
let stylizedResults = [] | |
if (window.Persistence && Persistence.isAvailable() && Persistence.getItem("stylizedMultipleChoice")) { | |
stylizedResults = Persistence.getItem("stylizedMultipleChoice") | |
} | |
else { | |
let shuffledResults = [] | |
for (r of results) { | |
shuffledResults.push(shuffle(r.split(syntax.fieldSeparator))) | |
} | |
for (r of shuffledResults) { | |
if (r.length === 1 && refRegex.test(r[0])) { | |
stylizedResults.push(stylizedResults[r[0].match(/\d+/)[0]]) | |
} | |
else { | |
let actualvalues = [] | |
for ([i, v] of r.entries()) { | |
let theIndex = i % colors.length | |
actualvalues.push(`<span style="color: ${colors[theIndex]}; padding: 0px ${fieldPadding};">${v}</span>`) | |
} | |
stylizedResults.push(actualvalues.join(output.fieldSeparator)) | |
} | |
} | |
} | |
for ([i, v] of results.entries()) { | |
document.querySelector(query).innerHTML = document.querySelector(query).innerHTML | |
.replace(`${syntax.openDelim}${v}${syntax.closeDelim}`, `${output.openDelim}${stylizedResults[i]}${output.closeDelim}`) | |
} | |
//// | |
// FRONT SIDE ONLY | |
if (window.Persistence && Persistence.isAvailable()) { | |
Persistence.setItem("stylizedMultipleChoice", stylizedResults) | |
} | |
// BACK SIDE ONLY | |
if (window.Persistence && Persistence.isAvailable()) { | |
Persistence.removeItem("stylizedMultipleChoice") | |
} | |
} | |
// https://gist.github.com/hgiesel/2e8361afccca5713414a6a4ee66b7ece | |
// MULTIPLE CHOICE TEMPLATE v1.2 }}} | |
</script> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<script> | |
// MULTIPLE CHOICE TEMPLATE v1.2 {{{ | |
// https://gist.github.com/hgiesel/2e8361afccca5713414a6a4ee66b7ece | |
const query = 'div#thecard' | |
const colors = ['orange', 'olive', 'maroon', 'aqua', 'fuchsia', 'navy', 'lime'] | |
const fieldPadding = '4px' | |
const syntax = { | |
openDelim: '(^', | |
closeDelim: '^)', | |
fieldSeparator: '::', | |
} | |
const output = { | |
openDelim: '〔', | |
closeDelim: '〕', | |
fieldSeparator: '', | |
} | |
//// | |
function escapeString(e){return e.replace(/[-\/\\^$*+?.()|[\]{}]/g,"\\$&")}const exprRegex=RegExp(`(?:${escapeString(syntax.openDelim)})(.*?)(?:${escapeString(syntax.closeDelim)})`,"gm"),refRegex=/^\^\d$/;function shuffle(e){let t,r,s=e.length;for(;0!==s;)r=Math.floor(Math.random()*s),t=e[s-=1],e[s]=e[r],e[r]=t;return e}let results=[];const theBody=document.querySelector(query).innerHTML;let m=exprRegex.exec(theBody);for(;m;)results.push(m[1]),m=exprRegex.exec(theBody);if(results.length>0){let e=[];if(window.Persistence&&Persistence.isAvailable()&&Persistence.getItem("stylizedMultipleChoice"))e=Persistence.getItem("stylizedMultipleChoice");else{let t=[];for(r of results)t.push(shuffle(r.split(syntax.fieldSeparator)));for(r of t)if(1===r.length&&refRegex.test(r[0]))e.push(e[r[0].match(/\d+/)[0]]);else{let t=[];for([i,v]of r.entries()){let e=i%colors.length;t.push(`<span style="color: ${colors[e]}; padding: 0px ${fieldPadding};">${v}</span>`)}e.push(t.join(output.fieldSeparator))}}for([i,v]of results.entries())document.querySelector(query).innerHTML=document.querySelector(query).innerHTML.replace(`${syntax.openDelim}${v}${syntax.closeDelim}`,`${output.openDelim}${e[i]}${output.closeDelim}`) | |
//// | |
// FRONT SIDE ONLY | |
if (window.Persistence && Persistence.isAvailable()) { | |
Persistence.setItem("stylizedMultipleChoice", e) | |
} | |
// BACK SIDE ONLY | |
if (window.Persistence && Persistence.isAvailable()) { | |
Persistence.removeItem("stylizedMultipleChoice") | |
} | |
} | |
// https://gist.github.com/hgiesel/2e8361afccca5713414a6a4ee66b7ece | |
// MULTIPLE CHOICE TEMPLATE v1.2 }}} | |
</script> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
I need sample..
Please teach me how to use it.