Awesome
b24.js
An HTML5 subtitle renderer for ARIB STD-B24 data packet, which is transmitted over the Digital TV Broadcasting in Japan.
Another alternative renderer aribb24.js is recommended for ARIB STD-B24 rendering.
This project will no longer update.
Features
- Converting to WebVTT
- Keeping original multiple caption lines
- Colored rendering with font color specified by data packet
Build
- NPM package can be used directly
Preparing
git clone https://github.com/xqq/b24.js.git
cd b24.js
git submodule update --init
npm install
Compiling C module
Install third-party toolchains:
- CMake
- Emscripten
mkdir build
cd build
emcmake cmake -DCMAKE_BUILD_TYPE=Release ..
make -j8
Compiling b24.js library
npm run build
Getting Started
<script src="hls.min.js"></script>
<script src="b24.js"></script>
<video id="videoElement"></video>
<script>
var video = document.getElementById('videoElement');
var hls = new Hls();
hls.loadSource('https://video-dev.github.io/streams/x36xhzz/x36xhzz.m3u8');
hls.attachMedia(video);
video.play();
var b24Renderer = new b24js.WebVTTRenderer();
b24Renderer.init().then(function() {
b24Renderer.attachMedia(video);
b24Renderer.show();
});
hls.on(Hls.Events.FRAG_PARSING_PRIVATE_DATA, function (event, data) {
for (var sample of data.samples) {
b24Renderer.pushData(sample.pid, sample.data, sample.pts);
}
}
</script>
Screenshoot
Third-party libraries
License
MIT License
Copyright (c) 2019 xqq <xqq@xqq.im>