Developer, journalist
Published
Edited
Dec 30, 2019
Importers
{
const el = DOM.element('div');
el.classList.add('captions');
yield el;
for await (const word of new OpenedCaptions()) {
el.innerHTML += word + ' ';
}
}
class OpenedCaptions {
constructor(url = "https://openedcaptions.com") {
this._socket = socketIO(url);
return new EventIterator(push =>
this._socket.on('word', ({ data }) => push(data.body))
);
}
}
socketIO = require("socket.io-client/dist/socket.io.js")
EventIterator = (await require('https://bundle.run/event-iterator@1.2.0/lib/event-iterator.js'))
.EventIterator
html`<style>
.captions {
min-height: 50px;
padding: 20px;
font-size: 17px;
font-family: Consolas,"Lucida Grande",Arial,Verdana;
background-color: black;
color: white;
}
</style>`
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
