“Error loading image occlusion”

I am not sure why my anki image occlusion does not work on my computer while all my image occlusions work on IOS (iPad and iPhone). I have the most updated version of the image occlusion add on, and the error states on my computer “TypeError: anki.setupImageCloze is not a function”. To add, I make the image occlusion cards on my iPad if that’s any help.

Are you making and editing notes in built-in Image Occlusion – or in the Image Occlusion Enhanced add-on? You named both of them in your question, but they are separate things and not interchangeable.

You also shouldn’t be editing the card templates for the Image Occlusion note type. If you’ve made changes to that, you may want to replace that note type with a new copy made from the default note type.

I think I am doing the built in image occlusion(I attached a photo below on what I choose), and sounds good for the second part!

Can you tell us your Anki version? If you’re using an older app, it might not support “Image Occlusion” (not enhanced).

To download the latest version, see here.

Actually, it seems you might’ve updated the templates manually. And changed the anki.imageOcclusion.setup(); part.

Replace your front template with this:

{{#Header}}<div>{{Header}}</div>{{/Header}}
<div style="display: none">{{cloze:Occlusion}}</div>
<div id="err"></div>
<div id="image-occlusion-container">
    {{Image}}
    <canvas id="image-occlusion-canvas"></canvas>
</div>
<script>
try {
    anki.imageOcclusion.setup();
} catch (exc) {
    document.getElementById("err").innerHTML = `Error loading image occlusion. Is your Anki version up to date?<br><br>${exc}`;
}
</script>

And use the following code for your back template:

{{#Header}}<div>{{Header}}</div>{{/Header}}
<div style="display: none">{{cloze:Occlusion}}</div>
<div id="err"></div>
<div id="image-occlusion-container">
    {{Image}}
    <canvas id="image-occlusion-canvas"></canvas>
</div>
<script>
try {
    anki.imageOcclusion.setup();
} catch (exc) {
    document.getElementById("err").innerHTML = `Error loading image occlusion. Is your Anki version up to date?<br><br>${exc}`;
}
</script>

<div><button id="toggle">Toggle Masks</button></div>
<div>{{Back Extra}}</div>

Check your version first, before you make any manual changes to your templates. The default template you have is the older version – and possibly the one that is necessary to be compatible with your version of Anki.

If your AnkiMobile installs are updated, it might be version mis-match that is causing this issue.

Unfortunately, I have hundreds of cards and won’t be able to do this for each one. And I did download the latest version as well! I think it might just be an issue that I’ll have to get over eventually😢

You only need to do it once. The cards are using templates from the same note type. See Getting Started - Anki Manual.

If this is confusing you by any chance, you can also do it after opening the templates screen the usual way you do it. It’s the same thing as going to Manage note types and then selecting the note type.

You appear to be using an old version of Anki on your computer. Please update again and double-check the version in the about screen, then see if the issue still exists.

2 Likes

It worked, thank you!!

1 Like

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.