Expose option to enable native text to speech

[aalemayhu]

We can probably do this straightforward with two pickers one for enabling TTS on either front, back and both. The other picker should expose the common TTS voices.

https://docs.ankiweb.net/#/templates/fields?id=text-to-speech

[aalemayhu]

https://docs.ankiweb.net/#/templates/fields?id=static-soundsimages-docsify-ignore

[aalemayhu]

The challenge here is how do we enable it and how does the user pick their preferred language? Do we want use the builtin OS things or provide third party support.

We should research what the most popular approaches are from add-ons and in the subreddit.

[aalemayhu]

Guillem mentioned this on Discord https://aws.amazon.com/polly/

[aalemayhu]

While cool, this is not a priority for the v1 track.

[aalemayhu]

There is an experimental browser API for this now SpeechSynthesis

SpeechSynthesis.getVoices()
    Returns a list of SpeechSynthesisVoice objects representing all the available voices on the current device.

https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesis/getVoices

function populateVoiceList() {
  if(typeof speechSynthesis === 'undefined') {
    return;
  }

  var voices = speechSynthesis.getVoices();

  for(var i = 0; i < voices.length; i++) {
    var option = document.createElement('option');
    option.textContent = voices[i].name + ' (' + voices[i].lang + ')';

    if(voices[i].default) {
      option.textContent += ' -- DEFAULT';
    }

    option.setAttribute('data-lang', voices[i].lang);
    option.setAttribute('data-name', voices[i].name);
    document.getElementById("voiceSelect").appendChild(option);
  }
}

populateVoiceList();
if (typeof speechSynthesis !== 'undefined' && speechSynthesis.onvoiceschanged !== undefined) {
  speechSynthesis.onvoiceschanged = populateVoiceList;
}

[aalemayhu]

Deffering this to v2.

[aalemayhu]