|
Цитата:
|
|
возможно/невозможно такое! Будет/не будет работать в anki?
|
Да, возможно! Будет работать, там используется webkit!
|
Цитата:
|
|
в случае если печатается неправильная буква то она бы не пропечатывалась и при этом воспроизводился бы звук ошибки.
|
Такой код выглядит, например, так
oninput = ({ target }) => {
if(target !== inputField) return;
const originalValue = target.value.toLowerCase();
const checkedValue = `${target.value.toLowerCase()}\n${word}`.match(/(.*).*\n(\1)/)[1];
if(originalValue !== checkedValue) {
hitSound.play();
}
if(originalValue === word) {
reachedSound.play();
}
target.value = checkedValue;
};
где inputField представляет текстовое поле, word — ответ, hitSound — аудио ошибки, когда введена неправильная буква, reachedSound — звук победы, вы наконец-то ввели слово!
|
Цитата:
|
|
диктант, возможно ли?
|
Допустим, носитель языка произносит ряд слов на английском языке, а вам нужно их правильно записать. Программно это может выглядеть так — у вас на экране есть кнопка и текстовое поле. При нажатии на кнопку раздается голос, произносящий английское слово. Ваша задача постараться правильно напечатать это слово. Как вы и говорили, в случае если печатается неправильная буква, то она не пропечатывается и при этом воспроизводится звук ошибки. Я думаю, что когда слово напечатано, то можно открыть промежуточный экран, где можно, смотря на слово, послушать как оно звучит, возможность открыть это слово в стороннем приложении, где например, показан перевод и примеры использования этого слова. Ну и разумеется, кнопка перехода к следующему слову.
Процесс диктанта заключается в последовательном чередовании двух экранов. Снимки экрана приложения, которое я написал, код смотри далее.
Рис. 1. Экран, на котором предлагается ввести озвученное слово.
Рис. 2. Экран, появляющийся после правильно введённого слова, на котором предлагается узнать больше и продолжить диктант.
Самой первой трудностью оказалось найти слова, какие именно слова использовать для диктанта? В итоге остановился на списке из 850 слов английского языка. Все эти слова обозначают простые понятия, обычно используемые в повседневной жизни.
https://en.wiktionary.org/wiki/Appen...lish_word_list
Слова были просто скопированы и обработаны в консоли браузера при помощи этого кода(не три слова, а все которые там были, результат, вы увидите в программе между тегами <template>)
[...[...new Set(
`account, act, addition`
.split(/[\s,\n]+/))].sort().join(" ").matchAll(/.{70}\S*/g)].map(l => l[0].trim()).join("\n")
matchAll не является стандартом, но кто тревожится, когда я только один раз у себя на компьютере запустил этот код!
Далее нужно, чтобы эти слова кто-то читал. Есть замечательный ресурс
https://forvo.com/, где носители почти всех языков мира произносят всевозможные слова на их родных языках. Но, к сожалению, API для программистов почему-то платное.
Поэтому произношения слов я взял с oxfordlearnersdictionaries.com.(там нет API? но я просто посмотрел, как там устроена кнопка)
Звуки ошибки (не та буква) и победы(наконец-то ввели слово правильно) взял из chrome://dino
Код получился таким широким, поскольку там захардкодены звуки.
<p data-height="700" data-theme-id="0" data-slug-hash="YdgpwK" data-default-tab="result" data-user="Malleys" data-pen-title="Английский диктант" class="codepen">See the Pen <a href="https://codepen.io/Malleys/pen/YdgpwK/">Английский диктант</a> by Malleys (<a href="https://codepen.io/Malleys">@Malleys</a>) on <a href="https://codepen.io">CodePen</a>.</p>
<script async src="https://static.codepen.io/assets/embed/ei.js"></script>
Код сюда не влез, поэтому сделал через codepen
https://codepen.io/Malleys/pen/YdgpwK?editors=1000 Да, вы можете использовать этот код не только в Anki, но прямо тут, чтобы учиться слышать английские слова.
Получилось что-то очень быстрый диктант, введу слово и Enter, введу слово и Enter. Не слишком ли простой набор слов? А как у вас, получается?
