Lecture à voix haute
Lit le document ou le texte sélectionné avec la synthèse vocale du navigateur, phrase par phrase, et sélectionne chaque phrase pendant sa lecture. Une petite barre au bas de la fenêtre propose pause, arrêt, voix et vitesse. Aucune bibliothèque, aucun serveur ni aucune clé ne sont nécessaires.
Activation
Cette fonctionnalité est fournie par le plugin readaloud.js (également inclus dans plugins/all_plugins.js). Sa commande et son élément de barre d’outils sont readaloud (infobulle « Read aloud »). Le bouton figure dans le menu « More » (⋮) de la barre par défaut ; dans votre propre barre, ajoutez readaloud. La commande ouvre la barre et démarre immédiatement la lecture ; la relancer ferme la barre.
<link rel="stylesheet" href="/richtexteditor/rte_theme_default.css">
<script src="/richtexteditor/rte.js"></script>
<script src="/richtexteditor/plugins/readaloud.js"></script>
<div id="editor"><p>The station opened in 1911. Trains ran twice a day.</p></div>
<script>
var editor = new RichTextEditor("#editor", {
toolbar: "mytoolbar",
toolbar_mytoolbar: "{bold,italic,underline}|{readaloud}"
});
</script>Les styles de la barre se trouvent dans rte_theme_default.css : conservez donc cette feuille sur la page.
La barre
- Play / Pause met en pause et reprend ; après la fin, relance la lecture.
- Stop arrête la lecture et rétablit la sélection précédente de l’utilisateur.
- Voice liste toutes les voix de
speechSynthesis.getVoices()sous la forme « nom (langue) », en signalant la voix par défaut. La liste se remplit lorsque le navigateur fournit ses voix. - Speed : 0.75×, 1×, 1.25×, 1.5× ou 2×, initialement 1×. Un changement s’applique à partir de la phrase suivante.
- L’état affiche « Reading… (3/10) », « Paused » ou « Nothing to read ». Close arrête la lecture et retire la barre.
Si du texte est sélectionné au démarrage, seule la sélection est lue. Les phrases sont séparées par ., !, ?, un saut de ligne et les signes chinois et japonais 。！？. La lecture se met en pause lorsque la page est masquée (autre onglet) et s’arrête lorsqu’on quitte la page.
Options et API
| Option | Valeur par défaut | Fonctionnement |
|---|---|---|
readAloudHighlight | true | Sélectionne chaque phrase dans l’éditeur pendant sa lecture. false lit sans déplacer la sélection. |
readAloudRate | 1.0 | Vitesse pour editor.readAloud() lorsque la barre est fermée. Sinon, son menu de vitesse est utilisé. |
editor.readAloud({ rate: 1.5, voice: "Microsoft Zira - English (United States)" });
editor.stopReadAloud();editor.readAloud(options) lit sans ouvrir la barre. rate est limité à 0.5–2 ; voice est la propriété name d’une voix, exactement telle que speechSynthesis.getVoices() le fournit. Si le nom est introuvable, la voix par défaut du navigateur est utilisée.
À savoir
- Nécessite
window.speechSynthesis. Si le navigateur n’en dispose pas, la commande affiche une boîte de dialogue signalant l’indisponibilité de la lecture à voix haute. - Les voix et les langues proviennent du navigateur et du système, et non de l’éditeur : la liste diffère selon les ordinateurs. Le plugin ne définit pas de langue ; la voix choisie détermine la prononciation. Choisissez donc une voix correspondant à la langue du document.
- Le texte est collecté nœud par nœud sans séparateurs. Un titre sans point est lu avec la phrase suivante et les deux mots à la jonction sont accolés (« station » + « The »).
- La phrase est indiquée par la sélection normale : la barre de mise en forme flottante de l’éditeur peut donc apparaître au-dessus du texte pendant la lecture.
- Rien n’est ajouté au document ; le HTML enregistré reste inchangé.
- Les textes de la barre proviennent de clés de langue telles que
text_ra_play,text_ra_pause,text_ra_stopettext_ra_readingof.
Voir aussi : dictée (parole vers texte), accessibilité, référence des éléments de la barre d’outils.