Link Search Menu Expand Document

Blanking and Obscuring

Table of contents

  1. Blanking
    1. International support
  2. Obscuring
  3. Ellipsers

Blanking

One possible way would be to show the answer all blanked out by underscore symbols _.

/** Blanking Clozes */
const blank = function(tag) {
  return [tag.values[0].replace(closet.unicodeAlphanumericPattern, '_')]
}

const blankOptions = {
  frontEllipser: blank,
  frontStylizer: closet.Stylizer.make({
    process: v => `<span style="color: cornflowerblue">${v}</span>`,
    separator: '',
  }),
}

filterManager.install(
  closet.recipes.cloze.show({
    tagname: 'c',
    ...blankOptions,
  }),
  closet.recipes.cloze.hide({
    tagname: 'ch',
    ...blankOptions,
  }),
  closet.recipes.cloze.reveal({
    tagname: 'cr',
    ...blankOptions,
  }),
)
Catecholamines: [[c1::dopamine, noradrenaline, adrenaline]]
Indolamines: [[ch2::serotonin]]
Imidazoles: [[cr3::histamin]]

Notice how the commas are left out. Together with the blanks, this lets us know that the flash card wants us to name three catecholamines. This might have otherwise been done with a hint.

International support

Closet has a built-in regular expression, which specifically targets alphanumeric characters, no matter the language.

/** Blanking Clozes */
const blank = function(tag) {
  return [tag.values[0].replace(closet.unicodeAlphanumericPattern, '_')]
}

const blankOptions = {
  frontEllipser: blank,
  frontStylizer: closet.Stylizer.make({
    process: v => `<span style="color: cornflowerblue">${v}</span>`,
    separator: '',
  }),
}

filterManager.install(
  closet.recipes.cloze.show({
    tagname: 'c',
    ...blankOptions,
  }),
  closet.recipes.cloze.hide({
    tagname: 'ch',
    ...blankOptions,
  }),
  closet.recipes.cloze.reveal({
    tagname: 'cr',
    ...blankOptions,
  }),
)
イミダゾール:[[c1::ドーパミン・アドレナリン・ノルアドレナリン]]
咪唑:[[ch2::多巴胺/肾上腺素/去甲肾上腺素]]
JavaScript expression: [[cr3::const value = f(3 + 5);]]

Depending on the context you might want to hide symbols as well. In this case, you have to change the used regular expression.


Obscuring

Another option is to obscure the solution by bluring the answer text.

/** Obscuring clozes */
const firstValue = (tag) => [tag.values[0]]
const obscureYellow = closet.Stylizer.make({
  processor: v => `<span style="color: yellow; filter: blur(0.2rem);">${v}</span>`,
})

const obscureOptions = {
  frontEllipser: firstValue,
  frontStylizer: obscureYellow,
}

filterManager.install(
  closet.recipes.cloze.show({
    tagname: 'c',
    ...obscureOptions,
  }),

  closet.recipes.cloze.hide({
    tagname: 'ch',
    ...obscureOptions,
  }),

  closet.recipes.cloze.reveal({
    tagname: 'cr',
    ...obscureOptions,
  }),
)
Catecholamines: [[c1::dopamine, noradrenaline, adrenaline]]
Indolamines: [[ch2::serotonin]]
Imidazoles: [[cr3::histamin]]

Note how we changed the highlight color: Seeing blurred blue on a black background would be hard to see.


Ellipsers

Both of these behaviors was implemented by providing custom ellipsers.

An ellipser is a function that outputs a string. There are two ellipsers: the active ellipser, and the inactive ellipser.

The active ellipser is used by all cloze subtypes to render active front clozes. By default is shows you the hint (a second provided value), or “[…]”, in case you did not provide hint.

The inactive ellipser has a default output of “[…]”. It is used in the following cases:

  • revealing clozes use it for inactive front clozes
  • hiding clozes use it for any inactive clozes

If any of the terms active, inactive, front, back confuse, see here.