Req: Text to speech in AnkiMobile for ios7..

Robert G.'s Avatar

Robert G.

06 Nov, 2013 03:50 AM

hello,
i would like to see tts added to ankimobile, where text is automatically spoken like the android version.
this would be a great addition for the visually impaired and those who want speech without
making audio recordings.
In ios7 I've seen 3rd party apps like "Voice Dream" use apple's internal voices for speech output. would this be possible with ankimobile??
thanks..

  1. Support Staff 1 Posted by Damien Elmes on 06 Nov, 2013 02:57 PM

    Damien Elmes's Avatar

    Hi Robert,

    Some AnkiMobile beta testers have been playing with the TTS support that iOS7 introduced, but I've seen it causing crashes, so it doesn't appear to be ready for prime time yet.

  2. 2 Posted by Robert G. on 06 Nov, 2013 05:30 PM

    Robert G.'s Avatar

    Hello Damien,
    Hopefully, voices will be fixed with a future iOS update.
    Please consider my request for tts in ankimobile when
    voice issues are resolved.
    thanks
    Robert G.

  3. Support Staff 3 Posted by Damien Elmes on 07 Nov, 2013 01:47 PM

    Damien Elmes's Avatar

    Note: see the post further below for a version that works on iOS 13.

    Hi Robert,

    The following was contributed by an Anki user. It looks like they may have been able to work around the crashing issues as well, by adding a delay before playing.

    On the computer version, while reviewing, click Edit>Cards, then add the following (assuming the field you want to speak is called Word; if something else, only change the capitalized Word)

    --- front ---
    <span id=word>{{Word}}</span>

    <script>
    var w = document.getElementById("word");
    window.setTimeout("speak(w.innerHTML)", 500);

    function speak(word)
    {
    var speech = new SpeechSynthesisUtterance();
    speech.text = word;
    speech.volume = 1; // 0 to 1
    speech.rate = 1; // 0.1 to 9
    speech.pitch = 1; // 0 to 2, 1=normal
    speech.lang = "en-GB";
    speechSynthesis.cancel();
    speechSynthesis.speak(speech);
    }
    </script>

    ----styling----
    #word { display: none; }

    You can change en-GB to other languages like en-US, de-DE, ja-JP, zh-HK, etc.

  4. Soren Bjornstad closed this discussion on 03 Dec, 2013 05:06 PM.

  5. Damien Elmes re-opened this discussion on 11 Oct, 2014 09:44 PM

  6. Support Staff 4 Posted by Damien Elmes on 11 Oct, 2014 09:44 PM

    Damien Elmes's Avatar

    You may need to install the Enhanced audio files for the language you want to play, which you can do so via the Settings app, then General, Accessibility, Speech and Voices.

  7. 5 Posted by Soren Bjornstad on 26 Oct, 2014 12:10 AM

    Soren Bjornstad's Avatar

    This ticket has been automatically closed due to inactivity. If you are still having issues or need to continue this discussion, please feel free to reply.

    If you are not the original poster but are experiencing a similar issue, please create a new thread and include a link to this one if appropriate.

  8. Soren Bjornstad closed this discussion on 26 Oct, 2014 12:10 AM.

  9. Damien Elmes re-opened this discussion on 03 Oct, 2019 07:51 AM

  10. Support Staff 6 Posted by Damien Elmes on 03 Oct, 2019 07:51 AM

    Damien Elmes's Avatar

    iOS 13 no longer seems to support the lang attribute. The following can be used instead:

    <span id=word>{{Word}}</span>
    
    <script>
    var w = document.getElementById("word");
    window.setTimeout("speak(w.innerHTML)", 500);
    
    function speak(word)
    {
    var speech = new SpeechSynthesisUtterance();
    speech.text = word;
    speech.volume = 1; // 0 to 1
    speech.rate = 1; // 0.1 to 9
    speech.pitch = 1; // 0 to 2, 1=normal
    speech.voice = window.speechSynthesis.getVoices().filter(v => v.lang == "en-GB")[0];
    speechSynthesis.cancel();
    speechSynthesis.speak(speech);
    }
    </script>
    
  11. 7 Posted by Petr Mátl on 03 Oct, 2019 09:51 PM

    Petr Mátl's Avatar

    Hello,

    I modified in original template line “speech.lang = “de-DE””
    by line
    ”speech.voice = window.speechSynthesis.getVoices().filter(v => v.lang == "en-GB")[0];”.
    But it doesn’t work. I received error code “This card contains a JS error: SyntaxError: Unexpected EOF”. What’s wrong?

    Thank you, Petr

    The whole template is:

    {{FrontSide}}

    <hr id=answer>

    <span id="word"> {{German}} </span>
    <script>
    var w = document.getElementById("word");
    window.setTimeout("speak(w.innerHTML)", 500);
    function speak(word)
    {
    var speech = new SpeechSynthesisUtterance();
    speech.text = word;
    speech.volume = 0.5; // 0 to 1
    speech.rate = 1; // 0.1 to 9
    speech.pitch = 1; // 0 to 2, 1=normal
    speech.voice = window.speechSynthesis.getVoices().filter(v => v.lang == "de-DE”)[0];
    speechSynthesis.cancel();
    speechSynthesis.speak(speech);
    }
    </script>

    <br>
    <br>
    {{German_Audio}}

    <br>
    <br>
    <div style='font-family: Arial; font-size: 20px; color:#828282;'>{{Example_Sentence}}</div>

  12. Support Staff 8 Posted by Damien Elmes on 04 Oct, 2019 12:38 AM

    Damien Elmes's Avatar

    The problem is the quote you've used after DE is a "smart quote" instead of a regular ". If you copy and paste the quote before de, it should fix the problem. The next AnkiMobile update will disable smart quotes in the template editor, to prevent this accident from happening.

  13. 9 Posted by Petr Mátl on 04 Oct, 2019 04:49 AM

    Petr Mátl's Avatar

    Hello Damien, thank you very much! Petr

  14. 10 Posted by Yan Bárta on 04 Oct, 2019 09:29 AM

    Yan Bárta's Avatar

    Hello,

    thanks for the fix for german, it works there. Unfortunately, it does not longer function for Czech. The language is supported by iPhone and it did work before iOS 13 with "cs" but does not longer. Is there a fix?

    Thank you for help.

  15. Support Staff 11 Posted by Damien Elmes on 05 Oct, 2019 01:29 AM

    Damien Elmes's Avatar

    You need to use cs-CZ. You can use the example section on the following page to see all the different languages. https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesis/ge...

  16. 12 Posted by Sutu on 10 Nov, 2019 01:13 PM

    Sutu's Avatar

    Hello,
    thanks for providing the alternative method, but it does not work on my devices. I modified the language from "en-GB" to "en-US" and tried to combine this method with other TTS tools on other platforms (this combination with previous method worked well on iOS 13.1.0). However, even though I just copied the code without modification and applied it alone, it did not function. What was wrong?

    Thank you for help

    The template was:

    <div  style = "text-align: center;align: center;font-size: 50px;">
        <tts service="sapi5js" quality="39" speed="0" voice="Microsoft David Desktop" volume="100" xml="0">
            <tts service="say" speed="210" voice="Alex">
                <tts service="android" voice="en_GB">
                    <span id = "word">
                        {{EnglishWord}}
                    </span>
                </tts>
            </tts>
        </tts>
    </div>
    
    <script>
    var w = document.getElementById("word");
    window.setTimeout("speak(w.innerHTML)", 500);
    
    function speak(word)
    {
    var speech = new SpeechSynthesisUtterance();
    speech.text = word;
    speech.volume = 1; // 0 to 1
    speech.rate = 1; // 0.1 to 9
    speech.pitch = 1; // 0 to 2, 1=normal
    speech.voice = window.speechSynthesis.getVoices().filter(v => v.lang == "en-US")[0];
    speechSynthesis.cancel();
    speechSynthesis.speak(speech);
    }
    </script>
    
  17. Support Staff 13 Posted by Damien Elmes on 10 Nov, 2019 11:42 PM

    Damien Elmes's Avatar

    The audio plays for me. Perhaps you have the mute switch on?

  18. 14 Posted by Sutu on 11 Nov, 2019 02:52 PM

    Sutu's Avatar

    Hello Damien, thanks for your response.

    I have checked the mute was switched off and tried the code again, but it still did not work for me. My devices are iPad Air 2 and iPhone 6s running on iOS 13.2.2. I notice that "Speak Selection" has to be turned on, and users have to download voices in "Voices" to enable the previous code. Is there another setting for this code on iOS devices I missed?

    Thanks for your help.

  19. Support Staff 15 Posted by Damien Elmes on 11 Nov, 2019 09:32 PM

    Damien Elmes's Avatar

    As I'm not able to reproduce the problem here, I'm afraid I'm not sure why it's not working for you. You could try starting with the original example that is pasted further up the page, or as a workaround, instead of using on the fly TTS you could have the computer add-on download the audio files for you, then sync them to AnkiMobile.

  20. 16 Posted by Milen Mihaylov on 20 May, 2020 06:46 AM

    Milen Mihaylov 's Avatar

    For some reason no matter what I try it seems that in the latest version of ankimobile I can't trigger a function on page load and I tried at least 4 different methods - including the code provided above.

    I have my own ios Javascript tts script and it only works if I add a button to the card and manually press it. I even tried to create a seperate function to press the button automatically but that wouldn't initiate either.
    All of the above used to work last time I did that.

  21. Support Staff 17 Posted by Damien Elmes on 20 May, 2020 10:56 AM

    Damien Elmes's Avatar

    You're probably hitting some WebKit restriction on playing audio without user interaction. Recent Anki versions have built in TTS support, so you may want to consider switching to that: https://docs.ankiweb.net/#/templates/fields?id=text-to-speech

Comments are closed, but you can start a new discussion.

Keyboard shortcuts

Generic

? Show this help
ESC Blurs the current field

Comment Form

r Focus the comment reply box
^ + ↩ Submit the comment

You can use Command ⌘ instead of Control ^ on Mac