ankidroid / Anki-Android

AnkiDroid: Anki flashcards on Android. Your secret trick to achieve superhuman information retention.
GNU General Public License v3.0
8.71k stars 2.24k forks source link

[need small help] template doesn't flip card when in nightmode + how to detect platform using js #6886

Closed thiswillbeyourgithub closed 4 years ago

thiswillbeyourgithub commented 4 years ago

Hi,

I hope it's okay for me to ask this here, I'm running into an issue with ankidroid and couldn't find the answer. I hope that by asking it here, it will be visible to others, should they run into the same issue.

I'll be short and to the point : I'm doing a pretty sophisticated template in js, but I'm really new to it.

I have this in my cloze front template :

if (navigator.userAgent.indexOf("obile") >= 0 || navigator.userAgent.indexOf("roid") >= 0 )  {
    var isOnMobile = "T";
}
if (autoFlip == "T") {
    if (isOnMobile == "F") { pycmd("ans"); }
    if (isOnMobile == "T") { showAnswer(); }
}

This idea is that if it passes some test, the card will not show the front but automatically flip and show the answer. The behavior doesn't seem to work when in nightmode in ankidroid but works perfectly in daymode.

  1. Could you give me some clues as to why it doesn't work?

  2. Do you have a recommendation as to the proper way to detect mobile versions? Your wiki and github is very well written but I don't find a lot of information about AnkiMobile

  3. Any recommendation as to where I can find information about what should and should work in js across all platforms? I saw in the official manual that they don't really offer support.

david-allison commented 4 years ago

Hi, have you attempted to use the JavaScript inspector: https://github.com/ankidroid/Anki-Android/wiki/Development-Guide#html-javascript-inspection

  1. Check if a css class exists: https://github.com/ankidroid/Anki-Android/blob/master/AnkiDroid/src/main/assets/card_template.html#L2

  2. Not currently. Check the API documentation for the specific projects

https://github.com/ankidroid/Anki-Android/blob/master/AnkiDroid/src/main/assets/scripts/card.js#L81

https://github.com/ankidroid/Anki-Android/wiki/AnkiDroid-Javascript-API

thiswillbeyourgithub commented 4 years ago

Hi,

  1. Unfortunately, I can't seem to make the debugger work, probably because I have a very tweaked android (microg, custom rom etc) that doesn't do well with chrome. Is there no way with logcat to access these logs?

  2. Thanks!

  3. Thanks again!

david-allison commented 4 years ago

@thiswillbeyourgithub It's in the pipeline, but currently, no.

Post your full template and I'll see if I can have a look in a while. EDIT: Our Google Groups/reddit might get a faster response.

mikehardy commented 4 years ago

The backup way to do it is to use adb to connect to the filesystem, and grab the card.html that is emitted, then you can treat that as a web page development to see what AnkiDroid would render if it was still in the app

thiswillbeyourgithub commented 4 years ago

Thanks a lot for you help. I was able to fix it eventually.

It was due to a line that changed the color of the cloze, apparently this was causing issue further down the code. It was not necessary anymore so I removed it.

For anyone, wondering, my code testing if the platform is on mobile so far is the following :

var isAnkiDroid = /wv/i.test(navigator.userAgent); // ankidroid specific test 
if (navigator.userAgent.indexOf("obile") >= 0 || navigator.userAgent.indexOf("roid") >= 0 || isAnkiDroid || ankiPlatform.indexOf("esktop") == -1)  {
    var isOnMobile = "T";
}

Then the card is flipped only if the cloze was not using hints like {{c1::X::Y}} :

for(let i = 0 ; i < clozes.length;i++) {
    if (autoFlip == "T") {
        if(clozes[i].textContent != '[...]') { 
            autoFlip = "F";
        };
    }
}
if (autoFlip == "T") {
    if (isOnMobile == "T") { showAnswer(); }
    if (isOnMobile == "F") { pycmd("ans"); }
}

Seems to work so far. I will probably have to change this eventually as I discover new edge cases. The latest version will be on my repo anyway.

Thanks again for everything you do, feel free to close the issue.

edit : wouldn't it be cool to create a new wiki page that contains the canonical code to detect all available platforms for all template? I've seen lots of different people asking to know if it's a tablet, or on the computer, or the simple html page of ankiweb etc. I don't think I've seen a all those trials and errors grouped in one place.

david-allison commented 4 years ago

Will add: https://github.com/ankidroid/Anki-Android/wiki/Advanced-formatting

david-allison commented 4 years ago

@thiswillbeyourgithub

https://github.com/ankidroid/Anki-Android/wiki/Advanced-formatting#detect-if-card-is-running-under-ankidroid-js

I'm going to close this as resolved. Please let me know if you need anything more.

Thanks for the update and the code!