html5-audio-read-along
html5-audio-read-along copied to clipboard
How use it
Hello please orientation for use it, with other audio files
You can use Audacity's "Labels" feature to get the start and end times for each word in a voice recording. This video shows how to do that. Once you have added labels to the voice recording and exported the labels, you can use the following Python script to read the exported labels file and generate the HTML markup that will work with html5-audio-read-along:
import errno
import os
import sys
from decimal import Decimal
try:
file_path = sys.argv[1]
except IndexError:
file_path = 'Label Track.txt'
if not os.path.isfile(file_path):
raise FileNotFoundError(errno.ENOENT, os.strerror(errno.ENOENT), file_path)
with open(file_path, 'r') as label_file:
lines = label_file.readlines()
for line in lines:
parts = line.rstrip('\n').split('\t')
start_time = Decimal(parts[0])
end_time = Decimal(parts[1])
label = parts[2]
duration = end_time - start_time
print(
'<span data-dur="%s" data-begin="%s">%s</span>' % (
duration,
start_time,
label,
)
)
For example, let's say that your exported labels file looks like this:
0.000000 0.131510 The
0.131510 0.363585 quick
0.384859 0.702029 brown
0.702029 1.069482 fox
1.081086 1.375049 jumps
1.375049 1.670945 over
1.670945 1.779248 the
1.779248 2.135097 lazy
2.135097 2.465805 dog
If you save the above Python script in the same folder as the exported labels file and then run the Python script, this is what it will output:
<span data-dur="0.131510" data-begin="0.000000">The</span>
<span data-dur="0.232075" data-begin="0.131510">quick</span>
<span data-dur="0.317170" data-begin="0.384859">brown</span>
<span data-dur="0.367453" data-begin="0.702029">fox</span>
<span data-dur="0.293963" data-begin="1.081086">jumps</span>
<span data-dur="0.295896" data-begin="1.375049">over</span>
<span data-dur="0.108303" data-begin="1.670945">the</span>
<span data-dur="0.355849" data-begin="1.779248">lazy</span>
<span data-dur="0.330708" data-begin="2.135097">dog</span>